Форум ReadyScript Вопросы по работе с системой Изображения сильно теряют в качестве в мобильной версии
Страницы 1
Чтобы отправить ответ, вы должны войти
Подскажите пожалуйста как можно сохранить резкость изображений в мобильной версии сайта?
Если смотреть на иконку около названия категорий "лето" и "зима", то они получаются сильно размытые
То же самое касается изображений товаров (второй скриншот).
В системном модуле сделал качество изображений 100.
Sergey T., Тоже задавались этим вопросом. Решили эту проблему путем загрузки иконок в формате SVG.
Дело абсолютно не в качестве. Так картинку сжимает сам браузер. Без у Вас есть картинка определённой ширины и высоты. При переходе в мобильное устройство. ширины картинок подстраиваются под общую область видимости(под ширину экрана). И картинка сжимается. И поскольку у формат jpeg и png, то он не хранит информацию посимвольно. Это проблема самого формата изображения. SVG, это формат который рассчитывает всё изображение и каждые линии формулами, на основе внутренних координат элементов и поэтому его можно сжимать как угодно.
Идеального решения на данный момент в мире не существует. SVG довольно тяжеловесный.
100 % качества в JPEG я Вам не рекомендую выставлять. Т.к. изображения сильно прибавляют в весе, а разницы между 90 и 100 вообще на глаз нет.
И если честно мне сложно представить, чтобы настолько близко к глазу человек будет рассматривать на мобиле фото.
Закусило Александр, На самом деле очень сильно бросается в глаза.
Стикер "Новинка" формата png из темы default весит 2,26 КБ.
Стикер "Новинка" формата svg весит меньше 1 КБ.
Думаю не плохо.
Спасибо за ответы!
Убрал качество обратно на 90.
А как использовать SVG в редискрипт? Штатно он ведь не поддерживается. При загрузке пишет "Загружен неподдерживаемый формат файла"
Sergey T., Если только на прямую больше ни как
Здесь дело не в качестве пережатия изображений.
Погуглите на тему Retina Optimization. Все дело в DPI мобильного.
Для таких экранов нужно изображения готовить в 2х или даже 3х кратном размере,
а затем масштабировать их за счет CSS. Это значительно пойдет в ущерб объему страницы (страницы будут тяжелыми).
Но все это возможно сделать на ReadyScript, просто в вашей теме оформления нужно запрашивать изображения большего размера, а в CSS или у тега img выставлять принудительно меньший размер.
Здесь дело не в качестве пережатия изображений.
Погуглите на тему Retina Optimization. Все дело в DPI мобильного.Для таких экранов нужно изображения готовить в 2х или даже 3х кратном размере,
а затем масштабировать их за счет CSS. Это значительно пойдет в ущерб объему страницы (страницы будут тяжелыми).
Но все это возможно сделать на ReadyScript, просто в вашей теме оформления нужно запрашивать изображения большего размера, а в CSS или у тега img выставлять принудительно меньший размер.
Спасибо большое! Так и сделал! Теперь значки на мобилке отображаются гораздо четче и приятнее глазу.
Страницы 1
Чтобы отправить ответ, вы должны войти
Форум ReadyScript Вопросы по работе с системой Изображения сильно теряют в качестве в мобильной версии
