ПредишенСледващото

Как да оптимизирате изображения за ретина дисплеи
Както е добре известно, "на тъмно. - всеки младеж" Използването на такъв изящен израз, можем да кажем, че на дисплея Retina светлините в Интернет. Въпреки че цялостната картина не се е променила и чертите на лицето остават разпознаваеми, но в ярка светлина разкри много малки дефекти, които развалят общото впечатление.

Какво е ретината? Как да се лекува?

Ретината - плод на въображението на Apple - всъщност прави на растенията LG и Samsung, което е особено пикантен в светлината на продължителни разправията между двете компании. Retina има плътност от пиксели, които човешкото око не могат да различат отделните хора. Например, решението за Ipad 3 е 2048 × 1536px, както и изображения в трите милиона пиксела изглежда наистина страхотно. По този начин, уеб дизайнери имат възможност да се даде на потребителя още по-чисти и ясни графики. Но тогава там са проблемите и как да се адаптират дизайна на този разкош? На следващо място, вие ще научите защо това е необходимо, дали е необходимо да се направи и как да го направя.

Как да оптимизирате изображения за ретина дисплеи
От другата страна има хора, които също "да" от новия екран. Мнозина вече са недоволни подпечата краката си. като нови приложения са оптимизирани по същите Ipad 3 много повече място, отколкото преди ретината. Това, което е вече говорим за интернет трафика? Не всеки е готов да се харчат пари, за да изтеглите огромни изображения. Как може да се оптимизира?

И имам нужда от него?

За щастие, гръмотевицата, докато най-накрая се спука, а не непременно да се кръсти. Клиентите търсят в нашите творения чрез дисплея Retina, все още представляват много по-малко от 1%.

Съществува мнение: защо пастърма за такъв малък брой потребители? Това е същото като да код за IE5, т.е. струва много, но е малко объркващо.

Контрааргумент. За щастие, IE5 постепенно изчезват от живота ни, но как смятате, че делът на висока резолюция устройства ще се увеличи или намали от година на година?

Заключение: време да се мисли!

CSS CSS и повече пъти!

Най-лесният начин за излизане от ситуацията е подобна на ситно гордиев възел: Да не се използва образа на всички. Съдържание, както си спомняте, ние имаме цар, и шрифтове и шрифтове на Retina изглеждат страхотно! Но ние, разбира се, да преувеличава. Направете голи текст не е възможно, така че аз просто се опитват да се намали количеството на графика - такива съвети ни дават смели оптимизатори. Използвайте CSS за ефекти - сянка, градиенти, заоблени ъгли. Така че си (подканващи към действие) бутони CTA не ще загубят своята привлекателност.

Как да оптимизирате изображения за ретина дисплеи

Какво да правим с икони?

Logo като икони, може да се зареди векторен формат .svg (Scalable Vector Graphics). Въпреки това, да бъдат подготвени за факта, че по-старите браузъри не поддържат .svg, така че не забравяйте да погледнете сайта си чрез различен призма, в зависимост от изискванията на клиентите и тяхното чувство за красота.

Увеличаване на изображения на 2 пъти?

Възможна. Сметката е проста. До Изображението се появява един красив Retina, той трябва да бъде два пъти повече от това, което предаваме на нормалната дисплея. С селектор «мин-устройство пиксела съотношение» определи типа на устройството и желания изпратени два пъти по-голяма картина. По този начин трябва да се удвои всички графики. Ако вече сте се втурнаха да се оптимизира правилните букви ще ви даде това чудо-чарт.

... Но не е задължително. Има и друг изглед. Дори и всички онези, които имат дисплей Retina, които искате да качите такъв огромен образ. Както е известно, колебае се губи, така че потребителят не може да чака за вашия сайт, за да заредите superoptimizirovanny. Така че трябва да се мисли за това дали всички необходими изображението се увеличава от 2 пъти. Използвайте CSS на макс, и всички останали снимки само малко увеличение, и колко - да вземе решение.

Как да се справим с проблема на Apple?

Ясно е, че преди пускането на нов дисплей, Apple отдавна обработват вашия сайт, за да изглежда като чист и Retina. Може би трябва да вземе пример от майсторите - те със сигурност излезе с нещо необикновено?

Щастлив или тъжен?

Уеб дизайн сплит общност (въпреки че, когато е обединен.). Някои казват. Retina, която ще ви отвори очите за това как грозно си дизайн, така че трябва сега любовта на изкуството да тичам да купуват устройства с нов дисплей. Други са на мнение. че не трябва да се бърза с крайности и да се мисли за това, което наистина имаме нужда и това, което е излишно. Ние стигаме до извода тази статия на същия положителен Забележка: В следващите няколко години ще се промени лицето на интернет, а до голяма степен благодарение на новите дисплеи, така че нека да хване вълната в самото си раждане, за да се опита нови методи на потока на изображението и задълбочаване на познанията им за CSS. Какво мислите?

Подкрепете проекта - споделете линка, благодаря!