Допустим ли пустой href?

Один из наших веб-разработчиков использует следующий HTML-код в качестве заполнителя для стилизации выпадающего списка.

<a href="" class="arrow"></a>

Является ли этот тег привязкой действительным?

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

Хотя на этот вопрос уже дан ответ ( tl; dr: yes, пустое hrefзначение допустимо), ни один из существующих ответов не ссылается на соответствующие спецификации.

Пустая строка не может быть URI. Однако hrefатрибут принимает в качестве значения не только URI, но и ссылки на URI. Пустая строка может быть ссылкой на URI.

HTML 4.01

HTML 4.01 использует RFC 2396 , где говорится в разделе 4.2. Ссылки на тот же документ (жирный шрифт):

Ссылка URI, которая не содержит URI, является ссылкой на текущий документ. Другими словами, пустая ссылка URI в документе интерпретируется как ссылка на начало этого документа , а ссылка, содержащая только идентификатор фрагмента, является ссылкой на идентифицированный фрагмент этого документа.

RFC 2396 устарел в RFC 3986 (который в настоящее время является стандартом URI IETF ), что по сути говорит то же самое .

HTML5

HTML5 использует ( действительный URL-адрес, возможно, окруженный пробелами → действительный URL-адрес ) спецификации URL- адреса W3C , которая была прекращена. Вместо этого следует использовать стандарт URL-адреса WHATWG (см. Последний раздел).

HTML 5.1

HTML 5.1 использует ( действительный URL-адрес, возможно, окруженный пробелами → действительный URL-адрес ) стандарта URL WHATWG (см. Следующий раздел).

WHATWG HTML

HTML-код WHATWG использует ( действительный URL-адрес, возможно, окруженный пробелами ) определение допустимой строки URL-адреса из стандарта URL-адреса WHATWG , в котором говорится, что это может быть строка относительного URL-адреса с фрагментом , которая должна по крайней мере быть строкой относительного URL-адреса , которая может быть строкой путь-относительная схема-меньше-URL , которая является строкой путь-относительный-URL , которая не начинается со строки схемы, за которой следует :, и ее определение гласит (выделено жирным шрифтом мое):

Строка относительного-пути-URL-адреса должна содержать ноль или более строк сегмента-пути-URL, отделенных друг от друга U + 002F (/), и не должна начинаться с U + 002F (/).

Это действительно.

Тем не менее, стандартной практикой является использование href="#"или иногда href="javascript:;".

Как уже говорили другие, это действительно.

Однако у каждого подхода есть свои недостатки:

href="#" добавляет дополнительную запись в историю браузера (что раздражает, например, при нажатии на кнопку).

href="" перезагружает страницу

href="javascript:;" Кажется, нет никаких проблем (кроме как выглядеть беспорядочно и бессмысленно) - кто-нибудь знает что-нибудь?

Хотя HTML может быть полностью допустимым, если он не содержит href, особенно с обработчиком onclick, есть некоторые моменты, на которые следует обратить внимание: он не будет ориентирован на клавиатуру без установленного значения tabindex. Кроме того, это будет недоступно программному обеспечению для чтения с экрана, использующему Internet Explorer, поскольку IE будет сообщать через интерфейсы доступности, что любой элемент привязки без атрибута href не может быть сфокусирован, независимо от того, был ли установлен tabindex.

Так что пока следующее может быть полностью действительным:

<a class="arrow">Link content</a>

Гораздо лучше явно добавить атрибут href с нулевым эффектом

<a href="javascript:void(0);" class="arrow">Link content</a>

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

<a href="javascript:void(0);" class="arrow" title="Go to linked content">Link content</a>

Текущий проект HTML5 также позволяет полностью пропустить атрибут href.

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

Чтобы ответить на ваш вопрос: да, это действительно.

В самом деле, вы можете оставить его пустым (валидатор W3 не жалуется).

Идем к идее на шаг впереди: опускаем = "". Преимущество этого состоит в том, что ссылка не рассматривается как привязка к текущей странице.

<a href>sth</a>

Хотя валидатор W3 может не жаловаться на пустой hrefатрибут, текущий рабочий документ HTML5 определяет:

hrefАтрибут aи areaэлементов должен иметь значение , которое является допустимым URL потенциально окружен пробелами.

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

... что означает, что пустая строка не является допустимым URL.

Однако в рабочем проекте HTML5 говорится:

Примечание . hrefАтрибут on aи areaelements не требуется ; когда эти элементы не имеют hrefатрибутов, они не создают гиперссылки.

Это означает, что мы можем просто полностью пропустить hrefатрибут:

<a class="arrow"></a>

Если вы хотите, чтобы эти элементы hrefбез aэлементов все еще требовали взаимодействия с клавиатурой, вам придется пойти по обычному пути назначения roleи tabindexнаряду с обычными обработчиками нажатия / нажатия клавиш:

<a class="arrow" role="button" tab-index="0"></a>

Слово предостережения:

По моему опыту, пропуск hrefатрибута создает проблемы для доступности, так как навигация с помощью клавиатуры будет игнорировать его и никогда не выделять его, как при наличии href. Ручное включение вашего элемента в tabindex - способ обойти это.

это действительно так, но, как сказал UpTheCreek, «у каждого подхода есть свои недостатки»

если вы вызываете ajax с помощью тега, оставьте href = "", так как это сохранит перезагрузку страницы, и код ajax никогда не будет вызываться ...

только что получил эту мысль было бы хорошо поделиться

Попробуйте сделать <a href="#" class="arrow">вместо этого. (Обратите внимание на острый #характер).