Apexuite

История интернета к которому мы привыкли началась совсем недавно, в 1991 году.

До этого интернет был намного проще. На заре его возникновения компьютеры занимали целую комнату и были очень дорогими. Позволить их себе могли только крупные организации, в том числе научные центры и университеты США. Именно та технология стала самой передовой и распространилась на весь мир. Именно они первыми стали соединять свои компьютеры в сети чтобы быстро обмениваться информацией. В компьютерах университетов научные труды собирались в электронные библиотеки. Данные хранились в виде обычных файлов разложенных по папкам, так как мы привыкли хранить свои файлы на своем домашнем компьютере. С помощью интернета стало возможным зайти на компьютер какого либо университета, найти нужный каталог, скачать файлы на свой компьютер и только потом открыть их. Тогда интернет был большой библиотекой. А протокол обмена файлами назывался FTP (file transfer protocol - протокол передачи файлов). Он существует до сих пор и также как и в давние времена используется для доступа к каталогам файлов.

Затем появилась электронная почта. С ее помощью письма стали доходить за считанные минуты, а не дни или недели как обычные бумажные. Интернет стал еще удобнее. Имя почтового ящика выглядит примерно так: username@server.ru В котором server это имя компьютера в интернете, сперва оно отражало название университета в котором находился компьютер. Username это имя человека, его логин на том сервере. А расширение например такое как .ru добавилось позже когда интернет стал стремительно расти и делится на зоны. Получалась очень удобная система имен. По имени dr_smith@mit.edu было сразу понятно, что это почтовый ящик доктора Смита из масачусетского технологического института из зоны education (образование).

И так продолжалось довольно долго, пока в 1991 году не случилась революция и появилась технология world wide web - всемирной паутины. Местом появления WWW был CERN (Европейский институт физики частиц), международная организация создающая большой адронный коллайдер. Это одна из самых сложных машин построенных человечеством. Ускоритель элементарных частиц в виде кольца в несколько десятков километров. С его помощью разбивают атомы на еще более мелкие частицы и изучают их. Он находится на границе Франции и Швейцарии. Над его созданием трудятся тысячи ученых со всех стран мира. В том числе ученые из нашей страны внесли существенный вклад в его строительство. Так как это очень сложная машина то понадобились сотни тысяч документов с технической документацией. И разобраться в этом огромном количестве документов становилось все сложнее. В них часто применялись ссылки на другие документы. Например, "нужна такая деталь, а узнать про нее подробнее можно в таком-то документе". Приходилось искать нужный документ, скачивать его, искать необходимы фрагмент. На это уходило очень много времени. И тогда появилась идея, что было бы хорошо, если бы нужный документ открывался сразу в нужном месте при выборе ссылки. За разработку этой идеи взялся сотрудник из CERN Тим Бернес-Ли. Он очень основательно подошел к делу и создал язык разметки HTML, который позволял не только использовать ссылки, но и более наглядно оформлять документы. Для того чтобы документы открывались по ссылке разработал протокол HTTP (hyper text transfer protocol), который сейчас является основным вместо FTP. Для работы по этому протоколу им были разработаны программы: первые веб-сервер и веб-браузер (mosaic). Больше не надо было рыться в каталогах и скачивать документы прежде чем посмотреть их. Браузер сам скачивал документ и сам тут-же показывал его. А веб-сервер понимал запросы браузера, находил нужные документы в каталогах и отправлял их браузеру. Если раньше при входе на сервер пользователя встречала куча каталогов, то теперь открывалась главная страница - документ с ссылками внутри. Щелкая по ссылкам можно было мгновенно перемещаться в любые другие документы.

За основу языка HTML (hyper text markup language) был взят стандарт SGML (standart generalized markup language). А именно использование тегов разметки. Сам документ HTML представляет собой обычный текстовый файл. Оформление которого задается тегами, это особые текстовые комбинации определенного вида: <tag> text </tag>. Это значит, что слово text обретет свойство tag, браузер это поймет и отобразить слово с учетом этого свойства. Теги бывают парными и одиночными. У парных есть начальный и конечный тег. Теги могут вкладываться друг в друга как матрешки. Получилась очень удобная и универсальная система разметки. Попробуйте открыть какой либо сайт в браузере и нажать комбинацию CTRL+U, так вы сможете заглянуть "под капот" и увидеть как реально выглядит страница в формате HTML.

Сперва тегов было совсем немного, но потом выходили все новые версии языка HTML, их становилось все больше. Сейчас применяется пятая версия, которую обычно называют HTML5.

Давайте посмотрим устройство самых простейших тегов, чтобы лучше понять как они работают. Для работы с файлами html можно использовать обычный блокнот, но лучше взять более мощный текстовый редактор, например Notepad++ или Geany в ОС Linux. Они будут автоматически выделять теги цветом и читать код станет намного удобнее. 

Откройте редактор, наберите в нем строчку ниже и сохраните файл с именем "hello.html".

The <b>bold</b> word

Теперь откройте файловый менеджер, найдите этот файл и откройте его в браузере. Чтобы выбирать программу которой надо открыть файл можно нажать по нему правой кнопкой мыши, выбрать "открыть с помощью". То есть в редакторе файл мы редактируем как текст, а в браузере мы этот файл открываем чтобы посмотреть результат. Не забывайте сохранять файл после изменений в редакторе и обновлять страницу в браузере.

Теперь замените теги <b> по очереди на другие:

<i></i>

<u></u>

<p></p>

Посмотрите результаты.

Наберите новый текст:

Hello world

Very nice

При просмотре две строки сольются в одну, потому что HTML игнорирует обычный символ переноса строки (enter), и ему нужен специальный тег <br>. Добавьте этот тег в конце строки и посмотрите результат. Теперь замените его на тег <hr>. Это одиночные теги которые не требуют закрытия.

Некоторые теги могут работать только в команде. Наберите следующий текст:

<ol>

<li>one</li>

<li>two

</ol>

Обратите внимание, теги <li> вложены внутрь <ol></ol>.

Также тег <li> может быть как парным так и одиночным. Во втором случае он закроется автоматически при встрече нового <li> или закрывающего </ol>. Посмотрите результат. Поменяте <ol></ol> на <ul></ul>.

У тегов могут быть еще и атрибуты которые уточняют свойства тега. Наберите:

<font color=red>text</font>

Атрибут color устанавливается в red и меняет цвет текста.

Попробуйте использовать другие цвета.

А теперь наберите:

<a href="http:\\ya.ru" target=_blank>yandex</a>

И посмотрите результат.

Это и есть та самая гиперссылка ради которой все затевалось.