Зайдите под своим паролем

     
  • Проекты Блог
  • 1 заметка с тегом

    вкладки

  • Избранное ★

    Теги

    • Eatty!
    • бег
    • вёрстка
    • интерфейс
    • приложения
    • процесс

    Связаться со мной можно письмом или телеграммой.

  • Дизайн вкладок

    9 декабря 2014, 13:12

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

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

    У правильных вкладок есть четкие границы, фон неактивных вкладок совпадает с фоном страницы, а активная вкладка заметно выделяется.

    Если убрать границы, будет как у Эйрбнб. С одной стороны активная вкладка ярко выделяется, однако совпадение фона у контента и неактивной вкладки сильно смущает:

    Если пойти дальше и отказаться от фонового выделения (как это сделали в Инстаграме), то получатся настоящие «вкладки Шрёдингерра»:

    Тут настолько всё плохо, что если включить мозг и начать думать, то скорее придешь к неверному выводу.

    Когда будете рисовать вкладки — начните с двух.

    вкладки   дизайн   интерфейс
  • © Александр Гурьянов,
    2004—2016
  • Движок — Эгея