Формат JPEG 2000, JPEG XR и WebP

[yura88k]

Сегодня получил рекомендацию от Google по всем своим сайтам

Используйте современные форматы изображений JPEG 2000, JPEG XR и WebP 

Сайты на разных версиях OC начиная с 1.5 заканчивая 3х

Вопрос такой, при попытке загрузить данный формат изображения на всех версиях выходит одна и та же ошибка "Неправильный тип файла"

Можно ли в Opencart загрузить хоть один из указанных форматов изображений, если да то как?

[sitecreator]

1 час назад, yura88k сказал:

Сегодня получил рекомендацию от Google по всем своим сайтам

 

да, гугл ввел новые требования.

 

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

 

WebP - довольно интересный формат, который заменяет сразу JPEG и PNG.  И позволяет без потери качества получать картинки значительно меньшие по весу.

Можно также уменьшать картинки за счет сжатия обычных JPEG и PNG.

 

WebP , а также алгоритмы сжатия для обычных JPEG и PNG есть в модуле Компрессор.

 

 

 

Там много чего есть (в Компрессоре), что позволит улучшить ваши изображения как в плане визуальных характеристик, так и в плане повышения любви Гугла к вашему сайту. А также есть дополнительные возможности в плане СЕО (продвижения) касательно изображений.

 

WebP поддерживается не всеми браузерами, но примерно 75% браузеров его поддерживает. Это все браузеры на платформе Chrome и его аналоги.  Пока не поддерживает FireFox, но у них в планах это заявлено.

 

Но нет проблем использовать WebP  прямо сейчас, тем более, что оценка гугла напрямую зависит от этого.

Просто отдача изображений организуется так, что отдается WebP  всем браузерам, которые его понимают, а JPEG и PNG - всем остальным.

 

На VDS правильная отдача решается легко без изменения кода движка. Надо лишь создать сами WebP  .  Это делает Компрессор.

На общем хостинге довольно часто можно тоже настроить отдачу без изменения кода движка. Если хостер позволяет настроить параметры кеширования статики.

Например хостер https://www.ukraine.com.ua/

позволяет это сделать легко.

А всем остальным я предлагаю автоматический способ с использованием разработанного мною для такой цели ocmod-ом.

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

 

В общем есть реально работающие две практики:

1) формат WebP

2) сжатие mozjpeg и optipng

 

Можете выбирать любой или оба сразу (если ресурсы позволяют).

Все это реализовано в Компрессоре. И реально позволяет поднять оценку Гугла.

 

JPEG 2000 кажется пока сложно реализуемым, т. к. поддержка браузеров слабая пока.

А WebP - очень перспективный формат.  Да и это детище Гугла, а своих детей гугл любит. 

 

 

 

 

[sitecreator]

Показываю пример работы Компрессора над изображениями шаблона.

Это именно сжатие JPEG и PNG работает в Компрессоре, т. е. самый универсальный способ.

Выигрыш будет в целом за счет изображений всего сайта от 30% примерно.

 

 

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

 

[sitecreator]

1 час назад, yura88k сказал:

Сайты на разных версиях OC начиная с 1.5 заканчивая 3х

 

Компрессор есть для 1.5,  2 (всей линейки) и для 3.0 опенкарт.

Проверено на любых сборках, а не только на opencart и ocstore.

[splka]

11 часов назад, sitecreator сказал:

 

Компрессор есть для 1.5,  2 (всей линейки) и для 3.0 опенкарт.

Проверено на любых сборках, а не только на opencart и ocstore.

Подтверждаю.
Отличный модуль, а самое главное гибкий:)
Я бы это, поправил названия и написания, чисто из этических соображений, чтобы воспринималось легче:)
Если что я про кнопку undu и прочие штуки.
Ну если это не было задумано автором)

Змінено 15 листопада 2018 користувачем splka

[sitecreator]

Поработал сегодня в комплексе.  Т. е. не только изображения.

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

 

Это сайт-демо для модуля Компрессор.

 

 

 

 

[destreser]

6 часов назад, sitecreator сказал:

Поработал сегодня в комплексе

Хочу попросить вас для сравнения результатов - сделайте плиз на странице не 7 картинок, а 62 (три банера фул-хд + 58 товаров с 609х609px). С webp, разумеется. У меня пока получилось выжать 86/98.

 

[markimax]

3 часа назад, destreser сказал:

Хочу попросить вас для сравнения результатов - сделайте плиз на странице не 7 картинок, а 62 (три банера фул-хд + 58 товаров с 609х609px). С webp, разумеется. У меня пока получилось выжать 86/98.

 

Результат почти отличный
А тема какая?

[destreser]

Только что, markimax сказал:

Результат почти отличный
А тема какая?

Ну, ещё есть куда пилить. Полный самопис на uikit3. Там не только в теме дело, от опенкарта скоро ничего не останется, сфой форк развиваю.

[sitecreator]

3 часа назад, destreser сказал:

сделайте плиз на странице не 7 картинок

 

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

 

3 минуты назад, markimax сказал:

62 (три банера фул-хд + 58 товаров с 609х609px).

 

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

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

 

вы можете написать мне в личку с адресом вашего сайта.

Я могу сделать эксперимент непосредственно с вашими изображениями (вашими исходниками).

[destreser]

2 минуты назад, sitecreator сказал:

вы можете написать мне в личку с адресом вашего сайта.

Я могу сделать эксперимент непосредственно с вашими изображениями (вашими исходниками).

Супер, спасибо! Завтра уже скину, думаю будет что обсудить

[stringer]

On 11/14/2018 at 9:25 PM, yura88k said:

Сегодня получил рекомендацию от Google по всем своим сайтам

Используйте современные форматы изображений JPEG 2000

Сегодня и я повелся на это.

Попробовал JPEG 2000 - фигня полнейшая

Не пойму - почему гугл спид тест деградировал и советует эту дрянь

[sitecreator]

8 часов назад, stringer сказал:

Попробовал JPEG 2000 - фигня полнейшая

 

Можете рассказать как вы его пробовали и как готовили? Что именно не понравилось?

Сложно ли было встроить его в опенкарт?

 

8 часов назад, stringer сказал:

Не пойму - почему гугл спид тест деградировал и советует эту дрянь

 

Может быть проблема не в гугле?

 

[stringer]

1 hour ago, sitecreator said:

 

Можете рассказать как вы его пробовали и как готовили? Что именно не понравилось?

Сложно ли было встроить его в опенкарт? 

 

 

Может быть проблема не в гугле?

 

Я про него банально в гугльспиде вчера прочитал.

Нашел, скачал jp2 компрессор.

Короче сделал файл.jp2 - он у меня не открылся.

Гугльспид - на мой взгляд - сервис деградировал.

[sitecreator]

3 часа назад, stringer сказал:

Короче сделал файл.jp2 - он у меня не открылся.

 

Он бы открылся у вас в Сафари (iPad, iPhone, Mac OS). Этот формат именно для этого браузера.

 

Кстати, а вы не смотрели на заголовок темы?

Смотрели, что рекомендует Гугл?

 

 

 

Просто вы подошли поверхностно и, видимо,  решили не разбираться в вопросе.

 

WEbP + JPEG2000 (именно в паре!!!) обеспечивает отдачу изображения в сжатом формате любому современному браузеру (FireFox-у тоже начиная с 65-й версии).

WEbP не понимает только Сафари, но он понимает JPEG2000.  Такие уж причуды конкурентной борьбы браузеров.

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

 

Основной постулат Гугла - изображения должны быть сжаты!

Простой заменой одного формата на другой этот вопрос не решить. Вы должны обеспечить отдачу каждому браузеру того формата, который он понимает.

А вы этого не сделали.  Такая  избирательная отдача может быть реализована, например, на уровне веб-сервера nginx или апачи (если только апачи без nginx ).  Это если без изменения кода опенкарт.  Есть и другие пути.

 

3 часа назад, stringer сказал:

Гугльспид - на мой взгляд - сервис деградировал.

 

Тут вы не правы.  Совсем наоборот,  Гугл стал мудрее и значительно ближе к реальной оценке скорости загрузки и скорости отображения страницы. Ранее была оценка отдельных параметров, а теперь оценка всей страницы в совокупности и каждый параметр оценивается не сам по себе (например, сжато/ не сжато), а оценивается реальная степень влияния этого параметра.

[stringer]

10 minutes ago, sitecreator said:

Он бы открылся у вас в Сафари (iPad, iPhone, Mac OS). Этот формат именно для этого браузера.

Если столько ограничений - буду обходить его за версту.

А jpeg - можно и обычный сжимать

Фотографии должны быть доступны для всех! - зачем себе сложности создавать?

[markimax]

1 час назад, stringer сказал:

Если столько ограничений - буду обходить его за версту.

А jpeg - можно и обычный сжимать

Фотографии должны быть доступны для всех! - зачем себе сложности создавать?

Совершенно верно, а то "здесь играем, здесь не играем - рыбу заворачивали..."
Сжатие mozjpeg для JPEG и не использовать PNG (вообще не вижу резона его использовать кроме как изредка в лого) - будет достаточно

 

Спойлер

 

 

[stringer]

Повырезал - и получилось - все довольны.

А играл бы сейчас Глюнку целиком - всеБ оББлевались! ))

Получается певец - Я

Пианисты - Вы

Змінено 24 листопада 2018 користувачем stringer

[sitecreator]

2 часа назад, stringer сказал:

Фотографии должны быть доступны для всех! - зачем себе сложности создавать?

 

если мощности сервера достаточно, то сжимайте обычные изображения.

И при грамотном походе в случае использования webP также все изображения доступны всем.

У webP основное преимущество в том, что этот формат (генерация изображений) не нагружает лишний раз сервер.

Ну и как альтернатива PNG формат webP выглядит весьма интересно. Разница в весе может быть в несколько раз.

 

Ведь многие как привыкли? Входные данные: общий хостинг за 90 руб, товаров под 10 000, картинок под 60 000. И запускают сжатие обычных изображений, не учитывая, что сжатие - это затратная операция, которая по сравнению с созданием обычных изображений требует времени в 3...4 раза больше. А потому хостер может выдать предупреждение, что "потребляется много ресурсов" с одновременным предложением перейти на более дорогой тариф.

 

webP потребляет ресурсов не больше чем требуется для создания JPEG. В этом основное преимущество.  Т. е. будет работать без проблем на слабых хостингах.

 

Что сжатый JPEG, что webP+JPEG будут работать везде, имеются ввиду браузеры.

В зависимости от ресурсов сервера можно выбрать оптимальный вариант.

 

Не стоит забывать, что не любой сервер (общий хостинг) позволяет в принципе использовать тоже сжатие mozjpeg, но может позволить вам использовать webp.  Т. е. есть выбор.  Это всегда лучше чем отсутствие совсем выбора в плане выбора способов сжатия.

[stringer]

Я сжал обычные картинки до нужного состояния, залил и забыл.

Знаю точно - любой прихожанин их увидит.

А с этой фигней - одна морока.

[sitecreator]

20 минут назад, stringer сказал:

Я сжал обычные картинки до нужного состояния, залил и забыл.

 

Вы сами создаете сжатые изображения в кеше?

Т. е. для всех размеров вроде:

 

 

24 минуты назад, stringer сказал:

А с этой фигней - одна морока.

 

Ну как вам сказать?

Для кого-то один раз заплатить что-то вроде 1000 р. за универсальное автоматическое решение по сжатию изображений - это вполне логичный выбор. Один раз настроили и, действительно, ни о чем не думают, далее все делается автоматически и пользователя уже не интересует что, как и когда там происходит. Сжатие работает не зависимо от того, что когда и куда заливается. Т. е. пользователь работает с изображениями как привык работать. А всякие термины вроде webP, mozjpeg, optipng вообще мало интересуют пользователя, и тем более, не интересует как это генерируется и как отдается.  Для этого есть программное решение чтобы оградить пользователя от всякой "фигни" и мороки.

 

И другое дело - это самому вручную при каждом добавлении нового изображения его сжимать и сжимать его многочисленные копии разных геометрических  размеров в кеше. Как же тут можно что-то "забыть"?  Наоборот, вы должны все время помнить, а не забили ли вы сделать сжатие для размера 500*500, а для размера 100*100  и т.д.  Какое уж тут " залил и забыл "?   А если кеш очистится, то все заново вручную делать?

 

Впрочем, для каждого, видимо, есть свое понятие "морока".

 

Но есть у меня подозрение, что вы опять не разобрались в вопросе и "залили" не те изображения, точнее, не туда.  Мне очень сложно представить, что вы заливаете каждое изображение нужного размера в кеш, а при этом еще делаете нужный ресайз, добавляете вручную нужные поля и т. д. и т.п. Ведь в кеш обычно не просто копируюся изображения - они обрабатываются движком и от старых не остается и следа в кеше.  Вы это учли? Вероятно, что вы залили исходники и "забыли".   Тогда вы сильно ошибаетесь....

 

 

[stringer]

1 hour ago, sitecreator said:

Мне очень сложно представить, что вы заливаете каждое изображение нужного размера в кеш

У нас мало товара - фотографий меньше 50

Я руками нарезал 2 самых важных размера - и залил - качество остальных маленьких размеров не имеет особого значения.

Теперь вижу то, что хочу видеть - качество картинок под контролем - процесс занимает минуты.

PNG - использую только для лого и всяких иконок (1-2Kb)

Змінено 24 листопада 2018 користувачем stringer

[sitecreator]

31 минуту назад, stringer сказал:

У нас мало товара - фотографий меньше 50

 

тогда вопросов нет.

ваш магазин, скорее, исключение в плане кол-ва изображений.

И ваш опыт вряд ли годится для остальных магазинов.

[stringer]

25 minutes ago, sitecreator said:

 

тогда вопросов нет.

ваш магазин, скорее, исключение в плане кол-ва изображений.

И ваш опыт вряд ли годится для остальных магазинов. 

У нас шубы дорогие в NY & US

Товаров 7 (по 6 фотографий)

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

Я их выведу в нужные топы уже в Декабре-Январе

Змінено 24 листопада 2018 користувачем stringer

[MIrnic]

Всетаки WebP будет получше чем Jpeg2000, в одной из статей показывают разницу в изображениях, где том и писалось в одной из статей про WebP