Возрастающая важность использования резиновых макетов
За последние несколько лет создание дизайнов с фиксированной шириной стало самым обычным делом. Это не удивительно, т.к. фиксированные размеры, которые сейчас используются, удовлетворяют большую часть пользователей. Однако, совсем недавно разработчики ощутили некоторое недовольство своих пользователей (владельцев мобильных телефонов, таких устройств как iPad и др.). На сегодняшний день дизайны с фиксированной шириной всё больше и больше устаревают.
Мобильный веб дизайн начал развиваться семимильными шагами и в последние несколько лет для его поддержки использовались специальные таблицы стилей для маленьких устройств, которые обслуживали лишь малую часть рынка, и были рассчитаны на фиксированный размер. Помимо этого, гибкий веб дизайн был настоящей редкостью и применялся от случая к случаю. В идеале гибкий веб дизайн должен быть полностью пропорционален (для небольших и крупных расширений).
Все преимущества гибких макетов видны невооружённым глазом. То же самое можно сказать и о сайтах с фиксированной шириной: их легче и быстрее создавать, вносить всевозможные изменения, и вы можете быть уверены, что они всегда и везде будут выглядеть одинаковым образом. Другими словами, фиксированная ширина макета может быть гораздо более удобней, чем его гибкие альтернативы, конечно если гибкая планировка неправильно реализовывается. В этой статье мы обсудим основные плюсы и минусы каждого типа макетов, и ответим на вопрос, почему гибкие макеты, несмотря на очевидные недостатки, будут наиболее используемыми в ближайшие несколько лет.
Какие устройства популярны сегодня, но не завтра
2010 год был признан очень благоприятным для устройства iPad, и после того, как они были распространены по всему миру, возникла большая необходимость в различного рода приложениях, которые будут предоставлять их владельцам различного рода удобства и услуги. Конечно же появилось огромное число разработчиков, которые создали специальные версии сайтов для iPad, в добавок к мобильной версии, варианта для нетбуков и т.д.. iPad стал очень популярным благодаря тому, что предоставляет огромные возможности, поэтому и началась вся эта заварушка.
Ещё одной платформой, которая стремительно завоёвывала популярность, стала система Android, и целый набор различных устройств, которые функционируют на данной платформе. В то время как вышел iPhone, в 2010 году ещё одно устройство стало очень популярным - смартфон. В отличии от предыдущих годов, огромное количество мобильных устройств нуждалось в особенном внимании, для того чтобы на них всё отображалось как нужно. В результате всего этого, в интернете появилось огромное количество уроков разработки дизайнов для смартфонов и других мобильных устройств.
На этом всё только началось, т.к. в 2011 году вышла очередная серия устройств, которая уже завоевала свою популярность среди потребителей. Нужно ли мне перечислять все брэнды? Как вы думаете, практично ли создавать под каждое устройство свою таблицу стилей? Это же можно сойти с ума – никакие нервы такого не выдержат.
Самым лучшим решением данной задачи, является пересмотр своих привычек и способов создания дизайна. Мы можем воспользоваться гибким дизайном или специальными правилами для наиболее часто используемых устройств и размеров экрана, которые будут популярны в течение следующих нескольких лет, но мы также должны заглядывать в будущее, не так ли?
Стандартные компьютеры & Размеры ноутбуков
Пять лет назад большинство пользователей сети использовали стандартное расширение, которое и вам хорошо знакомо - 1024x768. На период Января 2010, расширением 800x600 пользуется как минимум 1% пользователей, а новые расширения всё продолжают выходить. Теперь только 20% использует расширение 1024x768, а 76% все остальные.
Теперь, для большинства пользователей, многие сайты с фиксированной шириной, которые часто составляет 960px или даже некой другой на более больших мониторах смотрятся не очень привлекательными и сбалансированными. Это ведь не дело. Тут нужны меры.
Различные промежутки, справа, слева, снизу, сверху, могут привести к нарушению баланса, непропорциональности и, в конце концов, заставляют пользователя читать всё в сжатом виде, в то время как его техника может предоставить ему большие возможности, не так ли? Благодаря подходу с гибким дизайном мы можем занять как можно большее рабочее пространство, соблюсти балансировку, пропорции и т.д.
Ещё один момент, который нельзя не отметить, - это популярность мини ноутбуков – нетбуков, для которых характерны свои стандарты, отличающиеся от других устройств.
Многие нетбуки, как правило, стремятся использовать разрешение экрана, в основном 800x480 (один из самых маленьких) до 1280x800 (один из крупнейших). Многие резиновые дизайны без особых сложностей отображаются на данных расширениях, и почти оптимальным для таких рода размеров экранов. Однако, есть много нетбуков, которые используют ещё меньшие расширения, и в противном случае (если у вашего сайта фиксированный размер), вся информация будет выглядеть слегка сплющенной. Популярность таких устройств растёт, и это нужно учитывать.
Гибкие сайты могут (и должны) справиться с этой непростой задачей без нанесения ущерба другим устройствам, которые также популярны в мире.
Всё меньше пользователей используют максимальные размеры
После того, как я купил новый ноутбук с Windows 7, я сразу же стал ярым фанатом функции snap. Благодаря данной фиче, я могу расположить несколько окон одно за другим, тем самым обеспечить себе более удобную работу.
Однако, вскоре я понял, что множество сайтов, которые построены на фиксированных размерах просто превращаются в кашу! С каждым днём все меньше пользователей не используют максимальные размеры своего экрана, из-за каких-то новых функций. Это тоже нужно учитывать, т.к. если я не могу нормально пользоваться сайтом, то через некоторое время он будет меня раздражать и бесить.
Тем пользователям, которые столкнулись с такой же проблемой, как и я, приходится активно пользоваться областью прокрутки для того, чтобы добраться до нужного места. Это неправильно – так не должно быть!
Небольшие устройства, как правило, содержат сенсорные экраны
Если мы можем создать гибкий дизайн, который будет как можно меньше использовать область прокрутки, то это очень хороший старт. Однако, это только часть решения. Чем меньше само устройство, тем больше вероятность того, что оно оснащено сенсорным экраном. Поэтому нужно создавать такие дизайны, которые будут «приятны на ощупь» и удобны для навигации.
Вывод
Веб, по сути всегда является нам чем-то новым, потому как постоянно идёт процесс его развития. Все это будет только продолжаться ещё много лет. Только за последнее десятилетие мы были свидетелями взрыва развития устройств, размеров экрана и очень важно понимать, что если мы хотим крутиться среди всего этого, нужно идти в ногу со временем.
Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: www.
Перевел: Станислав Протасевич
Урок создан: 30 Апреля 2011
Просмотров: 11210
Правила перепечатки
Источник: http://feedproxy.google.com/~r/ruseller/CdHX/~3/fmllrzkHfv0/lessons.php
Дайджест новых статей по интернет-маркетингу на ваш email
Новые статьи и публикации
- 2024-11-26 » Капитан грузового судна, или Как начать использовать Docker в своих проектах
- 2024-11-26 » Обеспечение безопасности ваших веб-приложений с помощью PHP OOP и PDO
- 2024-11-22 » Ошибки в Яндекс Вебмастере: как найти и исправить
- 2024-11-22 » Ошибки в Яндекс Вебмастере: как найти и исправить
- 2024-11-15 » Перенос сайта на WordPress с одного домена на другой
- 2024-11-08 » OSPanel 6: быстрый старт
- 2024-11-08 » Как установить PhpMyAdmin в Open Server Panel
- 2024-09-30 » Как быстро запустить Laravel на Windows
- 2024-09-25 » Next.js
- 2024-09-05 » OpenAI рассказал, как запретить ChatGPT использовать содержимое сайта для обучения
- 2024-08-28 » Чек-лист: как увеличить конверсию интернет-магазина на примере спортпита
- 2024-08-01 » WebSocket
- 2024-07-26 » Интеграция с Яндекс Еда
- 2024-07-26 » Интеграция с Эквайринг
- 2024-07-26 » Интеграция с СДЕК
- 2024-07-26 » Интеграция с Битрикс-24
- 2024-07-26 » Интеграция с Travelline
- 2024-07-26 » Интеграция с Iiko
- 2024-07-26 » Интеграция с Delivery Club
- 2024-07-26 » Интеграция с CRM
- 2024-07-26 » Интеграция с 1C-Бухгалтерия
- 2024-07-24 » Что такое сторителлинг: техники и примеры
- 2024-07-17 » Ошибка 404: что это такое и как ее использовать для бизнеса
- 2024-07-03 » Размещайте прайс-листы на FarPost.ru и продавайте товары быстро и выгодно
- 2024-07-01 » Профилирование кода в PHP
- 2024-06-28 » Изучаем ABC/XYZ-анализ: что это такое и какие решения с помощью него принимают
- 2024-06-17 » Зачем вам знать потребности клиента
- 2024-06-11 » Что нового в работе Яндекс Метрики: полный обзор обновления
- 2024-06-11 » Поведенческие факторы ранжирования в Яндексе
- 2024-06-11 » Скорость загрузки сайта: почему это важно и как влияет на ранжирование
Все мы сидим в сточной канаве, но некоторые при этом смотрят на звезды Уайльд Оскар - (1854-1900) - английский писатель |
Мы создаем сайты, которые работают! Профессионально обслуживаем и продвигаем их , а также по всей России и ближнему зарубежью с 2006 года!
Как мы работаем
Заявка
Позвоните или оставьте заявку на сайте.
Консультация
Обсуждаем что именно Вам нужно и помогаем определить как это лучше сделать!
Договор
Заключаем договор на оказание услуг, в котором прописаны условия и обязанности обеих сторон.
Выполнение работ
Непосредственно оказание требующихся услуг и работ по вашему заданию.
Поддержка
Сдача выполненых работ, последующие корректировки и поддержка при необходимости.