Уроки HTML: «Основы языка разметки гипертекста»
Уроки HTML целесообразнее начинать с самого понятия «язык HTML» и его истории возникновения. HTML (Hyper Text Markup Language – язык разметки гипертекста). Он предназначен для разработки Web-страниц или документов HTML. Язык разметки гипертекста html представляет собой коллекцию управляющих - дескрипторов (или тегов), с помощью которых можно добавлять и форматировать элементы документа. Теги языка заключаются между 2-мя символами: <ТЕГ>. Установления необходимых дескрипторов недостаточно для полноценного отображения тех или иных элементов страницы. Именно по этой причине необходимо к дескрипторам устанавливать атрибуты, которые поддерживает соответствующий дескриптор. Обозреватели распознают дескрипторы (теги) HTML и преобразуют код документа в Web-страницу, отображаемую в окне обозревателя. Приложения обозревателей разрабатываются с учетом мировых стандартов языка HTML. Вопросами стандартизации языка занимается организация World Wide Web Сonsortium (W3C).
Рассматривая уроки по HTML, предполагается не скорейшее обучение и рассмотрение синтаксиса языка гипертекстовой разметки, а обязательное первоначальное упоминание о самой истории языка гипертекста. Поэтому начинаем также и с этого важного момента.
История языка HTML
Сеть World Wide Web появилась в 1989 году в Женеве, Швейцария. Тогда и был изобретен язык, ставший впоследствии основным языком разметки web-документов - HTML. Автором языка HTML является Тим Бернерс-Ли (Tim Berners-Lee). Он работал в сервисном компьютерном центре CERN над созданием системы, позволяющей научным центрам в разных частях мира обмениваться данными. Еще задолго до прихода в CERN в 1980 году им для личного использования была разработана система маркирования гипертекста Enquire – ранний прототип будущего HTML. Идея гиперссылок и URL – адресов в стиле структуры доменных имен была впервые реализована именно Тимом Бернерс-Ли.В любом уроке по HTML Вы встретите самую важную фразу - гипертекстовый документ содержит гиперссылки. Часто можно встретить, что текстовые гиперссылки на веб-странице выделяются цветом и подчеркиванием, но вообще это необязательно и не всегда так бывает. По своему назначению гиперссылки позволяют пользователю сайта быстро перейти к нужному документу в глобальной сети. Конечно это существенно облегчает людям поиск информации, разбросанной по всему Интернету.
Таким образом, технология гипертекста позволила связать всё множество опубликованных в сети Интернет документов в единую систему - WWW.
Вот так в кратком виде можно изучать уроки HTML и представить историю гипертекстового языка html.
Обучение HTML в виде серии уроков по языку, его основы, мы начнем со знакомства с базовыми элементами языка гипертекста. Поскольку я, прежде всего, предлагаю уроки html для начинающих, то необходимо начать с основы языка html - изучение его дескрипторов (или тегов). Это очень важно, т.к. без знания языка гипертекстовой разметки невозможно самостоятельно создать сайт, работая с html-кодом веб-странички. Ниже представлены базовые теги языка, наиболее часто используемые в заголовке Web-страницы:
- TITLE текст заголовка /TITLE - заголовок страницы, отображаемый в строке заголовка обозревателя (необходимо отметить, что наличие символа "/" перед тегом говорит о том, что осуществляется закрытие данного тега. Такие теги называются парными);
- META name=’параметр’ contents=’значение’> - непарный дескриптор (т.е. не имеет закрывающего тега), используемый для установки следующих метапараметров, заданных атрибутом name:
* author – имя автора;
* description – описание Web-страницы;
* keywords – ключевые слова Web-страницы. - SCRIPT…/SCRIPT - код сценария, выполняемый обозревателем автоматически во время загрузки Web-страницы.
В основном разделе Web-страницы (BODY…/BODY) содержится текст документа с дескрипторами, которые выполняют форматирование текста и добавление элементов Web-страницы. В этом разделена иногда используют дескриптор раздела заголовка - SCRIPT…/SCRIPT.
Блочным дескриптором является парный тег P…/P, отвечающий за абзац в тексте. Парный тег H3…/H3 является инструкцией для обозревателя, и означает заголовок третьего уровня (всего существует 6 уровней: от H1 до H6).
Гиперссылки являются одними из наиболее важных элементов Web-страниц. Можно сказать, что технология Web разрабатывалась именно ради гиперссылок. Удобная и удачно расположенная на Web-странице панель навигации позволяет посетителям сайта хорошо ориентироваться в нем.
Гиперссылки создаются с помощью парного дескриптора A…/A и соответствующего дескриптору атрибута HREF.
ПРИМЕР: A HREF=’адрес страницы’ текст гиперссылки /A (теги, конечно же, заключены в символы «< >»)
Как было уже отмечено ранее, при разработке этого образовательного интернет-ресурса с различными уроками, у меня не было цели подробно опубликовать весь учебный материал. Я лишь предлагаю Вам самое необходимое - изучая уроки html, ознакомиться с синтаксисом языка и базовыми понятиями. Более подробную информацию по всем другим тегам Вы сможете найти в учебниках и справочниках, которые я предлагаю скачать бесплатно с данного сайта по теме: сайтостроение или уроки по созданию сайта для начинающих.
Данный способ позволяет поэтапно усваивать весь материал, учит Вас работать с литературой и справочниками, а главное - у Вас не будет путаницы в голове от сразу большого объема учебного материала.
В качестве примера неплохой верстки с использование javascript + jQuery предлагаю посмотреть сайт www.decorativnoe-panno-iz-nitok.ru, на котором присутствует яркий дизайн и привлекательная галерея декоративных работ в виде каталога.
Ну а сейчас давайте перейдем ко второму уроку из раздела «Уроки HTML» - конструирование (вёрстка) web-страниц с помощью табличной и блочной верстки. Для этого перейдите по нижеприведенной ссылке:
Вёрстка веб-страниц