Ich springe etwas spät hier rein, bin aber auf diese Seite gestoßen, als ich selbst darüber nachgedacht habe. Natürlich weiß ich nicht, wie Facebook oder Twitter es gerechtfertigt haben, aber hier ist mein eigener Denkprozess für das, was es wert ist.
Am Ende kam ich zu dem Schluss, dass diese Praxis nicht so unsemantisch ist (ist das ein Wort?). Abgesehen von der Kürze und der netten Assoziation von "i is for icon" denke ich, dass dies die semantischste Wahl für ein Symbol ist, wenn ein einfaches <img>Tag nicht praktikabel ist.
1. Die Verwendung entspricht der Spezifikation.
Während es vielleicht nicht das ist, was der W3 hauptsächlich im Sinn hatte, scheint es mir, dass die offizielle Spezifikation für <i>ein Symbol ziemlich leicht aufnehmen könnte. Immerhin sagt das Antwortpfeilsymbol auf andere Weise "Antwort". Es drückt einen Fachbegriff aus, der dem Leser möglicherweise unbekannt ist und normalerweise kursiv geschrieben wird. ("Hier bei Twitter nennen wir das einen Antwortpfeil .") Und es ist ein Begriff aus einer anderen Sprache: einer symbolischen Sprache.
Wenn anstelle des Pfeilsymbols Twitter <i>shout out</i>oder <i>[Japanese character for reply]</i>(auf einer englischen Seite) verwendet wird, stimmt dies mit der Spezifikation überein. Warum dann nicht <i>[reply arrow]</i>? (Ich spreche hier ausschließlich von HTML-Semantik, nicht von Barrierefreiheit, auf die ich noch eingehen werde.)
Soweit ich sehen kann, ist der einzige Teil der Spezifikation, gegen den die Verwendung von Symbolen ausdrücklich verstößt, die Phrase "Spanne des Textes" (wenn das Tag auch keinen Text enthält). Es ist klar, dass das <i>Tag hauptsächlich für Text gedacht ist, aber das ist ein ziemlich kleines Detail im Vergleich zur Gesamtabsicht des Tags. Die wichtige Frage für dieses Tag ist nicht, welches Format des Inhalts es enthält, sondern welche Bedeutung dieser Inhalt hat.
Dies gilt insbesondere dann, wenn Sie bedenken, dass die Linie zwischen "Text" und "Symbol" auf Websites fast nicht vorhanden sein kann. Text kann eher wie ein Symbol aussehen (wie im japanischen Beispiel) oder ein Symbol kann wie Text aussehen (wie in einer JPG-Schaltfläche mit der Aufschrift "Senden" oder einem Katzenfoto mit einer überlagerten Beschriftung) oder Text kann ersetzt oder erweitert werden ein Bild über CSS. Text, Bild - wen interessiert das? Es ist alles Inhalt. Solange jeder - Menschen mit Behinderungen, Browser mit Behinderungen, Suchmaschinenspinnen und andere Maschinen verschiedener Art - diese Bedeutung verstehen kann, haben wir unsere Arbeit erledigt.
Die Tatsache, dass die Verfasser der Spezifikation nicht daran gedacht (oder entschieden) haben, dies zu klären, sollte uns nicht davon abhalten, das zu tun, was Sinn macht und mit dem Geist des Tags übereinstimmt. Das <a>Tag sollte den Benutzer ursprünglich an einen anderen Ort bringen, aber jetzt wird möglicherweise ein Leuchtkasten angezeigt. Großer Schrei, richtig? Wenn jemand herausgefunden hätte, wie ein Leuchtkasten beim Klicken geöffnet werden kann, bevor die Spezifikation eingeholt wurde, hätte er immer noch das <a>Tag verwenden sollen, nicht a <span>, auch wenn es nicht ganz mit der aktuellen Definition übereinstimmt - weil es am nächsten kam und war immer noch im Einklang mit dem Geist des Tags ("etwas wird passieren, wenn Sie hier klicken"). Gleiches gilt für <i>- was auch immer Sie hineinstecken oder wie kreativ Sie es verwenden,
2. Das <i>Tag fügt einem Symbolelement eine semantische Bedeutung hinzu .
Die alternative Möglichkeit, eine Icon-Klasse für sich zu führen, besteht darin <span>, dass sie natürlich keinerlei semantische Bedeutung hat. Wenn eine Maschine fragt, <span>was sie enthält, heißt es: "Ich weiß nicht. Könnte alles sein." Aber auf dem <i>Etikett steht: "Ich habe eine andere Art, etwas zu sagen als die übliche oder vielleicht einen unbekannten Begriff." Das ist nicht dasselbe wie "Ich habe ein Symbol", aber es ist viel näher dran als es ist <span>!
3. Schließlich macht die allgemeine Verwendung richtig.
Darüber hinaus ist zu berücksichtigen, dass Maschinenleser (ob Suchmaschine, Bildschirmleser oder was auch immer) jederzeit berücksichtigen können, dass Facebook, Twitter und andere Websites das <i>Tag für Symbole verwenden. Sie kümmern sich nicht so sehr um die Spezifikation, sondern darum, die Bedeutung des Codes mit allen erforderlichen Mitteln zu extrahieren. Sie können dieses Wissen über die allgemeine Verwendung verwenden, um einfach aufzuzeichnen, dass "hier möglicherweise ein Symbol vorhanden ist", oder um etwas Fortgeschritteneres zu tun, z. B. einen Blick in das CSS zu werfen, um einen Hinweis auf die Bedeutung zu erhalten, oder wer weiß was. Wenn Sie also die <i>for-Symbole auf Ihrer Website verwenden, geben Sie möglicherweise mehr Bedeutung als die Spezifikation.
Wenn diese Verwendung weit verbreitet wird, wird sie wahrscheinlich in Zukunft in der Spezifikation enthalten sein. Dann werden Sie Ihren Code durchgehen und <span>s durch <i>'s ersetzen ! Daher kann es sinnvoll sein, sich an die Richtung der Spezifikation zu halten, insbesondere wenn diese nicht eindeutig mit der aktuellen Spezifikation in Konflikt steht. Die allgemeine Verwendung diktiert Sprachregeln eher als umgekehrt. Wenn Sie alt genug sind, erinnern Sie sich, dass "Website" die offizielle Schreibweise war, als das Wort neu war? Wörterbücher bestanden darauf, dass es einen Leerzeichen geben muss und das Web groß geschrieben werden muss. Dafür gab es semantische Gründe. Aber die allgemeine Verwendung sagte: "Was auch immer, das ist dumm. Ich benutze 'Website', weil es prägnanter ist und besser aussieht." Und bald,
4. Also mache ich weiter und benutze es.
So <i>bietet aufgrund der spec Maschinen mehr Sinn, es bietet mehr Sinn für die Menschen , weil wir leicht assoziieren „i“ mit „Symbol“, und es ist nur ein Buchstabe lang. Sieg! Und wenn Sie sicherstellen, dass gleichwertiger Text entweder in das <i>Tag oder direkt daneben eingefügt wird (wie dies bei Twitter der Fall ist), wissen die Bildschirmleser, wo sie klicken müssen, um zu antworten. Der Link kann verwendet werden, wenn CSS nicht geladen wird, und die menschlichen Leser sind gut Sehkraft und ein anständiger Browser sehen ein hübsches Symbol. In diesem Sinne sehe ich keinen Nachteil.
<i class="sm-reply"></i>.