4 ошибки начинающего верстальщика

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

Чтобы этого избежать читайте мою подборку 4х популярных ошибок, которые необходимо искоренить из своей работы и с самого начала привыкать работать правильно.

1. Первая ошибка – это не использование тегов.

Таких как <header>, <footer>, <nav>, <article>, <section>, а вместо этого использовать div с идентификатором <div id=”header”> и т.д. Браузеры и роботы-поисковики давно знают симантическую структуру сайтов и использовать простые div уже не целесообразно и даже неправильно.
Использование тэгов header, footer, section


2. Вторая ошибка – прописывание стилей внутри элемента div или тега style.

Является ошибкой прописование стилей CSS внутри элемента страницы, например, <div style=”width:100%;”>
Также неправильно прописывать стили в странице html внутри тэга <style></style>

Эти варианты допускаются в ряде случаев, когда остальное уже не работает или нет возможности поменять файл стилей, но при создании сайта нужно использовать отдельный файл стилей, например, style.css, который подключается к проекту и все стили прописывать туда. Остальные варианты стараться исключать.

Стили в style.css3. Третья ошибка – неправильные названия классов и id элементов.

Не используйте в именах классах:
× безликие неинформативные или непонятные названия: kuku-2
× название кириллицой: novosti-dnya
× перечисления одного и того же названия, добавляя цифру в конце: block1, block2, block3 и так всю страницу.

✅ Используйте английские слова, понятно обозначающие суть данного блока через тире: daily-news или слитно, но каждое следующее слово с большой буквы: dailyNews.
Предпочтительней использовать первый вариант через тире.

Правильные название классов CSS

4. Последняя на сегодня ошибка: использование блочного элемента внутри строчного.

Блочные элементы это: div, ul, h1, h2 имеют по умолчанию свойство display: block
A строчные: a, li, span, label – display:inline.

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

Порядок элементов в HTML

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

Автор

1 Comment

Write A Comment