To pytanie pojawiło się podczas jednej z moich zajęć w college'u. Profesor udzielił tylko odpowiedzi, że był bardziej opisowy, ale wydaje się, że jest <b>
i <i>
jest dość wyraźny w ich znaczeniu i łatwiej jest pisać niż <strong>
i <em>
.
Jakie były oficjalne argumenty za wycofaniem tych tagów?
html
deprecation
LanceLafontaine
źródło
źródło
<b>
i<i>
nie jestem przestarzały.b
- dosłownie oznacza „to jest odważne”, a nie „to jest podkreślone”. Ale najważniejsze jest to, że mają różne znaczenia - nie ma w nich deprecjacji, po prostu nie to, że kiedy zwykłeś to robić,b
alboi
zwykle miałeś na myślistrong
lubem
.<i>
i<b>
nie są tak naprawdę przestarzałe,<tt>
i<u>
są, i pytanie byłoby tak samo odpowiednie dla nich.Odpowiedzi:
Zeszłego lata przeczytałem pełną specyfikację HTML5 i każdą poprzednią specyfikację HTML (nawet te porzucone), wszystkie specyfikacje CSS, które mogłem znaleźć, i wiele specyfikacji XML. Ponieważ uwielbiam semantycznie bogate dokumenty hipertekstowe, pozwól, że przedstawię ci ideę odpowiedniej semantyki HTML w HTML5.
Przed HTML5
Przed HTML5
i
ib
rzeczywiście były modne. Powodem było to, że zasadniczo działali jakem
istrong
odpowiednio, ale z naciskiem na prezentację, a nie na semantykę (co jest złe).Rzeczywiście
i
oznaczało to, że tekst powinien być pisany kursywą (mówił coś o tym, jak tekst powinien być renderowany na ekranie). Z drugiej stronyem
oznaczało, że należy podkreślić tekst (mówiło coś o semantyce tekstu).Istnieje tutaj ważna różnica teoretyczna. Jeśli używasz
em
, agent użytkownika (= przeglądarka) wie, że tekst powinien być wyróżniony, więc może renderować go kursywą, jeśli dokument jest wyświetlany na ekranie (lub wielkimi literami, jeśli formatowanie nie jest możliwe, a może nawet pogrubioną czcionką jest użytkownik woli), może wymówić to inaczej, jeśli dokument zostanie przekazany użytkownikowi itp.Zauważ, że tak naprawdę nacisk kładziony jest na semantykę. Na przykład frazy
nie mają tego samego znaczenia.
Ta sama różnica dotyczy
b
(czcionka pogrubiona) istrong
(duży nacisk).Ogólna zasada pisania cyfrowego, aw szczególności tworzenia hipertekstu, polega na oddzieleniu treści i stylu. W przypadku tworzenia hipertekstu oznacza to, że treść powinna znajdować się w pliku HTML, a styl powinien znajdować się w pliku CSS (lub kilku plikach CSS). Inną, ale powiązaną zasadą jest to, że dokument powinien być bogaty w semantykę (np. Zaznaczanie nagłówków, stopek, list, akcentów, adresów, obszarów nawigacyjnych itp.). Ma to wiele zalet:
Tak, w skrócie,
i
ib
były przestarzałe, ponieważ były znaczniki HTML zaniepokojeni prezentacji , która jest całkowicie błędne.W HTML5
W HTML5
i
ib
nie są już przestarzałe. Zamiast tego mają znaczenie półmatyczne . Więc teraz dotyczą one semantyki, a nie prezentacji.Tak jak poprzednio,
em
zaznaczasz nacisk: „Kot jest mój”. Ale używaszi
w prawie wszystkich innych przypadkach, w których używasz kursywy w drukowanej pracy. Na przykład:i
do oznaczania oznaczeń taksonomicznych: „Lubię R. norvegicus ”.i
do oznaczania frazy w innym języku niż otaczający tekst: À la cartei
do oznaczania słowo gdy mówimy o samo słowo: „ napój jest zarówno rzeczownik i czasownik”Dobrym pomysłem jest również użycie tego
class
atrybutu, aby określić dokładne użycie (także „mikroformat” Google i „mikrodane”). I oczywiście w drugim przypadku powinieneś naprawdę użyćlang
atrybutu, aby określić poprawny język. (W przeciwnym razie na przykład agent zamiany tekstu na mowę może źle wymawiać tekst.)Mniej więcej rok temu specyfikacja HTML5 mówi również, że
cite
należy jej używać do oznaczania nazw książek, filmów, oper, obrazów itp .:Wreszcie, od dawna,
dfn
służy do oznaczania definiującego wystąpienia frazy w tekście (np. Definicji matematycznej lub definicji terminu):Tak więc kursywa w drukowanej książce, która może oznaczać wiele różnych rzeczy, jest reprezentowana przez cztery różne tagi HTML5, co jest naprawdę świetne, ponieważ semantyka jest dobra, o czym starałem się przekonać wcześniej. (Na przykład możesz poprosić przeglądarkę o sporządzenie listy wszystkich definicji w tekście, abyś mógł je wszystkie poznać przed egzaminem).
Wracając do
strong
ib
, specyfikacja HTML5 mówi, żestrong
należy jej użyć do oznaczenia ważnej części tekstu, na przykład ostrzeżenia lub jakiegoś bardzo ważnego słowa do uchwycenia w zdaniu. Z drugiej stronyb
powinny być używane do oznaczania rzeczy, które muszą być łatwe do znalezienia w tekście, takich jak słowa kluczowe. Używam równieżb
jako nagłówków w elementach listy (LI).źródło
<dfn>
nie jest<def>
. W przeciwnym razie świetne kompleksowe podsumowanie wszystkich problemów. Twoja sugestia użycia<b>
jako nagłówków w elementach listy jest interesująca; podejście semantyczne polega na użyciu listy definicji , ale ponieważ obecnie żadne przeglądarki nie obsługujądisplay:run-in
, wstawiaj znaczniki słów kluczowych za pomocą<b>
lub<span>
możesz zrobić to najlepiej.display:run-in
, ale ponieważ jego wsparcie maleje , musisz użyć trikafloat
lubcontent:
, zobacz rejbrand.se/rejbrand/news.asp?ItemIndex=169 . Kiedy mówię o używaniub
do oznaczania „nagłówków” na listach, nie mam na myśli par nazwa-wartość, ale raczej proste listy, w których chcę użyć „nagłówka” w każdym elemencie.<b>
gwarantują pogrubienie tekstu. 1) Czytniki ekranu, monitory brajlowskie i inne sposoby konsumowania tekstu, dla których grubsze glify są bez znaczenia. 2)b { font-weight: normal }
, co oznacza, że styl wyświetlania nie jest ustalony dla<b>
żadnego z nich.b, strong { font-weight:bold; }
. W ten sposób możesz być tak pewny, jak tylko możesz. CSS to sposób na określenie formatu wizualnego. HTML dotyczy znaczenia (treści), CSS - wizualnej jego prezentacji.Jak mówi Doval, nie są przestarzałe. One nadal istnieją , ale powinny być wykorzystywane inaczej niż to, co wielu ludzi, gdzie wykorzystywane do przed HTML5.
Chodzi o HTML „semantyczny”. Powinien opisać „co”, a nie jak powinien wyglądać. Przeglądarka lub teoretycznie jakikolwiek inny nośnik wyświetlania (powiedzmy aplikacja do czytania dla osób niewidomych) powinna być w stanie zdecydować, jak dokładnie powinna być interpretowana.
Jest to podobne, dlaczego nie należy używać nazw klas CSS, takich jak „czerwony”, i stosować bardziej opisowe klasy, które opisują ideę funkcjonalną przy użyciu innego koloru tutaj. Możesz później zdecydować, że zielony jest lepszy (i być może wszystko „mocne” powinno być pokazane za pomocą czerwonego koloru zamiast pogrubionego tekstu). Lub użytkownik ślepy na kolory może mieć pewne specjalne ustawienia przeglądarki, w których kolory są zastępowane w inny sposób.
źródło
<span class="keyword">...</span>
na pierwszym miejscu oszczędza wiele kłopotów.<b>
to przypadek krawędzi, ale są stałe przykłady korzystania<i>
w przypadkach, gdy<em>
jest nieodpowiednie: naukowych nazw gatunków lub łacińskich słów przyjętych w języku angielskim (ty mógł używać rozpiętość z atrybutem języka, ale ma wszelkiego rodzaju innych skutków - - czytnik ekranu może przełączać głosy na inny język). Można go również używać do kursywy w tytułach innych dzieł, chociaż należy zastosować podejście semantycznie poprawne<cite>
.Prawdziwa historia jest taka, że
b
ii
po raz pierwszy przestarzałe, nieaktualne, przeklinał i anatematized jako „prezentacyjny” w różnych projektach HTML5 (mówiąc ogólnie), ale potem zrozumiałem, że te znaczniki są szeroko stosowane, a także generowane przez wiele programów autorskich. Zamiast po prostu im na to pozwolić, opracowali dla nich nowe definicje „semantyczne”, aby móc dopuścić elementy, ale nadal udawać, że są surowi wobec „prezentacji” znaczników. Nowe definicje różniły się w zależności od projektu i są niejasne: trudno znaleźć dwie osoby, które rozumieją i interpretują je w ten sam sposób.Przepraszamy, brak referencji. Powyższy opis jest wynikiem śledzenia zmian i czytania szkiców i dyskusji, często między wierszami. Nie mówią wprost przyczyny. Nadal uważam, że to prawdziwa historia.
Wniosek jest następujący: Idź dalej. Nie ma tu nic użytecznego. Elementy
b
ii
robią to samo, co zawsze: sprawiają, że czcionka jest odpowiednio pogrubiona lub kursywą, przy zwykłych zastrzeżeniach. To jest rzeczywistość, którą należy wziąć pod uwagę, a nie quasischolastyczna „semantyka”, która nie ma wpływu na przeglądarki, wyszukiwarki i inne oprogramowanie.źródło
<b>
jako zabawny rodzaj,<span>
który domyślnie renderuje się pogrubioną czcionką. Następnie, jeśli możesz być zaniepokojony, podaj również jego użycieclass
atrybutu, aby w razie potrzeby móc zmienić styl wielu rzeczy, które go używały, ponieważ mają one wspólną semantykę. To quasischolastyczne w tym sensie, że ludzie będą myśleć, że jesteś quasi w głowieb.productname {font-weight: normal; font-style: italic; }
po tym, jak zmieniłeś zdanie na temat prezentacji i skorzystałeś z mądrego wyboru znaczników semantycznych ;-)<b>this</b>
wydaje się znacznie bardziej rozsądne niż<span class="bold">this</b>
(ośmiobajtowy narzut pierwszego z nich jest dość irytujący; 23-bajtowy narzut drugiego z nich wydaje się szalony). Zastanawiam się, dlaczego HTML nigdy nie zdefiniował żadnej reprezentacji skróconej, takiej<@quack>this</@>
jak odpowiednik<span class="quack">this</span>
?class='bold'
? Mistrz Suku z The Codeless Code opowiedziałby wam o używaniu tak kiepskich nazw klas . Rozważ to swój ostatni pogrubionyRedText .<b>
I<i>
znaczniki pochodzi z pojęciami „bold” i „italic”. Problem polega na tym, że dla niektórych programów użytkownika mogą one być zupełnie bez znaczenia. Na przykład, jak brzmi „kursywa” w czytniku ekranu dla osoby niewidomej?Zastąpienie ich
<strong>
i<em>
usunięcie bezpośredniego linku do pojęć typograficznych. Zamiast tego klient użytkownika może je renderować w dowolny sposób.źródło
<b>
i<i>
jakkolwiek uważa za stosowne.<b>
I<i>
znaczniki są niezbędne, jeśli wymagają dosłownie tekst „bold” lub „italic”.Jeśli piszesz równanie w HTML, w którym kursywą „ ja ” ma inne znaczenie niż nie kursywą „ja”, ważne jest, aby móc to rozróżnić.
Myślę o nich w ten sam sposób, w jaki myślę
<sup>
lub<sub>
znaczniki - nie można poprawnie przedstawić znaczenia równania bez użycia takich znaczników „wyglądu”.Purystycznym podejściem byłoby użycie MathML lub TeX, ale obsługa przeglądarki jeszcze nie istnieje ...
źródło
in a monospaced typeface
ale który nie czyni rozróżnienia, dlaczego, wówczas użycie jednego z „zamienników” na<tt>
fałszywie oznaczałoby, że kod wykonujący import wiedział więcej niż cel.b
ii
w kontekście matematycznym (i fizycznym), ale takie użycie nie jest wspomniane w szkicach HTML5. Kiedy zadałem to pytanie, poważnie zareagowano na użycie znaków specjalnych Unicode (matematyczne pogrubione litery i matematyczne litery kursywy)!class="source-X-asserts-it-should-be-monospace"
, odróżnia ją od tekstu semantycznie odmiennego w tym sensie, że niektóre inne źródła twierdzą z nieznanych powodów, że powinna być monospace. W efekcie polega to na sprawdzeniu rzeczy, które HTML uważa za złe, a nie tylko tłumaczeniu złości na HTML.<TT>
, co bezpośrednio sugerowało, że tekst powinien być ustawiony kontrastową czcionką monospace, ze znacznikami, które po kilku warstwach pośrednich wskazują, że tekst powinien być pokazany w określonej czcionce, która zdarza się być monospace. Chociaż nie spodziewałbym się, że wszystkie czytniki ekranu zrobią coś pożytecznego<tt>
, spodziewam się, że będą miały o wiele łatwiejszy czas<tt>
niż<span class="styleNameThisImportUtilityPicked">
.Zasady projektowania leżące u podstaw tagów HTML są takie, że powinny one być „semantyczne”, tzn. Powinny wskazywać znaczenie i cel, a nie instrukcje niskiego poziomu.
Klasyczny test brzmi: „czy tagi mogą być sensownie użyte w przeglądarce dla osób niewidomych”.
Tak więc w przeglądarce opartej na dźwięku „i” dla kursywy jest dość bezużyteczne, ponieważ nie można używać kursywy. Znacznik „em” ma jednak znaczenie, ponieważ urządzenie audio może podkreślić frazę na wiele sposobów: zwiększając wysokość tonu, zwiększając głośność lub zmieniając akcent. Renderowanie w alfabecie Braille'a można podkreślić, podnosząc kropki, zmieniając odstępy, zmieniając rozmiar lub dodając wibracje.
źródło
<img>
dlatego, że nie można odczytać obrazu, a system bez sprzętu dźwiękowego nie może się prezentować<audio>
. Czasami prezentacja jest głównym celem elementu i nie musi być powszechnie obsługiwana (i w przeciwieństwie do innych potencjalnie nieobsługiwanych elementów,<i>
nie potrzebuje tekstu alternatywnego, ponieważ jedyną utraconą informacją jest kursywą). Prawdziwy problem polega na tym, że ludzie mówią,i
kiedy mają na myśliem
.<i>
znaczniku używa tonu 120, a tekst w<b>
znaczniku 80, a tekst w<tt>
synchronizacji mowy z syntezowaną maszyną do pisania umożliwiającą słuchaczowi aby łatwo rozróżnić te formy znaczników. Zadanie byłoby znacznie trudniejsze, gdyby zamiast użycia<i>
znacznika tekst zamiast tego użył<span class="whatever">
części, która spowodowała wyświetlenie części tekstu za pomocą „Acme SemiScript” zamiast „Waldorf Sans” [niektóre rodziny czcionek ...