Створення шаблону HTML5 для блогу

Вже настав час використовувати семантичні теги розмітки HTML5 при створенні сайтів. Консорціум W3C вивчив більше мільярда веб-сайтів і виявив, що ідентифікатори і класи, що найчастіше зустрічаються, це footer (підвал), header (шапка), menu (меню), content (вміст), title (назва) і nav (навігація). Семантична розмітка елементів HTML5 може передати їхню мету розробникам, браузерам та пошуковим роботам.

шаблону

HTML5 перестав підтримувати атрибут type:

У HTML5 слід уникати наступних тегів та атрибутів:

Верстка веб-сайту ділиться на чотири горизонтальні частини: Header, Nav, Section (розділ) та Footer:

КодHTML

створення

КодCSS

Тепер працюємо з невпорядкованим списком тега

    :

КодCSS

Основний розділ розділений на дві вертикальні частини: розділ статей та окрему бічну панель:

створення

КодCSS

Назва статті тут найбільш важлива та найвищого рівня, так що вона має бути у тезі

шаблону

Головна сторінка

На цій сторінці буде багато назв статей з невеликими описами, щоб читач міг швидко знайти потрібну інформацію. Стандарти W3C визначають використання тега

шаблону

створення

КодHTML

Тепер цей код добре працює і з ранніми версіями браузера Internet Explorer.

Зверніть увагу: Modernizer не підтримує властивості CSS, записані в HTML-коді.

style.css

Остаточний варіант кодуCSS

Зверніть увагу: Modernizer не підтримує властивості CSS, записані в HTML-коді.

Автор урокуSrinivas Tamada