<
  • Главная
Статьи

Artisteer створює шаблони сайтів Joomla, Blogger теми

  1. Колір і шрифти
  2. макет
  3. фон
  4. лист
  5. Верхній колонтитул
  6. Схожі матеріали
  • Тип - програма, що створює шаблони сайтів.
  • Якщо Ви читали мою попередню статтю « Огляд Artisteer (частина 1). Шаблони Joomla 1.5 », То напевно зрозуміли, що Artisteer дозволяє створювати досить непогані шаблони сайтів без знання спеціальних мов програмування, а за допомогою зрозумілих графічних інструментів. У цій частині огляду Artisteer я продовжу розгляд його інструментів.

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

    Колір і шрифти

    Вкладка Кольори і шрифти (малюнок нижче) містить інструменти для настройки загальної колірної схеми сайту і шрифтів. Інструменти розділені на три групи.

    1. Кольори.
    2. Тона.
    3. Шрифти.

    Є в наявності кнопки Запропонувати колір і Запропонувати шрифти. Вони служать для генерації колірних схем і наборів шрифтів для шаблону.

    В Artisteer 3 Standard Edition є дванадцять груп колірних схем. У кожній групі кілька підгруп. У кожній підгрупі, приблизно, від однієї до двадцяти трьох схем. Для кожної схеми близько десяти різних тонів

    1. Новий. Включає в себе 9 підгруп.
    2. Яскравий. Включає в себе 6 підгруп.
    3. Контрастний. Включає в себе 8 підгруп.
    4. Темний. Включає в себе 6 підгруп.
    5. Світлий. Включає в себе 2 підгрупи.
    6. Монохромні тону. Включає в себе 8 підгруп.
    7. Пастельний. Включає в себе 8 підгруп.
    8. Блакитний. Включає в себе 5 підгруп.
    9. Зелений. Включає в себе 8 підгруп.
    10. Помаранчевий. Включає в себе 2 підгрупи.
    11. Червоний. Включає в себе 6 підгруп.
    12. Жовтий. Включає в себе 2 підгрупи.

    Разом, за моїми скромними підрахунками, Вам пропонується від 700 до 16100 збалансованих колірних схем. Ви можете задати кольорову гаму самостійно, скориставшись інструментом Вибір кольору (малюнок нижче) Artisteer 3.0.

    У даного інструменту є можливість не тільки вказати колір у вигляді набору чисел для трьох каналів кольору, але і вказати відтінок, яскравість, насиченість. Ви зможете ввести кодове значення кольору, наприклад 99D3E3. При необхідності, за допомогою інструменту Піпетки, дізнатися числові параметри будь-якого кольору на шаблоні.

    Інструмент Набір шрифтів містить поєднання сімейств шрифтів для тексту і заголовків сайту. Є можливість редагувати, створювати і видаляти набори. В Artisteer 3.0.0.41778 Standard Edition встановлено десять наборів шрифтів (Класичний, Популярний, Простий, Формальний і так далі).

    Інструмент Стилі (малюнок нижче) містить вісім попередньо встановлених стилів (Класичний, Простий, Дрібний і так далі) для шрифтів сайту (для заголовків різного рівня, кнопок, посилань, тексту, цитат і так далі) і можливість редагувати, створювати і видаляти стилі. Це доступно для всіх шаблонів. Навіть для Blogger теми.

    На малюнку нижче показано вікно вибору редагованого елемента стилю. Шаблони Joomla 2.5 будуть використовувати ці налаштування.

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

    Інструмент розмір шрифтів дозволяє Вам змінити розмір всіх шрифтів на сайті, вказавши потрібний відсоток. Від 50% до 200% від поточного розміру.

    макет

    Панель інструментів Макет (малюнок нижче) розділена на чотири групи. Зазначу, що шаблони Joomla 1.7 і, наприклад, DotNetNuke шаблони, Blogger теми і так далі матимуть дещо відмінні налаштування макета через відмінностей в самих системах.

    1. Макет дизайну.
    2. Макет листа.
    3. Макет вмісту.
    4. Блоки.

    На цій вкладці, як і на інших, є кнопка автоматичної генерації елемента Запропонувати макет.

    Перед тим, як приступити до створення шаблону, бажано визначитися, яким його хотілося б бачити. Подивитися на вподобані і не сподобалися аналоги в мережі. І, що зовсім не мало важливо визначитися з кількістю, розташуванням і відносними розмірами колонок сайту. Визначитися з модульної сіткою. Artisteer 3.0.0.41778 Standard Edition дозволяє створювати шаблони сайтів з фіксованою і «гумовою» шириною. Цей принциповий момент необхідно вирішити заздалегідь. Так само необхідно приблизно знати які модулі будуть виводитися на сайті (Головне меню, Опитування, Вертикальне меню, Реєстрація і так далі).

    У групі інструментів Макет дизайну, Ви можете вибрати один з двадцяти варіантів макета верхнього колонтитула. Вони розділені на шість груп.

    1. Базовий.
    2. Фіксований.
    3. Виступаючий.
    4. Широкий.
    5. Прозорий.
    6. Накладення.

    Нижче я приведу по одному прикладу макета для кожної групи. Вони йдуть в порядку проходження в списку вище (це шаблони Joomla 1.7).

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

    Є можливість налаштувати поле до меню або нижнього колонтитула.

    Для налаштувань листа Вам доступний однойменний інструмент (малюнок нижче). Він розділений на три вкладки.

    1. Макет.
    2. Стиль.
    3. Тінь.

    Значення фіксованої ширини шаблону сайту доступні в діапазоні від 200 до 1500 пікселів. Або про 20 до 100% в разі гумового дизайну шаблону.

    Artisteer 3.0.0.41778 Standard Edition дозволяє створювати одне, двох і трьох колоночного шаблони сайтів. Для настройки ширини колонок Вам доступний інструмент Налаштування макету (малюнок нижче).

    Ширину колонок можна задавати в пікселях або відсотках. Причому, ширину однієї колонки можна задати в пікселях, а другий - у відсотках.

    Уже в шаблоні Artisteer 3.0.0.41778 Standard Edition дає можливість розташувати бедующіе модулі сайту в тому порядку, в якому вони передбачені розміщуватися в подальшому. Це не означає, що Ви не зможете їх поставити в іншому порядку. Це дуже зручно. Ви можете показати (подивитися) як буде виглядати шаблон на сайті, навіть без сайту.

    З модулів доступні наступні:

    1. Головне меню.
    2. Опитування.
    3. Вертикальне меню.
    4. Ключові поняття.
    5. Зараз на сайті.
    6. Форма регістрації.
    7. Реклама.

    Доступно шість варіантів розташування модуля (малюнок нижче).

    На малюнку нижче я наведу приклад шаблону з усіма включеними модулями і гумовим дизайном. При бажанні на нього можна подивитися в HTML . Це Joomla шаблони. Але, наприклад, Blogger теми і DotNetNuke шаблони будуть виглядати аналогічно.

    фон

    Панель інструментів Фон (малюнок нижче) розділена на три групи.

    1. Фон.
    2. Текстура або зображення.
    3. світловий ефект

    світловий ефект

    Як у випадку з іншими панелями, на цій також є кнопка автоматичної генерації.

    В якості фону можна задати суцільний колір, градієнт, зображення, текстуру і накладення відблиску. В Artisteer 3.0.0.41778 Standard Edition є двадцять три градієнта (малюнок нижче).

    Фон може бути прокручувати і фіксованим. Прокручуваний фон буде рухатися вгору \ вниз при наявності вертикальної смуги прокрутки сторінки. Фіксований фон буде завжди залишатися на місці. наприклад:

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

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

    Можна змінювати прозорість відблиску (від 0 до 100 відсотків) і масштаб (від 10 до 130 відсотків). В Artisteer 3.0.0.41778 Standard Edition встановлено дванадцять груп відблисків (малюнок нижче).

    1. Класичний.
    2. По центру.
    3. Абстрактний.
    4. Сучасний.
    5. Кола.
    6. Фігури.
    7. Екстравагантний.
    8. Кут.
    9. Природні.
    10. Ажурний.
    11. Квітковий.
    12. Гранж.

    Гранж

    Всього до 300 відблисків і можливість установки своєї. Artisteer 3.0.0.41778 Standard Edition підтримує в якості графічного файлу відблиску такі формати як GIF, PNG, JPG, JPEG.

    Для текстури доступні опції режиму змішування (нормальний, м'яке світло, перекриття), прозорість, вага кольору, насиченість кольору, контрастність і інвертування. Можна задавати повторення текстури по горизонталі, по вертикалі, заливкою або не повторювати. Ви можете відобразити або розгорнути текстуру, а так само змінити її масштаб. В Artisteer 3.0.0.41778 Standard Edition встановлено дев'ять груп текстур (малюнок нижче).

    1. Новий.
    2. Кольорові.
    3. Квіти.
    4. Інвертований.
    5. Лінії.
    6. природні
    7. Орнаментальні.
    8. Точкові.
    9. Силует.

    Силует

    Всього до 300 текстур і можливість установки своєї. Artisteer 3.0.0.41778 Standard Edition підтримує в якості графічного файлу текстури такі формати як GIF, PNG, JPG, JPEG.

    Для градієнта можна задати висоту (від 1 до 1200 пікселів) і контрастність (від -100 до 100 відсотків).

    Шаблони Joomla 1.7, після установки на сайт і при наявності спеціальних розширень, можуть відображати різний фон для різних сторінок.

    лист

    Лист - це і є «робоча» область сайту, то, що знаходиться на тлі. Панель інструментів Лист (малюнок нижче) містить однойменну область з інструментами і кнопку автоматичної генерації елемента.

    Доступно вісімнадцять шаблонів обведень листа (малюнок нижче).

    Можна задавати ширину листа (в пікселях або відсотках), поле від верхньої межі вікна до початку листа (в пікселях), відступи від краю листа до внутрішнього вмісту (модулів), (задається в пікселях від 0 до 50).

    Ви можете задати округлення (від 0 до 200 пікселів), обведення (від 0 до 20 пікселів) і тінь листа. Для тіні доступні параметри зміни розміру (від 0 до 50 пікселів), прозорості (від 0 до 100 відсотків), відстані (від 0 до 60 пікселів) і кута.

    Лист можна зробити прозорим (від 0 до 100 відсотків) або задати йому колір.

    Верхній колонтитул

    Панель інструментів Верхній колонтитул (малюнок нижче) розділена на сім груп і містить кнопку автоматичної генерації елемента. Як правило, наприклад, Joomla шаблони, асоціюються не з поняттям "заголовок", а з "шапкою" сайту. Але в Artisteer 3.0 прийнятий саме такий переклад.

    1. Макет.
    2. Фон.
    3. Фонове зображення.
    4. Фото об'єкт.
    5. Flash.
    6. Заголовок.
    7. Стилі заголовки.

    Стилі заголовки

    Ви можете зовсім відмовитися від заголовка. Або ж вибрати один з варіантів розташування колонтитула (малюнок нижче).

    Або ж вибрати один з варіантів розташування колонтитула (малюнок нижче)

    Довжина може бути по ширині листа або по ширині сторінки. Висота колонтитула може бути від 50 до 500 пікселів.

    В Artisteer 3.0.0.41778 Standard Edition є можливість вставки в заголовок поля під текстовий блок (малюнок нижче) довільного вмісту. Можна задати йому колір, прозорість і положення (зліва чи справа).

    Верхньому колонтитулу можна задати колір і прозорість. Застосувати скругление країв і тінь (схоже на інструменти з панелі інструментів Лист).

    Можливо накласти текстуру. Опції, доступні для налаштування текстури показані на малюнку нижче.

    Опції, доступні для налаштування текстури показані на малюнку нижче

    В Artisteer 3.0.0.41778 Standard Edition текстури для заголовка розділені на кілька груп. Всього близько 300 текстур і можливість установки своєї. В якості графічного файлу текстури підтримуються такі формати як GIF, PNG, JPG, JPEG. Є можливість установки градієнта із зазначенням контрастності і кута повороту. Доступні за замовчуванням в Artisteer 3.0.0.41778 Standard Edition градієнти показані на малюнку нижче. Всього їх близько сорока п'яти.

    Всього їх близько сорока п'яти

    Ще є можливість встановити відблиск на верхній колонтитул. В Artisteer 3.0.0.41778 Standard Edition відблиски розділені на кілька груп (малюнок нижче). Всього їх близько 130 штук. Є можливість завантажувати свої.

    Є можливість завантажувати свої

    Також можна в якості фону для верхнього колонтитула використовувати зображення. В якості графічного файлу для фону підтримуються такі формати як GIF, PNG, JPG, JPEG. Можна задати йому прозорість, ступінь стиснення (тільки для PNG і JPEG) і розмиття. При вставці фонового зображення з файлу в проект Artisteer, Ви зможете виконати кадрування необхідної частини (рисунок нижче), а потім, при необхідності, вибрати вирівнювання зображення всередині колонтитула (по лівому краю, по центу, по правому краю).

    При вставці фонового зображення з файлу в проект Artisteer, Ви зможете виконати кадрування необхідної частини (рисунок нижче), а потім, при необхідності, вибрати вирівнювання зображення всередині колонтитула (по лівому краю, по центу, по правому краю)

    Можна вставити логотип з файлу (GIF, PNG, JPG, JPEG), задати йому світіння (від 0 до 100 відсотків), задати прозорість світіння (від 0 до 100 відсотків), вибрати його розташування, вирівняти (по лівому краю, по центру, по правому краю), задати перефарбування в відтінки сірого або виконати команду відображення по вертикалі.

    Для анімації верхнього колонтитула в Artisteer 3 передбачена підтримка флеш анімації (SWF). У програмі вже встановлено дванадцять анімаційних об'єкта і є можливість завантаження своїх. На малюнку нижче показані опції, доступні для налаштування анімованих об'єктів.

    Однак, слід врахувати той факт, що флеш анімація вимагає, щоб у користувача був встановлений спеціальний плагін в браузері. Так само це збільшить час завантаження Вашого сайту. А деякі користувачі взагалі воліють блокувати флеш анімацію. Так що перед розміщенням інформативного вмісту у флеш анімації слід подумати і обов'язково продублювати його. Також рекомендую налаштувати статичне зображення верхнього колонтитула так, як якщо б анімації не було. Це дасть можливість зберегти зовнішній вигляд Вашого сайту, якщо у користувача не відобразиться SWF файл.

    При відсутності власного логотипу можна просто вписати назву сайту (малюнок нижче).

    При відсутності власного логотипу можна просто вписати назву сайту (малюнок нижче)

    Ви можете налаштувати гарнітуру, стиль, розмір та інші параметри шрифту (малюнок нижче).

    Ви можете налаштувати гарнітуру, стиль, розмір та інші параметри шрифту (малюнок нижче)

    Можна змінити масштаб відображення написів і їх положення, а також встановити одне з дев'яти положень написів на колонтитулі (малюнок нижче).

    Можна змінити масштаб відображення написів і їх положення, а також встановити одне з дев'яти положень написів на колонтитулі (малюнок нижче)

    При бажанні, необхідності і вмінні Ви завжди зможете внести поправки в код Вашого шаблону, створеного в Artisteer. Це дозволити втілить в життя набагато більше дизайнерських ідей, ніж за допомогою стандартних інструментів програми.

    Можу сказати, що шаблони Joomla 1.7 створюються в Artisteer 3.0 буквально за лічені хвилини. Та й взагалі, шаблони сайтів і Blogger теми переходять з розряду «великої проблеми» в приємне розвага. На жаль не доводилося створювати DotNetNuke шаблони.

    У наступній статті « Огляд Artisteer (частина 3). Створення Wordpress шаблонів »Я розгляну залишилися панелі інструментів Artisteer. Серед яких Меню, Статті, Бічна панель, Вертикальне меню, Кнопки, Нижній колонтитул.

    Схожі матеріали

    Корисні посилання:



Новости
  • Виртуальный хостинг

    Виртуальный хостинг. Возможности сервера распределяются в равной мере между всеми... 
    Читать полностью

  • Редизайн сайта

    Редизайн сайта – это полное либо частичное обновление дизайна существующего сайта.... 
    Читать полностью

  • Консалтинг, услуги контент-менеджера

    Сопровождение любых интернет ресурсов;- Знание HTML и CSS- Поиск и обновление контента;-... 
    Читать полностью

  • Трафик из соцсетей

    Сравнительно дешевый способ по сравнению с поисковым и контекстным видами раскрутки... 
    Читать полностью

  • Поисковая оптимизация

    Поисковая оптимизация (англ. search engine optimization, SEO) — поднятие позиций сайта в результатах... 
    Читать полностью