Проблема с изображением в мобильной версии для ios

Решено svmagay
(@svmagay)

5 лет, 2 месяца назад

Не могу найти причину перевернутого изображения с главной страницы в мобильной версии сайта leratenart.com на айфонах? Причем на андроидах все отображается нормально, в чем причина?

Просмотр 8 ответов — с 1 по 8 (всего 8)

SeVlad
(@sevlad)

5 лет, 2 месяца назад

Не могу найти причину перевернутого изображения с главной страницы в мобильной версии сайта leratenart.com на айфонах? П

Изображение повёрнуто в реальности — http://leratenart.com/wp-content/uploads/2018/07/IMG_1149-1-225×300.jpg. Это браузер его поворачивает «правильно» в соответствии с ориентацией в EXIF:

Позвольте дам рекомендацию: никогда не загружайте такие огромные картинки

Всегда готовьте картинки перед заливкой на сайт — приводите в порядок физ. размеры, проверяйте ориентацию, удаляйте EXIF (если только EXIF действительно нужен).
O
(@perdyllo)

5 лет, 2 месяца назад
приводите в порядок физ. размеры, проверяйте ориентацию,

Путем многочисленных экспериментов лично я пришёл к выводу то максимальный вес фото для ВП сайта не должен превышать 0.5-0,7мб Размер не более 1920х1080 пкс Качество jpeg 85-90.(это потолок, при котором фото открывается относительно легко и сохраняет очень хорошее качество). Но фактически я использую на всех своих сайтах фото в разрешении 1280х720 при качестве jpeg 90 и соответственно «весе» в 150-300кб. При этом соблюдается наилучший баланс между скоростью открытия страниц сайта с фото, самих фото при сохранении вполне приемлемого качества картинки.

P. S. Вместе с тем меня очень удивляет факт что в и-те можно найти фото (в основном это обои для рабочего стола и фоны для веб дизайна) которые имеют мизерный вес, огромное разрешение 4К и сохраняют потрясающее качество картинки. Лично я не могу понять каким образом можно добиться таких результатов, какие алгоритмы обработки фото для этого используются.
- Ответ изменён 5 лет, 2 месяца назад пользователем O.
- Ответ изменён 5 лет, 2 месяца назад пользователем O.
Модератор Yui
(@fierevere)

永子

5 лет, 2 месяца назад

Путем многочисленных экспериментов лично я

стоит смотреть статистику GA или Метрики, и брать за основу максимальное разрешение экрана посетителей, да, скорее всего это и будет 1920×1080, посетителей у которых экран будет больше будет очень мало, тем не менее возможны варианты…

вот например, 2560 есть, но их мало

второй фактор — время загрузки страницы, как полностью, так и время до отрисовки, когда пользователь переключается от ожидания к рассматриванию содержимого.

третий фактор (тоже по метрике) — доля стационарных и мобильных устройств и их тип.

SeVlad
(@sevlad)

5 лет, 2 месяца назад

максимальный вес фото для ВП сайта не должен превышать 0.5-0,7мб Размер не более 1920х1080 пкс Качество jpeg 85-90

Смотря какое «фото» и для какого сайта и в каком месте. Для вставки в пост может и 400х200 100 кб будет много. А для потфолио фотографа может и 4к понадобиться.
Любое ~~фото~~ графическое изображение должно быть оптимизировано настолько, насколько это возможно без потери кач-ва на глаз.
А 90 для jpg-фото это много. 80 — вполне достаточно если это фото в пост. А порой и до 60 можно ужать без особых потерь.

Самое важное — общий вес страницы. Он не должен быть большим. Нужно ориентироваться на юзеров с медленным и дорогим моб интернетом (а это не только «мобильные» юзеры!). Если нужно показать много картинок то не стоит их все вываливать на первый экран, а стоит использовать «ленивую загрузку» и/или превью с лайтбоксом.

O
(@perdyllo)

5 лет, 2 месяца назад

Смотря какое «фото» и для какого сайта и в каком месте

Опять «лично я» 🙂 . Лично я использую именно фото при этом нужно их показать в достаточно удовлетворительном качестве и с размером для комфортного просмотра при открытии в лайтбоксе. 4К мне не надо, но и 200х400 и даже 600х800 тоже не годится. Поэтому остановился на указанном выше оптимальном для меня варианте — 1280х720. Чего и многим другим желаю.

bezuprechno
(@bezuprechno)

5 лет, 2 месяца назад

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

Например, ShortPixel Image Optimizer, с опцией glossy. Можно попробовать на их сайте 50 штук (и более при подходе с головой) Вполне сносно жмет картинки. При желании и денег можете заплатить. Пока из плагинов более приличного сжатия не видела (имеется ввиду качество-вес)
O
(@perdyllo)

5 лет, 2 месяца назад
Например, ShortPixel Image Optimizer,

Я немного о другом. Онлайн-сервисы меня в данном случае не интересуют.

Пока из плагинов более приличного сжатия не видела (имеется ввиду качество-вес)

Готов поспорить и противопоставить https://ru.wordpress.org/plugins/tiny-compress-images/
и сам онлайн сервис https://tinypng.com
Но, в данном случае я не об этом.
- Ответ изменён 5 лет, 2 месяца назад пользователем O.
bezuprechno
(@bezuprechno)

5 лет, 2 месяца назад

поспорить и противопоставить

Видела, пробовала. Совсем не понравился.

Просмотр 8 ответов — с 1 по 8 (всего 8)

Тема «Проблема с изображением в мобильной версии для ios» закрыта для новых ответов.