Разработка сайта
23.07.2014

Ultra HD, Retina и Full HD сайты

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

Давайте же разберемся: Ultra HD, Retina и Full HD – это дисплеи сверхвысокого разрешения, с поддержанием изображения высокой четкости, что многократно превышает обычный стандарт. На сегодняшний день подобные дисплеи – это не редкость, и чтобы не отлететь на задворки Интернета нужно идти в ногу с новинками.

Retina-дисплей. Возможность видеть больше!

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

Как обстоят дела с сайтами, которые не поддерживают разрешение Retina? Пользователи с Ultra HD или Retina дисплеем на сайтах, которые не поддерживают это разрешение, будут наблюдать картинку плохого качества.

Почему сайты нуждаются в адаптации?

Всё достаточно прозаично: современные мобильные аппараты обладают мониторами сверхвысокого качества. Адаптация сайта под разрешение Retina позволит всем пользователям наслаждаться идеальным изображением. Позаботьтесь о Ваших посетителях!

Как изменить изображение под Retina-дисплей?

Здесь Вы можете найти инструменты для решения адаптации сайта.

Формат SVG – посмотри на мир по-другому.

Преимущество этого формата – векторная графика, которая предотвращает потерю качества при изменении изображения до любых размеров. Манипуляция происходит не за счет пикселей, так как векторы формируют различные фигуры, что не отображается на структуре изображения. Вне зависимости от формата дисплея, картинка будет выглядеть идеально.

Растровые картинки и фото

Изменение формата за счет сжатия с помощью HTML, CSS или JS. Все, что потребуется – это внести необходимый размер, высоту и ширину в HTML, что уменьшит формат. Через CSS изображение уменьшается на 50%.

CSS media query – это уникальный код, который позволяет определять формат экрана и загружать большие изображения только на Retina-дисплей.

JavaScript – удобный плагин для разрешения задачи дисплея высокого качества. Данный вариант является довольно простым. К примеру, у Вас в наличие имеется 2 изображения – одно увеличенное, второе обычного формата. Все, что потребуется – программа retina.js, которая определит Retina-дисплей и применит нужное изображение. Главное – правильное название картинки.

Измените стиль жизни Вашего сайта! Придайте ему четкости и качества!