Знакомство с основами HTML
Здравствуйте дорогие друзья. HTML (Hyper Text Markup Language) расшифровывается как – «язык гипертекстовой разметки», описывающий форму отображения информации в браузере.
HTML – это основа сайта строения, его скелет, который каждый мало мальский web-программист знает. Язык HTML интерпритируется браузером (считывается) и отображается в виде документа, страницы в удобном для человека форме.
Для начало нужно указать браузеру тип документа – это строка не обязательна, но я вам советую ее постоянно указывать, чтобы не получилась неразбериха:
<!DOCTYPE html>
Подробнее про DOCTYPE(Данная статья еще не опубликована) можно прочитать здесь.
HTML состоит из тегов, тег формируется из двух скобок <> в которые заключено ключевое слово, например:
<html>Теги бывают двух видов это парные и одинарные– теперь, а каждом виде поподробнее:
Начнем с парных– это теги, которые имеют начало и конец, например:
<html></html>Как видно на примере первый тег <html> говорит интерпретатору что в этом месте начинается html, а второй </html>, что тут он заканчивается, они отличаются только тем что у закрывающего имеется обратный слеш, что символизирует конец этого тега. Получается своеобразный контейнер.
Одинарыне теги отличаются от парных тем, что просто не имеют закрывающие тег, например как <meta>.
У тега <meta> много разных типов, вам нужен знать основной это кодировка:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
В этой строке мы указываем кодировку нашей страницы, которая является utf-8. Кодировка нам нужна для того, чтобы сайт отображался правильно, допустим мы написали сайт на русском в Великобритании на английском во Франции на Французским и т.д. Для того чтобы браузер понимал, на каком языке отображать страницу мы указываем кодировку для России она выглядит так window-1251 или cp1251, utf-8 – это универсальная кодировка, которая учитывает многие языки. Но еще не стоит забывать, что и сама страница редактора где будите писать сайт, должна быть соответствовать данной кодировке, иначе просто за место букв вам браузер отобразит не понятные символы. Про кодировку подробно можно прочесть здесь.
Статья про мета-теги: http://ru.wikipedia.org/wiki/Мета-теги
Некоторые теги могут иметь параметры или атрибуты. Атрибуты указываются после имени тега через пробел формате атрибут="значение". Если параметров несколько, то они перечисляются через пробел, как можно увидеть предыдущим примере мета-тега:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
В этом примере атрибуту http-equiv тега <meta> присвоено значение Content-Type, а атрибуту content - значение text/html; charset=windows-1251.
Подробние про атрибуты можно прочитать тут(Эта статья еще не добавлена).
Пока не забыл хочу дополнить, чтоб вы лучше понимали структуру, теги могут вкладываться друг в друга. Например:
<p><i>Text></i></p>
При вложении тегов необходимо соблюдать последовательность их закрытия. Например, такой код использовать нельзя:
<p><i>Text></p></i>
Так же теги делятся на форматирующая теги, они отвечают за абзацы, картинки, заголовки. Они создают видимую часть страницы, второй тип это вспомогательные – в какой кодировке сделана страница, какой заголовок, подключение различных стилей и скриптов.
Область head предназначена для всех вспомогательных тегов, область body для всех форматирующих.
Вспомогательные теги содержат техническую информацию о странице и включают в себя заголовок, описание страницы, ключевые слова для поисковых машин, данные об авторе и т.д. Обязательным тегом является <title>.
Теперь я надеюсь вы уже имеете не большое представления о html и я вас не запутал, перейдем к основным тегом.
Первый из них это <html></html>, он является основным, им мы показываем интерпретатору, как я писал раннее, что находится внутри этих тегов уже является гипертекстом.
Следующий важный тег – это <head></head>, он тоже является парным, мы его пишем как вы уже могли догадаться внутри тега <html>, пример:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> </html>
Он переводится как голова, в нем в основном располагается настройки страницы, заголовки и т.д., об этом я уже расскажу чуть позже, поподробнее, а пока просто запомните, что он существует. Еще один интересный тег – это <title></title> мы им указываем заголовок страницы, он пишется в теге <head>, пример:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title></title> </head> </html>
И вот главный тег, к которому мы плавно подошли является <body></body>, он всегда располагается после <head>, пример:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body></body> </html>
Он переводится как тело, в нем мы и выполняем основные операции. Вот основные теги, которые вы должны знать обязательно, без них вы не сможете построить web-страницу. Чтобы узнать больше, то читайте другие мои статьи в данном разделе, до встречи друзья увидимся в следующей статье. :)
Дата создания: 06.06.2014 23:52:26
Автор: Максим Фёдоров
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.