| Записи в блоге | ||||||
| |
Разметка страницы |
| Ничто не стоит в этом мире на одном месте, и языки программирования не являются исключением из этого правила. Мы приближаемся к новой эре web-программирования семимильными шагами, даже несмотря на хвост из устаревших версий браузеров, не поддерживающих новую специфику языка HTML 5. И, хоть современный разработчик еще не может себе позволить в полной мере использовать при создании сайта разметку согласно HTML 5, но знать основы и следить за ситуацией по развитию и обновлению браузеров, он просто обязан. В связи с этим начинаю цикл статей, посвященных новой версии всеми известного и любимого языка создания сайтов - HTML 5 (англ. HyperText Markup Language, version 5). Первый черновик спецификации стал доступен широкой общественности 22 января 2008. Спецификация сейчас находится в разработке и может находиться в этой стадии ещё несколько лет, хотя предполагается, что отдельные части HTML 5 будут закончены и реализованы в браузерах до того, как спецификация официально получит статус рекомендации. И для начала поговорим об основных элементах разметки html - страницы. 1 DOCTYPE.Не может не радовать новая запись старого тега DOCTYPE. Отныне не нужно будет открывать сохраненные файлы и копировать сохраненный тег оттуда. Теперь он пишется просто и понятно: <!DOCTYPE html> "Почему не html5" ?, - спросите Вы. Ответ на данный вопрос прост: как выяснилось, DOCTYPE HTML5 не принимается Internet Explorer 6, тогда как сам документ, составленный в HTML5 и с правильным DOCTYPE отображается правильно. Говоря проще, IE6, как обычно, подкачал... 2 Новые элементыНовые элементы привлекают наше внимание с первого взгляда. Спецификация W3C на самом деле прислушалось к мнению общественности и ввела большое количество новых в рассчете на будущее. Теперь у нас будет все, начиная с простых структурных элементов, которые обещают стать мощными API и обеспечить нас достаточной свободой для создания новых приложений и при этом уйти от необходимости использовать флэш при отображении видео и мультипликации, что в свою очередь приведет к разгруженности страницы. 2.1 Элемент <header>Элемент header предназначен для отображения всей вводной информации, типа лготипа, названия сайта и тому подобное. 2.2 Элемент <nav>Элемент nav содержит ссылки на другие разделы сайта или страницы. Не нужно все ссылки заключать в эти тэги, только основную навигацию. 2.3 Элемент <section>Этот тэг заключает в себе динамический контент или программное приложение. То же самое делает div, но section отделяет целый кусок документа. 2.4 Элемент <article>Отделяет кусок страницы, текст, который может стоять отдельно, например, блоговский пост, форумное сообщение, комментарий пользователя или любая независимая от остального контента статья. 2.5 Элемент <aside>Элемент aside содержит контент, относящийся к основному содержимому страницы. Как правило, это боковые колонки, где размещаются ссылки на похожие материалы, облака тэгов и т.п. Могут также содержать выносы – цитаты из текста. 2.6 Элемент <footer>Используется для отделения «подвала», не только всей страницы, но и любого ее раздела. Так что этот элемент вы, скорее всего, будете использовать на странице несколько раз. На первый взгляд кажется, что эти новые элементы делают то же самое, что обычные <div id>, но если div id с уникальным именем может использоваться на странице только один раз, эти элементы ведут себя также, как привычные нам тэги <p>, <h1> и прочие, и их можно использовать на странице столько раз, сколько необходимо. Элементы header и footer не просто отделяют шапку и подвал страницы, но определяют шапку и подвал каждого элемента на ней, как делают в таблицах thead и tfoot. Преимущество новой разметки в том, что она семантически определяет элементы страницы (легче ориентироваться в коде). Однако, использовать ее нужно с умом, иначе легко переборщить. Иллюстрацию к рассмотренным в статье тегам вы видели в начале статьи. Разметка страницы
Код кино Разметка страницы
для сайта . html-cсылка для сайта или блога . BB-cсылка для форума . |
| .: Новости IT :. | ||||
|
|