История создания языка html. Описание языка HTML. Как подключить HTML страницу внутри другой страницы
Большая часть современных интернет технологий основана на давно используемом, самом дискутируемом языке HTML. Он был разработан для выполнения разметки и оформления документов, размещаемых на веб-страницах. Свои первые черты язык начал обретать в 1986 году. Толчком стало принятие Международной организацией по стандартизации (ISO) ISO-8879-стандарта - Standard Generalized Markup Language или, в сокращенном варианте - SGML. К нему прилагалось описание, в котором говорилось о том, что SGML предназначен для структурной разметки текста. Примечательно, что описания внешнего вида документа не предполагалось.
Исходя из этого, можно сделать вывод о том, что SGML не являлся системой для разметки текста и не располагал какого-либо списка структурных элементов языка, используемых в определенных условиях. Язык подразумевал описание синтаксиса написания главных элементов разметки. Спустя некоторое время они получили, хорошо известное сегодня название - «теги».
Вполне очевидной была потребность в создании языка, который:
- Описывал какой элемент в каких случаях разумно применить
- Содержал перечень элементов, с помощью которых можно создать документ, читаемый разными программами
Несмотря на то, что язык SGML, как и его схожие приложения, не получил особого развития, он и не был окончательно забыт. В 1991 году Европейский институт физики частиц объявил о необходимости разработки механизма, позволяющего передавать гипертекстовую информацию через Глобальную сеть. Именно SGML лег в основу будущего языка - Hyper Text Markup Language (HTML).
Этапы становления.
Около сорока тегов содержал HTML версии 1.2. Описания физического представления документов также не имелось. Как и его прародитель - SGML, он был преимущественно ориентирован на логическую и структурную разметку текста. Впрочем, некий намек на то, как будет физически представлена страница, ряд тегов все же делал.
Разработкой HTML версии 2.0 занялся консорциум W3С. Первый результат удалось получить, спустя год насыщенной работы - в 1995 году. Практически параллельно обсуждались возможности версии 3.0. Если вторую версию нельзя назвать существенно отличающейся от первой, то третья стала безусловным прорывом.
HTML 3.0 включал интересные новинки:
- Разметку математических формул
- Теги для создания страниц
- Вставку рисунков, обтекаемых текстом
- Примечаний и т.д.
Однако, этого было недостаточно, потребность в визуальном оформлении гипертекстовых страниц становилась все более актуальной. Тогда, W3С приступили к созданию самостоятельной системы, при этом не противоречащей основам HTML, но позволяющей описывать визуальное оформление документов. Результатом стало появление CSS - Cascading Style Sheets, иерархические стилевые спецификации, наделенные уникальным синтаксисом, структурой, задачами.
Но, не будем забегать вперед, и вернемся к HTML. Существенное расширение тегов произошло с подачи Netscape Communications - корпорации, запустившей первый коммерческий браузер - Netscape Navigator. Нововведения преследовали лишь одну цель - улучшить внешний вид документа, но при этом они совершенно противоречили исконным принципам языка.
HTML версии 3.2 создали в кратчайшие сроки. Он был ориентирован на Microsoft Internet Explorer. До недавнего времени эта версия HTML была единственным стандартом языка при . Тем не менее, направление развивается очень активно, с помощью HTML удалось придать некую упорядоченность элементам разметки всех браузеров, но возможностей языка становилось недостаточно.
В 2004 году приняли новую версию HTML - 4.01. Он обеспечивает отличные показатели кросс - браузерности и кросс - платформенности.
Почему же сегодня все чаще используется CSS? Потому что HTML, не смотря на свои существенно расширившиеся с момента создания возможности, остается языком логической разметки гипертекста, т.е. не связан с оформлением документа. Современные стандарты интернета подразумевают создание ярких и запоминающихся страниц, поэтому веб-мастера все чаще используют CSS. Можно ли ставить точку в истории HTML? Ответ на этот вопрос будет, скорее положительным, но полностью язык не исчезнет, т.к. он лежит в основе многих других систем.
Основы HTML содержат основные правила языка HTML, описание структуры HTML-страницы, отношения в структуре HTML-документа между HTML-элементами.
HTML-документ - это обычный текстовый документ, может быть создан как в обычном текстовом редакторе (Блокнот) , так и в специализированном, с подсветкой кода (Notepad++, Visual Studio Code и т.п.) . HTML-документ имеет расширение.html .
HTML-документ состоит из дерева HTML-элементов и текста. Каждый элемент обозначается в исходном документе начальным (открывающим) и конечным (закрывающим) тегом (за редким исключением).
Начальный тег показывает, где начинается элемент, конечный - где заканчивается. Закрывающий тег образуется путем добавления слэша / перед именем тега: … . Между начальным и закрывающим тегами находится содержимое тега - контент.
Одиночные теги не могут хранить в себе содержимого напрямую, оно прописывается как значение атрибута, например, тег создаст кнопку с текстом Кнопка внутри.
Теги могут вкладываться друг в друга, например,
Текст
. При вложении следует соблюдать порядок их закрытия (принцип «матрёшки») , например, следующая запись будет неверной:Текст
.HTML-элементы могут иметь атрибуты (глобальные, применяемые для всех HTML-элементов, и собственные). Атрибуты прописываются в открывающем теге элемента и содержат имя и значение, указываемые в формате имя атрибута="значение" . Атрибуты позволяют изменять свойства и поведение элемента, для которого они заданы.
Каждому элементу можно присвоить несколько значений class и только одно значение id . Множественные значения class записываются через пробел, . Значения class и id должны состоять только из букв, цифр, дефисов и нижних подчеркиваний и должны начинаться только с букв или цифр.
Браузер просматривает (интерпретирует) HTML-документ, выстраивая его структуру (DOM) и отображая ее в соответствии с инструкциями, включенными в этот файл (таблицы стилей, скрипты). Если разметка правильная, то в окне браузера будет отображена HTML-страница, содержащая HTML-элементы - заголовки, таблицы, изображения и т.д.
Процесс интерпретации (парсинг) начинается прежде, чем веб-страница полностью загружена в браузер. Браузеры обрабатывают HTML-документы последовательно, с самого начала, при этом обрабатывая CSS и соотнося таблицы стилей с элементами страницы.
HTML-документ состоит из двух разделов - заголовка — между тегами … и содержательной части — между тегами … .
Структура веб-страницы 1. Структура HTML-документаЯзык HTML следует правилам, которые содержатся в файле объявления типа документа (Document Type Definition, или DTD) . DTD представляет собой XML-документ, определяющий, какие теги, атрибуты и их значения действительны для конкретного типа HTML. Для каждой версии HTML есть свой DTD.
DOCTYPE отвечает за корректное отображение веб-страницы браузером. DOCTYPE определяет не только версию HTML (например, html), но и соответствующий DTD-файл в Интернете.
...
Элементы, находящиеся внутри тега , образуют дерево документа, так называемую объектную модель документа, DOM (document object model) . При этом элемент является корневым элементом.
Рис. 1. Простейшая структура веб-страницы
Чтобы разобраться во взаимодействии элементов веб-страницы, необходимо рассмотреть так называемые «родственные отношения» между элементами. Отношения между множественными вложенными элементами подразделяются на родительские, дочерние и сестринские.
Предок - элемент, который заключает в себе другие элементы. На рисунке 1 предком для всех элементов является . В то же время элемент является предком для всех содержащихся в нем тегов: ,
, , и т.д.
Потомок - элемент, расположенный внутри одного или более типов элементов. Например, является потомком , а элемент
Является потомком одновременно для и .
Родительский элемент - элемент, связанный с другими элементами более низкого уровня, и находящийся на дереве выше их. На рисунке 1 и . Тег
Является родительским только для .
Дочерний элемент - элемент, непосредственно подчиненный другому элементу более высокого уровня. На рисунке 1 только элементы , ,
И являются дочерними по отношению к .
Сестринский элемент - элемент, имеющий общий родительский элемент с рассматриваемым, так называемые элементы одного уровня. На рисунке 1 и — элементы одного уровня, так же как и элементы , и
Являются между собой сестринскими.
1.1. Элемент 1.2. ЭлементРаздел ... содержит техническую информацию о странице: заголовок, описание, ключевые слова для поисковых машин, кодировку и т.д. Введенная в нем информация не отображается в окне браузера, однако содержит данные, которые указывают браузеру, как следует обрабатывать страницу.
1.2.1. ЭлементОбязательным тегом раздела является тег . Текст, размещенный внутри этого тега, отображается в строке заголовка веб-браузера. Длина заголовка должна быть не более 60 символов, чтобы полностью поместиться в заголовке. Текст заголовка должен содержать максимально полное описание содержимого веб-страницы.
1.2.2. ЭлементНеобязательным тегом раздела является одинарный тег . С его помощью можно задать описание содержимого страницы и ключевые слова для поисковых машин, автора HTML-документа и прочие свойства метаданных. Элемент может содержать несколько элементов , потому что в зависимости от используемых атрибутов они несут различную информацию.
Описание содержимого страницы и ключевые слова одновременно можно указывать на нескольких языках, например, на русском и английском:
С помощью тега можно запретить или разрешить индексацию веб-страницы поисковыми машинами:
Для автоматической перезагрузки страницы через заданный промежуток времени нужно воспользоваться значением refresh:
Страница будет перезагружена через 30 секунд. Чтобы перебросить посетителя на другую страницу, нужно указать URL-адрес в параметре url:
| charset | Указывает кодировку символов для текущего HTML-документа: |
| content | Содержит произвольный текст, который определяет значение, ассоциируемое с атрибутом http-equiv или name , в зависимости от их значения. |
| http-equiv | Контролирует действия браузера на данной веб-странице (эквивалент HTTP заголовков). При отображении страницы браузер будет следовать инструкциям, заданным в атрибуте: default-style указывает предпочтительный стиль для использования на странице. Атрибут content должен содержать идентификатор элемента , который ссылается на таблицу стилей CSS, или идентификатор элемента , содержащего таблицу стилей. refresh указывает время в секундах до перезагрузки страницы или время до перенаправления на другую страницу, если в атрибуте content после указания времени идет строка "url=адрес_страницы" . Автоматическая перезагрузка страницы через заданный промежуток времени, в данном примере, через 30 секунд: Если необходимо сразу перебросить посетителя на другую страницу, то можно указать URL-адрес в параметре url: |
| name | Ассоциируется со значением, содержащемся в атрибуте content . Не должен использоваться в случае, если для элемента уже заданы атрибуты http-equiv , charset или itemprop . application-name указывает название веб-приложения, используемого на странице. author указывает имя автора документа в свободном формате. description определяет краткое описание к содержимому страницы, например: generator указывает один из пакетов программного обеспечения, используемого для создания документа, например: . keywords содержит список ключевых слов, разделенных запятыми, соответствующих содержимому страницы, например: . Также атрибут name может принимать следующие значения из расширенной спецификации, такие как creator , googlebot , publisher , robots , slurp , viewport , хотя ни одно из них еще не было официально принято. |
Внутри этого элемента задаются стили, которые используются на странице. Для задания стилей в HTML-документе используется язык CSS. Таких элементов на странице может быть несколько.
Внутрь этого элемента можно записывать код форматирования как самих элементов веб-страницы, так и веб-страницы целиком.
.paper { width: 200px; height: 300px; background-color: #ef4444; color: #666666; }
Чтобы подключить к элементу заданный стиль, необходимо через атрибут class (или id) присвоить элементу соответствующее название:
...
CSS-код можно встраивать непосредственно в элемент разметки в виде значение атрибута style , например:
1.2.4. Элемент
Задать стили для документа можно также при помощи другого способа - записать их в отдельный файл с расширением.css , например, style.css .
Подключить файл со стилями к веб-странице можно двумя способами:
через
директиву @import url
@import url(style.css);
с использованием элемента . Элемент не требует закрывающего тега. Данный элемент определяет отношение между текущей страницей и другими документами. Таких элементов на странице может быть несколько. Запись будет иметь следующий вид:
| crossorigin | Указывает, должен ли использоваться CORS (технология браузеров, которая позволяет предоставить веб-странице доступ к ресурсам другого домена) при извлечении изображения с сайта. anonymous — в кросс-доменный запрос браузер автоматически добавляет заголовок Origin, содержащий имя домена, с которого осуществлён запрос. Если сервер не ответит CORS-заголовком Access-Control-Allow-Origin: * (или имя домена вместо звёздочки), то загрузка изображения будет заблокирована. use-credentials — если сервер не предоставляет учётные данные с помощью Access-Control-Allow-Credentials: true , то загрузка изображения будет заблокирована. |
| href | Основной атрибут тега, в качестве значения выступает путь к файлу со стилями. |
| hreflang | Определяет язык текста в документе, на который идет ссылка. |
| media | Определяет тип устройства, к которым должен быть применен ресурс ссылки. |
| nonce | Генерируемая случайным образом на сервере строковая переменная, которая устанавливает правила использования встроенных стилей с целью защиты контента. Значение атрибута — строка текста. |
| rel | Атрибут определяет отношения между текущим документом и документом, на который идет ссылка. alternate — ссылка на тот же документ, но в другом формате (например, страницы для печати, перевод, зеркало, лента в формате RSS или Atom), . archives — указывает на то, что документ по ссылке представляет исторический интерес. Ссылка может указывать на коллекцию записей, документов и других материалов. author ссылка на страницу об авторе документа или на страницу с контактными данными автора. bookmark ссылка на ближайшего предка статьи, являющегося связующим звеном, или на раздел статьи, наиболее тесно связанных с элементом, если нет предка. external используется для указания того, что страница на которую ведет ссылка не являются частью данного сайта. first указывает ссылку, ведущую на первый документ из последовательности документов. help ссылка на документ со справкой. icon определяет путь к иконке, которая будет использована для текущего документа. last указывает ссылку, ведущую на последний документ в последовательности документов. license ссылка на сведения об авторских правах для документа. next указывает, что этот документ является частью серии, и что ссылка ведет на следующий документ в этой серии. nofollow указывает на то, что ссылка не одобрена автором страницы или что ссылка носит коммерческий характер. noreferrer указывает на то, что заголовок запроса клиента, содержащий url источника запроса, не должен передаваться при переходе по ссылке. pingback указывает адрес пингбэк-сервера, что дает возможность для блога автоматически оповещать сайты, ссылающиеся на него. prefetch указывает, что следует заранее кэшировать файл, на который ведет ссылка. prev указывает, что этот документ является частью серии, и что ссылка ведет на предыдущий документ в этой серии. search указывает, что ссылаемый документ содержит интерфейс поиска и связанных с ним ресурсов. sidebar указывает, что ссылаемый документ, если это возможно, будет показан в дополнительном контексте браузера, и некоторые браузеры при щелчке по гиперссылке открывают окно для добавления ссылки в панель закладок. stylesheet ссылка на внешний файл, который будет использоваться в качестве таблицы стилей для данного документа. tag указывает на то, что метка, на которую ведет гиперссылка, относится к данному документу. up указывает, что страница является частью иерархической структуры, и что гиперссылка ведет на более высокий уровень ресурса в структуре. |
| sizes | Указывает размер иконок для визуального отображения. Атрибут sizes используется только совместно с rel="icon" , и может принимать следующий значения: ширинах высота - определяет список размеров, разделенных пробелами, каждый размер должен быть в формате - ширинах высота (размеры иконки задаются в пикселях), например: ; any - иконка может масштабироваться до любого размера. |
| title | Определяет заголовок ссылки или название набора альтернативных таблиц стилей. Значение атрибута — текст. |
| type | Определяет MIME-тип документа, на который идет ссылка. В данном случае он принимает значение "text/css" . |
| async | Атрибут указывает на то, что сценарий будет выполняться асинхронно с остальной частью страницы (сценарий начнет выполняться одновременно с загрузкой страницы). |
| charset | Определяет кодировку символов |
| crossorigin | Определяет, будет ли использоваться CORS при загрузке внешних скриптов (с использованием атрибута src). anonymous — перед загрузкой скрипта в кросс-доменный запрос браузер автоматически добавляет заголовок Origin, при этом не передаются параметры доступа (cookie, сертификат X.509, логин/пароль для базовой аутентификации по HTTP). Если в ответе сервера отсутствует заголовок Access-Control-Allow-Origin: имя домена, скрипт не будет загружен. use-credentials — перед загрузкой скрипта в кросс-доменный запрос браузер автоматически добавляет заголовок Origin с указанием параметров доступа (cookie, SSL-сертификат или пары логин/пароль). Если в ответе сервера отсутствует заголовок Access-Control-Allow-Credentials: true , скрипт не будет загружен. |
| defer | Интерпретация сценариев откладывается до окончания отображения документа на устройстве пользователя. |
| nonce | Обеспечивает безопасность, защищая от атак с внедрением межсайтового скриптинга (XSS, cross site scripting). Устанавливает правила использования встроенных скриптов с помощью nonce-значений и хэшей. Во время рендеринга страницы браузер для каждого инлайн-скрипта вычисляет хэши и сравнивает с перечисленными в CSP. Загрузка с ресурсов, не входящих в «белый список», блокируется. |
| src | Указывает на месторасположение файла со сценарием, значение атрибута - это url файла, содержащего JavaScript-программу. |
| type | Используются для объявления языка сценария, использованного при составлении содержимого тега. |
В этом разделе располагается все содержимое документа. Для элемента доступны .
| onafterprint | Событие, срабатывающее после отправки страницы на печать или после закрытия окна печати. |
| onbeforeprint | Событие, срабатывающее перед отправкой страницы на печать. |
| onbeforeunload | Событие срабатывает, когда посетитель инициировал переход на другую страницу или нажал «закрыть окно». Позволяет отображать сообщение в диалоговом окне подтверждения, чтобы сообщить пользователю, хочет ли он остаться или покинуть текущую страницу. |
| onhashchange | Событие срабатывает, когда меняется hash-часть URL, например, когда пользователь перейдет с адреса example.domain/test.aspx#page1 на example.domain/test.aspx#page2 . |
| onmessage | Событие происходит, когда сообщение получено через источник события. |
| onoffline | Событие вызывается браузером в том случае, когда браузер определит, что соединение с интернет пропало. |
| ononline | Событие вызывается браузером в том случае, когда соединение с интернет возобновилось. |
| onpagehide | Событие происходит, когда пользователь покидает страницу посредством навигации, например, нажав на ссылку, обновив страницу, заполнив форму и т.д. |
| onpageshow | Событие происходит, когда пользователь переходит на веб-страницу, после события onload. |
| onunload | Событие срабатывает если страница не загрузилась по каким-либо причинам, либо при закрытии окна браузера. |
Имеются возможности создания на Web-странице формы, в которую пользователи могут заносить информацию, передаваемую браузером на сервер (тег ) или управляющую выбором из меню (тег ).
Поскольку в языке HTML множество тегов ограниченное и фиксированное, действия, предусматриваемые ими, в частности, операции форматирования , реализованы в браузерах. При этом тегам, подобным , соответствует определенный стиль (тип, размер, цвет шрифта). Чтобы дать возможность пользователям устанавливать желаемый стиль изображения, разрабатывают таблицы стилей, представляющие информацию о параметрах стиля, и способы связывания таких таблиц с HTML-документом. Большинство браузеров поддерживают каскадные таблицы стилей CSS (Cascading Style Sheet).
Таблица CSS состоит из правил форматирования. В каждом правиле указываются тип элемента, к которому относится форматирование, и список объявлений. Список обрамляется фигурными скобками, объявления в списке разделяются точками с запятой. Каждое объявление задает значение одного из свойств отображения элемента в виде свойство:значение. К свойствам относятся тип (гарнитура), размер, цвет, способ выравнивания и стиль (обычный, полужирный, курсив) шрифта, цвет или рисунок фона, межстрочные интервалы, наличие рамок, взаимное расположение блоков текста и другие характеристики, обычные для управления видом изображения в текстовых редакторах. Можно вместо типа элемента указать имя оригинального вводимого стиля, имя стиля должно начинаться с точки.
Использование таблицы стилей подразумевает указание типа таблицы в разделе HTML-документа. Там же между тегами и записываются правила форматирования. Можно все правила форматирования записать в отдельном файле и тогда в HTML-документе достаточно сослаться на этот файл в специальном теге . Если вводимый стиль относится лишь к части документа, используется тег с параметром CLASS , например:
Часть документа
Первые версии языка HTML были достаточно простыми, но не лишенными ряда недостатков. Прежде всего нужно отметить ограниченность набора тегов, что не соответствует потребностям многих приложений. Кроме того, в тегах HTML не отделены данные, задающие структуру документа, от данных по его изображению (форматированию) на экране дисплея при просмотре с помощью браузера, что затрудняет работу с документами. В результате в новые версии языка стали вводится усовершенствования, что заметно усложнило язык, но не устранило основные недостатки. Наиболее существенными недостатками HTML являются, во-первых, невозможность отделить информацию о структуре документа от информации о форматировании, во-вторых, отсутствие в языке HTML средств, позволяющих производить такие операции обработки текста, как сортировка, поиск фрагментов по определенным признакам и т.п.
Следующий модуль
Поиск терминов
В 1989 году Тим Бернерс-Ли, сотрудник центра высоких технологий (CERN), предложил проект распределенной гипертекстовой системы под названием WWW (World Wide Web). Гипертекст - это текст, «который разветвляется сам по себе или выполняет действия по запросу». Изначально проект задумывался для того, чтобы объединить все информационные ресурсы CERN в единую распределенную систему гиперссылок, но данная технология, оказалась настолько перспективной, что впоследствии, благодаря простоте и использованием уже известных на тот момент сетевых протоколов (TCP и IP), ляжет в основу известной на егодняшний день Всемирной паутине.
World Wide Web - первая успешно реализованная сетевая технология, удобство применения привели к росту числа пользователей WWW и привлекли внимание коммерческих компаний, благодаря чему количество пользователей увеличивается геометрически и по сей день.
Одним из основных составляющих World Wide Web стал язык гипертекстовой разметки HTML , разработанный Тимом Бернерсом-Ли на основе стандарта языка разметки печатных документов -- SGML (Standard Generalised Markup Language, стандартный обобщенный язык разметки ).
Благодаря созданию HTML были решены две задачи: дизайнеры гипертекстовых баз получили очень удобный инструмент для создания гипертекстовых документов; этот инструмент получился достаточно мощным, чтобы отразить имевшиеся на тот момент представления об интерфейсе пользователя гипертекстовых баз данных.
Первая задача была решена за счет выбора теговой модели(см. главу 2) описания документа. Такая модель широко применяется в системах подготовки документов для печати.
Для реализации HTML документов был выбран текстовый файл, так как помимо существования стандарта Z39.50 (который подразумевал простой текстовый файл, соответствующий кодировке US ASCII, как единицу хранения), создание и редактирование такого файла возможно в любом текстовом редакторе.
По сути - гипертекстовая БД в рамках WWW представляет из себя совокупность написанных при помощи HTML текстовых файлов, которые так же включают в себя систему связей между собой и внешними информационными ресурсами (гиперссылки), которые, в последствии объединили множество различных информационных и развлекательных ресурсов. В последствии, когда гиперссылки стали объединять не только текст, но и аудио и видео возникло понятие гипермедиа.
HTML 1.0 предназначался скорее для презентации самого языка. HTML 2.0 уже определял четкую архитектуру документов. HTML++ предоставил больше возможностей для составления научных статей и формирования таблиц. HTML 3.2 собрал воедино нововведения и наработки предыдущих версий, позволил выполнять на странице написанный на Java код. В HTML 4.01 . расширены возможности работы с мультимедиа, была введена интеграция с таблицами стилей CSS, языкиами программирования JavaScript и VBScript.
Но в 1998 году язык HTML был признан устаревшим (по сравнению с XML) и W3C решили заморозить язык разметки на версии 4.01. Затем был разработан язык XHTML, сочетающий в себе структуру HTML и синтаксис XML. Были разработаны два стандарта XHTML Transitional и XHTML Strict Первый был разработан для упрощения перехода на устоявшийся стандарт XHTML strict. Затем началась работа над XHTML 2.0. При разработке данного стандарта была совершена попытка улучшить логику писания разметки.
Но команда энтузиастов из компании Opera считали, что XML (а так же XHTML 2.0) не является достойным стандартом языка разметки. Они запустили проект по разработке экспериментального стандарта, добавив расширения для форм HTML, сохраняя при этом обратную совместимость. В результате получился стандарт Web forms 2.0, который в дальнейшем вошел в состав HTML5. После присоединения к команде разработчиков сотрудников из Mozilla они продолжили работу над проектом назвав себя WHATWG (Web Hypertext Application Technology Working Group, «рабочая группа по разработке гипертекстовых приложений для Интернета» -- http://www. whatwg.org). Код данного проекта является открытым и каждый может предложить любые изменения и нововведения в спецификацию. В последствии W3C признала, что попытка перевести весь мир на XML оказалась провальной и проголосовала за использование разработки от WHATWG в качестве основной, обновленной версии HTML, и так начался процесс работы над HTML5 аналог которой параллельно разрабатывала W3C и WHATWG. В 2009 году W3C направила все доступные средства на разработку HTML5.
Тим Бернерс-Ли
Создатель языка HTML
В этой статье о HTML дан небольшой обзор языку, его структуре, характеристике, истории. Данная статья о языке HTML предназначена к прочтению для общего развития и на начальном этапе изучения HTML вы можете её пропустить, а вернуться к ней позже, после прочтения .
HTML (HyperText Markup Language) — язык разметки гипертекста. Сайты создаются с помощью языка HTML .
Создателем языка HTML, является выдающийся британский учёный — Тим Бернерс-Ли .
Версии HTMLДо 1995 года официального стандарта языка HTML не существовало, но было несколько не стандартизированных версий языка HTML. 22 сентября 1995 года, создали первый официальный стандарт языка HTML, он сразу получил номер 2.0 (HTML 2.0).
14 января 1997 года появилась версия HTML 3.2,
18 декабря 1997 года HTML 4.0,
24 декабря 1999 года HTML 4.01
В 00-х годах, также существовал язык разметки XHTML (то же самое что и HTML, но с более строгим синтаксисом). XHTML предназначался для того, чтобы подготовить вебмастеров, к строгим правилам разметки языка XML . Благодаря строгой разметке, различные программы и сервисы понимающие XML, могут эффективно обрабатывать данные на сайтах написанные на XHTML, также в этом языке появилась возможность внедрять SVG, MathML, CML и другие производные языка XML.
XHTML существовал в трёх версиях в строгой, переходной и frameset, в переходной можно было использовать устаревшие теги такие как center или font . На данный момент, разработку языка XHTML закрыли.
Современной версией языка HTML, является HTML5 , именно эту версию мы и будем изучать в данном учебнике. HTML5 более удобен чем предыдущие языки и вобрал в себя все их преимущества, также в нём уделено большое значение семантике.
Язык CSS и HTMLНачиная с 4 версии языка HTML, изменять внешний вид HTML тегов рекомендуется только с помощью языка CSS. Поэтому языки HTML и CSS желательно изучать параллельно. В учебнике по HTML для начинающих мы также ознакомимся с начальными аспектами языка CSS, ну а для продолжения изучения вы можете почитать и сам
История HTMLЯзык HTML был создан в 1991 году, британским учёным Тимом Бернерсом-Ли. Тогда Тим работал в CERN (Европейская организация по ядерным исследованиям) и сайтов еще не существовало. Ученые работавшие в данном центре нуждались в надежном и эффективном способе обмена информацией.
Выбор пал на язык SGML , но он был слишком сложен и тогда Тим на основе SGML, создал упрощенную его вариацию — HTML , благодаря чему любой ученый мог создать простой документ с информацией, обрамив её различными тегами: абзацами, заголовками, ссылками и разместить его в интернете, а другие ученые в то же время могли читать данную информацию.
Изначально в HTML-документах (на страницах сайтов), можно было размещать только текстовую информацию, возможность добавления медиафайлов: изображений, видео и аудио появилась чуть позже.
На данный момент, поддержкой и развитием языка HTML занимается W3C (World Wide Web Consortium) — консорциум всемирной паутины. W3C состоит из различных рабочих групп, которые внедряют и развивают интернет стандарты и технологии.
Таблица распространения браузеровФайлы HTML, обычно имеют расширения .html или .htm . Эти файлы можно просматривать с помощью интернет-браузеров.
Таблица имён браузеров и количество их распространения в мире, на январь 2016 года, в порядке уменьшения:
| Google Chrome | 54,22 % |
| Internet Explorer | 14,67 % |
| Mozilla Firefox | 14,61 % |
| Safari | 9,43 % |
| Opera | 1,96 % |
| Прочие | 5,11 % |
