А ты уверен в том, что правильно понимаешь что такое браузер? В этой статье мы раскроем истинную задачу, которую решает браузер.
Мы уже разобрались, как устроен интернет с физической стороны и как об информации в сети узнают поисковые службы. Теперь нужно разобраться в том, как пользователям, т.е. вам, отображается информация с сайтов на ваши экраны.
Понятно, что интриги не будет - это делает браузер. Давайте теперь разберемся, что именно он отображает и каким образом.
С чего начинается браузер?
Все начинается с понимания термина. Слово браузер является английским, на русском языке данное слово означает “обозреватель”.
Чем именно является обозреватель? С точки зрения ОС - это обычная программа, которая имеет возможность взаимодействовать с сетью.
Основная концепция браузера заключается в том, чтобы скачивать документы с сайтов и отображать их в своем окне. Наиболее важным является то, какие именно документы браузеры скачивают с сайтов.
Во времена зарождения интернета скорость соединения была крайне мала, кроме этого компьютеры не поддерживали графические изображения в том прекрасном виде, в котором мы сейчас их наблюдаем на своих телефонах, компьютерах и планшетах.
Поэтому, единственным способом коммуникации был текст. Но просто открыть сплошной текст без оформления не самая приятная процедура для чтения.
Поэтому нужно было придумать, как форматировать текст так, чтобы на экране пользователя он отображался красиво.
Единственным логичным решением является вставлять команды форматирования в сам текст, а браузер (обозреватель) должен понимать эти команды, интерпретировать их и выдавать текст в отформатированном виде.
Как я сказал ранее браузер - это программа. А программу создают программисты. Значит каждый программист может придумывать свои команды для форматирования и вставлять их в свой браузер.
Но в таком случае текст придется форматировать под каждый браузер отдельно, вставляя разные команды. А ведь таких браузеров может быть несчитанное количество, значит попахивает хаосом и требованием создать общий стандарт.
Так появился специальный язык для форматирования текста, который называется HTML. Если посмотреть какую-либо статью в Дзен изнутри, то она будет выглядеть примерно так:
Очень много непонятных английских слов? Это и есть те самые команды для форматирования текста, в HTML они называются теги.
Но мы заговорили о том, что раньше передавали только текст. Так как же выглядели страницы в те времена? Мы легко можем это проверить. Сегодня еще существуют текстовые браузеры, один из таких Lynx.
Ниже покажу, как он отображает главную страницу поисковой службы Google. Слева в современном браузере, а справа в консольном (текстовом).
Очень уютно выглядит страница, согласитесь?
Наверняка у вас возник вопрос: а что они могли только текст читать и никаких картинок? Картинок конечно же нет, а вот изображения они могли вставлять в страницы. Просто это делалось за счет символов. Такое вот символьное творчество.
Даже не буду спрашивать, как вам качество изображения. 🙂 Предлагаю попробовать угадать, что здесь изображено и написать ответ в комментариях.
Что было дальше?
Далее язык HTML развивался, компьютеры становились мощнее и могли отображать привычные нам картинки.
Картинки
В HTML добавили возможность вставлять картинки прямо в текст, а браузеры научились их показывать.
Но этого было мало. Видели сайты времен 90ых годов?
Это не газета, а такой сайт. Просто людям дали возможность добавлять изображения на свои страницы 🙂 Этот сайт до сих пор доступен.
Проблема в том, что просто вставлять картинки и изменять цвет текста - это конечно хорошо, но недостаточно.
Стилизация
Поэтому создали еще один язык для страниц, который называется CSS.
Данный язык не является самостоятельным, т.к. он описывает стили для текста, который был отформатирован тегами HTML.
В результате страницы стали гораздо более красивыми и создатели сайтов стали уделять больше времени на стилизацию. Так появилась профессия WEB-дизайнер. Это человек, который создает дизайн страницы сайта.
Но стандартизация CSS на первых порах имела странную реализацию, поэтому каждый браузер пытался впихнуть в себя какую-то особенную возможность стилизации. И на какой-то промежуток времени создателям сайтов приходилось заниматься подбором стилей, которые одинаково отображаются во всех браузерах.
Все решилось и стандартом занялась целая ассоциация. После чего браузеры обязались следовать определенным правилам добавления обязательных свойств для стилизации.
Динамика
Люди быстро привыкают к хорошему и теперь хотелось не просто читать текст с красивых сайтов, но получать какой-то интерактив на странице.
Это сейчас мы рассматриваем страницы сайта, как самостоятельные программы. А раньше страница сайта - это просто стилизованный документ, который можно было только читать.
Самой простой потребностью в те времена было сворачивание подпунктов меню. Меню стали достигать такой глубины, т.к. страниц сайтов становилось все больше и больше, что не хватало страницы для того, чтобы увидеть меню целиком. Приходилось долго прокручивать.
В те времена силами HTML и CSS такое сделать было невозможно. Поэтому решили разработать полноценный язык программирования, который будет работать непосредственно в браузере. Он называется JavaScript.
Как только появился данный язык, то интернет перешел на новый уровень. Чуть позже к этому языку разработали технологию AJAX - это такой способ передачи данных без перезагрузки страницы.
Раньше, чтобы отправить сообщение во Вконтакте, нужно было перезагружать страницу. После того как JavaScript и AJAX интегрировались в браузер, мы получили такие невероятные штуки в социальных сетях и мессенджерах, о которых раньше могли только мечтать.
Это сегодня все это воспринимается как должное. Но сегодня браузер, это не просто рядовая программа, это целый космический корабль. Кроме тех вещей, которые предоставляются вам, как пользователям, вы не видите того объема инструментов доступных для разработчиков прям в браузере.
В завершении скажу, что браузер уже не просто выполняет функцию обозревателя - это целый коммуникационный мир, где вы можете сегодня писать сообщения, вести бизнес, блоги и даже создавать другие программы прямо в браузере.
Подпишись и разбирайся в IT просто!
Читай следующую статью про модное слово "нейросети". Узнай, что же это такое на самом деле.
