Язык HTML
Мой первый сайт


HTML - это гипертекстовый язык разметки, на котором создаётся абсолютное большинство страниц в Интернете. Его знание необходимо абсолютно любому Web-мастеру, причём совершенно не важно, как Вы создаёте сайты: абсолютно с нуля или же с помощью какого-нибудь инструмента. И в первом, и во втором случае Вы будете использовать язык HTML.


Сам язык HTML состоит из множества элементов, так называемых тегов HTML. Каждый тег HTML выполняет свою задачу: одни вставляют ссылку, другие картинку, третьи создают таблицы для выравнивания других тегов, четвёртые позволяют делать отдельные блоки на странице, - все эти элементы Вы будете использовать при создании своих сайтов.


Также не так давно появился HTML 5. Это расширенный стандарт языка гипертекстовой разметки. В него вошло множество новых элементов, расширяющих возможности Web-мастеров, с которыми мы тоже познакомимся.
Ладно, пора приступать к созданию нашего с Вами первого сайта.


Первое, что нужно решить: где создавать сайт? Разумеется, можно и в обычном Блокноте. Но мы лучше будем использовать что-нибудь "потяжелее" - редактор "Notepad++".
Устанавливаем и запускаем редактор. Сразу сохраняем страницу под именем "index.html".


Теперь пишем (пожалуйста, напишите, а не скопируйте!) в окне редактора:


<html>
<head>
</head>
<body>
</body>
</html>


Написали? Сохранили? Поздравляю Вас, Вы только что создали самую простую (но очень важную!!!) HTML-страницу! Теперь можно нашу страницу открыть в браузере. Так и поступим.


Что-нибудь видите? Скорее всего, нет. И это неудивительно, ведь это самая элементарная страница.


Но Вы можете посмотреть исходник страницы. Для этого в меню "Вид" выберите пункт меню "Просмотр HTML кода", "Исходный код страницы" или что-то в этом духе, в зависимости от Вашего браузера. Также можно просто нажать CTRL-U (в большинстве браузеров откроется исходный код страницы), и Вы увидите Ваш код.


Вернемся к нашему редактору и немного добавим текста на нашу страничку:


<html>
<head>
</head>
<body>
Привет! Меня зовут Светлана, можете меня называть также Букля :)
</body>
</html>


Еще раз сохраним документ и обновим его в браузере.
А теперь давайте обсудим, что мы здесь написали.


<html>, <head>, <body> - это открывающие теги. Иногда их ещё называют дескрипторы.


</html>, </head>, </body> - это закрывающие теги.


Теги бывают парные и одиночные.
Парные теги - это теги, которые нуждаются в закрывающем (то есть все три тега, которые мы использовали являются парными).


Одиночные теги - это теги, которые не требуют наличия закрывающего тега.


Теперь, что касается назначения данных тегов:


Тег <html> означает начало HTML-документа.
Тег <head> означает начало заголовка HTML-документа. Сюда могут входить, например, заголовок страницы, различные мета-теги. Обо всём об этом погорим чуть ниже.
Тег </head> означает конец заголовка HTML-документа.
Тег <body> означает начало самого документа. То есть всё (текст, картинки, ссылки и т. д.), что Вы видите на страницах в Интернете - всё расположено в теге <body>.
Тег </body> означает конец содержимого документа.
Тег </html> означает конец HTML-страницы.


Теперь давайте немного добавим в нашу страницу кода, уж, больно она примитивная у нас пока. Внутри тега <head> добавьте такой код:


<title>Личная страница</title>
<meta http-equiv="Content-type" content="text/html" charset="windows-1251">


Тег <title> определяет заголовок страницы, который будет отображён в заголовке окна браузера.
Тег <title> сообщает, что здесь заголовок заканчивается.
Что касается тега <meta>, то здесь сначала познакомимся с понятием атрибутов тегов.
У тегов могут быть различные атрибуты, определяющие их свойства, например, вид их содержимого.


Атрибуты ставятся внутри открывающего тега и имеют следующий вид: Название = "значение".


Тег <meta> у нас определяет тип содержимого документа.
Атрибут http-equiv и его значение Content-type определяет, что сейчас будет описан тип документа.
Атрибут content и его значение text/html сообщают браузеру, что данный документ является HTML-документом (text/html).
Атрибут charset и его значение windows-1251 сообщают браузеру, что кодировка этого документа - кириллица (windows-1251).


Это был пример мета-тегов.


Основа: http://myrusakov.ru/


Вводное занятие «Как создать свой сайт». Язык HTML. Заголовки. Атрибуты цвета тэга body.


comments powered by Disqus