Вообще-то, язык HTML не является языком программирования. Это язык разметки гипертекста (HyperText Markup Language). Т.е. называть его «языком HTML» не верно.
Если говорить проще, то HTML — это список тегов (управляющих слов), которые позволяют представить обычный текст в форматированном виде. Например, выделить егожирным, или курсивом и т.д. Но представить так текст можно только в специальных программах — браузерах (программы, с помощью которых ты бродишь по Интернету).
Они отображают только отформатированный текст и скрывают теги HTML, которые применялись для форматирования. Чтобы тебе было понятней, о чем я говорю, щелкни правой кнопкой мыши по этой странице и в открывшемся меню выбери пункт «Исходный код» или что-то подобное. Перед тобой откроется эта страница в своем настоящем виде.
Создавать код HTML можно как в обычных текстовых редакторах, так и использовать специальные программы, так называемыевизуальные редакторы. Визуальные редакторы отличаются от текстовых тем, что заточены под набор кода HTML, CSS, JavaScript, PHP и др., т.е. под web-программирование. Кроме того, они позволяют сразу же просмотреть плоды своих трудов во встроенном браузере и подсвечивают некоторые ошибки в набранном коде.
Настоятельно рекомендую набирать весь код руками (для улучшения прямоты этих самых рук), визуальные редакторы же значительно облегчают этот процесс. Лично я пользуюсь Macromedia Dreamweaver 8. Это далеко не самая последняя версия, но её возможностей мне хватает с избытком.
Я поступаю так: набираю код в Dreamweaver, затем сохраняю и нажимаю кнопку «Просмотр в браузере» (список браузеров в этом меню ты редактируешь сам), после возвращаюсь в Dreamweaver и продолжаю редактирование. Здесь русификатор для Macromedia Dreamweaver 8. Это то, что касается инструментов, теперь перейдем непосредственно к тегам HTML.
Начнём со строения html-страницы, вернее с её основных тегов.
Обязательные теги HTML-страницы
К обязательным (основным) тегам HTML, которые используются в каждом html-документе, относятся следующие:
< HTML>
< HEAD>< /HEAD>
< BODY>< /BODY>
< /HTML>
Для того, чтобы браузер выводил код HTML как текст (не интерпретировал его в код), после каждой открывающей угловой скобки «<» я оставляю пробел. Ты, когда будешь набирать код, пробелы НЕ ОСТАВЛЯЙ.
Как видишь, все теги парные (есть открывающий тег и закрывающий), в HTML почти все теги такие. Отличаются открывающий тег от закрывающего тем, что перед закрывающим стоит косая черта «/». Такие теги ещё называют контейнерными, потому что между ними можно вставить другие теги, т.е. поместить в контейнер. Ты и сам можешь видеть, что между тегами < html> и < /html> находятся другие теги.
Набирать имена тегов можно как заглавными буквами, так и прописными, разницы нет никакой. Т.е. записи вида < HTML> и < html> для браузера различий не имеют и интерпретируются одинаково. Теперь поговорим поподробнее о том, что означают эти теги.
Так, основные теги < HTML> и < /HTML> показывают браузерам и другим программам для просмотра гипертекстовых страниц, что они как раз и имеют дело с гипертекстовым документом. Любой html-документ должен начинаться с < HTML> и заканчиваться < /HTML>. Т.е. между этими тегами находится ВЕСЬ код html-страницы.
Между тегами < HEAD> и < /HEAD> находятся мета-теги (заголовок страницы, описание, ключевые слова и т.д.). В них хранится информация об html-странице и технические сведения. Вообще, данный тег не является обязательными, т.е. без него html-документ будет нормально отображаться браузерами. Но даже, если ты не планируешь использовать область заголовка, то напиши хотя бы просто < HEAD> < /HEAD>. Это нужно для совместимости между различными версиями программ.
Все сведения, находящиеся между тегами «HEAD», никак не отображаются браузером (за исключением информации между тегами < TITLE> < /TITLE>, где расположено название html-документа, выводимое в верхней панели браузера). Но могут оказывать большое влияние на вид html-страницы, её жизнь в Интернете и ранжирование поисковыми системами. Подробнее о тегах, которые располагаются в заголовке гипертекстового документа, мы поговорим позже.
Основное содержимое html-документа располагается между тегами < BODY> и < /BODY>. Здесь находится всё, что мы видим, когда открываем html-страницу: текст, графика, меню, кнопочки и т.д. Это основное «тело» страницы.
Все остальные теги, использующиеся при создании html-документа, находятся между (т.е. внутри) этими обязательными тегами. Практически все теги html имеют различные атрибуты, свойства и параметры, которые позволяют отобразить информацию именно так, как задумал разработчик. Например, если ты напишешь:
, то фон всей страницы будет красным.
Здесь тег < BODY> — это, собственно, тег; bgcolor — его атрибут; "#FF0000" — значение атрибута (у тега может быть несколько атрибутов).
Все атрибуты тега и их значения указываются в открывающем теге (тот, который без косой черты), но ни в коем случае не в закрывающем.
Итак, мы разобрались с основными тегами html-документа. Теперь настало время более подробно изучить остальные. Здесь я хочу сделать небольшое отступление.
Как я предлагаю изучать HTML
Применяя на практике знания, полученные из различных руководств по основам HTML, я понял, какую ошибку допустило большинство авторов этих книг и самоучителей. Все эти учебники, во-первых, предназначены новичкам, во-вторых, изучение основ HTML идет в них по порядку.
Т.е. сначала рассматриваются теги заголовка html-документа (< HEAD>< /HEAD>, а потом теги «тела» (< BODY>< /BODY>).
Основываясь на собственном опыте, смею утверждать, что такой порядок изучения основ HTML для новичка категорически неприемлем. Новичок предпринимает попытку изучить все эти многочисленные и малопонятные ему теги заголовка, во-первых, не видя результатов своего обучения (напомню, теги заголовка браузером не отображаются). А во-вторых, даже не подозревая, что большинство этих тегов для создания задуманного им сайта не понадобятся (по крайней мере, в начале работы).
Таким образом, он только теряет время и желание продолжать изучение HTML. При этом утверждаясь во мнении, что создать сайтмогут только «гуру» за хорошие деньги. Я бы тоже бросил это занятие, если бы не наплевал на то, что мне пока непонятно и не пошел дальше.
Поэтому, я предлагаю тебе сначала рассмотреть теги, относящиеся к «телу» html-документа (< BODY>< /BODY>), а уж затем переходить к остальным. Тем более, что в «теле» html-страницы и содержится информация, за которой будут приходить посетители сайта. А создать или найти её гораздо сложнее, чем написать код.
Ну что же, теперь, не мешкая ни минуты, жми кнопку «Дальше» и продолжи узнавать, как эти небритые и невыспавшиеся дядьки создают сайты.