Обзор Artisteer (часть 1). Шаблоны Joomla 1.5

• Тип – программа для создания шаблонов Joomla, Wordpress, Drupal.
• Платная версия Home и Academic Edition – 398 гривен. (09.08.2011)
• Платная версия Standard Edition – 1036 гривен. (09.08.2011)
• Купить Artisteer на официальном сайте.

• Интерфейс.
• Идеи.

Программа Artisteer – предназначена для автоматизированного создания шаблонов сайтов для популярных систем управления контентом и не только. Принцип работы крайне прост. Шаблон «разделён» на составляющие элементы (лист, верхний колонтитул, меню, статьи, кнопки и так далее), у каждого из них есть ряд параметров, которые можно менять. Количество параметров и настроек этих параметров достаточно велико. Artisteer содержит много встроенных графических элементов (линии, текстуры, фоны, фоновые изображения, иконки и так далее), которые можно применять для создания «уникального» шаблона. Есть возможность подключения собственных изображений и шрифтов, что значительно расширяет возможности для дизайна. Можно не пользоваться встроенными объектами, а, например, нарисовать всё в графическом редакторе (GIMP, Adobe Photoshop и так далее), разрезать и вставить в Artisteer, добавив необходимые шрифты, настроив отступы, интервалы и так далее. Безусловно, возможности Artisteer несравнимы с работой дизайнера, который создаст изображение, и программиста, который превратит изображение в шаблон, написав все необходимые таблицы стилей, разрезав, как надо, изображения и установит полученное на сайт. Разумеется, что сопоставление затрат времени и финансов окажутся не в пользу последнего варианта. Особенно, если мы говорим о сайтах визитках, блогах, личных веб-страницах, форумах, сайтов фирм, не имеющих фирменного стиля, которого нужно придерживаться и так далее.

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

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

Есть ещё возможность найти в интернете готовый шаблон или купить на специальном сайте уже разработанный вариант. Но у этого способа ещё больше недостатков, чем у шаблона, созданного при помощи Artisteer. Среди них следующие:

• такой шаблон может скачать или купить любой.
• Если в шаблоне что-то нужно подправить, то всё равно придётся лезть в код или пользоваться графическими редакторами для изменения изображений.
• Если Вы перенесёте свои сайты, например, с Joomla 1.5 на Joomla 1.7, то есть вероятность того, что шаблоны Joomla 1.5 не сработают для 1.7, их никто не будет переделывать на сайте, с которого Вы взяли эти шаблоны, и всё равно придётся лезть в код или покупать (скачивать) другие шаблоны. Что может плохо сказаться на имидже сайта.
• Такой шаблон может содержать вредоносный код.

Для создания шаблона в Artisteer Вам не нужно глубокое знание CSS и PHP. Графический интерфейс программы прост и понятен. При желании можно редактировать и сам код. Это даст возможность создания более оригинальных решений.

Например, качественные Joomla шаблоны получаются за 20-30 минут. Затем ещё 1-2 часа на их детальную проработку и шаблоны Joomla 1.5 готовы. Это утверждение справедливо и для других версий Joomla, а также для других CMS.

На момент написания статьи (09.08.2011) Artisteer существует в двух версиях. Домашняя\академическая и Стандартная версия. Более подробно о разнице этих версий можно узнать заглянув на сайт Artisteer. Пользуюсь программой с июня 2009 года с версии 2.2.0.17376. В обзоре участвует последняя (09.08.2011) лицензионная стабильная версия Artisteer 3.0.0.41778 Standard Edition на русском языке. Все примеры будут приведены для создания шаблона под систему управления контентом Joomla.

Программно-аппаратная часть:

• Операционная система Microsoft Windows 7 Максимальная SP1 (сборка 7601), x64.
• Разрешение экрана 1920х1080.
• Качество цветопередачи 32 бита.
• Internet Explorer 9.
• Opera 11.50.
• Google Chrome 13.0.782.107.
• Safari 5.1 (7534.50).
• Mozilla Firefox 5.0.1.
• Adobe Flash Playe 10.3.181.34.
• Microsoft .NET Framework 4.

Системные требования, заявленные на официальном сайте программы.

• Процессор Intel или AMD 1500 МГц или выше.
• Свободное дисковое пространство 100 Мб.
• ОЗУ 512 МБ или больше.
• Microsoft Windows XP, Vista, Windows 7.
• Microsoft .NET Framework 2.0 или новее.

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

• Internet Explorer 6 или более новая версия.
• Firefox 2 или более новая версия.
• Opera 9 или более новая версия.
• Safari 1 или более новая версия.
• Google Chrome 1 или более новая версия.

Поддерживаемые технологии (заявленные на официальном сайте программы (источник №1) (источник №2)):

• Drupal (5.x, 6.x, 7.х) система управления контентом.
• WordPress (2.6-3.0) система управления контентом.
• Joomla 1.5, 1.6, 1.7 система управления контентом.
• DotNetNuke 4.9 и более новая версия. Система управления контентом.
• ASP.NET Application.
• Blogger.
• CodeCharge Studio 4.

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

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

Интерфейс

Отмечу тот факт, что программа Artisteer 3 переведён на шестнадцать языков (Арабский, Китайский, Чешский, Датский, Нидерландский, Английский, Французский, Немецкий, Венгерский, Итальянский, Японский, Польский, Португальский, Русский, Испанский, Швецкий).

Интерфейс Artisteer 3 Standard Edition (рисунок ниже) условно можно разделить на три группы.

1. Строка заголовка и Меню Файл.
2. Панель инструментов.
3. Рабочая область.

У Artisteer в строке заголовка (рисунок выше) есть кнопки Меню Файл, Открыть, Отменить действие, Повторить действие, Экспорт шаблона. При нажатии на логотип Artisteer в левом верхнем меню появится меню управления окном программы (Переместить, Свернуть, Развернуть, Закрыть). Меню Файл (рисунок ниже) дублирует команды строки заголовка, а также позволяет сохранить проект, сохранить под другим именем, сменить шаблон (с текущего, например, шаблона Joomla, на WordPress, Blogger, ASP.NET, Drupal, DotNetNuke или CodeCharge Studio), экспортировать в готовый «собранный» файл шаблона для той или иной системы управления контентом, экспортировать в HTML (очень удобно для демонстрации вариантов шаблона заказчикам или руководителям, выложив HTML страницы на хостинг), сменить иконку сайта, просмотреть шаблон в одном из установленных в системе и поддерживаемых Artisteer браузерах (Internet Explorer, Opera, Google Chrome, Safari, Mozilla Firefox), просмотреть данные о лицензии на программу и перейти в её настройки.

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

На вкладке Водяной знак (рисунок ниже) Вы можете задать водяной знак (на подобие знака при использовании пробной версии Artisteer), который будет отображаться на всех рисунках шаблона. Это поможет, например, сберечь Ваш проект от кражи недобросовестными клиентами. Так как для того, чтобы качественно почистить от водяного знака все изображения им придётся потратить не одну тройку часов работы в графических редакторах.

Пример просмотра проекта шаблона с водяными знаками в окне браузера показан на рисунке ниже.

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

На вкладке Параметры CSS (рисунок ниже) Вы можете вставлять произвольный CSS код для шаблона. На рисунке ниже показан пример задания отступа в 10 пикселей от края страницы для модуля Хлебные крошки, находящегося под верхним меню.

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

В настройках Artisteer (рисунок ниже) Вы сможете сменить язык, включить вызов окна Быстрый старт при запуске программы (в нём отображаются последние проекты и возможность выбора создания нового типа шаблона (для Joomla, WordPress, Drupal и так далее)), задать параметры автопросмотра (время в миллисекундах, после которого Artisteer будет применять внесённые вами изменения), подсветка секции при наведении мыши (будет расмотрено немного детальнее ниже в статье).

Панель инструментов Artisteer 3 Standard Edition разделена на двенадцать вкладок (они будут рассмотрены ниже).

1. Идеи.
2. Цвет и шрифты.
3. Макет.
4. Фон.
5. Лист.
6. Верхний колонтитул.
7. Меню.
8. Статьи.
9. Боковая панель.
10. Вертикальное меню.
11. Кнопки.
12. Нижний колонтитул.

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

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

Давайте рассмотрим каждую из вкладок панели инструментов Artisteer 3 Standard Edition более детально.

Идеи

Вкладка Идеи (рисунок ниже) содержит двенадцать «инструментов» разделённых на три группы. Инструментами их назвать сложно. Это кнопки, при нажатии на которые программа Artisteer предлагает дизайн того или иного элемента.

Можно генерировать шаблон полностью при помощи команды (кнопки) Предложить дизайн. Можно генерировать одну из девяти «областей шаблона»:

1. цветовая схема.
2. Набор шрифтов.
3. Макет.
4. Фон.
5. Лист.
6. Верхний колонтитул.
7. Меню.
8. Боковая панель
9. Статьи.

В Artisteer 3.0.0.41778 Standard Edition предустановлено двенадцать стилей. Под стилями понимается подобранные цвета, шрифты, фоны и так далее для сайтов определённой тематики.

1. Общие.
2. Корпоративные.
3. Орнаментальные.
4. Гламурный.
5. Зелёный.
6. Праздничный.
7. Ретро.
8. Грандж.
9. Чистый.
10. Простой.
11. Прозрачный.
12. Широкий.

Перед тем как генерировать шаблон, Вы можете отключить тот или иной стиль\стили. Затем, после выбора понравившегося варианта можно генерировать только определённую область шаблона и\или приступить к «ручному» редактированию.

Ниже я приведу три примера сгенерированных случайным образом шаблонов (стили Общие, Гламурный, Чистый). При желании, Вы сможете просмотреть их не только на рисунке, но и в HTML версии.

1. Общие.
2. Гламурный.
3. Чистый.

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

Как видите Artisteer как программа для создания шаблонов Joomla представляет собой удобный и простой инструмент. При помощи него Joomla шаблоны получаются красивыми и удобными.

Хочу отметить, что команда разработчиков Artisteer постоянно развивает и улучшает свой продукт. На 12.09.2012 уже появилась новая версия Artisteer 4.0 RC (4.0.0.57793) для Windows. Количество новых возможностей поражает!

В итоге, можно сказать, что Artisteer - программа для создания шаблонов Joomla, Wordpress, Drupal. Также она позволяет создавать шаблоны Blogger и некоторые другие. Полный список поддерживаемых CMS Вы можете узнать посетив официальный сайт Artisteer.

В статье «Обзор Artisteer (часть 2). Создание Joomla шаблонов» я рассмотрю такие панели инструментов как: Цвет и шрифты, Макет, Фон, Лист и Верхний колонтитул.

Цикл статей: «Обзор Artisteer (часть 2, 3)».

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

• Купить Artisteer на официальном сайте.
• Официальный сайт программы.
• Документация и справка (англ.).
• Форум (англ.).
• Галерея шаблонов.