Популярные разрешения экранов: основы адаптивной верстки

Отзывчивый дизайн

Невозможно разработать стиль и дизайн сайта для каждого устройства. Поэтому для адаптивной вёрстки разработчики часто:

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

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

Если вы разработчик и хотите создать дизайн, удобный для работы с мобильными или адаптивными стилями, ниже мы предлагаем фрагменты кода CSS, которые могут пригодиться

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

@media screen and (max-width: 991px) {
/* стили для больших планшетов — начало */

}

@media screen and (max-width: 767px) {
/* стили для средних планшетов — начало */

}

@media screen and (max-width: 479px) {
/* стили для телефонов — начало */

}

Использование приложения SecondScreen

Увеличить или уменьшить разрешение помогут такие приложения, как Resolution Changer Pro, SecondScreen. Как и в предыдущих способах, необходим root-доступ. Программа SecondScreen может:

• Внести изменения в разрешение дисплея;
• Опустить или поднять параметр DPI с 720р до 1080р;
• Сменить режим отображения «смартфон-планшет».

К преимуществам приложения SecondScreen можно отнести возможность подключения гаджета к интернету через Bluetooth либо Wi-Fi. Оно может отключить подсветку экрана смартфона либо планшета для поиска в интернете после подключения гаджета к большому экрану. При этом сенсорный дисплей останется активным. Приложение SecondScreen можно установить через магазин Google Play. Оно является бесплатным, что будет дополнительным преимуществом для многих пользователей.

Разрешение экрана планшета либо смартфона, который работает на операционной системе Андроид, не всегда соответствует требованиям юзеров. В таком случае можно изменить параметры устройства. Для этого существуют специальные приложения. Можно внести изменения вручную, используя знания о файловой системе оболочки Андроид. Сложности могут возникнуть лишь с получение root-прав, которые необходимы для подобных действий.

Retina

Ещё одно маркетинговое название, на этот раз от компании Apple. У экранов Retina нет определённых характеристик, разве что должно быть разрешение выше минимального. Это разрешение не позволяет человеческому глазу видеть отдельные пиксели, и плотность пикселей тут более 300 ppi. При этом Apple измеряет плотность пикселей не так, как другие производители.

Измерение зависит от размера и разрешения экрана. Концепция Retina продвигается со времён iPhone 4 с разрешением 960 х 640. Там применялся экран IPS LCD 3,5 дюйма, плотность пикселей 330 ppi.

В наши дни на Android экраны под 6 дюймов с разрешением QHD плотность пикселей достигает 400-500 ppi. Из-за этого Apple пришлось пересмотреть мнение о том, что 300 ppi является достаточным значением. iPhone 6 Plus с разрешением Full HD обладает плотностью пикселей 401 ppi. На iPhone 7 и iPhone 7 Plus плотность пикселей 326 и 401 ppi соответственно. На iPhone XS и XS Max это значение составляет 458 ppi.

LG G6

Когда LG G6 только появился, его вытянутый 5,7-дюймовый экран с нестандартным соотношением сторон 18:9 был в новинку, но прошло полгода — и этим уже никого не удивишь. Но корпус удивительно компактный и на сегодняшний день — его размеры 148,9×71,9×7,9 мм, и это меньше, чем у прошлогоднего LG G5 с экраном 5,2”. За счёт дополнительного скругления углов, о котором мы уже писали, смартфон даже удалось сделать по ощущениям ещё более компактным.

Производитель говорит о том, что экран занимает 79% передней поверхности, наши расчёты показывают 78,3%, что не сильно отличается, но всё же. Разрешение экрана QHD+ — это был первый аппарат с таким разрешением на IPS-матрице с соотношением сторон 18:9. Кстати, LG решили сыграть на соотношении сторон «два квадрата», и в новой версии фирменного интерфейса поддерживается режим многооконности.

На что влияет диагональ?

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

Начнем с пользовательского опыта. Если вы купите фаблет (смартфон, диагональ дисплея которого превышает 5,5 дюйма), то рискуете столкнуться с определенными проблемами. Подобный гаджет может не поместиться в карман рубашки или в задний карман джинсов. Также вам придется регулярно использовать вторую руку — практика показывает, что пользователь не имеет шанса дотянуться до верхних углов большим пальцем. Но зато на устройстве с крупным дисплеем великолепно смотрятся фильмы! Только не забудьте убедиться в том, что экран приобретаемого смартфона располагает высоким разрешением! Впрочем, об этом мы поговорим отдельно. Ещё на большом дисплее проще набирать текст, работая с документами. Именно поэтому среди офисных работников всегда были популярны фаблеты из серии Samsung Galaxy Note.

Об устройствах с маленьким или средним дисплеем сложно сказать что-то конкретное. По крайней мере, в отношении пользовательского опыта. Кто-то заявит, что на 4,7-дюймовой ЖК-панели невозможно читать книги и смотреть фильмы. Но на самом деле это чистая неправда. Если уж быть честным, то для просмотра видео лучше использовать планшет с 10-дюймовым экраном или вовсе телевизор. Более компактные устройства в любом случае окажутся для этих целей менее удобными. Кстати, автор этой статьи в детстве спокойно прочитал несколько книг на Siemens CX70 с его крошечным TFT-дисплеем. А на 2,2-дюймовом экране смартфона Nokia E65 осуществлялся просмотр шестого сезона сериала «Остаться в живых». Короче говоря, если контент интересный, то маленький экран каких-то неудобств не составит.

Запасаемся энергией для больших и сочных картинок

Ну а что можно сказать о влиянии ЖК-дисплея на работоспособность смартфона? Пожалуй, вы уже догадались, что крупная диагональ расходует значительные объемы энергии. По крайней мере, это касается IPS-панелей и экранов, выполненных по похожей технологии. Они располагают отдельным слоем подсветки, которая равномерно освещает всю площадь дисплея. И если эта площадь больше, то и заряд аккумулятора расходуется активнее. Вот почему более крупные смартфоны чаще всего получают и более ёмкую батарею. Если же экран выполнен по технологии AMOLED, то всё не так плохо — различия между разными диагоналями будут менее заметны (но они всё же не исчезают).

Для вывода картинки на более крупный экран тратятся большие ресурсы. То есть, если два смартфона с разными дисплеями будут иметь одинаковый процессор, то более крупный девайс будет работать медленнее. Хотя это не является истиной в полном смысле этого слова — всё же наибольшее влияние на производительность оказывает разрешение, а не диагональ.

Почему так важен размер экрана?

От него зависят габариты устройства. Но при этом девайс, даже имея большой экран, может иметь небольшую толщину. В этом плане рекордсменом считается Vivo X5 Max, имеющий толщину 4,75 мм. Кроме того от величины экрана в прямой зависимости находится ширина корпуса. Фаблет позволяет со всеми удобствами просматривать фильмы, осуществлять наборы текста и серфинговать на просторах интернета.

И всё это при меньших, относительно планшета размерах. И к тому же он всегда в пределах досягаемости. Так думают и пользователи. Об этом говорит падение спроса на iPad после того, как был презентован первый планшет Apple. Оно составило 13% по результатам 4-го квартала 2014 года.

Есть ли у фаблетов минусы? Конечно. Их появление сделало невозможным одноручное управление смартфонном. Большому пальцу не удаётся достать все зоны экрана, если не выполнять перехват. А значит, создаются неудобства для пользования на ходу. И избавиться от этого неудобства можно только уменьшением полезной площади экрана.

В iOS есть возможность сдвинуть вниз интерфейс. Для этого выполняется двойной клик на Home — кнопки, на которой изображён логотип, принадлежащий системе. Благодаря особенностям некоторых ОС Android есть возможность одним жестом выполнить включение управление посредством руки.

От размера, который имеется у экрана, в прямой зависимости находится выбор смартфона. Предложение определяется трендом. Именно по этой причине в текущем году пользователи с непониманием воспринимают флагманские смартфоны, чей экран меньше 5,2 дюйма. В качестве исключения можно назвать iPhone и устройства, относящиеся к семейству Sony Xperia Z Compact. По некоторым сведениям компании планируют представлять модели, размер экрана которого будет равен 5 дюймам, и процессором А8.

Немалое значение уделяется соотношению между габаритами дисплея и величиной корпуса гаджета (screen-to-body ratio). Обладая диагональю в 5,7 дюйма, Xiaomi Mi Note имеет меньшие размеры, чем iPhone 6s Plus. Использование узких рамок, окаймляющих дисплей, является одной из самых популярных тенденций. Когда речь идёт о вопросах, связанных с конструированием смартфонов в предыдущем году. И дело тут исключительно в эстетике.

Какое оптимальное разрешение экрана для смартфона

Когда мы рассказываем о смартфонах на страницах нашего интернет-журнала, мы не забываем рассказать о разрешении их экранов. Разрешение экрана — это размеры получаемого на экране изображения в пикселях. Чем больше пикселей, тем больше объектов может поместиться на экране.

Однако дело вовсе не в количестве объектов, которые могут разместиться на экране, а в количестве точек на дюйм — чем их меньше, тем выше зернистость, которую в том числе способен разглядеть человеческий глаз. Разумеется, касается это по больше части устройств с низким разрешением. Существует даже такой параметр PPI (от англ. pixels per inch), который и означает количество точек на дюйм

Считается, что человеческий глаз может разглядеть пиксели на экране при PPI, который равняется 350. Отчасти это верно, если не забывать, что каждый человек индивидуален и если вам PPI 350 мало, то другому — как говорится, за глаза.

Вот вам изображение для того, чтобы вы наглядно смогли ознакомиться с пиксельностью на экране:

Перед вами типичное разрешение для смартфонов и данные PPI:

4 дюйма — 800х480 (250 PPI)

4,5 дюйма — 1280х720 (326 PPI)

4,7 дюйма — 1280х720 (317 PPI)

5 дюймов — 1280х720 (294 PPI)

5 дюймов — 1920×1080 (441 PPI)

5,5 дюйма — 1920×1080 (401 PPI)

5,5 дюйма — 2560×1440 (534 PPI)

5,7 дюйма — 1920×1080 (386 PPI)

5,7 дюйма — 2560×1440 (515 PPI)

Говоря о PPI 350, мы не лукавили — на 5-дюймовом экране с разрешением 1280х720 пикселей заметить зернистость действительно несложно, однако помните, что это также зависит от технологии производства дисплея. При это на 5-дюймовом смартфоне с разрешением 1920×1080 заметить зернистость куда сложнее, нужно специально вглядываться и то не факт, что вы сможете что-то увидеть.

Получается, что чем выше разрешение и PPI, тем лучше? Да, все верно

К тому же в столь высоком разрешении зачастую нет смысла — зачем оно нужно при PPI 534, когда вы не видите зернистость уже при PPI 350? Именно поэтому мы рекомендуем не гнаться за высокими цифрами, а выбирать золотую середину.

И еще один важный момент. Опираться на отзывы можно, однако когда дело заходит о дисплее, настоятельно рекомендуем вам познакомиться с ним лично, нежели делать выбор только на основе отзывов.

Заряжен мощью iPhone 13. При своих-то размерах

Первые замеры показывают, что A15 Bionic улучшили больше в области CPU, чем GPU. Банально потому что конкуренты всё ещё отстают в обеих сферах.

Сколько угодно можно гонять смартфоны в монтаже 4K-файлов и считать секунды, собирать данные бенчмарков, измерять количество кадров в 3D-сценах. но концертно этому девайсу оно не нужно, потому что он всё это безоговорочно сделает на уровне первых мест.

Сейчас процессоры в iPhone решают много задач, и основные – это работа с функциями камеры, максимальная экономия энергии, гладкие анимации и мгновенный запуск приложений. Чип в iPhone 13 mini делает ровно это.

Другого и не ожидаешь. Новинки Apple всегда мощные.

Больше всего меня впечатляет, как грамотно это распределение ресурсов продумано. Заметно, что видео теперь режутся и кадрируются быстрее, но в нужные моменты сила чипа укрывается и ждёт своего часа, сохраняя драгоценные проценты.

Поэтому я так уверено и говорю о том, что батарея спокойно переживёт день. Этот смартфон нужен тем, кто относится ко всему немного иначе.

Xiaomi Mi Mix

Сегодня у нас лидирует флагман Xiaomi, но образца не нынешнего года, а прошлого — его оказалось рано сбрасывать со счетов. Mi Mix, вышедший во второй половине прошлого года, был своего рода демонстрацией возможностей для китайского бренда, «игрой мускулами». Правда, «безрамочный» дизайн с эффектным керамическим корпусом и мощное железо были на одной чаше весов, тогда как на другой — хрупкость этого самого корпуса, посредственная камера и отсутствие поддержки популярных в России диапазонов LTE.

Но нас интересует именно «безрамочность», о ней и поговорим. На презентации казалось, что 6,4-дюймовый дисплей занимает действительно всю площадь передней поверхности, но по факту вокруг него есть пусть узкие и малозаметные, но всё-таки рамки. Габариты корпуса 6,4-дюймового Mi Mix — 158,8 х 81,9 мм. Для сравнения, ширина и высота у 5,5-дюймового Apple iPhone 8 Plus составляют 158,4 и 78,1 мм соответственно.

Отметим нестандартное соотношение сторон IPS-дисплея 17:9 — он вытянут больше, чем у смартфонов с соотношением 16:9, но не кажется таким длинным, как новомодные аппараты с 18:9. Разрешение экрана составляет 2040 x 1080 точек — немного больше, чем Full HD, но всё-таки не 4К, и качество картинки тут очень хвалят.

Железо

Процессор

Есть несколько ведущих производителей процессоров — Apple, HiSilicon, MediaTek, Qualcomm, Samsung. Все они делают многоядерные процессоры, и количество ядер сегодня мало что решает

Лучше обратить внимание на тесты производительности в бенчмарках и в реальных задачах

При прочих равных устройства на Qualcomm Snapdragon предпочтительнее любых других: они меньше греются, медленнее расходуют заряд батареи, лучше обрабатывают снимки, под них оптимизировано больше софта и игр. Самая мощная серия — восьмисотая, Snapdragon 8xx. Почти так же быстры чипсеты серии 7xx, а вот 6xx и 4xx предназначены только для устройств среднего и бюджетного сегмента, они далеко не так хороши в играх, хотя с основными задачами справляются.

Самые производительные чипсеты Samsung — прошлогодний Exynos 990, а также новейшие 1080 и 2100. Схожей производительностью обладают HiSilicon Kirin 980, 985 и 990. Самые прогрессивные продукты MediaTek — чипы Dimensity 800 и 1000, но чаще можно встретить устройства на чипах серии Helio, относящихся к среднему сегменту.

В мире Apple всё просто: у устройств, которые можно найти в официальной рознице, проблем с производительностью нет. А самые быстрые модели — из последнего поколения. Сейчас это iPhone 12 с чипом A14. В мире Android есть не только флагманы, но и устройства подешевле, и их быстродействие может разительно отличаться.

Оперативная память

Apple её объем и характеристики не раскрывает — айфоны «просто работают». В мире Android максимальный размер оперативной памяти становится с каждым годом больше, как и аппетиты программ и игр. Поэтому лучше брать устройства с памятью от 4 ГБ, а при возможности, от 6 ГБ. Есть разные стандарты памяти, различающиеся скоростью работы: LPDDR4, LPDDR4X и LPDDR5, из которых лучше всех — последний вариант. Но выбор вам делать не придётся, так как устройство вы будете подбирать по экрану, процессору, камерам и другим параметрам, а оперативная память уж какая достанется, лишь бы объем был достаточным. Но можете не переживать, в устройствах с быстрыми процессорами будет достаточно быстрая память.

Внутренняя память

В 2021 году пора забыть про устройства с памятью меньше 64 ГБ. А оптимальный объём — от 128 ГБ. Особенно если собираетесь много фотографировать и записывать видео. Стандартами внутренней памяти сейчас являются eMMC 5.1, UFS 2.0, UFS 2.1, UFS 3.0 и 3.1. На текущий момент лучше выбирать между UFS 2.1 и UFS 3.0, как самыми быстрыми. UFS 3.0 быстрее eMMC 5.1 минимум в 6 раз, а по сравнению с UFS 2.1 — более чем в 2. Как и в случае с оперативной памятью, выбор типа производитель сделает за вас. Остаётся только проверить объём и наличие слота для карты памяти, — возможность расширить хранилище никогда не помешает.

Беспроводные коммуникации

Поддержка сотовой связи 4G (она же LTE) есть даже в самых недорогих устройствах. А вот устройства с 5G, которые обеспечивают значительно более быстрый доступ в интернет, в России в ближайшее время не пригодятся, — у нас пока нет для них сотовых сетей. Пользоваться 5G получится только за границей.

Wi-Fi в 2021 году должен быть с поддержкой 5 ГГц. Есть уже и Wi-Fi 6, но его преимущества можно ощутить только там, где есть соответствующие роутеры, а таких мест пока немного.

Последняя версия Bluetooth — 5.2. Но совершенно не критично, если в устройстве BT 5.0 или 5.1.

Модуль NFC нужен для бесконтактной оплаты, когда смартфон заменяет банковскую карту.

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

Материал по теме

Под какие устройства и разрешения экранов оптимизировать сайт

Однозначного ответа нет. Нужно смотреть с каких устройств на сайт заходит целевая аудитория

Но нужно принимать во внимание, что:

• Наиболее распространенный формат Андроид — 480×800 (hpdi), он соответствует всем смартфонам Samsung и большинству популярных Nokia.
• Второй по популярности формат — mdpi, 320×480
• Большинство смартфонов оснащены тач-скрином.

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

• 320×480 px — iPhone5
• 480×800 — HTC Desire, Nexus One, i9000 Galaxy S и другие
• 768×1024 — iPad
• 640×960 — iPhone 4
• 1000 и более×бесконечность — планшеты и десктоп

Статья по теме: Оптимизация сайта под низкочастотные запросы

Под какие устройства и разрешения экранов оптимизировать сайт

Однозначного ответа нет. Нужно смотреть с каких устройств на сайт заходит целевая аудитория

Но нужно принимать во внимание, что:

• Наиболее распространенный формат Андроид — 480×800 (hpdi), он соответствует всем смартфонам Samsung и большинству популярных Nokia.
• Второй по популярности формат — mdpi, 320×480
• Большинство смартфонов оснащены тач-скрином.

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

• 320×480 px — iPhone5
• 480×800 — HTC Desire, Nexus One, i9000 Galaxy S и другие
• 768×1024 — iPad
• 640×960 — iPhone 4
• 1000 и более×бесконечность — планшеты и десктоп

Статья по теме: Выбираем систему управления сайтом

Какое разрешение экрана выбрать?

Одним из самых популярных разрешений дисплея смартфона является 1280 на 720 пикселей — HD. Практически все гаджеты бюджетного ценового сегмента оснащены именно таким показателем.

Более мощные устройства оборудованы дисплеями с бОльшим разрешением. Смартфоны с экранами 1920 на 1080 появились давно и уже никого не удивляют. Если диагональ смартфона составляет от 4,5 до 5,5 дюймов, лучше всего подойдет экран 1920 x 1080 точек (Full HD). При меньшем разрешении на изображении будут заметны пиксели, и пользователь может ощутить дискомфорт. Наверно, это и есть золотая середина — цены невысокие, изображение четкое и яркое.

При диагонали 5,5 и более дюймов во флагманских устройствах используется разрешение Quad HD (2650×1440). Качество изображение здесь высокое, но, если верить некоторым исследованиям, человеческий глаз практически не в силах заметить существенную разницу. Quad HD — характеристика будущего, она необходимо для технологий дополненной и виртуальной реальности.

Для устройств Apple

У устройств фирмы Apple есть свои стандарты для разрешений

Модель iPhone	Диагональ, дюйм	Разрешение, пиксели
4,4S	3,5	640×960
5, 5C, 5S	4	640×1136
6, 6S	4.7	750×1334
6+, 6S+	5.5	1080×1920
7, 8	4.7	750×1334
7+, 8+	5.5	1080×1920
X	5.8	1125×2436
SE	4	640×1136

Для устройств Android

Стандарты разрешений для устройств на базе Android

Модель	Диагональ, дюйм	Разрешение
ASUS
Zenfone 2 Lazer ZE500KL	4,99	720×1280
Zenfone 4 A450CG	4,4	480×800
HTC
Desire 600	4.45	540×960
Desire C	3.52	320×480
Desire SV	4.31	480×800
Desire V	4,1
Desire X	4,1
One	4.8	1080×1920
One 32Gb	4.6
One S ,	4.2	540×960
One SV	4.2	480×800
One X, X+	4.8	720×1280
Windows Phone 8s	4.1	480×800
Windows Phone 8x	4.2	720×1280
Huawei
Ascend G630	5,1	720×1280
Honor 5X	5.4	1080×1920
Honor 6, 7	5.1	1080×1920
Lenovo
IdeaPhone P770	4.6	540×960
IdeaPhone S720
K900	5.4	1080×1920
P70, S60	5.1	720×1280
Vibe Shot	5.2	1080×1920
LG
G2	5.2	1080×1920
Nexus 4	4.8	768×1280
Nexus 5	4.97	1080×1920
Optimus 4X HD	4.71	720×1280
Optimus G	4.71	768×1280
Otimus G Pro	5.51	1080×1920
Optimus L5	4,1	320×480
Optimus L5 II Dual	4,1	480×800
Optimus L7 II Dual	4.4
Optimus L7	4.4
Optimus L9	4.6	540×960
Samsung
Activ S	4.75	720×1280
Galaxy A5	5,1	720×1280
Galaxy A5 2016	5.1	1080×1920
Galaxy Mega 6.3	6.4	720×1280
Galaxy Nexus	4.7	720×1280
Galaxy Note	5.4	800×1280
Galaxy Note 2	5.6	720×1280
Galaxy S Duos	4,1	480×800
Galaxy S2, S2+	4.4	480×800
Galaxy S3	4.7	720×1280
Galaxy S3 Mini	4,1	480×800
Galaxy S4	5,1	1080×1920
Galaxy S4 Mini	4,2	540×960
Galaxy S4 Mini, S4 Zoom	4.1	540×960
Galaxy S5	5.2	1080×1920
Galaxy S6	5.2	1440×2560
Galaxy Win	4.6	480×800
Sony Xperia
Acro S	4.35	720×1280
E Dual, Go	3.51	320×480
Ion	4.56	720×1280
J	4,1	480×854
L	4.35
Miro	3.6	320×480
P	4,1	540×960
S	4.4	720×1280
Sola	3.75	480×854
SP	4.62	720×1280
Tipo	3.21	320×480
TX	4.57	720×1280
V	4.33
Z, Z1	5,05	1080×1920
Z1 Compact	4.33	720×1280
Z2	5.24	1080×1920
ZL	5,1
ZR LTE	4.52	720×1280
Xiaomi Redmi
3, 3S	5	720×1280
4, 4А, 4X, 5А	5	720×1280
4 Pro	5	1080х1920
5	5,7	720х1440
6, 6А, 7А	5,45
5+	5,99	1080х2160
6 Pro	5,84	1080×2280
7	6,3	720х1520
Go	5	720х1080
S2	5,99	720х1440
K20 Pro	6,39	1080×2340
Y3	6,25	720×1560
Xiaomi Redmi Note
2, 3, 4, 5A Prime	5,5	1080×1920
5	5,99	1080х2160
6 Pro	6,25	1080×2280
7, 7 Pro	6,3	1080×2340
8	6,4
8 Pro	6,53
Xiaomi Mi
4	5	1080х1920
5, 5S, 6	5,15
6+	5,7
5X	5,5
7	5,65	1080×2160
7+	6
8, 8 Pro	6,2	1080×2248
8 Lite	6,25	1080×2280
9	Т, Lite, Pro, T Pro, Explorer	6,39	1080х2340
SE	5,98
A1	5,5	1080×1920
A2, Mix 2	5,99	1080х2160
A2 Lite	5,84	1080×2280
A3, Mix 3	6,4	1080×2340
A3 Lite	6	720×1560
Play	5,85	1080×2280
Max	6,9	1080 x 2160

Оптимальное разрешение

На современных смартфонах преобладают следующие разрешения, независимо от размера и соотношения сторон дисплея:

• HD, 720p – 1280 × 720 px – родная разделительная способность бюджетных устройств с небольшим дисплеем;
• Full HD, 1920 × 1080 px – у большинства средних по стоимости смартфонов;
• Quad HD, 2650 × 1440 px – характерно для флагманских телефонов.

Картинка на QHD-дисплеях выглядит еще лучше, но для человеческого глаза эта разница едва ли различима. Для планшетов с большим дисплеем такое разрешение будет оптимальным, для телефона оно излишнее. Немногие приложения и даже оболочки адаптированы под Quad HD.

Дисплей

Главный элемент, с которым вы будете взаимодействовать, поэтому ему надо уделить особое внимание

Диагональ и разрешение

Большинство моделей сегодня имеют вытянутые безрамочные дисплеи с диагональю 6,2–6,7 дюйма. При этом габариты корпуса смартфона остаются на уровне прежних моделей с экранами 4,7–5,5 дюйма. Меньше 6 дюймов экраны только у самых бюджетных моделей, либо у флагманов формата mini. К семи дюймам подбираются, в основном, топовые модели с ценой в 100 и более тысяч рублей. Найти мощный телефон с обычными рамками сверху и снизу, если вы к ним привыкли, не получится.

Гонка разрешений закончилась. Золотой стандарт — Full HD с приставкой «+», так как экраны стали более вытянутыми. FHD+ отлично смотрится на всех диагоналях, от 5 до 7 дюймов. Отдельные флагманские модели имеют разрешение больше, QHD+ и подобные форматы, но разительного преимущества в качестве картинки они не дают. 

Тип матрицы

На текущий момент есть 2 основных типа матриц — OLED/AMOLED и IPS. Экраны, выполненные по технологии TN, TFT и LTPS, встречаются совсем редко. Дисплеи на органических диодах OLED/AMOLED отличаются высокой яркостью, контрастностью, скоростью отрисовки, а также меньшим энергопотреблением. Из недостатков — неточная цветопередача у моделей попроще и ШИМ — экран начинает мерцать при понижении яркости, и это вызывает дискомфорт у некоторых пользователей. Матрицы IPS отличается более натуральной цветопередачей, они дешевле и долговечнее, но в 2021 году их удел — средний и нижний ценовой диапазон устройств. Флагманы с IPS можно пересчитать по пальцам одной руки. Все современные iPhone перешли на OLED и большинство устройств стоимостью от 30 000 рублей тоже.

Частота обновления

Вокруг этого параметра разворачивается чуть ли не главная гонка характеристик последних двух лет. Стандартная частота обновления экрана — 60 Гц, то есть каждую секунду изображение на экране успевает поменяться 60 раз. Этого достаточно для комфортной работы с интерфейсом, просмотра видео и игр. Но если увеличить частоту обновления, то в динамичных сценах картинка становится плавнее. Например, шрифты и изображения остаются читаемыми при пролистывании сайтов и лент соцсетей. В играх с поддержкой этой технологии также можно получить преимущество.

На рынке можно встретить устройства с частотой обновления 90, 120, 144 или даже 240 Гц. Флагманы рубеж в 90 Гц уже преодолели, и стандартом становится 120 Гц. Лучше, если герцовка адаптивная — автоматически меняется в зависимости от контента на экране, тогда меньше расходуется заряд батареи. Экраны 90 Гц начинают появляться в среднем ценовом сегменте. Также производители начали повышать частоту опроса сенсорного слоя для увеличения отзывчивости телефона.

Всё вышесказанное актуально для устройств на Android, а все iPhone пока работают на стандартных 60 Гц. Возможно, ситуация изменится с выходом нового поколения осенью 2021.

Гибкие дисплеи

Гибкие дисплеи. В продаже вы можете встретить складные устройства с гибким дисплеем. Это такие очень дорогие технологичные игрушки для тех, кто может себе их позволить. Возможно, во второй половине года представят что-то более практичное и доступное. Подождём!

Что такое разрешение экрана

Как правило, каждый экран содержит миллионы подобных пикселей, равномерно расположенных по вертикали и горизонтали экрана. Для обозначения параметра дисплея используется специальная сетка. К примеру, 1920х1080, где:

• 1920 – количество горизонтальных точек;
• 1080 – вертикальных.

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

Также следует обращать внимание на размер экрана. Достойное изображение воссоздаст дисплей, которому характерно большее количество пикселей на экранный дюйм

Описываемая характеристика является пиксельной плотностью.

Чтобы облегчить ориентирование среди многочисленного количества разрешений, изготовители девайсов создали специальные определения, позволяющие выбрать подходящий вариант:

• HD;
• qHD;
• WQHD;
• Full HD;
• 4K;
• 8K.

Разрешение экрана влияет на расход заряда батареи

Это кажется очевидным, но многие не знают, что чем выше качество видео и изображения, тем больше мощности требуется аппаратному обеспечению для воспроизведения видео с такими разрешениями. Например, если на нашем мобильном телефоне разрешение 4K , это будет заметно по потреблению нашей батареи намного больше, чем если бы у нас была опция QHD.

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

Так есть ли в этом польза?

Ясно, что да. Хотя это также будет зависеть от того, как каждый человек использует свой мобильный телефон. Если вы один из тех, кто проводит целый день за просмотром видео в Интернете, просмотром социальных сетей, заходом в такие приложения, как WhatsApp и играть во всевозможные игры, которые потребляют много батареи , возможно, стоит попробовать более низкое разрешение с более высоким разрешением, чтобы мобильное устройство могло работать дольше, не заряжая его. Если же, с другой стороны, вы должны взять свой мобильный телефон на короткое время в день, и время от времени вы используете его, чтобы увидеть и другие социальные сети, возможно, ваш лучший вариант — оставить все как есть. Что ж, на батарее вашего устройства это тоже не сильно повлияет.

Как определить разрешение с помощью CSS

Определить ширину экрана, положение и соотношение сторон с помощью media-запросов, которые появились в CSS3.

Минус данного способа, в том, что код инициирует три отдельных http-запроса. Подобных запросов должно быть как можно меньше, иначе это отразится на скорости загрузки страницы.

Чтобы сократить количество запросов, можно использовать один файл таблиц стилей.

/* Устройства с экранами от 480px до 1024px */ @media screen and (min-width:481px) and (max-width:1024px) { /* Стили для данного устройства */ } /* Устройства с шириной экрана 480px и ниже */ @media screen and (max-width:480px) { /* Стили для данного устройства */ }

Аккумулятор и зарядка

Экраны растут в размерах, и для того, чтобы они могли работать весь день, нужны аккумуляторы побольше. Желательная емкость батареи для Android-устройств — не менее 4000 мАч. Среди смартфонов Apple дольше работают версии Max.

А основная гонка технологий разворачивается вокруг скорости зарядки. Здесь впереди всех флагманы от китайских брендов, многие из них заряжаются с 0 до 100% меньше, чем за час, а некоторые — быстрее, чем за 40 минут. Устройства от Samsung или Apple в предлагают в лучшем случае 50% за 30 минут, а потом зарядка замедляется.

Также наметился неприятный для потребителя тренд, когда в коробку с устройством не кладут вообще никакого зарядного устройства. На этом фоне выгодно отличаются модели, в комплекте с которыми идёт адаптер для максимально быстрой зарядки.

Huawei Mate 9

Так называемый бизнес-флагман был презентован Huawei совсем недавно. Он получил цельнометаллический тонкий корпус и незаметные боковые рамки вокруг 5,9-дюймового экрана — примерно по 1 мм толщиной. Сверху оставили фронтальную камеру, динамик и датчики, верхние и нижние рамки тоже небольшие — в целом, смартфон не смотрится как «лопата». Хотя для управления одной рукой он явно великоват.

IPS-экран не «дотянули» до QHD — его разрешение составляет 1920х1080 точек, то есть соотношение сторон привычное, 16:9. По нашим расчётам дисплей занимает 77,5% площади передней панели. Но основные «фишки» девайса — даже не «безрамочность», а мощный процессор HiSilicon Kirin 960 вкупе со сверхбыстрой памятью стандарта UFS 2.1, обновлённая двойная камера Leica и завидная автономность (батарея на 4000 мА•ч держит заряд около суток в режиме чтения и 12 — 14 часов в режиме просмотра видео на высокой яркости).

Самые популярные разрешения экрана

Зная, что при разработке веб-сайтов важно учитывать возможности разных устройств, мы составили список самых современных из них. В нём отражаются и разрешения экранов и показатели окон просмотра

Устройства Apple

Разрешение дисплея	Viewport
iPhone
iPhone XR	828 x 1792	414 x 896
iPhone XS	1125 x 2436	375 x 812
iPhone XS Max	1242 x 2688	414 x 896
iPhone X	1125 x 2436	375 x 812
iPhone 8 Plus	1080 x 1920	414 x 736
iPhone 8	750 x 1334	375 x 667
iPhone 7 Plus	1080 x 1920	414 x 736
iPhone 7	750 x 1334	375 x 667
iPhone 6 Plus/6S Plus	1080 x 1920	414 x 736
iPhone 6/6S	750 x 1334	375 x 667
iPhone 5	640 x 1136	320 x 568
iPod
iPod Touch	640 x 1136	320 x 568
iPad
iPad Pro	2048 x 2732	1024 x 1366
iPad 3 и 4-го поколения	1536 x 2048	768 x 1024
iPad Air 1 и 2	1536 x 2048	768 x 1024
iPad Mini 2 и 3	1536 x 2048	768 x 1024
iPad Mini	768 x 1024	768 x 1024

Устройства Android

Разрешение дисплея	Viewport
Телефон
Nexus 6P	1440 x 2560	412 x 732
Nexus 5X	1080 x 1920	412 x 732
Google Pixel 3 XL	1440 x 2960	412 x 847
Google Pixel 3	1080 x 2160	412 x 824
Google Pixel 2 XL	1440 x 2560	412 x 732
Google Pixel XL	1440 x 2560	412 x 732
Google Pixel	1080 x 1920	412 x 732
Samsung Galaxy Note 9	1440 x 2960	360 x 740
Samsung Galaxy Note 5	1440 x 2560	480 x 853
LG G5	1440 x 2560	480 x 853
One Plus 3	1080 x 1920	480 x 853
Samsung Galaxy S9+	1440 x 2960	360 x 740
Samsung Galaxy S9	1440 x 2960	360 x 740
Samsung Galaxy S8+	1440 x 2960	360 x 740
Samsung Galaxy S8	1440 x 2960	360 x 740
Samsung Galaxy S7 Edge	1440 x 2560	360 x 640
Samsung Galaxy S7	1440 x 2560	360 x 640
Планшеты
Nexus 9	1536 x 2048	768 x 1024
Nexus 7 (2013)	1200 x 1920	600 x 960
Samsung Galaxy Tab 10	800 x 1280	800 x 1280
Chromebook Pixel	2560 x 1700	1280 x 850

Узнать стоимость адаптации вашего сайта можете тут → или в форме ниже