Czy pusty href jest ważny?

Jeden z naszych programistów stron internetowych używa następującego kodu HTML jako symbolu zastępczego do stylizowania listy rozwijanej.

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

Czy ten uważany tag zakotwiczenia jest prawidłowy?

Ponieważ nie ma wartości href, w niektórych naszych raportach sprawdzania linków jest ona uszkodzona.

Chociaż na to pytanie już udzielono odpowiedzi ( tl; dr: tak, pusta hrefwartość jest poprawna), żadna z istniejących odpowiedzi nie odwołuje się do odpowiednich specyfikacji.

Pusty ciąg nie może być identyfikatorem URI. Jednak hrefatrybut nie tylko przyjmuje wartości URI, ale także odwołania do identyfikatorów URI. Pusty ciąg może być referencją URI.

HTML 4.01

HTML 4.01 używa RFC 2396 , o czym mówi sekcja 4.2. Odniesienia do tego samego dokumentu (moje pogrubienie):

Odwołanie URI, które nie zawiera URI, jest odniesieniem do bieżącego dokumentu. Innymi słowy, puste odniesienie URI w dokumencie jest interpretowane jako odniesienie do początku tego dokumentu , a odwołanie zawierające tylko identyfikator fragmentu jest odniesieniem do zidentyfikowanego fragmentu tego dokumentu.

RFC 2396 jest przestarzały przez RFC 3986 (który jest obecnie standardem URI IETF ), który zasadniczo mówi to samo .

HTML5

Używa HTML5 ( prawidłowy adres URL potencjalnie otoczony spacjami → prawidłowy adres URL ) Specyfikacja URL W3C , która została wycofana. Zamiast tego należy użyć standardu URL WHATWG (patrz ostatnia sekcja).

HTML 5.1

HTML 5.1 używa ( prawidłowy adres URL potencjalnie otoczony spacjami → prawidłowy adres URL ) Standardowy adres URL WHATWG (patrz następna sekcja).

WHATWG HTML

WHATWG w HTML używa ( prawidłowego adresu URL potencjalnie otoczonego spacjami ) definicji prawidłowego ciągu URL ze standardu URL WHATWG , gdzie mówi, że może to być ciąg względnego adresu URL z fragmentem , który musi być przynajmniej ciągiem względnego adresu URL , który może być łańcuchem URL-ścieżki-względnej-schematu-mniejszym , który jest łańcuchem URL- ścieżki-względnej , który nie zaczyna się od łańcucha schematu, po którym następuje :, a jego definicja mówi (pogrubienie moje):

Łańcuch względnego adresu URL musi być zerowy lub więcej ciągów segmentu ścieżki URL, oddzielonych od siebie U + 002F (/) i nie może zaczynać się od U + 002F (/).

Jest ważny.

Jednak standardową praktyką jest stosowanie href="#"lub czasem href="javascript:;".

Jak powiedzieli inni, jest to ważne.

Każde podejście ma jednak kilka wad:

href="#" dodaje dodatkowy wpis do historii przeglądarki (co jest irytujące, np. przy przyciskowaniu wstecznym).

href="" ponownie ładuje stronę

href="javascript:;" nie wydaje się mieć żadnych problemów (poza wyglądaniem niechlujnie i bez znaczenia) - ktoś o nich wie?

Chociaż HTML może nie zawierać hrefu, szczególnie w przypadku programu obsługi onclick, należy jednak wziąć pod uwagę kilka kwestii: nie będzie można go ustawić za pomocą klawiatury bez ustawienia wartości tabindex. Ponadto będzie to niedostępne dla oprogramowania do odczytu ekranu za pomocą przeglądarki Internet Explorer, ponieważ IE zgłosi za pośrednictwem interfejsów ułatwień dostępu, że jakikolwiek element kotwiczący bez atrybutu href nie może być ustawiany, niezależnie od tego, czy został ustawiony tabindex.

Tak więc, podczas gdy poniższe mogą być całkowicie poprawne:

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

O wiele lepiej jest jawnie dodać atrybut href o zerowym efekcie

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

Aby uzyskać pełne wsparcie wszystkich użytkowników, jeśli używasz klasy z CSS do renderowania obrazu, powinieneś również dołączyć treść tekstową, na przykład atrybut title, aby przedstawić tekstowy opis tego, co się dzieje.

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

Obecna wersja robocza HTML5 pozwala również całkowicie pominąć atrybut href.

Jeśli element nie ma atrybutu href, wówczas element reprezentuje symbol zastępczy, w którym można by umieścić link, gdyby był odpowiedni.

Aby odpowiedzieć na twoje pytanie: Tak, jest ważne.

Rzeczywiście, możesz zostawić to puste (weryfikator W3 nie narzeka).

Idąc dalej o krok dalej: pomiń = "". Zaletą tego jest to, że link nie jest traktowany jako kotwica do bieżącej strony.

<a href>sth</a>

Podczas gdy walidator W3 może nie narzekać na pusty hrefatrybut, aktualny projekt roboczy HTML5 określa:

hrefAtrybut ai areaelementów musi mieć wartość, która jest prawidłowy adres URL potencjalnie otoczony spacjami.

Prawidłowy adres URL jest adresem URL, który jest zgodny z URL Standardu . Teraz Standard URL jest nieco mylący, jeśli chodzi o poruszanie się, jednak nigdzie nie jest powiedziane, że URL może być pustym ciągiem.

... co oznacza, że ​​pusty ciąg nie jest prawidłowym adresem URL.

Projekt roboczy HTML5 dalej jednak stwierdza:

Uwaga: atrybut i elementów nie jest wymagana ; gdy te elementy nie mają atrybutów, nie tworzą hiperłączy.hrefaareahref

Oznacza to, że możemy po prostu hrefcałkowicie pominąć atrybut:

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

Jeśli masz zamiar, aby te hrefbezbłędne aelementy nadal wymagały interakcji z klawiaturą, musisz pójść normalną drogą przypisywania rolea tabindexobok swoich zwykłych programów obsługi kliknięć / klawiszy:

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

Słowo ostrzeżenia:

Z mojego doświadczenia hrefwynika, że pominięcie atrybutu powoduje problemy z dostępnością, ponieważ nawigacja za pomocą klawiatury go zignoruje i nigdy nie będzie koncentrować się tak, jak w przypadku obecności href. Ręczne włączenie twojego elementu w tabindex jest rozwiązaniem tego.

jest ważny, ale jak powiedział UpTheCreek: „Każde podejście ma kilka wad”

jeśli wywołujesz ajax za pomocą tagu, zostaw href = "" w ten sposób spowoduje to ponowne załadowanie strony, a kod ajax nigdy nie zostanie wywołany ...

właśnie dostałem tę myśl, którą warto podzielić się

Spróbuj zrobić <a href="#" class="arrow">zamiast tego. (Zwróć uwagę na ostry #znak).