Палки и плашки. О мусоре на странице.
Сегодня мне хотелось бы поговорить о различных декоративных элементах, излишняя любовь к которым может значительно ухудшить внешний вид макета.
Это палки и плашки.
Под палками я понимаю либо горизонтальные разделители (<HR>), которые были введены в спецификацию HTML в эпоху web1.0 (немногим позже вымирания динозавров, да-да) и предназначались для смысловой отбивки блоков текста (аналогично типографской линии, или звездочкам) друг от друга; либо css-свойство border (граница элемента), достаточно часто используемое не по назначению.
Примеры плохого использования палок:
Если на первой картинке вертикальную палку убрать совсем, а горизонтальные уменьшить раза так в четыре, картинке полегчает. А в таком виде она полна мусора.
Во второй картинке можно вообще убрать все вертикальные палки, станет только лучше. Я, честно признаться, не понимаю, зачем они там вообще, но видел и такие примеры верстки.
Почти такая же беда и с плашками:
Плашка, это элемент также предназначенный для смысловой отбивки небольшого блока текста. Применять их нужно весьма осторожно. Если увлечься, то получится ужас, показанный на картинках выше. Да-да, я и такое видел. И даже, когда-то, делал:-)
В случае первой картинки у нас огромная плашка под основным текстом давит на зрителя и приводит его в уныние. Ее можно с легким сердцем удалить, оставив только мелкую плашку под меню. Она позволяет визуально отделить меню от основного текста и акцентирует на нем внимание зрителя.
В случае второй картинки от плашек надо вообще отказаться, обыграв визуальную отбивку блоков друг от друга более плотным межстрочным интервалом (line-height) и более разреженными отступами блоков друг от друга.
Я показал всего четыре достаточно простых примера, но если вы немного подумаете, вы легко сможете сами понять в каких еще случаях палки плашки могут мешать, а в каких – наоборот, – пригодиться. При условии соблюдения правильного баланса ваши макеты всегда будут легкими и изящными.
В тему: