Обзоры расширений Joomla

Видео уроки Website X5 13 и 12Видео уроки Website X5 13 и 12

Видео уроки на русском языке по самостоятельному созданию сайта с нуля в Incomedia Website X5 Evolution и Professional 12, 13.

 

 

В предыдущей статье «Обзор WebSite Evolution 10 (часть 2). Конструктор сайтов» мы рассмотрели вопросы, связанные с созданием и редактированием шаблона. В этой части поговорим о структуре сайта в целом. Создать сайт с помощью конструктора Incomedia WebSite X5 Evolution 10 несложно.  Приступая к работе над сайтом в программе, прежде необходимо всё максимально детально продумать. Особенно это относится к планированию структуры сайта. Так как  может отразиться на удобстве пользования Вашим сайтом.

Создание карты сайта

Создание сайтов в программе Website X5 на втором шаге предполагает формирование структуры или карты сайта (рисунок ниже).

Incomedia WebSite X5 Evolution 10

Incomedia WebSite X5 Evolution 10 предоставляет весьма удобные инструменты для этих целей. Рассмотрим те из них, которые не были затронуты в статье «Обзор Incomedia WebSite X5 Free 10 (часть 3). Создаем сайт сами».

Над областью карты сайта есть панель инструментов. Кнопки Развернуть и Свернуть позволяют сворачивать и разворачивать категории и подкатегории в карте сайта. Это служит только для упрощения работы с программой. На сам сайт это не влияет.

Инструмент Скрыть страницу в меню позволяет скрыть выбранные Вами страницы из меню сайта. Но к ним всё равно могут получить доступ пользователи. На тестовом сайте такой страницей является «Карта сайта».

Если Вы хотите запретить просматривать некоторые страницы сайта незарегистрированными пользователями, то специально для этого служит инструмент Защищённая страница. При помощи него Вы отмечаете те страницы, которые хотите закрыть от незарегистрированных пользователей.

Website X5 Evolution

Website X5 Evolution предоставляет возможность выбрать, каким конкретно пользователям или группам пользователей можно открывать доступ к той или иной «приватной» странице сайта. Как создавать и настраивать пользователей или группы пользователей мы обсудим в статье «Обзор WebSite Evolution 10 (часть 9). Создание сайта своими руками». На тестовом сайте «приватными» страницами являются страницы категории портфолио. Вы можете проверить работу инструмента Защищённая страница на тестовом сайте.

  • Логин – Создание сайтов
  • Пароль – программа конструктор сайтов

В Incomedia WebSite X5 Evolution 10 предусмотрен такой элемент меню как Разделитель. Чтобы добавить его в меню, Вам необходимо просто нажать кнопку Разделитель в меню справа от карты сайта. Можно задать текст разделителя. У этого элемента нет свойств. Это простой текст в меню.

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

Свойства страницы

Рассмотрим, какие возможности касательно свойств страниц (рисунок ниже) предоставляет WebSite X5 Evolution 10. Те из инструментов, что уже были освещены в статье «Обзор Incomedia WebSite X5 Free 10 (часть 3). Создаем сайт сами» рассматриваться не будут.

Создание сайтов

Создание сайтов должно ориентироваться в первую очередь на целевую аудиторию. На людей. Не на поисковых роботов. Но многие пользователи находят сайты в сети именно благодаря поисковым системам. Именно поэтому программа конструктор сайтов Incomedia WebSite X5 Evolution 10 оснащена рядом инструментов, которые помогут Вам лучше представить сведения о Вашем сайте и о его страницах поисковым системам. Свойства страницы разделены на три вкладки.

  1. Общие. Рассмотрено в статье «Обзор Incomedia WebSite X5 Free 10 (часть 3). Создаем сайт сами».
  2. Графика.
  3. Эксперт.

На вкладке Графика (рисунок ниже) Вы можете настроить внешний вид конкретной страницы.

Программа конструктор сайтов

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

  • Цвет фона. В качестве особого фона Вы можете задать сплошной цвет.
  • Изображение. В качестве особого фона Вы можете задать изображение в формате JPG, JPEG, GIF или PNG.
  • Положение. Если Вы задали в качестве фона изображение, то данная опция позволит Вам задать положение этого изображения. Доступно пять параметров: Без повторения, Повторение по горизонтали, Повторение по вертикали, Замостить изображение, По ширине окна.
  • Выравнивание. Задаётся выравнивание фонового изображения. Доступны следующие параметры Сверху – Слева, Сверху, Сверху – Справа, По центру – Слева, По центру, По центру – Справа, Снизу – Слева, Снизу, Снизу – Справа.
  • Фиксированный фон. Данная опция позволяет зафиксировать фон страницы в случае, если содержимое страницы не помещается полностью на экране пользователя и он начинает прокручивать страницу вниз. По аналогии с подобной опцией при редактировании шаблона сайта.

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

В поле Пиктограмма для пункта меню можно указать картинку, которая будет появляться рядом с названием меню. Доступны изображения в формате JPG, JPEG, GIF или PNG.Пример работы данных настроек можно увидеть на тестовом сайте.

Программа конструктор сайтов Incomedia WebSite X5 Evolution 10 позволяет Вам создать страницу без шаблона. Для этого активируйте опцию Создать страницу без шаблона. Для этой страницы можно задать свою ширину (опция Ширина страницы).

Создать сайт с помощью конструктора

Создать сайт с помощью конструктора не всегда может Вас удовлетворить. Например, если Вы захотите добавить комментарии к статьям от социальной сети В контакте, то Вам придётся немного поработать с кодом. Для этого понадобится вкладка Эксперт (рисунок выше).

  • Расширения генерируемых файлов. Вы можете выбрать, с каким расширением будет генерироваться та или иная страница. Доступно html, php, asp, cfm, jsp. Помимо этого можно указать своё расширение. Нельзя менять расширение для защищённых страниц. Оно будет PHP. Если Вы не знаете, зачем именно нужна эта опция, не изменяйте её.
  • Пользовательский код. Так же, как и в случае с настройкой сайта в целом, Вы можете указать, в какую часть конкретной страницы надо поместить Ваш фрагмент кода. Доступны такие части страницы: Перед закрывающимся тегом HTML, Перед закрывающимся тегом HEAD, Атрибуты тега BODY (style, onload и т.д.), Перед закрывающимся тегом BODY, После закрывающегося тега BODY. Выбрав ту или иную опцию, Вы можете ввести нужный Вам фрагмент кода в поле ниже. Оно отмечено надписью «В это поле можно ввести код службы статистики посещаемости, свой скрипт, применяемый ко всем страницам сайта или CSS-код».
  • Добавить эту страницу к карте сайта. Включив данную опцию, Вы указываете, что необходимо добавить эту страницу в карту сайта. Карта сайта облегчает индексацию Вашего проекта поисковыми системами. Немного детальнее о том, зачем она нужна, Вы можете прочесть в статье «Обзор Xmap. Карта сайта для Joomla».
  • Приоритет контента. Приоритет конкретной страницы сайта (от 0 – Максимально низко до 10 – Максимально высоко) по отношению других страниц. Не рекомендую для всех страниц устанавливать один и тот же приоритет (не важно какой). Учитывайте, что это значение всего лишь рекомендация, а не чёткая и обязательная к выполнению директива поисковым системам. По большому счёту, она не сильно влияет на процесс индексации. Выставление максимального приоритета не гарантирует попадание той или иной статьи в индекс или на лидирующие позиции в поисковой выдаче. Советую выставлять приоритет взвешенно, в зависимости от действительной важности элементов карты сайта по отношению друг к другу.
  • Частота обновления. Частота, с которой обновляется та или иная страница сайта. Доступны такие значения как Всегда, Каждый час, Каждый день, Каждую неделю, Каждый месяц, Каждый год, Никогда. Служит для указания поисковым системам частоты обновления страницы сайта (информации на ней). Другими словами, подсказывает поисковому роботу, как часто надо посещать страницу для проверки её изменений (повторной индексации). Не рекомендую для всех материалов устанавливать одну и ту же частоту обновления. Учтите, что это значение всего лишь рекомендация, а не чёткая и обязательная к выполнению директива поисковым системам. По большому счёту, она не сильно влияет на процесс индексации. Выставление ежечасной частоты обновления не гарантирует ежечасный приход поискового робота на ту или иную страницу. Советую выставлять частоту обновления взвешенно, в зависимости от действительной периодичности обновления. Отмечу, что если, например, к статье сайта предусмотрены комментарии и они появляются достаточно часто, например, ежедневно, то есть смысл выставить ежедневную частоту обновления. Так как, заходя на страницу, поисковый робот видит не только саму статью, но и элементы интерфейса и комментарии. Иногда замечал, что сайт попадает в результаты поисковой выдачи именно по фразам, которые содержатся в комментариях.

Добавление карты в Mail.ru

Создать сайт с помощью конструктора и экспортировать его в интернет – не последний этап. После того, как сайт появился в сети,  можно добавить карту сайта в несколько поисковых систем для ускорения индексации. Советую это делать тогда, когда сайт более или менее готов. Как добавить карту сайта в Google, Яндекс и Bing было описано ранее. Для сайтов, сделанных в Incomedia WebSite X5 Evolution 10 (как и для любых других) этот процесс ничем не отличается.

Для добавления карты сайта в кабинет вебмастера Mail.ru Вам необходимо завести учётную запись в любом сервисе Mail.ru (почта, социальная сеть Мой мир Mail.ru и так далее), если такой ещё нет. Затем пройти процедуру подтверждения прав собственности на Ваш сайт. После чего в кабинете вебмастера Mail.ru (рисунок ниже) нажмите на иконку карандаша в правой части таблицы (столбец Мета).

Кабинет вебмастера Mail.ru

В появившемся окне (рисунок ниже) введите путь к Вашей карте сайта.

Website X5

Website X5 создаёт карту сайта в корневом каталоге сайта. Так что путь будет «/sitemap.xml» (без кавычек). После этого нажмите Сохранить.

Для создания карты любого сайта, не только сделанного в WebSite X5, можно воспользоваться инструментом, подробное описание которого Вы можете прочесть в статье «Обзор WebSite Auditor. Программа для раскрутки сайта».

Robots.txt для сайтов WebSite X5

Программа конструктор сайтов Incomedia WebSite X5 Evolution 10 не генерирует файл robots.txt. На мой взгляд, это очень странно. О важности и пользе данного файла в сети есть множество статей. Если кратко, то в этом файле Вы указываете, какие поисковые системы директории и\или файлы Вашего сайта можно или нельзя индексировать. В отличие от информации в карте сайта, информация в robots.txt воспринимается поисковыми системами как обязательная к выполнению. Зачем нужно закрывать от индексации те или иные директории? Для того, чтобы поисковые роботы не тратили своё время и ресурсы Вашего сервера на индексацию ненужного содержимого. Например, на индексацию фрагментов изображения капчи в папке «captcha» .

Хочу предложить Вам свой вариант файла robots.txt для сайта, сделанного в Incomedia WebSite X5 10 (неважно, платная или бесплатная версия).

User-agent: *

Disallow: /admin/

Disallow: /captcha/

Disallow: /menu/

Disallow: /imemail

 

User-agent: Yandex

Disallow: /admin/

Disallow: /captcha/

Disallow: /menu/

Disallow: /imemail

Host: ХХХ

Sitemap: http://ХХХ/sitemap.xml

Вместо «ХХХ» подставьте доменное имя Вашего сайта с учётом наличия или отсутствия «www». Немного детальнее о robots.txt Вы можете прочесть в справке для вебмастеров Яндекс и в справке для Веб-мастеров Google.

Разместите файл robots.txt с вышеуказанным содержимым (добавив свой домен) в корне сайта.

Создание страниц в WebSite X5 Evolution 10

После формирования карты сайта Вы приступаете к наполнению страниц содержимым. Это второй шаг при работе над проектом в Website Evolution.

Website Evolution

Создать сайт с помощью конструктора Incomedia WebSite X5 Evolution 10 на втором шаге предлагаю начать с разработки макета страниц (рисунок выше). В предыдущей статье «Обзор Incomedia WebSite X5 Free 10 (часть 3). Создаем сайт сами» были рассмотрены некоторые инструменты и принципы по работе с макетом страницы. Рассмотрим только те инструменты, которые отличаются или были недоступны в версии Free.

Выделив нужный объект, размещённый в таблице макета страницы, и нажав на пиктограмму Определить стиль ячейки (в панели инструментов над областью макета страницы справа от кнопки Редактировать), Вы перейдёте на страницу Стиль ячейки (рисунок ниже).

Incomedia Website X5

Incomedia Website X5 позволяет настроить внешний вид каждой отдельной ячейки макета страницы. Инструменты стиля ячейки разделены на три вкладки:

  1. Стиль.
  2. Текст.
  3. Библиотека.

Рассмотрим их более детально.

Фон. В качестве фона ячейки Вы можете задать Цветовой фон ячейки, Градиентный фон, Фоновое изображение, Подогнать под размер ячейки. Каждый из этих фонов содержит свой набор опций. Некоторые из опций повторяются от фона к фону. Рассмотрим их более детально (если опция была рассмотрена для одного фона, и она повторяется в настройках другого, то она не будет рассматриваться).

Цветовой фон ячейки. Вы можете задать сплошной цвет фона для ячейки (включая прозрачность). Для этого предназначена опция Цвет (рисунок ниже). Выбрав любой цвет, Вы можете задать ему степень прозрачности (опция Непрозрачность). Толщина рамки позволяет задать толщину обводки ячейки. Вы можете задать разную толщину для левой, правой, верхней и нижней частей обводки. Опция Цвет позволяет задать цвет границы обводки ячейки. Вы можете задать разный цвет для левой, правой, верхней и нижней частей обводки. Чтобы скруглить углы обводки, воспользуйтесь опцией Сглаживание углов. Можно задавать разное сглаживание разным углам.

Цветовой фон ячейки

Опция Тень (рисунок ниже) позволяет настроить тень, отбрасываемую ячейкой. Можно задать цвет тени, смещение по оси X и Y относительно ячейки (от 0 до 25), а также диффузию (от 0 до 50) и размер (от 0 до 50).

Тень

Выравнивание. Вы можете задать выравнивание объекта, помещённого в ячейку. Доступны такие параметры: Сверху – Слева, Сверху, Сверху – Справа, По центру – Слева, По центру, По центру – Справа, Снизу – Слева, Снизу, Снизу – Справа.

Внешние поля. Программа конструктор сайтов позволяет задать отступ в пикселях (от 0 до 250) от края объекта до края ячейки. Можно задать разный отступ для разных сторон.

Внутреннее поле. Вы можете задать отступ в пикселях (от 0 до 250) от содержимого объекта до края самого объекта. Можно задать разный отступ для разных сторон.

Выбрав в качестве фона Градиентный фон (рисунок ниже) Вы сможете выбрать два цвета (Начальный цвет градиента и Конечный цвет градиента) градиента для фона ячейки. При помощи опции Диффузия Вы сможете задавать «линию» начала перехода одного цвета в другой. При помощи опции Направление Вы задаёте направление самого градиента (Слева, Справа, Сверху).

Градиентный фон

Пример настройки стиля ячейки Вы можете увидеть на тестовом сайте.

Incomedia WebSite X5 Evolution 10 позволяет в качестве фона ячейки задать изображение в формате JPG, JPEG, GIF или PNG. Можно задать его положение (опция Положение). Доступно пять параметров: Без повторения, Повторение по горизонтали, Повторение по вертикали, Замостить изображение, По ширине окна. Опции работают аналогично тем, которые описаны в статье «Обзор WebSite Evolution 10 (часть 2). Конструктор сайтов». Выбрав изображение, Вы можете задать в опции Насыщенность цвета цвет, который необходимо добавить в изображение, а также задать его степень прозрачности (опция Непрозрачность). Другими словами, задав красный цвет и выбрав 100% непрозрачности Вы перекрасите всё изображение в красный цвет.

Фоновое изображение

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

Опция Подогнать под размер ячейки

На второй вкладке Текст (рисунок ниже) можно задать текстовые надписи для объекта в ячейке. Этого не было в бесплатной версии Incomedia Website.

Incomedia Website

Можно задать Заголовок, Изображение для ‘шапки’ страницы и Текст описания.

Для заголовка (рисунок выше) доступны такие опции как:

  • Контент. Строка для ввода текста заголовка.
  • Цвет фона. Цвет фона для заголовка ячейки.
  • Цвет текста. Цвет текста заголовка ячейки.
  • Шрифт. Настройки гарнитуры, кегля и начертания шрифта заголовка ячейки.
  • Выравнивание. Выравнивание заголовка ячейки (Слева, По центру, Справа).
  • Внешние поля. Программа конструктор сайтов задаёт отступ в пикселях (от 0 до 50) от области заголовка до края ячейки. Можно задать разный отступ для разных сторон.
  • Внутренние поля. Вы можете задать отступ в пикселях (от 0 до 50) от заголовка до края области заголовка. Можно задать разный отступ для разных сторон.
  • Изображение для ‘шапки’ страниц. Данная опция позволяет в качестве фона заголовка ячейки задать изображение в формате JPG, JPEG, GIF или PNG.

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

Третья вкладка Библиотека (рисунок ниже) содержит 32 стиля оформления ячейки.

Incomedia

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

В конце статьи «Обзор WebSite Evolution 10 (часть 10). Создание сайта HTML» Вы можете скачать файл проекта (*.IWZIP) тестового сайта к данному циклу статей.

Пример работы библиотеки Вы можете увидеть на тестовом сайте.

Как видите, программа конструктор сайтов Incomedia WebSite X5 Evolution 10 обладает большим количеством инструментов для настройки внешнего вида Вашего сайта. В следующей статье «Обзор Incomedia WebSite X5 Evolution 10 (часть 4). Самостоятельное создание сайта» мы начнём рассмотрение объектов, которые превращают создание сайтов в интересную задачу.

Видео уроки Website X5 13 и 12Видео уроки Website X5 13 и 12

Видео уроки на русском языке по самостоятельному созданию сайта с нуля в Incomedia Website X5 Evolution и Professional 12, 13.

 

Полезные ссылки: