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.
Odpowiedzi:
Chociaż na to pytanie już udzielono odpowiedzi ( tl; dr: tak, pusta
href
wartość jest poprawna), żadna z istniejących odpowiedzi nie odwołuje się do odpowiednich specyfikacji.Pusty ciąg nie może być identyfikatorem URI. Jednak
href
atrybut 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):
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):źródło
Jest ważny.
Jednak standardową praktyką jest stosowanie
href="#"
lub czasemhref="javascript:;"
.źródło
href="#"
, fokus przenosi się na górę strony w IE, więc myślę, żehref="javascript:;"
jest lepszyJak 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?źródło
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:
O wiele lepiej jest jawnie dodać atrybut href o zerowym efekcie
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.
źródło
href
spowoduje bałagan w interfejsach ułatwień dostępu.href
wartości na cokolwiek innego niż ścieżkę względną / bezwzględną spowoduje problemy z czytnikiem ekranu. Unikaj używania symbolu skrótu / funta jako obejścia tego problemu, ponieważ nie jest on przeznaczony do tego. Czytniki ekranu mogą (obecnie VoiceOver) ogłaszać, że twój link jest identyfikatorem fragmentu (link do gdzieś na bieżącej stronie) i jest również ważny ze standardowego punktu widzenia. patrz w3.org/2001/tag/2011/01/HashInURI-20110115#NakedHashObecna wersja robocza HTML5 pozwala również całkowicie pominąć atrybut href.
Aby odpowiedzieć na twoje pytanie: Tak, jest ważne.
źródło
<a>
element bezhref
jest stylowo stylizowany w niektórych przeglądarkach. Na przykład style „: hover” nie działają w Chrome (i innych dziwnych rzeczach)<a>
Tag bezhref
reprezentuje coś innego , a nie związek (tradycyjnie kotwicy). Istnieje również różnica między atrybutem opcjonalnym a atrybutem, który może być pusty.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.
źródło
<a href></a>
→ Atrybut href bez widocznej wyraźnej wartości. Atrybut może zostać usunięty przez IE7.Podczas gdy walidator W3 może nie narzekać na pusty
href
atrybut, aktualny projekt roboczy HTML5 określa: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:
Oznacza to, że możemy po prostu
href
całkowicie pominąć atrybut:Jeśli masz zamiar, aby te
href
bezbłędnea
elementy nadal wymagały interakcji z klawiaturą, musisz pójść normalną drogą przypisywaniarole
atabindex
obok swoich zwykłych programów obsługi kliknięć / klawiszy:źródło
href
powoduje, że nie jest to hiperłącze, co czyni tęonclick
funkcjonalność niedostępną dla użytkowników klawiatury.Słowo ostrzeżenia:
Z mojego doświadczenia
href
wynika, ż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.źródło
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ę
źródło
Spróbuj zrobić
<a href="#" class="arrow">
zamiast tego. (Zwróć uwagę na ostry#
znak).źródło