Разработка WEB-страницы. Структурные элементы страницы
Базовый SEO HTML шаблонСтруктурные элементы страницы<!DOCTYPE html> <!--конструкция, указывающая версию языка: HTML5--> <html> <head> <!--Тег head (голова) предназначен для хранения элементов, помогающих браузеру в работе с данными--> <title>Структурные элементы</title><!--Заголовок страницы--> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!--Кодировка страницы--> <meta name="description" content="Шаблон страницы." /> <meta name="keywords" content="ключевые слова: шаблон, структура, web-страница" /> <!--Список ключевых слов для поисковиков--> <link rel="stylesheet" href="css/style.css"> <!--Ссылка на таблицу стилей--> </head> <body> <header> <!--шапка сайта--> <h1>Самый лучший сайт делаем сейчас!</h1> </header> <nav><!--навигация: включает ссылки на другие страницы или навигацию по текущей странице.--> <table> <tr> <td> <a href="#">Ссылка 1</a> </td> <td> <a href="#">Ссылка 2</a> </td> <td> <a href="#">Ссылка 3</a> </td> </tr> </table> </nav> <main> <!--выделяет основное содержание страницы, которое не повторяется на других страницах. И обычно на странице используется один <main>--> <article><!--центральный контент--> <h1>Статья</h1> <!--Заголовок 1 уровня--> <figure><!--Контейнер картинки, изображения--> <img src="html5.jpg" alt="html5" /> <!--Вставка картинки, изображения--> <figcaption>Подпись картинки, изображения</figcaption> </figure> <section> <!--обозначает крупный текстовый или смысловой (или «логический») блок--> <h2>Заголовок 2 уровня</h2> <p>Текст статьи_1...</p> <p>Текст статьи_2...</p> </section> <section> <h2>Заголовок 2 уровня</h2> <p>Текст статьи...</p> <p>Отмечу, что <mark>HTML5 - важная технология</mark>.</p> </section> <aside> <!--дополнительное содержание, не связанное напрямую с основным, "сайдбар".--> Место для отдельной информации, ... </aside> <aside> Место для отдельной информации, ... </aside> </article> <article> <h1>Видео</h1> <video width="800" controls="controls" autoplay="autoplay"> <source src="Stroky_Python_urok_3_10.ogv" type="video/ogg" /> <source src="Stroky_Python_urok_3_10.mp4" type="video/mp4" /> <source src="Stroky_Python_urok_3_10.webm" type="video/webm" /> </video> </article> </main> <footer>#школьная ИНФОРМАТИКА. Copyright ©2019-2021. Все права защищены</footer> <!--Подвал сайта--> </body> </html>
Курс