Как создать многостраничный сайт

Наверняка вы задумывались над тем, как сделать многостраничный сайт самому без знаний html, программирования и дизайна. В данной статье мы расскажем об этой технологии.

Подробнее о том, как добавить новую страницу к сайту. 

Содержание:

1. Шаг 1. Выбор и установка шаблона
2. Шаг 2. Создание структуры многостраничного сайта
3. Шаг 3. Настройка и редактирование главной страницы
4. Шаг 4. Добавление новых страниц к сайту
5. Шаг 5. Как переименовать страницы и прописать URL
6. Шаг 6. Создание меню на сайте
7. Подключение домена, Яндекс Метрика и Яндекс Вебмастер.
8. Настройка начального SEO многостраничного сайта
9. Основные рекомендации для SEO продвижения многостраничного сайта

Похожее:

• Как создать сайт статей или блог.
• Как создать интернет магазин.
• Как создать сайт учителя.
• Как создать сайт воспитателя.

И в качестве примера попробуем создать многостраничный сайт бесплатно на конструкторе сайтов. Для удобства разобьем весь процесс на несколько этапов.

Для начала ознакомьтесь с инструкцией: Описание кнопок в редакторе сайта на конструкторе Tobiz.
 

Шаг 1. Выбор и установка шаблона

На странице Шаблоны сайтов выберите подходящий шаблон. Либо начните делать сайт с нуля, нажав на кнопку Создать сайт. Установленный шаблон появится в вашем аккаунте на странице Проекты. 

Выбрать вы можете, как одностраничный шаблон и увеличить его затем до многостраничного, так и многостраничный шаблон и просто изменить его под себя.

Шаг 2. Создание структуры многостраничного сайта

Определите, какие страницы будут на сайте. Для этого можете начертить примерный список страниц в текстовом редакторе. 

Примерный набор страниц для многостраничного сайта:

1. Главная
2. О компании
3. Услуги, которые могут подразделяться на дополнительные страницы:
   3.1.Услуга 1
   3.2. Услуга 2
   3.3. Услуга 3
4. Примеры работ/Отзывы
5. Контакты
6. Блог 

На этом этапе желательно хотя бы в текстовом виде прописать, какие основные моменты будут находиться на каждой странице.

Далее нужно отредактировать главную страницу сайта. Остальные страницы мы добавим позже.

Шаг 3. Настройка и редактирование  главной страницы

Чтобы отредактировать главную страницу перейдите в Проекты и нажмите рядом со страницей кнопку "Редактировать сайт". 

Если вы делаете сайт с помощью шаблона, то просто отредактируйте блоки сайта под свою компанию. Удалите те блоки, которые вам не нужны и добавьте новые, нажав на кнопку "Добавить блок". 



 

Как сделать Главную страницу с нуля

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

1. Меню.
2. Обложка с формой.
3. Текстовый блок с изображением или без.
4. Блок Преимущества компании.
5. Блок Галерея
6. Форма обратной связи.
7. Карта с контактами.
8. Подвал.

Рекомендуем на Главной странице добавлять 2-3 формы обратной связи на ваше усмотрение.

Теперь переходим к добавлению блоков:​

1. Зайдите в редактор страницы.
2. Нажмите на кнопку "Добавить блок".
3. Выберите раздел "Шапка и меню" и нажмите на любое меню, которое вам нравится. Меню добавиться на сайт. Редактировать его пока необязательно.
4. Далее добавим обложку. Нажмите на "Добавить блок" и выберите раздел "Обложка". Нажмите на блок, например, самый первый 201 блок. Страница теперь выглядит так:
   
   
    
5. Далее нажмите на "Добавить блок" и выберите раздел либо "Текстовый блок" либо "Контент", в зависимости от того, какой текстовый блок хотите добавить: с картинкой или без. Добавьте блок, нажав на него. Теперь под обложкой появился текстовый блок.
   
   
    
6. Теперь снова выберите библиотеку блоков и нажмите на раздел Преимущества, чтобы заполнить потом достоинства вашей компании, почему клиент должен выбрать именно вас.
   
   
    
7. Далее из раздела Галерея добавьте блок с фотографиями. Здесь вы сможете добавить фото услуг вашей компании.
   
   
    
8. Форму обратной связи вам нужно добавить из раздела Форма и кнопка.
   
   
    
9. В библиотеке блоков перейдите в раздел Контакты и выберите блок с картой.
   
   
    
10. И, наконец, добавьте подвал из раздела Подвал сайта. 
    
    
     

Когда вы добавили все блоки, поправьте их под себя. Добавьте информацию, касающуюся вашей компании. 

Чтобы отредактировать карту, воспользуйтесь инструкцией: Как сделать метки на Яндекс картах

Блок меню рекомендуем оформлять после того, как добавлены остальные страницы сайта.

Шаг 4. Добавление новых страниц к сайту

Теперь нужно создать другие страницы сайта.

1. Для этого нужно зайти на страницу Проекты и под своим сайтом нажать на кнопку "Добавить страницу". У вас появилась новая страница.
   
   
   
   Также можно скопировать страницу Главной и создать новую страницу. Для этого нажмите на три точки рядом с кнопкой РЕДАКТИРОВАТЬ и выберите первую кнопку:
   
   
    
2. Через кнопку "Добавить страницу" добавьте еще несколько страниц. Первая страница, где открыт глаз - это Главная страница. В остальных страницах глаза должы быть закрыты.
   
   
    
3. Когда страницы добавлены, вы видите, что вместо названий страниц отображается набор чисел и количество просмотров, заказов и конверсия. Эти показатели используются при AB тестировании. Сейчас это вам не нужно, поэтому отключим их и переведем названия страниц в обычный вид. 
   
   
    
4. Перейдите в "Настройки проекта" и в основных настройках нажмите на  "Использовать страницы вместо A-B тестирования", активируйте ее, чтобы переключатель стал зеленым. Сохраните.
   
   
    
5. Вернитесь на страницу с проектами. Теперь сайт со страницами выглядит так:
   
   

Подробнее о том, как копировать страницу в статье: Как добавить страницу к сайту. 

Шаг 5. Как переименовать страницы и прописать URL

Далее вам нужно переименовать все страницы. Для примера переименуйте Главную:

1. Нажмите на 3 точки рядом с кнопкой Редактировать.
   
   
    
2. Нажмите на первую кнопку с файлом и карандашом.
   
   
    
3. Появится окно с настройками. Пропишите название "Главная". Для других страниц соответствующие им названия. 
   
   
    
4. Далее увидите поле URL страницы. На Главной его нужно оставить пустым! Для других страниц вашего сайта вам нужно сделать URL, нажав на кнопку "Заполнить". Или можно добавить другой URL с помощью сайта Транслит. Используйте транслитерацию для поисковиков.
   
   
    
5. Далее вы можете прописать SEO вашей страницы, это нужно для продвижения сайта - title и description. Вот подробная инструкция, как прописать мета-теги.
   
   
    
6. Если SEO настройки выключены, то переключатель становится неактивным и выглядит так:
   
   
    
7. Сохраните изменения.

Таким же образом настраиваем остальные страницы сайта. Далее в редакторе каждой страницы добавляем блоки, по примерно такому алгоритму, как на Главной странице. 

Шаг 6. Создание меню на сайте

Важный шаг - создание единого меню на сайте.

1. Сначала отредактируйте меню на Главной странице. В статье Как сделать горизонтальное меню на сайте подробно написано о том, как сделать горизонтальное обычное меню и выпадающее меню.
2. Далее нужно добавить сделанное меню на остальные страницы сайта. Чтобы созданное вами меню появлялось на каждой странице, не нужно ставить меню на каждую страничку сайта. Можно поступить гораздо проще. Вам нужно добавить меню с помощью блока-ссылки. Инструкция, как добавить меню с помощью блока-ссылки. 

Не забывайте нажимать кнопки сохранения между выходом из страниц!

После того, как добавите меню с помощью блока-ссылки на каждую страницу, вам нужно будет редактировать его только на Главной странице. На остальных страницах меню будет меняться автоматически. 

С помощью блока-ссылки можно добавить любой блок на любую страницу сайта. Подвал добавляется по такому же алгоритму. 
 

Подключение домена, Яндекс Вебмастер и Яндекс Метрика

После того, как сделали сайт вам нужно подключить домен, а затем добавить его в Яндекс Метрику и Яндекс Вебмастер.

Инструкции:

1. Подключение домена. Доменное имя – это адрес сайта, который выходит в поисковой строчке. Если сайт вообще не имеет никакого доменного имени, в Интернете его просто напросто не будет. После подключения домена, если у вас тариф выше тарифа BIZ, рекомендуем подключить SSL сертификат для защищенного соединения с сайтом. 
2. Как подключить Яндекс Метрику. Яндекс.Метрика – это сервис, который позволяет отслеживать работу сайта – его посещаемость, поведение посетителей на сайте и многое другое. 
3. Как добавить сайт в Яндекс Вебмастер. Яндекс Вебмастер - это сервис, с помощью которого вы сможете контролировать, насколько хорошо работает сайт. Он проводит диагностику ошибок сайта, также проверяет настройки мета тегов, показывает индексацию страниц сайта в поиске и многое другое. 

Настройка начального SEO многостраничного сайта

После того, как добавили всю информацию на сайт и отредактировали страницы настройте первоначальное SEO. Это нужно для того, чтобы улучшить результаты выдачи в поисковой системе. 

Делаем первичную SЕО оптимизацию сайта:

1. Сбор ключевых запросов сайта. Ключевые запросы — это словосочетания, которые, обычно, вводят люди, для поиска нужной информации, услугу или товара.  Зайдите на сервис Wordstat Yandex. Введите основную тему вашего сайта и соберите некоторые ключи, которые вы далее сможете добавить в мета теги сайта, а также в тексты на сайте. 
2. Мета-теги. Пропишите мета теги (seo-заголовок и seo-описание) у каждой страницы или у всего сайта, если ранее этого не сделали. При заполнении мета тегов используйте собранные ключевые запросы для сайта. Заголовки страниц обязательно должны быть уникальными! Инструкция: Как прописать title, description, keywords. 
   
   
3. Настройка Open Graph Image. Open Graph - это изображение, которое будет прикрепляться к ссылке на ваш сайт при размещении его в социальных сетях и мессенджерах. Это привлекает внимание клиентов. 
4. Проверьте ЧПУ. По-другому, человекопонятный URL. Первоначально URL страницы на конструкторе выглядит так: https://220409.lp.tobiz.net/?v=369065  Главную страницу мы должны оставить с пустым полем URL. Она будет выглядеть так: https://220409.lp.tobiz.net/ Остальные страницы, когда вы заполните URL будут выглядеть примерно так: https://220409.lp.tobiz.net/uslugi/. То есть к ссылке на главную будет привязываться хвост страницы.  Выше в разделе Шаг 5 мы рассказывали, как это сделать. Прописывается только ссылка на страницуя, а не вставляется ссылка на весь сайт. 
   
   
    
5. Добавление на страницы сайта заголовков H1, H2, H3. Желательно использовать ключевые запросы в заголовках.
6. Добавление фавикона на сайт. Фавикон необходим для поисковых систем и отображается в поисковой выдаче рядом с заголовком сайта.

Если вы пройдетесь по данному чек-листу и сделаете все эти пункты, это повлияет на то, что поисковые системы начнут показывать ваш сайт и поймут, что он существует.

Далее для более глубокого SEO продвижения предстоит большая работа с сайтом.
 

Основные рекомендации для SEO продвижения многостраничного сайта

1. Текст на сайте должен быть полезным и интересным для людей. А чтобы поисковики поняли, что сайт полезен, в тексты на сайте нужно добавить ключевые запросы. Можете добавить подобные запросы несколько раз на одной странице, желательно не более пяти, но это больше зависит от количества символов в тексте.
2. Продвигайте сайт с помощью ссылок: бесплатных и платных. Как разместить ссылки для сайта.
3. Дополняйте сайт контентом постоянно. Для этого также можно добавить Блог со статьями на сайт. Собирайте ключевые запросы для статей также через сервис Wordstat. Для того, чтобы сделать статьи вам понадобятся инструкции-алгоритм создания блога:

Как собрать ключевые запросы-темы для статей
Как составить техническое задание для копирайтера (если вы будете писать статьи не сами)
Как добавить блог на сайт

Также читайте в другой статье  про SEO-продвижение сайта.

Важно знать! 

• Если у вас многостраничный сайт, настройки проекта можно не заполнять, достаточно настроек страниц сайта.
• На нашем конструкторе возможно создать многостраничный сайт (лендинг).
• Есть возможность добавлять доп. страницы.
• На конструкторе возможно создать много страничные сайты.
• Как на одном сайте сделать несколько страниц.

Пользователи также ищут:

• Возможно ли на вашем конструкторе создать сайт, чтобы на нем можно было расположить стили, в которых я работаю, по отдельным полкам. Что-то вроде главных папок с заголовками, кликая на которые посетитель будет открывать нужный раздел
• Как сделать так, чтобы главная страница сайта была доступна только по одному адресу
• Можно ли поменять шаблон сайта на другой за такие же деньги? - Нет, это сделать нельзя.
• Как сделать, чтобы при нажатии на кнопку перекидывало на другую страницу?
• Можно ли настроить, чтобы, нажав кнопку "пройти тест", переходило на сам тест? - Да, конечно. Для этого вам нужно в настройках кнопки указать переход (поставить ссылку) на страницу с тестом
• Сайт открывается, но картинки и эффекты загружаются дольше. Подскажите, можно что-то сделать, чтобы сайт открывался сразу загруженный? - Относительно загрузки сайта многое зависит от скорость интернета, а также от того, насколько много и насколько "тяжелые" картинки или видео применяются на страницах проекта
• Мне нужно сделать многостраничный сайт, я сделала все по инструкции, первое время страницы переключались, потом перестали (вылезает страница 404 ошибка). Как быть? - В этом случае необходимо прописать URL страницы Каталога в настройках страницы. Если URL по какой-то причине слетает, необходимо закрыть все вкладки, установить URL, нажать "сохранить". Только потом открыть редактор. Тогда всё будет оптимально работать.