WebP - формат изображений для сайта, сжатие без потерь качества

WebP плагин для Photoshop и конвертер

Большинство современных сайтов используют графику на страницах для привлекательного внешнего вида. Форматы графики типа: JPG, PNG, GIF давно заслужили доверие, и распространение у веб-дизайнеров.

Компания Google выпустила новый формат графических файлов для веб-страниц под расширением (*.webp). Этот формат сжимает изображения на 50-70% больше чем перечисленные выше форматы, и при это качество графики не страдает. Этот формат предлагает современное решение для разработчиков сайтов, так как страницы будут загружаться быстрее без ущерба качества графики.

Хочется отметить что формат «webp» поддерживает прозрачность как и PNG, так что это новая альтернатива для веб-дизайнеров.

Сравнение формата WebP c JPG, PNG и GIF

Формат JPG (52.895 кб.)
Пример - jpg
Формат PNG (271.520 кб.)
Пример - png
Формат GIF (91.232 кб.)
Пример - gif
Формат WebP (38.172 кб.)
Пример - webp

Установка и применение плагина WebP для Photoshop

Скачиваем плагин подходящей для вас версии (32 bit) или (64 bit).

Копируем файл в пару C:\Program Files\Adobe\Ваша версия Photoshop\Plug-ins

Затем открываем Photoshop, загружаем файл и выбираем: Файл > Сохранить как. В типах файла выбираем формат (WebP), далее устанавливаем нужные настройки и нажимаем сохранить.

После чего убедитесь, что при уменьшении веса изображения не теряют качества.

Поддержка формата WebP браузерами

Сегодня формат поддерживается большинством современных браузеров.

Поддержка формата WebP для отображения в среде Windows

Для того чтобы новый формат корректно отображался в операционной системе установите официальное расширение «WebP Codec for Windows» от компании Google.

7 основных видов веб-дизайна сайта

7 основных видов веб-дизайна

Одной из самых обширных отраслей веб-разработок в настоящее время является область веб-дизайна. О достойном оформлении собственного ресурса должен позаботиться каждый веб-мастер. Грамотная разработка дизайна может стать гарантией того, что проект сможет составить достойную конкуренцию сторонним ресурсам, обладая высокими потребительскими свойствами и эстетическими качествами.

Заказать адаптивный дизайн или отдельную мобильную версию сайта

Адаптация дизайна или создание мобильной версии сайта

Для того чтобы ваш сайт корректно отображался на любых устройствах, мы рекомендует сделать адаптивную верстку или создать отдельную мобильную версию (независимую от основного дизайна).

Разработка дизайна сайта. Уникальный дизайн - против шаблона!

Разработка дизайна сайта. Уникальный дизайн - против шаблона!

Разработка авторских сайтов. Отличия между уникальным дизайном и бесплатным шаблоном. На примере графика показано как изменения коснулись позиций.

Как подбирать ключевые слова для Яндекс Директа

Как подбирать ключевые слова для Яндекс Директа

Описание эффективного подбора ключевых слов - настройка Яндекс Директа. Увеличение значения CTR для снижения стоимости рекламы.

Наши клиенты