Sobes.tech
Middle

Jeśli link wygląda jak przycisk, czy nadal powinno się go formatuje jako przycisk?

sobes.tech AI

Odpowiedź od AI

Linki (tag <a>) służą do przejścia do innej strony lub zasobu. Przyciski (tag <button>) wykonują akcje na bieżącej stronie, na przykład wysyłanie formularza lub wywoływanie funkcji JavaScript.

Jeśli element wykonuje akcję, ale wygląda jak link, powinien być sformatowany jako <button>. I odwrotnie, jeśli element prowadzi do innej strony, ale wygląda jak przycisk, lepiej użyć <a>.

Uzasadnienie z punktu widzenia dostępności:

  • Semantyka: Czytniki ekranu i inne technologie wspomagające korzystają z semantyki tagów, aby zrozumieć funkcję elementu. Przycisk jest postrzegany jako element interaktywny, który można aktywować, link jako element nawigacyjny.
  • Interakcja klawiaturą: Domyślnie, przyciski aktywuje się klawiszem Enter lub Space, linki tylko Enter. Użytkownicy korzystający z klawiatury oczekują takiego zachowania.
  • Stylizacja i JavaScript: Używanie odpowiednich tagów ułatwia stosowanie stylów i obsługę zdarzeń.

Przykład sformatowania linku jako przycisku:

<a href="/page" class="button">Przejdź do strony</a>

Przykład przycisku naśladującego link (rzadko, ale możliwe dla specyficznych rozwiązań UX):

<button type="button" onclick="doSomething()" class="link">Wykonaj akcję</button>

Ogólnie, trzymaj się semantyki: linki do nawigacji, przyciski do działań.