Статья

Что такое Retina?

03 декабря 2020

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

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

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

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

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

 

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

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

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

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

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

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