Посадочная страница за 18 шагов

Мы уже писали о том, что такое посадочная страница. Теперь мы хотим на примере показать вам, как можно сделать один из таких одностраничных сайтов. Подобные страницы, как правило, посвящены какому-то особому мероприятию: лекции, выставке, семинару и так далее. Их специфика заключается в том, что у них нет меню, и вся важная информация по мероприятию оформлена на одной единственной странице, которая поделена на несколько разделов. Что может быть на такой странице? Например, краткое описание мероприятия, дата и время его проведения, информация о доступности входных билетов или абонементов, расписание, список специальных гостей, фотографии с прошлых аналогичных мероприятий и, конечно, контактная форма для возможных вопросов или отзывов.

Посадочная страница из нашего примера будет посвящена книжной ярмарке. Для создания посадочной страницы необходимо следующее:

  • Сайт на Jimdo
  • Любой графический редактор. Он может понадобиться для работы над разными связанными с графическим дизайном мелочами и фотографиями. Если у вас нет необходимости в постоянном наличии такого редактора на компьютере, вы всегда можете воспользоваться одним из онлайн-сервисов, например, Pixlr

Пошаговая инструкция создания посадочной страницы

1. Для начала мы регистрируем обычный сайт на Jimdo и выбираем для него шаблон. В нашем случае давайте остановимся на простом и всем доступном шаблоне F4240.

 

 

 

 

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

2. Для фона мы используем обычную фотографию с эффектом размытия (Lens Blur) и небольшой дополнительной обработкой. Хотелось бы особо подчеркнуть, что для того, чтобы быть использованным в качестве фона, изображение должно быть большим, например, 2.000 х 1.500 пикселов.

  

Для того, чтобы его применить, мы сохраняем изображение в формате .jpg, после чего заходим в админ-панель нашего Jimdo-сайта: "Стиль" – "Собственный фон". В настройках фоновых изображений и видео мы выбираем режим "Одиночное изображение" и загружаем наш фон, после чего не забываем нажать на кнопку "Сохранить".

Подробнее о настройках собственного фона на сайте можно прочитать в онлайн-помощи.

3. Как известно, на посадочной странице практически никогда не используется меню, и в данном случае оно нам тоже не нужно. В настройках навигационного меню нажимаем на иконки с изображением глаза напротив каждого из имеющихся пунктов и сохраняем результат. Если мы теперь выйдем из режима редактирования и посмотрим на сайт, то увидим, что меню исчезло, а вместо него осталось пустое пространство. Как раз такого эффекта мы и хотели добиться!

4. Переходим к названию сайта. По умолчанию в шапке сайта стоит белая надпись "Название сайта", которая нас, конечно же, не устраивает. Чтобы изменить ее, нужно зайти в режим редактирования и клинуть на шапку сайта, открыв настройки шапки сайта. В них нас интересует вкладка "Заголовок". Если вы пользуетесь версией JimdoFree, то вам можно просто изменить название сайта на, скажем, "Книжная ярмарка". У пользователей версий JimdoPro и JimdoBusiness есть возможность установить в шапку сайта собственный логотип.

Для загрузки логотипа нужно перейти во вкладку "Логотип" и загрузить заранее приготовленное лого. Стоит также обратить внимание на различные настройки, отвечающие за размер и позиционирование вашего логотипа. На нашем сайте-примере мы расположим его посередине.

 

После этого мы переходим во вкладку "Изменить шапку" и слегка меняем высоту нашей шапки сайта, чтобы сверху и снизу логотипа было достаточно пространства.

 

5. Теперь переходим к области контента на сайте. По нашей первоначальной задумке, мы бы хотели разместить основную информацию, необходимую посетителям сайта, в самом верху страницы: дату и место проведения выставки, а также информацию о наличии мест в выставочных и лекционных залах. Конечно, мы могли бы просто написать эти данные сверху, но это было бы слишком легко и невыразительно. Поэтому, давайте разобьем информацию на три блока "Когда", "Где" и "Места". 

 

Оставить комментарий

Комментарии: 0