Тэг br, а так ли он нужен?

Часто можно встретить, что начинающий верстальщик для реализации некоторых своих дизайнерских решений использует тэг  . Однако остаётся актуальным вопрос «правильное ли это решение?».

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

<ul>
   <li>Строка Списка первая</li>
   <li>Строка Списка вторая</li>
   <li>Строка Списка третья</li>
</ul>

Встречается код разряда:

Строка Списка первая<br/>
Строка Списка вторая<br/>
Строка Списка третья<br/ >

И таких неверных примеров большое количество.

Где не нужен br

Однако, если визуально можно достичь необходимого результата при помощи этого тэга, то почему бы его не использовать?

Ответ прост- этот тэг предназначен для переноса строки, а ни как не для создания списков и абзацев.

дизайн страницы сайта стоимость.

Верстка сайта, в котором часто встречается тэг  , показывает низкую квалификацию «мастера». Для формирования правильной структуры документов искушённый верстальщик может использовать значительное количество специализированных тэгов, среди которых <li>,  и так далее. А для добавления необходимых визуальных эффектов используют стили css.

Ранее этот тэг использовался, к примеру, при написании стихов, где требовался перенос строки при незаконченной мысли. Однако при желании можно обойтись без него и здесь. Для этого есть даже несколько вариантов, первый это задать с помощью CSS ширину блока, а второй это вместо тэга  использовать тэг <pre>.

Для тех кто не знает что такое тэг <pre>- это тег, добавляющий на страницу предформатированный текст. Это значит, что пробелы, переносы строки и т.д. внутри его сохраняются.

При желании мы можем использовать полезные свойства <pre> у самых рядовых абзацев воспользовавшись кодом:

p {
    white-space: pre;
}

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

Выводы

Если возникает необходимость в создании списка на вашей странице, то не стоит использовать тег   , для этого существуют теги <ul>, <ol>, <li>, а если вам не требуется отображение маркера списка, то не стоит возвращаться к злокачественному тегу, а просто стоит в css прописать list-style-type значение none. Например:
```
<ul>
 <li> Строка первая </li>
 <li> Строка вторая </li>
 <li> Строка третья </li>
</ul>
<style>
 li {
 list-style-type: none;
 }
</style>
```
При написании текста для формирования абзацев следует использовать тег . Ну, а если требуется создать некоторое расстояние между конкретными абзацами нам в помощь придёт CSS, с селекторами first-child, last-child, nth-child — для определения конкретного абзаца и свойствами padding, margin для задания необходимого отступа. Например:
```
Нам нужен какой-нибудь текст.
Который имеет несколько абзацев.
 
 
И перед последним должен быть большой отступ.
```
Не стоит делать этого так:
```
Нам нужен какой-нибудь текст. 
Который имеет несколько абзацев. 
 
 
И перед последним должен быть большой отступ.
```
Решение задачи просто. Во первых для каждого абзаца используем необходимый для этого тэг, и HTML код приобретёт вид:
```
 Нам нужен какой-нибудь текст.
 Который имеет несколько абзацев.
 И перед последним должен быть большой отступ.
```
А для создания необходимого промежутка между последним абзацем и текстом используем сss:
```
p:last-child {
 padding-top: 25px;
}
</li>
```
И последнее, для создания новой строки можно использовать вспомогательные элементы, к которым относятся  и <div>. Например:
```
Контакты:
(xx) xxx-xx-xx
(xx) xx-xx-xxx
bizonoff.net
vaden-pro.ru
```
Это можно сверстать:
```
<div>
Контакты:
(xx) xxx-xx-xx
(xx) xx-xx-xxx
bizonoff.net
vaden-pro.ru
</div>
```
Ну а для переносов строк добавляем CSS:
```
span {
 display: block;
}
```

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