Сегодня блог команды buyhtml попытается вкратце рассказать вам о том, что такое атрибуты в html и как именно они работают при <strong>верстке сайтов. </strong>Для максимальной информативности поста мы постараемся описать только самые используемые из них.

Атрибут — это уточнение для браузера функций самого тега, его оформления и отображения в шаблоне. Они задаются внутри открывающего тега следующим способом:

атрибут= «его значение»

С помощью атрибутов код становится более функциональным, но их использование не всегда оправдано. По возможности, рекомендуется выносить как можно больше кода стилей в соответствующий файл, минимизируя html структуру.

Впрочем, некоторые из них используются очень часто и достаточно уместно:

Align — один из наиболее используемых атрибутов при верстке сайтов, именно им задается расположение элемента, впрочем без добавки в стиле блока различных отступов, малофункционален, ограничивается тремя свойствами и none по умолчанию.

Src — сокращенный от англ. «source», задает источник используемого, мультимедийного файла. Используется достаточно часто для картинок в статьях, в дизайне шаблона рациональнее применять свойство background-image.

Class/id — незаменимые, базовые атрибуты при верстке сайта. Они привязывают отдельный блок кода к соответствующим значениям стиля, минимизируя html структуру. Принципиальным отличием является то, что id применяется к уникальным элементам, то есть повторное использование идентификатора с таким же значением невозможно. Class соответственно имеет более широкие свойства, благодаря чему в коде он используется чаще.

Alt — сокращенный от англ. «alternative», задает поясняющий текст к отображаемой картинке. Атрибут часто используется для оптимизации кода, ведь его значением «интересуются» роботы ПС.

Href — используется для задания ссылок в тексте или для определения адресов подключаемого файла. В создании шаблона заменяется php кодом для большего удобства, но при написании текстов просто незаменим.

Rel — определяет отношение документа на котором расположен к другому, на который поставлена ссылка. Чтобы не усложнять понимание этого тега, скажем что чаще всего он применяется для поисковой оптимизации с целью не отдавать PR странницы значением nofollow. Также в некоторых случаях атрибут удобно использовать для объявления авторского права (rel=”copyright ”) или обозначения данной ссылки, как справки по документу (rel=”help”).

Title — атрибут-подсказка, выводит информацию об элементе для которого задан. В основном используется для поисковой оптимизации кода и улучшения юзабилити при верстке сайта. Сама подсказка в текстовых браузерах показана, как «всплывающий» текст при наведении на объект.

Style — позволяет задавать оформление блока без его привязки к файлу стилей. Атрибут имеет очень широкий функционал, но мало используется ввиду настоятельной рекомендации минимизировать код. Использовать его логично для тех объектов, задавать которым отдельный блок нет смысла (мультимедиа, таблица). Естественно, даже в таком случае не стоит задавать много значений этому атрибуту.

При верстке сайта следует больший упор делать на функциональность будущего шаблона, быстрота загрузки которого во многом зависит от количества html кода. Поэтому использование других, не обозначенных в этой статье атрибутов не всегда верно. Правильнее будет заменить их соответствующими свойствами в файле стилей.