WebMаster.Soft - еженедельные обзоры софта для веб-мастеров: Мастерская. Выпуск 201
WebMaster.soft // №201
Приветствую, дорогие друзья и коллеги!
На связи Путченков Дмитрий, ведущий рассылки.
читайте в этом выпуске:
Мастерская
Artisteer - дизайн - это просто
Видеокурсы по веб-дизайну. Избранное
WebMasterZone рекомендует...
→ новости сайта:До окончания акции остался всего 1 день! На сайте WebMasterZone - магазине CD и DVD-дисков по веб-дизайну - проводится НЕДЕЛЯ СКИДОК! Только в течении 7-ми дней, с 09.03 по 16.03, Вы сможете приобрести любой наш диск с беспрецедентной скидкой 50%! Не упустите свой шанс! Посетить...
Количество блоггеров, как и владельцев собственных сайтов, увеличивается с каждым днем. Большинство пишущих и страждущих используют для своих страниц стандартный дизайн, предлагаемый владельцами сервисов или системами управления сайтами, и лишь немногие создают что-то свое. Создание собственного
дизайна требует не только хорошего вкуса, но и знаний программирования. А такого знания у большинства пишущих нет. Именно для них компания Extensoft разработала программу Artisteer, которая позволяет без серьезного знания программирования создавать собственный, настроенный под себя, дизайн блога или сайта, работающего под управлением наиболее распространенных CMS.
Работаете ли вы со статическим веб-сайтом или динамическим приложением, с системой CMS, внешний вид создаваемых страниц в конечном счете сводится к таблицам каскадных стилей (CSS). С одной стороны, использование стилей дает колоссальную выгоду, с другой - добавляет новые проблемы. Удобство каскадных стилей в том, что, внеся изменение в одном месте, мы получаем новое представление везде, где используется измененный стиль. Но с другой стороны, невероятная сложность управления десятками и сотнями
параметров, каскадной записью правил, необходимостью учета особенностей различных браузеров приводит к тому, что большинство пользователей никогда не отклоняются от шаблонов стилей, заданных по умолчанию.
Конечно, выходы есть: можно, покопавшись в Сети, подобрать готовый шаблон и подогнать его под свои нужды. Но этот подход не идеален, поскольку найти дизайн, наиболее удачно соответствующий информационному наполнению вашего сайта, довольно сложно. А адаптация его снова замыкается на редактирование стилей.
Программа Artisteer в чем-то похожа на каталог готовых шаблонов, среди которых можно подобрать шаблон подходящего размера. Но такой взгляд на программу не является правильным, поскольку принцип ее работы существенно отличается от работы обычного каталога. Вместо представления готовых шаблонов Artisteer формирует произвольный шаблон, а вы можете путем вызова функции генерации нового шаблона перебирать
предлагаемые варианты, пока не подберете тот, который вас более всего устраивает. Это - самый простой способ работы с программой, но и самый непроизводительный. Поскольку шаблоны формируются произвольно, ожидать быстрого появления подходящего сложно. Такой вариант подбора мо
жно рекомендовать только с той целью, чтобы познакомиться с возможными вариантами, которые можно получить с помощью программы.
Здесь же надо отметить еще один момент, связанный с использованием программы. Artisteer формирует только шаблоны страниц, наполнить шаблон вашим контекстном с его помощью не удастся. Эту задачу придется решать с помощью других средств, например с помощью программы для работы с HTML-страницами (как пишут в форумах по этому продукту, доработка страниц из сформированного шаблона выполняется с помощью "напильника"). Впрочем, разработчики обещают, что в последующем программа будет не только формировать
шаблоны, но и также в нее будут включены HTML-редактор и возможность подготовки многостраничных сайтов. Но пока этих возможностей нет, разберемся, как с помощью Artisteer можно создать шаблон одной страницы.
В конечном итоге страница формируется из определенного числа базовых элементов. В их число входят макет страницы, фоновое оформление, параметры листа, цвета и шрифты, верхний и нижний колонтитулы, меню, блоки, кнопки и статьи (всего в программе одиннадцать категорий). Эти элементы взаимосвязаны цветовым решением - цветовое решение будет отслеживаться по каждому элементу, но изменение формы элемента не отразится на его цветовом решении. Подбирая характеристики элементов будущей страницы, получим,
в конце работы, то, что и требовалось, - шаблон страницы. Описываемая ниже последовательность работы не является обязательной, каждый может работать над шаблоном так, как ему будет наиболее удобно.
Макет страницы
Наверное, это первое, с чего надо начинать работу, - подобрать схему размещения информации на будущей странице. Макет формируется в три этапа. Первый определяет наличие и взаимное расположение верхнего колонтитула и меню (оба вместе, один из элементов, без этих элементов). Второй помогает построить колонки - выбрать их количество и настроить их ширину. Наконец, на третьем этапе вы определяете наличие типовых блоков (Newsletter, Highlights, Contact Info). Это типовые блоки, на основе которых вы
сможете создать требуемое количество своих собственных блоков. Кроме выбора типовых блоков здесь же вы сможете определить место их размещения на странице.
Фон и цвет
После выбора макета можно перейти к следующему этапу - выбору фона и подбору цветового и шрифтового решений. Фоном для страницы может служить либо изображение, либо текстура. И то и другое есть среди вариантов, предлагаемых программой. Но нет ограничений и на использование в качестве фонового изображения собственных графических файлов. В качестве дополнительных возможностей предлагается выбрать цвет заливки, а также отображение заливки в качестве градиента. Для более подготовленных пользователей
можно предложить поиграть дополнительными настройками расположения фонового изображения и параметрами градиента.
Разобравшись с фоном, перейдем к цветам и шрифтам, которые будут использоваться на вашей HTML-странице. В программе предлагаются готовые комбинации цветового решения, состоящие из трех элементов: цвет основы листа, цвет заголовков и цвет кнопок. Вариантов достаточно много, но при желании можно создать собственную комбинацию. В настройке цветовой гаммы участвуют еще два параметра - яркость и контрастность, которыми можно управлять как в готовых комбинациях, так и при подготовке собственной.
Лист
В этой категории предстоит определить изображение границ разделов, отступов и так далее. А начинать надо с выбора ширины листа - ее можно изменять от 500 до 1500 пикселей, чего вполне достаточно для большинства сайтов. Все остальные параметры - настройка внешнего вида. К ним относятся скругление углов рамки, образующей лист, цвет этой рамки, цвет заливки листа и отступы. Одним словом, какие настройки выберете в этой секции, так и будет смотреться ваш лист.
Верхний колонтитул
Если при макетировании страницы вы определили, что верхний колонтитул у вас будет, то в соответствующем разделе его можно настроить. В программе предлагаются два типа колонтитула - без текстовой части и с текстовой частью. Требуется лишь выбрать вариант и настроить размеры частей. Колонтитул может содержать графическое изображение - его можно вставить из внешнего файла и обработать дополнительными эффектами, среди которых перекрашивание изображения, наложение текстуры, размытие и ряд других эффектов.
На изображение в колонтитуле можно наложить надпись. Это может быть название вашего сайта или раздела. С помощью специального графического инструмента можно подобрать для надписи желаемое размещение в рамках колонтитула, подобрать цвет и тип шрифта.
Меню
С меню проще. Здесь лишь несколько настроек - общего вида, элементов меню и подменю. К общему виду относятся вид кнопок, используемых в строке меню, разделители и цветовое решение (каким цветом будут отображаться активный и пассивный элементы). Для элементов подменю можно также установить ширину элемента (важно в случае больших надписей на таких элементах). Но надписи на кнопках при работе в программе изменить нельзя - их можно будет править после формирования HTML-шаблона в каком-либо внешнем
редакторе.
Статьи и блоки
Основная часть вашей страницы, где размещается информационная часть, может включать два раздела: один называется "Статья" и предназначен для размещения основной информации, второй раздел может состоять из различного типа блоков. А вот подход к их оформлению очень близок. У каждого раздела есть основная часть, есть заголовки, а у статьи может быть еще и нижний колонтитул.
Настройка разделов заключается в подборе цветовой гаммы и шрифтов, правил размещения текста (выравнивание, отступы), использовании различных эффектов. В разделе "Статья" могут размещаться и дополнительные элементы - таблицы, изображения, маркеры, заголовки. Каждый из этих элементов также имеет возможности тонкой настройки, включающей цветовое и графическое оформление, различное отображение ссылок, границ, разделителей.
Кроме уже названных элементов на странице могут располагаться кнопки и нижний колонтитул. Эти элементы также можно настраивать, подбирая их форму и содержание.
В результате после настройки всех требуемых элементов вы сможете получить шаблон страницы, сформированной под ваши задачи и требования. При этом на этапе настройки вам совершенно не требуется знание программирования и правил создания каскадных стилей - программа выполняет эту работу за вас, предоставляя вам возможность визуального воплощения ваших идей.
Работать в программе удобно - предварительный просмотр возможных изменений реализован без необходимости подтверждения изменения. Достаточно выбрать в ленте новое значение параметра того или иного элемента, как это возможное изменение будет отображено на шаблоне. Понравилось - подтвердили изменение и переходите к следующему элементу. Не понравилось - выбираете новое значение, которое сразу отразится на экране.
Но вот заканчивается подготовительная работа - внешний вид страницы полностью вас удовлетворяет. Остается сохранить его в виде шаблона для используемой вами CMS либо в виде страницы в коде HTML или ином, предлагаемом программой. Если это шаблон для CMS, его можно будет открыть в соответствующей программе и выполнить создание реальной страницы. Если вы сделали простую страницу в HTML-коде, то ее можно открыть в любом HTML-редакторе и выполнить требуемую доработку: наполнить страницу реальной информацией,
доработать меню, проставить нужные ссылки и разместить на своем сайте.
При генерации итогового шаблона программа Artisteer формирует файлы каскадных стилей (CSS). При этом формируются базовый файл и пара файлов, которые используются при просмотре вашей страницы в браузере MS IE. И действительно, в этих браузерах все отображается прекрасно. Но заметил, что таблицы в браузерах Chrome, FireFox не всегда отображаются корректно, а ведь последний используется очень часто.
Освоиться с программой оказалось довольно просто, к тому же у нее есть локализованная версия. И пусть отсутствует русскоязычная документация - это не является помехой. Очень удобная программа, если вам надо создать дизайн страницы. Удобная также тем, что в результате вы получаете сформированные по текущим стандартам коды HTML и CSS. При желании вы сможете в дальнейшем изучить на этих примерах правила их создания. Если вы дизайнер, то программа поможет выполнить предварительные наброски для дальнейшего
использования в качестве основы.
"Профессиональное создание Интернет-магазина под ключ"
Полный и качественный видеокурс по созданию интернет-магазина под ключ для любого уровня подготовленности.
68 уроков полностью раскроют все тонкости и нюансы профессионального создания интернет-магазинов.
"PHP+MySQL для начинающих"
Более 110 видеоуроков общей продолжительностью в 22 часа и 30 минут, которые позволят Вам создавать неповторимые динамические сайты с использованием языка PHP и баз данных MySQL!…
"Как создать прибыльный блог"
Пошаговое руководство для новичков в Интернет-бизнесе 2.1. Видеокурс, представляющий собой бизнес-систему, которая научит зарабатывать от $1000 в месяц в Интернете на блогах. На сегодняшний день бизнес-система Как создать прибыльный блог является самым полным, пошаговым и понятным инструментом для создания бизнеса в Интернете.
"Весь Арсенал Флешера на DVD"
Курс "Арсенал Флешера" предназначен для серьезных людей, кто действительно хочет: получить качественную информацию; создавать флеш-ролики с нуля, с наименьшими временными и финансовыми затратами и применить полученные знания на практике.
Надеюсь, что вам понравился этот выпуск рассылки и вы узнали что-то новое и полезное для себя. Если у вас есть пожелания или предложения как сделать рассылку лучше, присылайте их на наш e-mail:
admin@wm-zone.info
Количество блоггеров, как и владельцев собственных сайтов, увеличивается с каждым днем. Большинство пишущих и страждущих используют для своих страниц стандартный дизайн, предлагаемый владельцами сервисов или системами управления сайтами, и лишь немногие создают что-то свое. Создание собственного
дизайна требует не только хорошего вкуса, но и знаний программирования. А такого знания у большинства пишущих нет. Именно для них компания Extensoft разработала программу Artisteer, которая позволяет без серьезного знания программирования создавать собственный, настроенный под себя, дизайн блога или сайта, работающего под управлением наиболее распространенных CMS.
