Страницы

Поиск по вопросам

суббота, 1 февраля 2020 г.

Какие HTML теги моветон?

#html #css #html5 #вёрстка 


Какие HTML теги при оформлении css считается моветон ?


Ответы

Ответ 1


Во-первых, не стоит использовать все элементы, помеченные в спецификации как устаревшие
или даже исключённые из неё. Это b, i, u, strike, big, small, font и некоторые другие.

Также есть некоторые элементы, которые хотя и имеют некоторое дефаултное оформление,
обрели свою семантику. Использовать их чисто ради оформления неправильно, но использование
по прямому назначению вполне оправдано:


br - перевод строки. Идеально подойдёт для строк внутри стихов или песен, но НЕ подойдёт
для создания пустой строки между куплетами - вместо этого можно, например, оборачивать
сами куплеты в p.
hr - горизонтальная линия. В книгах иногда внутри глав встречаются *** как разделитель
меньший, чем глава - вот на его роль hr отлично подходит. Более спорное использование
- между самими главами (по сути дублирует заголовки) и между куплетами песни.
em и strong - смысловое акцентирование слов. Их не следует  использовать просто ради
курсива и жирного шрифта. А вот курсив в этом тексте у сочетания "не следует" вполне
логично сделать через em.
mark - выделение совпадений, например, подсветить поисковую фразу в результатах поиска.
А не просто жёлтый фон.
s - неактуальная информация. Например, во время скидок можно поместить в него старую
цену. А просто что-то зачеркнуть надо через css.
ins и del - вставленный и удалённый текст - некое версионирование. Собственно, кроме
версионирования ничего в голову и не приходит.


Сейчас становится популярным использовать тег i для иконок. Вообще-то не уверен как
на это смотрит стандарт, но почему бы и нет. Может со временем это там закрепится.

Ещё есть интересный тег plaintext - он никогда не был в спецификации, но обладает
удивительной особенностью - всё, что идёт после его открытия становится просто текстом.
На страницах я его никогда не использовал, но он просто идеален для вывода текстовой
информации в новом окне, так что довольно часто я его использую в сниппетах которые
запускаю в своём браузере. Но формально его использовать не стоит :)

PS: Вообще пришло в голову, что презентационные теги подходят для wysiwyg-редакторов,
поскольку там семантика неизвестна. С другой стороны, всё то же самое можно сделать
просто через классы на span'ах.


Ответ 2


Одни "плохие теги" попросту отвечают за внешнее представление элемента (как тег ),
и их можно заменить на нечто более значимое, либо использовать вместо них CSS. Другие
же могут не только определять визуальное представление, но и быть к тому же излишне
громоздки (как тег ) или ужасно пагубны для удобства использования веб-страницы
(как тег ).

Теги
Ниже приводится большинство общих тегов, у которых есть лучшая альтернатива:

 отображает текст жирным шрифтом. Вместо него можно использовать тег ,
который добавляет элементу дополнительное значение (усиленное выделение), либо, если
необходимо просто отобразить текст жирным шрифтом, соответствующее свойство CSS выполняет
ту же работу.
 отображает текст курсивом. Использование тега  также добавляет дополнительную
информацию (выделение), а для обычной визуализации подойдет соответствующее свойство CSS.

 увеличивает размер отображаемого текста. Если текст используется в качестве
заголовка, то лучше использовать теги заголовков (
, 
 и т.д.), которые именно
для этого и предназначены, а для простого визуального выделения следует использовать
свойство CSS font-size, которое предоставляет больший контроль над страницей.
 уменьшает размер отображаемого текста. Опять же для этого лучше использовать
свойство CSS font-size.

 создает горизонтальную линию. Тем не менее, в веб-странице, основывающейся на
CSS, использование этого тега несколько необычно. Для этого вполне подойдет свойство
CSS border-top или border-bottom, либо, в крайнем случае, старый добрый тег изображения
сделает это лучше.

Ко всем перечисленным тегам последние стандарты HTML относятся достаточно лояльно,
однако эти теги ничего не добавляют к значению контента, что обязаны делать "хорошие
теги". Все эти "пустышки" могли бы быть более полезны, но они не приносят и вреда,
в отличие от следующих "вредин":

 в свое время использовался для подчеркивания текста. Так получилось, что подчеркнутый
текст прочно ассоциируется со ссылками. Именно поэтому этот тег давно умер, и именно
поэтому крайне не желательно иметь в тексте подчеркнутые участки, не являющиеся ссылками.

 использовался для центрирования одного элемента относительно другого. Свойство
CSS text-align имеет не только значение center, но и left, right и justify.
 аналогичен тегу 
, однако работает он только в старых версиях браузера
Netscape и потому совершенно бесполезен.
 или . Наше твердое "Нет!". Они должны были делать мигающий текст,
однако из-за ограниченной поддержки вскоре превратились в дурную шутку.
 использовался для определения имени, размера и цвета шрифта элементов. Этот
тег снискал репутацию злого гения мира тегов. Старые сайты (и даже некоторые новые)
подобно оспинами буквально испещрены тегами . Большинство из них обязаны своему
появлению различным программам автоматизации создания сайтов, вставляющие тег 
вокруг всякого элемента, размер или цвет которого изменяет автор. Так как этот тег
приходится вставлять вокруг каждого появления элемента (скажем, каждый раз, как используется
элемент 
), то при помощи свойств CSS это можно сделать при помощи одной маленькой
строки кода и применить ее ко всему сайту. Такой способ не только делает код веб-страницы
меньше, но и позволяет при модифицировании стиля изменить всего одну строку, а не отыскивать
все теги  в коде всех веб-страниц. Тег  и неуместное использование таблиц
– две наиболее частые причины распухания кода веб-страниц.

источник











Автор:



на






















Ярлыки:
,
,
,
,

















Комментариев нет:















Отправить комментарий

















        
      








Подписаться на:
Комментарии к сообщению (Atom)