Урок HTML.
Урок - 1.
Что же такое HTML? HTML - это язык разметки гипертекста. Тоесть простыми словами - как и куда сделать этот элемент. Заметьте что HTML это не язык программирования!
(HTML - HyperText Markup Language)
Как же создаётся код HTML?
Всё начинается с создания файла в формате .html (name.html). Далее открываете любой текстовой редактор, но советую скачать новичкам NotePad++.
Это текстовой редактор для более чем 100 языков программирования а также для HTML и тупо как блокнот.
Для более продвинутых советую 2 редактора. Это бесплатный текстовой редактор написанный на html и js - Brackets. Этот редактор сделала компания Adobe и по качеству он очень хорош.
Также есть более продвинутый редактор под название Dreamweaver by Adobe. Этот уже входит в пакет Adobe Creative и он платный по подписке, но Йо-Хо-Хо и на раздачу!
Такс, если мы разобрались с редактором то начинаем писать сам код.
В старый версиях HTML код начинается с множества символов и букв.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> - Код в старых версиях HTML. Правда непонятно?
А давайте попробуем HTML5! <!DOCTYPE html>. Лучше, правда? - Правда)
Что же такое этот DOCTYPE? Это даёт браузеру или редактору информацию о том что это код HTML, а не другой.
Затем идёт так называемая 'Модель'. Она выглядит как семейной дерево.
<html>
<head>
</head>
<body>
</body>
</html>
Давайте разберём что такое head, body, html. Это всё - теги. Теги это мозг HTML. Например в тег <html> следует писать код внутрь тега <html>.
<head> это невидимая часть кода. Например название сайта в поисковой системе и в окне браузера.
<body> это видемая часть кода, там можно писать текст, картинки, заголовки, цитаты и многое другое.
А зачем два этих тега? body и /body. /ТЕГ закрывает тег, чтобы например в тег head не попали элементы <body>
Надеюсь вы разобрались с началом кода и нашего путешествия в мир вёрстки.
И так, начнём изучать теги и что в них писать.
в <head> мы пишем настройки для страницы. И так первый наш тег - <title>. Он задаёт имя сайту, для окна браузера и в поисковой системе.
Пример: <title>Я учу HTML!</title>.
Следующий тег - <meta>. Он задаёт описание, ключевые слова, кодировку и многое другое странице.
Например <meta name="charset" content="utf-8"> Это означает что тип meta будет кодировка. А content задаёт значение - utf-8 самая распорстанёная кодировка в мире.
Самые важные meta:
<meta name="description" content="Описание"> Это описание страницы для поисковых систем.
<meta name="Keywords" content="Ключевые слова"> Это ключевые слова страницы. Раньше по ним поисковые системы искали сайты. Как сейчас никто не знаете.
<meta name="charset" content="кодировка"> Кодировка страницы.
И так, дальше. Тег <link>. В конце этого тега НЕ пишется </ТЕГ>, такие теги называются одиночные. Тег link подключает CSS, JavaScript, иконка для сайта.
Он пишется так - <link href="ССЫЛКА" rel="ТИП"> rel задаёт тип link. Например для CSS rel будет rel="stylesheet". А href="" задаёт ссылку на файл. Также можно подключить файл из интернета.
Также можно подключить иконку для поисковых систем и другие фишки.