Веб-сайт — это набор логически связанных между собой веб-страниц, расположенных в Сети под единым именем — доменом. Веб-страницы — это документы, которые написаны на языке разметки HTML и доступны в вебе. Веб-страницы содержат контент — например, статьи, фото или видео. Для просмотра веб-страниц используют веб-браузеры. Чтобы открыть сайт в веб-браузере, нужно ввести в его адресную строку веб-адрес сайта. Когда люди ищут не конкретный сайт, а информацию, они попадают на сайт не с помощью прямого адреса, а через поисковую систему: «Яндекс», Google или другие. Поисковой системе дают запрос — например, «что такое веб-сайт». Система ищет среди страниц сайтов те, на которых есть ответ, и выводит список таких страниц. По данным Internet Live Stats, в 2021 году в Сети было 1,88 миллиарда сайтов. На сайтах продают товары и услуги, публикуют информацию, играют в игры, общаются, созваниваются по видеосвязи, учатся, смотрят видео.
Какие есть типы сайтов
Владельцы сайтов решают с помощью сайтов разные задачи — от продажи товаров до изменения общественного мнения. Мы приведём примеры нескольких типов сайтов, созданных для различных задач, но это не исчерпывающий список.
- Сайт-визитка — небольшой сайт из одной или нескольких страниц, на котором размещают основную информацию о человеке, компании, товаре или услуге. На сайте-визитке можно разместить описание товара или компании, фотографии и контактные данные. Допустим, SMM-специалист может создать сайт-визитку, чтобы рассказать о своих услугах.
- Корпоративный сайт — сайт с подробной информацией о компании, её товарах или услугах. Также на сайте могут быть разделы с новостями, документами, вакансиями. Корпоративные ресурсы создают, чтобы продавать товары или услуги. Поэтому на корпоративных сайтах, в отличие от сайтов-визиток, можно оформить заказ или хотя бы связаться с менеджером — например, оставить заявку на обратный звонок.
- Интернет-магазин — сайт, на котором продаёт товары один продавец. В интернет-магазине есть каталог товаров, корзина и система оплаты. Интернет-магазины заводят производители, дистрибьюторы, торговые компании. На интернет-магазины похож другой тип сайтов — маркетплейсы. Это онлайн-площадки, где торгует множество продавцов. Владелец сайта при этом не сам продавец, а компания-посредник.
- Новостной сайт — ресурс, на котором размещают новости. Новостной сайт может быть узкотематическим — например, только с новостями спорта. Новостные сайты создают, например, СМИ, которые раньше существовали в офлайне. Чтобы заработать, владельцы таких ресурсов размещают на них рекламу.
- Блог (или информационный сайт) — сайт, на котором автор или группа авторов регулярно размещает информационные статьи. Статьи в блогах могут быть посвящены жизни автора, хобби, узкой области знаний, профессиональным или практическим вопросам — например, тому, как ухаживать за горшечными растениями. Блоги обычно посвящены одной теме. Чтобы заработать, владельцы блогов могут размещать в них рекламу.
Типов веб-сайтов гораздо больше — например, выделяют ещё форумы, социальные сети, лендинги. Существуют также сайты, совмещающие элементы разных форматов.
Из чего состоит сайт
Технически сайты устроены сложно. Чтобы не вдаваться в технические подробности, рассмотрим то, без чего большинство сайтов не может работать или быть полезным. Это файлы кода, хостинг, домен, функциональность, дизайн и контент.
- Файлы кода — документы, написанные на языках HTML, CSS и JavaScript. Файлы HTML нужны, чтобы все элементы страницы — заголовки, картинки, текст — были показаны в правильном порядке. CSS — это язык стилей, с его помощью задают внешний вид элементов — например, цвет и размер шрифта. На JavaScript пишут сценарии поведения элементов. Например, с его помощью можно сделать так, чтобы кнопка меняла цвет, когда на неё наводят курсор.
- Хостинг — это размещение файлов сайта на сервере. Без хостинга сайт никто не увидит.
- Любой сайт — набор файлов, причём не только файлов кода, но и файлов изображений, документов и текста. Чтобы люди могли увидеть их и взаимодействовать с ними, сайт должен быть загружен на компьютер со специальным программным обеспечением и круглосуточным доступом в интернет. Такие компьютеры называют серверами.
- Доменное имя (или домен) — это уникальное название сайта, адрес, по которому его можно найти. Домены есть у всех сайтов. Например, у сайта нашей Компании это cncadviser.ru.
- Функциональность — набор возможностей, которые предоставляет сайт. У каждого ресурса он свой в зависимости от того, зачем сайт сделали. Например, на большинстве сайтов можно переходить по страницам. В интернет-магазине пользователь может зарегистрироваться, купить и оплатить товар. На сайте компании — заполнить форму обратной связи, чтобы ему перезвонили. Рассчитать стоимость проекта на онлайн-калькуляторе — тоже функциональность сайта.
- Дизайн — визуальное оформление сайта. Цвета, шрифты и изображения, используемые на странице, расстояние между элементами и их порядок — всё это компоненты дизайна. Дизайн разрабатывают и для элементов самого сайта, и для контента — его наполнения. Дизайн нужен, чтобы сайт выглядел привлекательно, а людям было удобно им пользоваться.
- Контент сайта — это информационное наполнение веб-страниц: текст, изображения, видео, аудио и мультимедиа. Например, статья, которую вы сейчас читаете, — это тоже контент.
Какие элементы есть в интерфейсе сайта
- Интерфейс — видимая часть системы сайта, с которой взаимодействует пользователь. Так как сайты создают в разных целях, интерфейсы у них тоже разные. Но на большинстве ресурсов есть шапка, элементы навигации и футер.
- Шапка сайта (или хедер) — это верхний модуль сайта. На нём обычно располагают логотип, контакты, кнопки навигации, корзину для покупок, кнопку для входа в аккаунт. Логотип часто кликабельный: нажав на него, пользователь попадает на главную страницу сайта. Обычно шапка видна на всех страницах. Часто её фиксируют — она остаётся вверху страницы даже при прокрутке.
- Футер — нижний модуль сайта. В футере обычно размещают справочную информацию: контакты, ссылки на соцсети, номер телефона службы поддержки. Ещё в футере иногда располагают ссылки на разделы сайта.
- Элементы навигации сайта — это элементы, которые упрощают перемещение по ресурсу. Например, меню — список страниц, сгруппированных в разделы. Иногда его обозначают символом в виде трёх горизонтальных линий, который называют бургером. Меню часто добавляют в хедер и фиксируют вместе с ним.
- Ещё один элемент навигации — кнопка «наверх». Её тоже фиксируют — она видна при прокрутке страницы. Она помогает быстро попасть в начало страницы, а не прокручивать её вручную.
Кроме перечисленных элементов интерфейса, на сайте могут быть формы для отправки данных, кнопки социальных сетей, галереи изображений, строка поиска.
Как работает веб-сайт
Пользователь находит сайт в поисковой системе или вводит его название в браузере, а тот открывает нужную страницу. После этого пользователь может взаимодействовать с ресурсом: читать статьи, скачивать файлы, покупать товары. За этим стоит сложный процесс. Опишем его пошагово:
- DNS-запрос. Получив имя сайта, браузер отправляет на сервер доменных имён — DNS-сервер — запрос. Сервер отвечает, какому IP-адресу соответствует домен сайта.
- Установка соединения. Браузер устанавливает соединение с сервером по полученному IP-адресу. Для этого браузер отправляет запрос, а сервер отвечает на него.
- Запрос страницы. После того как соединение с сервером установлено, браузер отправляет запрос на получение нужной веб-страницы. Сервер отправляет эту страницу в виде HTML-документа.
- Загрузка страницы. Браузер загружает HTML-документ, который отправил ему сервер, и начинает обрабатывать его содержимое.
- Разбор страницы. Браузер разбирает HTML-документ на заголовки, абзацы, изображения, ссылки и строит структуру страницы.
- Загрузка ресурсов. Браузер загружает всё наполнение, которое указано в HTML-документе: изображения, видео, шрифты и прочее.
- Отображение страницы. Браузер отображает страницу в своём окне, и пользователь может начинать работу с сайтом.
Когда пользователь совершает на сайте действия, браузер так же посылает запросы на сервер, а сервер отвечает на эти запросы. В реальности все эти процессы занимают считанные секунды или даже доли секунд.
Как создать сайт
Можно заказать разработку у фрилансера или веб-студии или собрать свою команду: нанять дизайнера, разработчика и других специалистов. Если нужен сложный сайт, разработка может стоить дорого.
Чтобы создать сайт необходимо определиться с CMS. CMS (или система управления контентом) — это платформа, которая позволяет создавать, настраивать сайт и управлять его содержимым без необходимости писать код с нуля. CMS дают массу возможностей, например, оптимизацию страниц под требования поисковых систем. Чтобы создать сайт на CMS, нужно:
- Зарегистрировать домен. Для этого нужно выбрать свободное доменное имя и оформить его у регистратора доменов.
- Заказать хостинг. Эта услуга платная и ее предоставляют различные хостинг-провайдеры.
- Выбрать CMS. Наиболее популярные — WordPress, Joomla, Drupal, MODX, OpenCart, InSales, Magento, «1С-Битрикс».
- Привязать домен к хостингу. Это делают в панели администратора на сайте хостинг-провайдера.
- Разместить сайт на сервере. Для этого нужно зайти в панели администратора, создать сайт и провести определенные настройки.
- После этого можно создавать страницы сайта и наполнять их контентом. Логика настройки и наполнения зависит от того, ресурс какого типа вы создаёте и с помощью какой CMS им управляете.
Все вышеописанное — это базовые понятия, которые мы попытались описать простым языком. В реальности создание сайта, его наполнение и продвижение в сети — трудоемкое и непростое занятие, имеющее массу нюансов и подводных камней. Создать простой сайт можно попробовать самостоятельно, за более сложными с особым функционалом лучше обратиться к опытным специалистам.