Елемент <a>nchor - це просто прив'язка до або від деякого вмісту. Спочатку специфікація HTML дозволена для названих anchors ( <a name="foo">) та пов'язаних якорів (<a href="#foo"> ).
Названий формат якоря використовується рідше, оскільки ідентифікатор фрагмента тепер використовується для визначення [id]атрибуту (хоча для зворотної сумісності ви все ще можете вказати [name]атрибути). Елемент без атрибута залишається в силі .<a>[href]
Що стосується семантики та стилю, то <a>елемент не є посиланням ( :link), якщо він не має [href]атрибута. Побічним ефектом цього є те, що <a>елемент [href]за замовчуванням не буде в порядку вкладки.
Справжнє питання полягає в тому, чи <a>єдиний елемент є відповідним представленням а <button>. На семантичному рівні існує чітка різниця між a linkі a button.
Кнопка - це те, що при натисканні викликає дію.
Посилання - це кнопка, яка викликає зміну навігації в поточному документі. Навігація, що виникає, може бути переміщенням у документі у випадку ідентифікаторів фрагмента ( #foo) або переміщенням до нового документа у разі URL-адрес ( /bar).
Оскільки посилання є спеціальним типом кнопок, вони часто перекривали свої дії для виконання альтернативних функцій. Продовжувати використання якоря як кнопки все нормально з точки зору консистенції, хоча семантично це не зовсім точно.
Якщо ви стурбовані семантикою та доступністю використання <a>елемента (або <span>або <div>) як кнопки, вам слід додати такі атрибути:
<a role="button" tabindex="0" ...>...</a>
Роль кнопки повідомляє користувачеві, що конкретний елемент трактується як кнопка як переосмислення для будь-якої семантики базового елемента.
Для <span>та <div>елементів ви можете додати слухачів ключа JavaScript для Spaceабо Enterвикликати clickподію. <a href>і <button>елементи роблять це за замовчуванням, але елементи, які не мають кнопок, не роблять. Іноді має більше сенсу прив’язувати clickтригер до іншої клавіші. Наприклад, може бути пов'язана кнопка "довідка" у веб-додатку F1.