Wskakuję tu trochę za późno, ale sam natknąłem się na tę stronę. Oczywiście nie wiem, w jaki sposób Facebook lub Twitter to uzasadniły, ale oto mój własny proces przemyślenia tego, co warto.
W końcu doszedłem do wniosku, że ta praktyka nie jest aż tak niekonwencjonalna (czy to słowo?). W rzeczywistości, oprócz skrótu i miłego skojarzenia „i jest dla ikony”, myślę, że jest to najbardziej semantyczny wybór ikony, gdy prosty <img>tag nie jest praktyczny.
1. Użycie jest zgodne ze specyfikacją.
Chociaż może nie być to, co miał na myśli W3, wydaje mi się, że oficjalna specyfikacja <i>dość łatwo pomieści ikonę. W końcu symbol strzałki odpowiedzi mówi „odpowiedz” w inny sposób. Wyraża termin techniczny, który może być nieznany czytelnikowi i zwykle byłby pisany kursywą. („Tutaj na Twitterze nazywamy to strzałką odpowiedzi ”). Jest to termin z innego języka: języka symbolicznego.
Jeśli zamiast symbolu strzałki użyty zostanie Twitter <i>shout out</i>lub <i>[Japanese character for reply]</i>(na angielskiej stronie), byłoby to zgodne ze specyfikacją. Dlaczego więc nie <i>[reply arrow]</i>? (Mówię tu wyłącznie o semantyce HTML, a nie o dostępności, do której dojdę.)
O ile widzę, jedyną częścią specyfikacji wyraźnie naruszoną przez użycie ikony jest fraza „rozpiętość tekstu” (gdy znacznik również nie zawiera tekstu). Oczywiste jest, że <i>znacznik jest przeznaczony głównie do tekstu, ale jest to dość mały szczegół w porównaniu z ogólną intencją znacznika. Ważnym pytaniem dla tego znacznika nie jest to, jaki format treści zawiera, ale jakie jest znaczenie tej treści.
Jest to szczególnie prawdziwe, gdy weźmie się pod uwagę, że linia między „tekstem” a „ikoną” może prawie nie istnieć na stronach internetowych. Tekst może wyglądać bardziej jak ikona (jak w przykładzie japońskim) lub ikona może wyglądać jak tekst (jak w przycisku jpg z napisem „Prześlij” lub zdjęcie kota z nałożonym podpisem) lub tekst może zostać zastąpiony lub wzbogacony o obraz za pomocą CSS. Tekst, obraz - kogo to obchodzi? Cała zawartość. Dopóki wszyscy - ludzie z upośledzeniami, przeglądarki z upośledzeniami, pająki wyszukiwarek i inne maszyny różnego rodzaju mogą zrozumieć to znaczenie, wykonaliśmy naszą pracę.
Zatem fakt, że autorzy specyfikacji nie myśleli (ani nie wybrali), aby to wyjaśnić, nie powinien wiązać naszych rąk z robieniem tego, co ma sens i jest zgodne z duchem tagu. <a>Tag był pierwotnie przeznaczony do podjęcia użytkownikowi gdzieś indziej, ale teraz to może pojawi się schowek. Big whoop, prawda? Jeśli ktoś wymyślił, jak wyskoczyć lightbox po kliknięciu, zanim specyfikacja złapie, nadal powinien był użyć <a>tagu, a nie <span>, nawet jeśli nie był on całkowicie zgodny z obecną definicją - ponieważ był najbliższy i był nadal zgodny z duchem tagu („coś się stanie, gdy klikniesz tutaj”). To samo dotyczy <i>- niezależnie od tego, co w nim umieścisz lub jak twórczo z niego korzystasz,
2. <i>Znacznik dodaje semantyczne znaczenie do elementu ikony.
Alternatywną opcją przenoszenia samej klasy ikon jest <span>, co oczywiście nie ma żadnego znaczenia semantycznego. Gdy maszyna pyta, <span>co zawiera, mówi: „Nie wiem. To może być cokolwiek”. Ale <i>tag mówi: „Podaję inny sposób wypowiedzenia niż zwykły, a może nieznany termin”. To nie to samo, co „Zawieram ikonę”, ale jest o wiele bliżej niż <span>mam!
3. Ostatecznie powszechne użycie jest słuszne.
Oprócz powyższego warto wziąć pod uwagę, że czytniki maszynowe (czy to wyszukiwarka, czytnik ekranu itp.) Mogą w dowolnym momencie zacząć brać pod uwagę fakt, że Facebook, Twitter i inne strony internetowe używają <i>tagu jako ikon. Nie dbają o specyfikację tak bardzo, jak dbają o wydobywanie znaczenia z kodu wszelkimi niezbędnymi środkami. Mogą więc wykorzystać tę wiedzę o powszechnym użyciu, aby po prostu zarejestrować, że „może tu być ikona”, lub zrobić coś bardziej zaawansowanego, jak wywołanie CSS w celu podpowiedzi do znaczenia lub kto wie co. Jeśli więc zdecydujesz się na użycie <i>ikon for w swojej witrynie, być może zapewniasz więcej znaczenia niż specyfikacja.
Co więcej, jeśli to użycie stanie się powszechne, prawdopodobnie zostanie włączone do specyfikacji w przyszłości. Następnie przejrzysz swój kod, zastępując <span>s na <i>'s! Może więc mieć sens wejście w coś, co wydaje się być kierunkiem specyfikacji, szczególnie gdy nie jest ona wyraźnie sprzeczna z obecną specyfikacją. Powszechne stosowanie zwykle dyktuje reguły językowe bardziej niż na odwrót. Jeśli masz wystarczająco dużo lat, czy pamiętasz, że „strona internetowa” była oficjalną pisownią, kiedy słowo było nowe? Słowniki podkreślały, że musi być spacja, a sieć musi być pisana wielkimi literami. Powody były semantyczne. Ale powszechne użycie mówiło: „Cokolwiek, to głupie. Używam„ strony internetowej ”, ponieważ jest bardziej zwięzłe i wygląda lepiej”. I wkrótce
4. Więc idę dalej i używam go.
Tak więc <i>nadaje więcej znaczenia maszynom ze względu na specyfikację, zapewnia więcej znaczenia ludziom, ponieważ łatwo kojarzymy „i” z „ikoną” i ma on tylko jedną literę. Zdobyć! A jeśli upewnisz się, że umieścisz równoważny tekst wewnątrz <i>tagu lub tuż obok niego (tak jak robi to Twitter), to czytniki ekranu rozumieją, gdzie kliknąć, aby odpowiedzieć, link jest użyteczny, jeśli CSS nie ładuje się, a czytelnicy z dobrymi ludźmi wzrok i przyzwoita przeglądarka widzą ładną ikonę. Mając to na uwadze, nie widzę negatywnych skutków.
<i class="sm-reply"></i>.