Как работает Web
Все мы отлично знаем, что такое интернет, и прекрасно умеем им пользоваться. Но не задумывались ли Вы, что интернет чем-то напоминает магию – вы открываете браузер и пишите URL в адресной строке, а уже через долю секунды (или чуть дольше – зависит от скорости интернета) попадаете в какой-то невероятный новый мир. И так происходит после каждого клика мышью по ссылке. Большинство пользователей и не задумывается, сколько действий на самом деле за этим стоит.
Клиенты и сервера
Начнём с того, что все компьютеры во всемирной паутине связаны, и делятся они на два типа – клиенты и сервера. На сервере содержатся файлы, которые необходимо передать клиенту, что осуществляется с помощью специальных «адресов» компьютеров – IP (выражается в числовом значении). Но, так как запоминать IP сайтов неудобно, была придумана система доменных имен – Domain Name System (DNS). DNS – это своего рода посредник между сервером и пользователем, он преобразовывает числовой адрес в символьный. Таким образом, прежде чем отослать запрос на сервер, компьютеру необходимо узнать его IP – за этим он обращается к DNS. Если расписать по действиям, то это будет выглядеть так:
- компьютер посылает запрос (URL) на DNS [об «адресе» DNS заботится провайдер];
- DNS передаёт компьютеру IP;
- компьютер отправляет этот IP (вместе с URL) серверу;
- у нас появляется картинка сервер передает содержимое необходимой страницы сайта компьютеру, что впоследствии выводится на дисплей.
«Кухня» написания сайтов тоже достойна внимания. Сайт пишется с помощью четырёх основных языков: HTML, CSS, PHP и JavaScript. Все эти языки действуют вместе, каждый имеет своё назначение, дополняют друг друга.
HTML и CSS: структура и оформление
Первое, что мы видим на странице – это структура и оформление сайта. Они создаются с помощью HTML и CSS. Эти два языка действуют в связке и создают общий статический вид сайта. HTML размечает текст определенными "метками", а CSS, ориентируясь на эти "метки" задает то, как должен выглядеть текст или изображение в рамках этих меток.
HTML (HyperText Markup Language) – язык гипертекстовой разметки документа. Основное его назначение – вывести на монитор текст, пригодный для чтения.
CSS (Cascading Style Sheets) – язык описания внешнего вида документа.
Есть ли в языке HTML возможность оформить сайт, а не только прописать основную разметку? Да, есть. Но в случае, если Вы захотите изменить цвет шапки, это придётся делать на всех страницах вручную, что, во-первых, долго, а во-вторых, есть опасность пропустить какую-либо страницу. В этом случае на помощь приходит CSS – Вы прописываете одно оформление для всех страниц (или для той группы страниц, которая Вам нужна), и при необходимости меняете всё, что нужно, в одном документе.
Структура и оформление должны накладываться на какой-либо контент. Опять же, наполнять сайт вручную можно, но требует огромного запаса ресурсов (времени и терпения), поэтому программисты используют язык PHP.
PHP - слоник - мозг сайта
PHP (Hypertext Preprocessor, изначально Personal Home Page Tools) – это динамика сайта, его наполнение. Язык PHP обрабатывает запрос пользователя на сервере, после чего генерирует ответ в HTML и отсылает клиенту. Для наглядности приведем пример. Предположим, Вы захотели прочитать статью (одну из ста) на сайте. Эта статья содержится на сервере, в базе данных, под определенным номером (этот номер можно увидеть в адресной строке). PHP видит запрос, с которым пользователь обращается (клик по названию статьи), достаёт эту статью из базы данных, вставляет её в HTML-код и отсылает назад пользователю. Гораздо легче, чем прописывать отдельную страницу для каждой статьи вручную.
Javascript - красота в движении
Казалось бы – сайт готов, оформлен, что ещё нужно? Правильно, интерактивность! Сайт без возможности каким-либо образом изменять страницу без перезагрузки смотрится довольно уныло. И тут на помощь приходит JavaScript (сокращенно JS). JS позволяет реагировать на какие-либо действия пользователя моментально на этой же странице без её перезагрузки. Все подсвечиваемые кнопки при наведении на них мышью, каскадные меню и разворачивающиеся на странице окна – заслуга JS. Сайт таким образом выглядит не только более наполненным, ярким и профессиональным, но еще и компактным – с помощью JS можно скрыть большую часть информации до тех пор, пока она не понадобится пользователю.