Материал предоставлен https://it.rfei.ru

Пробелы

Верстальщики вебстраниц часто добавляют дополнительные пробелы в код или даже помещают некоторые элементы на новые строки с целью повышения удобства читаемости кода.

Когда браузер встречается с двумя или более пробелами, идущими друг за другом, он отображает только один. Аналогично он поступает и с переносом строки, воспринимая его как единичный символ пробела. Данное свойство браузеров известно как «сворачивание пробелов».

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

  • <html>
    <head>
    <title>Термины</title>
    </head>
    <body>
    <h1>
    Термины, используемые при съемке фильмов
    </h1>
    <h2>
    Трансфокация
    </h2>
    <p>Плавный наезд на объект съемки или отъезд от него камерой
    </p>
    <h2>
    Интерлюдия
    </h2>
    <p>
    Короткая вводная сцена или последовательность сцен, появляющаяся в фильме, но не обязательно связанная с основным сюжетом
    </p>
    </body>
    
    </html>
    
  • <html>
    <head>
        <title>Термины</title>
    </head>
    
    
    <body>
        <h1>Термины, используемые при съемке фильмов</h1>
    
    
        <h2>Трансфокация</h2>
    
    
        <p>Плавный наезд на объект съемки или отъезд от него камерой</p>
    
    
        <h2>Интерлюдия</h2>
    
    
        <p>Короткая вводная сцена или последовательность сцен, появляющаяся в
        фильме, но не обязательно связанная с основным сюжетом</p>
    </body>
    </html>
    


Как вы можете видеть, структурированный код намного проще для восприятия и редактирования.

Существуют специальные сервисы, которые приводят ваш код в порядок. Например, dirtymarkup.com или СodeBeautify. В них вы можете ввести ваш «грязный» код, и сервис его «очистит», то есть расставит элементы в порядке их иерархичности.

Подстрочные и надстрочные знакиПеревод строк и горизонтальные линии