HTML ознаки за нагласување

Една од таговите што ќе ја научите рано во вашиот веб дизајн образование е пар на тагови познати како "акцент тагови." Ајде да погледнеме што овие тагови се и како тие се користат во веб дизајн денес.

Назад кон XHTML

Ако сте научиле HTML пред неколку години, многу пред порастот на HTML5, веројатно сте користеле и задебелени и закосени ознаки. Како што би очекувале, овие ознаки ги претворија елементите во задебелен текст или курзивен текст, соодветно. Проблемот со овие тагови, и зошто тие беа тргнати настрана во корист на нови елементи (кои ќе ги погледнеме наскоро), е дека тие не се семантички елементи. Ова е затоа што тие дефинираат како треба да изгледа текстот, а не информации за текстот. Запомнете, HTML (што е местото каде што овие тагови би биле напишани) е за структурата, а не за визуелниот стил! Визуелите се управувани од CSS и најдобрите практики на веб дизајн веќе долго време се одржаа дека треба да имате јасна поделба на стилот и структурата на вашите веб страни. Ова значи дека не се користат елементи кои се не-семантички и кои детали изгледаат наместо структура. Ова е причината зошто задебелени букви и курзивни ознаки беа генерално заменети со силни (за задебелени букви) и акцент (за закосени букви).

& lt; силен & gt; и & lt; em & gt;

Силните и акцентните елементи додаваат информации во вашиот текст, со детали за содржината што треба да се третираат поинаку и истакната кога се зборува таа содржина. Овие елементи ги користите слично на ист начин каков би се користеле задебелено и курзивно во минатото. Едноставно опкружувајте го текстот со ознаките за отворање и затворање ( и за акцент и и за силен акцент) и приложениот текст ќе биде нагласен.

Можете да ги заглавите овие ознаки и не е важно која е надворешната ознака. Еве неколку примери.

Овој текст е нагласен и повеќето прелистувачи ќе го прикажат како курзив. Овој текст е силно нагласен и повеќето прелистувачи ќе го прикажат како задебелен.

Во двата од овие примери, ние не диктира визуелен изглед со HTML. Да, стандардниот изглед на тагот ќе биде закосен и ќе биде задебелен, но изгледа лесно може да се смени во CSS. Ова е најдоброто од двата света. Можете да ги искористите стандардните стилови на прелистувачот за да го нагласат курзив или задебелен текст во вашиот документ без всушност да ја преминуваат линијата и структурата и стилот на мешање. Кажете дека сакате да текстот не само да биде задебелен, туку и да биде црвен, би можел да го додадете ова во CSS

силна {
боја: црвена;
}

Во овој пример, не треба да додадете својство за задебелен фонт-тежина, бидејќи тоа е стандардно. Ако не сакате да го оставите тоа на случајност, сепак, секогаш можете да го додадете во:

силна {
фонт-тежина: задебелен фонт;
боја: црвена;
}

Сега ќе бидете сите, но гарантирате дека имате страница со задебелен (и црвен) текст секаде каде што се користи ознаката .

Двоен нагоре за акцентот

Едно нешто што го забележав во текот на годината е што ќе се случи ако се обидете да се удвоите на акцент. На пример:

Овој текст треба да содржи и текст и во неа.

Ќе мислите дека оваа линија ќе создаде област која има задебелен текст и курзив. Понекогаш тоа навистина се случува, но видов дека некои прелистувачи само го почитуваат вториот од двата акцентирани стилови, оној што е најблизок до конкретниот текст за кој станува збор, а само ова го прикажува како курзив. Ова е една од причините зошто не се удвојувам на акцентните ознаки.

Друга причина за да се избегне ова "удвојување" е за стилски цели. Една форма на акцент ако обично е доволно за да го пренесете тонот кој сакате да го поставите. Не треба да се задебели, да се нагласуваат, да се истакнуваат, да се бојат, да се зголемуваат и да се нагласува текстот за да се истакне. Тој текст, сите тие различни видови на акцент, ќе стане гарни. Па бидете внимателни кога користите ознаки за нагласување или CSS стилови за да обезбедите акцент и не претерувајте.

Забелешка за задебелени букви и курва

Една крајна мисла - додека забраните () и курзивите () тагови повеќе не се препорачуваат да се користат како елементи на акцент, постојат некои веб-дизајнери кои ги користат овие ознаки за да стиснат подрачје на текст. Во основа, тие го користат како елемент . Ова е убаво бидејќи ознаките се многу кратки, но користењето на овие елементи на овој начин не е генерално препорачливо. Јас споменувам во случај да го видите таму на некои сајтови кои се користат да не се создава задебелен или курзивен текст, туку да се создаде кука за CSS за некој друг вид визуелен стил.

Авторски напис од Џенифер Крајнин. Ревидирани од Џереми Жирар на 12/2/16.