Обзор простого одностраничного демо-сайта

Приведённый пример простого одностраничного сайта имеет форму обратной связи и удобную админ-панель, с помощью которой Вы сможете разместить/редактировать информацию на своём сайте.

Пользовательская часть сайта

В качестве примера, я разместил на демо-сайте информацию об юридических услугах. Основная информация разделена на следующие блоки:

  1. О нас - вступление, несколько слов о том, куда вообще попал посетитель. В этот блок добавлена картинка на юридическую тему, которая также помогает быстро понять о чем сайт.
  2. Наши преимущества - почему посетителю сайта выгодно сотрудничать именно с этой компанией.
  3. Услуги - перечень оказываемых услуг.
  4. Прайс-лист - таблица с ценами на услуги.
  5. Контакты - контактные данные компании.

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

Простой одностраничный сайт

В правой части сайта находится форма обратной связи и виджеты на официальные группы компании в социальных сетях - «Мы Вконтактах», «Мы на Одноклассниках».

Страница «Спасибо»

После отправки сообщения через форму обратной связи происходит перенаправление на страницу «Спасибо» (thank-you.html). Это нужно для того, чтобы была возможность с помощью utm-меток получить статистику - сколько было отправлено сообщений.

Страница «Спасибо»

Админ-панель

Данный одностраничный сайт сделан на платформе MODX, имеющей админ-панель с множеством настроек. Чтобы неопытному администратору было удобно править информацию не опасаясь «сломать» сайт, создан отдельный аккаунт с ограниченными возможностями. В результате получилась простая панель управления сайтом, где нет ничего лишнего. Вы сможете легко и быстро разобраться в ней даже без документации.

Зайдя в админ-панель выберите пункт меню - Содержимое/Конфигурация. Откроется страница с настройками сайта.

Админка сайта, переход в настройки

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

Сравнение настроек в админке с пунктами меню навигации на сайте

После того, как отредактировали текст в админке, нажмите на кнопку «Сохранить конфигурацию», расположенной в верхнем правом углу.

Кнопка «Сохранить конфигурацию»

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

Адаптивный дизайн

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

Проверка адаптивного дизайна демо-сайта

Посмотреть вживую Демо-сайт. Чтобы заказать похожий сайт перейдите на страницу Контакты и свяжитесь со мной.

Расскажите о нас своим друзьям: