Статья

Что такое Retina?

03 декабря 2020

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

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

К примеру, разрешение экрана Apple Retina имеет в два раза больше пикселей на дюйм чем у конкурентов. Соответственно, мы видим изображение в 2 раза четче.

Теперь увеличьте окно в браузере Ctrl и + в Windows, в macOS разницу увидите сразу. Первая картинка — обычная, вторая — Retina.

обычный монитор
изображение x1 (обычное)

 

retina
изображение x2 (повышенной четкости)

Как сделать, чтобы изображение было четким на любом устройстве?

Существует два варианта:

  1. Закачивать фотографию с разрешением в 2 раза больше, чем требует размер экрана в Windows.
  2. Сделать скрипт, подменяющий фотографию (большего разрешения или меньшего) в зависимости от плотности пикселей экрана или его разрешения.

Прочтите еще статью про SVG.

Добавьте ваш отзыв
Ваше имя
Email
Сообщение
Оцените
Отправьте запрос
Ваше имя
Ваш телефон
Сообщение
Антиспам защита
Семь минус два ?
Согласен с условиями отправки личных данных