Как работает сайт?

Это несколько связанных между собой страниц с текстом, картинками и всем остальным, что бывает в интернете. Если вы читаете эти карточки через браузер — значит, вы на сайте «Медузы». Ваш браузер скачал эту статью в виде страницы на языке HTML (именно на нем пишутся, а точнее — размечаются веб-страницы) и считал специальные разметки — наборы букв и символов, преобразовав их в нечто более симпатичное, чем просто текст. Поэтому вы видите аккуратно отформатированный текст с фоном, картинками, ссылками, кнопками и так далее. Например, текст вида <strong>«Медуза»</strong> преобразуется на сайте так, что слово «Медуза» становится выделено полужирным. 

Не всегда. Бывают статические и динамические сайты. Статические — это готовые HTML-страницы: например, сайты-визитки с контактами, прайс-листом и другой информацией, которую не нужно часто менять. Когда прайс-лист устареет, придется зайти на сервер и обновить файл. А если у сайта сотня страниц, которые нужно обновить, тогда придется заменить сто файлов, даже если некоторые из них одинаковые. Чтобы упростить этот процесс, были придуманы динамические сайты. В их основе — веб-сервер, специальная программа, которая принимает запрос пользователя и каждый раз генерирует для него новый файл с той страницей, запрос к которой он отправил. Веб-сервер может предоставить хостинг-компания, или вы должны установить программу на сервер сами (о хостинге и сервере мы расскажем ниже). Потом эту программу можно менять, подключать к ней базу данных (например, с пользователями или товарами), выносить повторяющиеся элементы в отдельные шаблоны. Именно так сейчас делаются все большие сайты — онлайн-магазины, медиа, да что угодно. В том числе и сайт «Медузы».

С помощью системы управления контентом (CMS — Content Management System) — в простонародье админки. Они различаются в зависимости от задач, для которых предназначены. Для блогов это одни (например, Wordpress), для интернет-магазинов — другие (такие как «1С-Битрикс»). Бывают ситуации, когда компания не может найти на рынке готовое решение под свои задачи, тогда им приходится создавать CMS самостоятельно. По этому пути пошла и «Медуза». У нас есть собственная система «Монитор» — она же и внутренний редактор. Через нее загружаются и публикуются тексты, здесь работает вся редакция. 

Сервер нужен. Но обычно владельцы сайта покупают вычислительные мощности у сторонних компаний. Эта услуга называется хостингом, ее предоставляет множество компаний с различными ценами, оборудованием и скоростью интернета в дата-центрах — специальных зданиях, где установлено серверное оборудование. Если нужен хостинг для простого сайта, обычно покупается так называемый виртуальный сервер — это когда на одном физическом сервере находится сразу несколько сайтов, не связанных друг с другом, при этом каждый из них получает ограниченный доступ к мощности сервера. Если сайт сложный, то берется в аренду физический сервер — тогда вся его мощность будет в вашем распоряжении, но вам же придется заниматься его настройкой. «Медуза» берет в аренду серверы в нескольких компаниях и дата-центрах сразу. Так мы, во-первых, страхуем себя от ситуаций, когда с одним дата-центром что-то случится (например, выключится электричество), а во-вторых, так мы можем находиться ближе к читателю. То есть наш сервер может быть неподалеку от вас, что позволяет данным перемещаться до вашего компьютера быстрее.

Не только из-за этого. Скорость загрузки сайта зависит как от хостинга, так и от сложности его архитектуры и количества пользователей, которые одновременно на него заходят. Скорость может зависеть и от вашего интернет-соединения, и от мощности вашего устройства. Одна из задач разработчиков — сделать обмен информацией между пользователем и сервером максимально быстрым. Существуют разные способы этого добиться. Например, при помощи CDN — сетей доставки контента — можно быстрее «отдавать» пользователю некоторые элементы сайта. Также нужно оптимизировать код, обновлять оборудование и программное обеспечение. Пренебрежительное отношение к «железу», «софту» или коду сайта запросто может привести к потере аудитории и другим неприятным последствиям. В интернет-магазине уменьшится число продаж или возникнут проблемы с оформлением заказов, сайт популярного медиа не справится с пиковой нагрузкой в ответственный момент и так далее.

Единого набора нет. Архитектура может быть очень разной. Но у сайта всегда (за очень редким исключением) есть главная страница. Также все сайты делятся на фронтэнд и бекэнд. Фронтэнд — это фасад сайта, то, с чем взаимодействует посетитель: весь текст, картинки, кнопки и так далее. Бекэнд — это задний двор: устройство веб-сервера, которое отвечает за то, чтобы код работал правильно, письма отправлялись, статьи отображались и так далее. Бекэнд может быть устроен по-разному. Некоторые сайты работают благодаря единой программе, другие имеют так называемую микросервисную архитектуру — то есть состоят из множества разных, слабо связанных друг с другом программ. Когда одна выходит из строя, другие части продолжают нормально работать. Как раз так устроена «Медуза». 

Вообще есть два способа сделать так, чтобы сайт нормально отображался и на телефоне, и на компьютере. Первый: делаются две разные версии сайта, и в зависимости от того, с какого устройства на него заходит пользователь, ему отдается подходящая. Второй: сайт автоматически меняется в зависимости от ширины экрана. Такой подход требует более глубокой проработки дизайна, но плюс в том, что нам не нужно поддерживать две версии сайта. Понять, как именно сделан сайт, можно просто: откройте сайт в браузере на компьютере и уменьшите окно. Если он хорошо выглядит в узком окне — он сверстан адаптивно. «Медуза» и большинство новых сайтов сделаны именно так.

Существуют разные служебные разделы. Например, файл robots.txt позволяет сайту попадать в выдачу результатов поиска «Яндекса» и Google или, наоборот, запрещает поисковикам индексировать некоторые страницы. Еще есть .htaccess — он регулирует разные правила: например, перенаправляет пользователя на главную, если он вдруг зашел на несуществующую страницу. 

Мы в «Медузе» любим экспериментальные технологии — пусть они недоработанные и с ними приходится сложнее, зато они дают технологические преимущества. Например, мы пользуемся языком Elixir. Он молодой и непопулярный, но на нем можно очень быстро писать realtime-системы, например наши чаты, — такие мало где есть. Но, конечно, не везде допустимы эксперименты. Те части сайта, которые должны работать предсказуемо и надежно, пишутся на проверенных технологиях и языках. CMS написана на Ruby on Rails — этому фреймворку уже больше десяти лет, и непонятных ситуаций с ним возникает куда меньше, чем с более новыми разработками.

Безопасность бывает разной. Нужно стремиться к тому, чтобы сайт нельзя было взломать, но достичь этого на 100% практически невозможно. Если вас очень захотят «хакнуть», то сделают это — вопрос только в цене. Именно на это стоит делать расчет и приложить все усилия к тому, чтобы стоимость взлома была очень высокой. Есть несколько способов этого достичь. Во-первых, стоит провести независимый аудит безопасности. Это дорого, но дешевле, чем последствия взлома. Во-вторых, нужно обновлять не только код, но и все программное обеспечение администраторов сайта. В-третьих, нужно проводить тренинги для сотрудников и обучать их правилам безопасности. В-четвертых, нужно позаботиться и о безопасности посетителей вашего сайта — использовать HTTPS, проверять партнёров, рекламные сети, сторонние скрипты. Наконец, контролируйте среду, в которой работают ваши программисты — настройте доступы таким образом, чтобы разработчики имели доступ только к тем частям системы, которые нужны для их работы. Соблюдение этих правил позволит вашему сайту жить долго и счастливо, а вашим посетителям — быстро и качественно получать то, за чем они пришли.

Этот материал мы подготовили вместе с DataLine. Узнать больше о хостинге и поддержке веб-проектов на аутсорсинге можно на сайте компании.