Категории: Веб-дизайн

Псевдоссылки

Псевдоссылка — ссылка, с dashed или dotted подчеркиванием. При щелчке по такой ссылке не происходит переход к другой странице, а выполняется некоторое действие на текущей странице без ее перезагрузки. Наиболее распространена такие ссылки в Рунете, часто используются совместно с технологией AJAX. Для создания ссылок используется свойство CSS border-bottom со значение dashed или dotted.

Кто-то принимает псевдоссылки за аналог кнопки, но это не совсем так. Давайте разберемся

Правила

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

Подчеркивание обозначает:

  • «линией» — действие при нажатии с переходом на другую страницу; ссылка на страницу; не действие; желательно выражать существительным;
  • «пунктиром» — действие при нажатии без перехода перехода на другую страницу и перезагрузки текущей; желательно выражать глаголом;
  • «точками» — действие при наведении; визуальное выделение ссылки, которая поясняется дополнительно и чаще всего всплывающей подсказкой (например: аббревиатуры и подсказки)

P.S.: Убедительная просьба. Перестаньте подчеркивать текст в вебе, если только это не ссылка. Лучи ненависти вызывают люди, выделяющие слова подчеркиванием. Для выделения текста уже давно изобрели полужирное и курсивное начертание.

Поделиться

Посмотреть комментарии

  • Откровенно говоря, я никогда не видел разницы в поведении ссылки, подчеркнутой пунктиром или точками и воспринимал их так:

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

    Примерно так :)

    • В принципе да. Но если проектируешь интерфейс, то следует использовать правильные подчеркивания.

      • А кто сказал, что это правильные подчеркивания? Кто вообще сказал, что логика должна быть именно такой?
        Пользователь этих правил не знает и ни когда не узнает, так как ему все равно. Единственно, что он должен понимать — это что ему нужно сделать, чтобы получить результат. Смотрим на западные сайты, они вообще не используют эти правила и живут себе спокойно. Все это условности, которые придумали русские дизайнеры, чтобы решать какие-то свои задачи. При этом не парятся понимает ли это человек, который пользуется их интерфейсом или нет.

        • Ну западный дизайн вообще отдельная тема. Я в этой статье говорил о русском.

          > При этом не парятся понимает ли это человек, который пользуется их интерфейсом или нет.
          Вот это очень зря. Вот так и появляются сайты и сервисы, которыми невозможно пользоваться.

  • А кто выдумал, что такое подчеркивание правильное? Ну допустим якорь - _ _ _ я еще согласен, но .... вместо ______ исключительно вопрос подхода к графике, а не правилам

    • Ну это не прописные стандарты типа W3C, а кейсы к которым привыкли пользователи.

      Горностаев Сергей, это то я как раз и имел ввиду!

      • Добрый день, Максим!
        Спасибо за статью.

        У меня возник вопрос, касающийся оснований этих правил.
        «Ну это не прописные стандарты типа W3C, а кейсы к которым привыкли пользователи.»
        Откуда у Вас эти данные?

        • Опыт: мой и других дизайнеров интерфейсов.
          Хотя последний пункт насчет разницы между подчеркивания точками и пунктиром — не аксиома. Все может быть с точностью до наоборот.

  • У большинства пользователей синий текст со сплошным подчёркиванием прочно ассоциируется со ссылкой, если они также привыкнут к подчёркиванию курсивом и точками, то облегчат себе жизнь. Это как договорённость между создателями сайта и посетителями.

  • "Для выделения текста уже давно изобрели полужирное и курсивное начертание." (с)

    Я бы сказал что в для этого давно изобрели логическую разметку и соответственно теги strong и em...

Последние посты

Дайджест ABOUT FACE #5: дизайн-принципы хороших продуктов, Sketch + AE, правильная иконка шаринга

Хорошей среды! Пришло время нового выпуска дайджеста. (далее…)

% дней назад

Дайджест ABOUT FACE #4: агенство или продукт, After Effects в код, 100 книг для дизайнера

Хорошего понедельника! Давно не было свежего выпуска дайждеста, а материала накопилось порядочно 😍 (далее…)

% дней назад

5 современных альтернатив WordPress

Это рекламная статья. Многие считают, что WordPress — одна из наиболее популярных open-source систем для…

% дней назад

Дайджест ABOUT FACE #3: новая книга Бюро, CSS в Скетче, дизайн для нескольких языков

Хорошего понедельника! Надеюсь все отлично отдохнули, потому как я собрал для вас новую порцию интересных…

% дней назад

Дайджест ABOUT FACE #2: книги по типографике, одновременная работа с макетом, дизайнер-cатана

Хорошего понедельника! Приветствуем второй выпуск дайджеста. Для тех, кто не в теме, дайджест просеивает тонны…

% дней назад

Дайджест ABOUT FACE #1: редизайн Хрома, сколько зарабатывают дизайнеры, каким должен быть VR интерфейс

Хорошего понедельника! Как я писал в паблике, я решил немного изменить формат выхода новостей. Поэтому всё…

% дней назад