html текст
All interests
  • All interests
  • Design
  • Food
  • Gadgets
  • Humor
  • News
  • Photo
  • Travel
  • Video
Click to see the next recommended page
Like it
Don't like
Add to Favorites

Основные ошибки при разработке адаптивного дизайна tutorial

Адаптивные дизайн становится все популярнее, сегодня это уже не просто модная новая технология. Ниже собраны самые частые ошибки, допускаемые при разработке адаптивного сайта, своеобразный чек-лист.





Скрывать контент


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

Не оптимизировать под touch-устройства


Большинство мобильных устройств с touch-управлением, поэтому нужно обязательно оптимизировать элементы интерфейса под него. Популярные техники описаны в хабратопике Оптимизация сайта для планшетов.

Не оптимизировать типографику


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

Использовать слишком большие файлы


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

Использовать слишком большие изображения


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

Упрощать дизайн


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

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


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

Не думать о контенте


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

Не думать о больших экранах


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

Отключать зум


На многих адаптивных сайтах разработчики отключают возможность ресайза сайта на тач-устройствах, прописывая это в мета-теге viewoprt, и это может сильно раздражать пользователей. (На всякий случай дам ссылку на документацию Apple по использованию Viewport)

Забывать о Home Screen иконке


Это аналог favicon для iOS устройств, добавляется простым кодом:

<link rel="apple-touch-icon" href="/custom_icon.png"/>
Читать дальше
Twitter
Одноклассники
Мой Мир

материал с habrahabr.ru

3

      Add

      You can create thematic collections and keep, for instance, all recipes in one place so you will never lose them.

      No images found
      Previous Next 0 / 0
      500
      • Advertisement
      • Animals
      • Architecture
      • Art
      • Auto
      • Aviation
      • Books
      • Cartoons
      • Celebrities
      • Children
      • Culture
      • Design
      • Economics
      • Education
      • Entertainment
      • Fashion
      • Fitness
      • Food
      • Gadgets
      • Games
      • Health
      • History
      • Hobby
      • Humor
      • Interior
      • Moto
      • Movies
      • Music
      • Nature
      • News
      • Photo
      • Pictures
      • Politics
      • Psychology
      • Science
      • Society
      • Sport
      • Technology
      • Travel
      • Video
      • Weapons
      • Web
      • Work
        Submit
        Valid formats are JPG, PNG, GIF.
        Not more than 5 Мb, please.
        30
        surfingbird.ru/site/
        RSS format guidelines
        500
        • Advertisement
        • Animals
        • Architecture
        • Art
        • Auto
        • Aviation
        • Books
        • Cartoons
        • Celebrities
        • Children
        • Culture
        • Design
        • Economics
        • Education
        • Entertainment
        • Fashion
        • Fitness
        • Food
        • Gadgets
        • Games
        • Health
        • History
        • Hobby
        • Humor
        • Interior
        • Moto
        • Movies
        • Music
        • Nature
        • News
        • Photo
        • Pictures
        • Politics
        • Psychology
        • Science
        • Society
        • Sport
        • Technology
        • Travel
        • Video
        • Weapons
        • Web
        • Work

          Submit

          Thank you! Wait for moderation.

          Тебе это не нравится?

          You can block the domain, tag, user or channel, and we'll stop recommend it to you. You can always unblock them in your settings.

          • habrahabr.ru
          • домен habrahabr.ru

          Get a link

          Спасибо, твоя жалоба принята.

          Log on to Surfingbird

          Recover
          Sign up

          or

          Welcome to Surfingbird.com!

          You'll find thousands of interesting pages, photos, and videos inside.
          Join!

          • Personal
            recommendations

          • Stash
            interesting and useful stuff

          • Anywhere,
            anytime

          Do we already know you? Login or restore the password.

          Close

          Add to collection

             

            Facebook

            Ваш профиль на рассмотрении, обновите страницу через несколько секунд

            Facebook

            К сожалению, вы не попадаете под условия акции