#1 История появления HTML и CSS - уроки с нуля

В этом уроке — краткая история появления HTML и CSS: ключевые даты и имена, которые стоит знать, чтобы понимать, откуда взялись современные стандарты.

Определения

• HTML (HyperText Markup Language — «язык гипертекстовой разметки») — язык разметки веб-страниц: с его помощью автор размечает документ, сообщая браузеру, что в нём является заголовком, абзацем, списком, ссылкой, картинкой и т.д. HTML описывает структуру и смысл содержимого, но не его внешний вид.
• CSS (Cascading Style Sheets — «каскадные таблицы стилей») — формальный язык описания внешнего вида документа, написанного на HTML (или XML): с его помощью задают цвета, шрифты, отступы, размеры и расположение элементов на странице.

  «Каскадные» — потому что стили приходят из нескольких источников (стиль браузера, автора страницы, пользователя) и накладываются друг на друга по приоритетам.

Предыстория

• 1969 — сеть ARPANET (прародитель интернета)
• 1983 — переход ARPANET на TCP/IP — появился интернет в современном виде
• 1986 — язык разметки SGML (ISO) — непосредственный предок HTML

Ключевые имена

• Тим Бернерс-Ли (Tim Berners-Lee) — изобретатель веба: создал HTML, HTTP и URL, автор первого браузера и первого сайта; позже основал W3C
• Хокон Виум Ли (Håkon Wium Lie) — предложил CSS в 1994-м (в дальнейшем — технический директор Opera)
• Берт Бос (Bert Bos) — соавтор спецификации CSS

Три технологии, из которых состоит веб

Веб держится на трёх изобретениях Т. Бернерса-Ли:

1. HTML — язык разметки документов (что в странице является заголовком, абзацем, ссылкой),
2. HTTP — протокол, по которому браузер запрашивает страницу у веб-сервера и получает её в ответ,
3. и URL — единая схема адресов, по которым страницы находятся (например, https://fkn.ktu10.com/?q=node/17654).

Вместе это работает так: браузер обращается по URL к серверу, по протоколу HTTP получает HTML-документ и отображает его пользователю.

HTML: ключевые даты

• 1989 — Т. Бернерс-Ли предлагает проект «Всемирная паутина» (CERN, Женева) — текст предложения
• 1991 — первый сайт info.cern.ch (доступен до сих пор); первый документ по HTML («HTML Tags», 18 тегов: ссылки, заголовки, абзацы, списки)
• 1993 — графический браузер NCSA Mosaic
• 1994 — Netscape Navigator; основан консорциум W3C
• 1995 — HTML 2.0 — первый официальный стандарт (IETF); выходит Internet Explorer — начинаются «браузерные войны»
• 1997 — HTML 3.2 (таблицы; теги оформления вроде font)
• 1999 — HTML 4.01 (курс на разделение структуры и оформления, устаревшие теги оформления)
• 2000 — XHTML 1.0 (HTML по правилам XML)
• 2004 — создана WHATWG (Apple, Mozilla, Opera) — работа над HTML5
• 2014 — HTML5 становится рекомендацией W3C
• с 2019 — единый «живой стандарт» HTML от WHATWG (версий больше нет) — html.spec.whatwg.org

  Живой стандарт — это спецификация без версий: она не выпускается «снимками» раз в несколько лет, а обновляется постоянно, по мере того как браузеры реализуют новые возможности (с 2019-го W3C отказался от собственной линейки версий и признал стандарт WHATWG каноническим).

  Так произошло потому, что браузеры стали обновляться каждые несколько недель, и версия-«снимок» (очредного стандарта) устаревала бы сразу после выхода. Поэтому сегодня про новую возможность говорят не «появилась в HTML N», а проверяют её поддержку в браузерах — например, на caniuse.com.

CSS: ключевые даты

• 1994 — Хокон Виум Ли публикует предложение «каскадных таблиц стилей»; идея: отделить оформление (CSS) от содержания (HTML)
• 1996 — CSS1 — первая рекомендация W3C
• 1998 — CSS2 (позиционирование, слои)
• 2011 — CSS 2.1
• с 2000-х — CSS развивается модулями («CSS3»): медиа-запросы (2012), flexbox (~2015), grid (2017), вложенность и запросы контейнера (2023) — актуальный статус модулей: CSS current work

Эволюция ответственности - туда и обратно

HTML изначально описывал структуру документа, но в 1990-е (в период «браузерных войн») оформление стали вписывать прямо в разметку — тегами вроде font и вёрсткой таблицами.
CSS вернул разделение, теперь ответственность такая:

• HTML — что значит текст: заголовокабзац/ссылка) и тд
• CSS — как этот тест/блок выглядит.

Контрольные вопросы

• Кто и где изобрёл веб? Какие три технологии он предложил?
• Зачем придумали CSS и что означает слово «каскадные»?
• Какая версия HTML актуальна сегодня? Почему у неё нет номера?