Как да оптимизираме JPEG за дисплеи на ретината?

За да се настанят дисплеи с висока разделителна способност / ретина, ще искате да използвате изображение с ширина 1280 пиксела, което се нарича „2x“. Докато графиката все още ще се показва на уебсайта с ширина 640 пиксела, вие удвоявате плътността на пикселите, като използвате изображение, което е двойно по-голямо.

1. Какво е оптимизирана ретината?
2. Как да направя изображение, готово за ретина?
3. Как да направя уебсайта си Retina Ready?
4. Каква резолюция е Retina Display?

Какво е оптимизирана ретината?

Изисквания за оптимизация на ретината

Sandvox може да оптимизира вашите изображения за Retina Дисплеи, ако размерът, в пиксели, на изходното изображение е поне два пъти по-голям, в точки, на изображението, както се появява в Sandvox. ... Ако изходният файл също е 400x400 пиксела, той ще изглежда пикселиран на Retina дисплей.

Как да направя изображение, готово за ретина?

Устройствата Retina имат повече пиксели на инч, така че те изискват изображения с висока разделителна способност, за да запълнят тези допълнителни пиксели.
...

1. Стъпка 1: Трябва да създадете изображения с двойни размери на пикселите за вашия сайт. ...
2. Стъпка 2: Сервирайте Retina изображения на Retina Devices. ...
3. Стъпка 3: Качете вашите Retina изображения в WordPress и ги използвайте на вашия сайт.

Как да направя уебсайта си Retina Ready?

За да направите уебсайта си готов за ретина, използвайте Scalable Vector Graphics (SVG), когато е възможно. SVG е графичен формат, базиран на XML, който представя изображения с високо качество. SVG изображенията могат да се преглеждат в интернет браузъри, които използват XML или да се показват на мобилни телефони във SVGB или SVGT файлови формати.

Каква резолюция е Retina Display?

Родна резолюция: 2880 x 1800 при 220 пиксела на инч. Поддръжка за милиони цветове. 13-инчови модели MacBook Pro, представени в края на 2012 г. или по-късно. Родна разделителна способност: 2560 x 1600 при 227 пиксела на инч.