Архивы материалов Март 2010

Как укротить блоки

Рано или поздно каждый начинающий верстальщик сталкивается с необходимостью верстать блоками. Это диктуют нам не столько тенденции моды, сколько устройство современных CMS и фрэймворков.

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

<body>
<!-- Хэдер в отдельной таблице -->
 <table>
  <tr>
   <td>
    HEADER
   </td>
  </tr>
 </table>
<!--// Хэдер в отдельной таблице -->
<!-- Контент и меню в отдельной таблице -->
 <table>
  <tr>
   <td>
    LEFT MENU
   </td>
   <td>
    CONTENT
   </td>
   <td>
    RIGHT MENU
   </td>
  </tr>
 </table>

Структура HTML. Часть 3: виды вёрстки — табличная и блочная

Этот обзор-статья повествует об актуальных на сегодняшний день видах вёрстки. Здесь можно выделить следующие направления:

  1. Блочная — опора контента, или каркас, формируемый из элементов <div>. (Еще её называют "дивной";)
  2. Табличная — структуру сайта определяют таблицы, строки и столбцы: <table> <thead> <tr> <td>
  3. Комбинированная — симбиоз таблиц и блоков.

Табличная вёрстка

Структура HTML. Часть 2: секция

В прошлой части мы рассмотрели документа и узнали о предназначении и важности элемента <!DOCTYPE ...>.

В этой статье подробно рассмотрим <head> секцию. Её еще принято называть "головой" документа.

Вспоминаем нашу схемку:head-секция в структуре html документа

История развития HTML.

На самом деле, HTML - не первый язык разметки. Ему предшествовал так называемый SGML, разработанный международной организацией по стандартизации ISO в далёком 1986 году.

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

Вступление. Как работать и в чём

Рассмотрим soft, который нам понадобится.

  • Качественный текстовый редактор с подсветкой синтаксиса.
  • FTP - менеджер
  • Быстрый стандартизированный браузер.

В качестве текстового редактора я рекомендую использовать PSPad. Он бесплатный и достаточно функциональный. Скачать можно с официальной страницы разработчика. Верстать, конечно, можно и в блокноте, но это неоправданная трата времени и заведомо много недочетов. Тем более, что в блокноте довольно ограниченное количество поддерживаемых кодировок.