Искусство оформления сайта. Практическое пособие - Сергей Бердышев

Названные форматы являются рабочими для веба. Формат JPEG (Joint Pictures Encoding Group – группа кодирования неподвижных изображений) кодирует в пределе до 224 = 16 777 216 цветов! Но, конечно, и весит он очень много. Вот почему когда цвета однообразны и немногочисленны, выгоднее использовать формат GIF (Graphic Interchange Format – формат обмена графикой), палитра которого включает лишь 256 цветов.

Из растровых редакторов самым мощным надо назвать упоминавшийся ранее Adobe Photoshop (Фотошоп). Эта программа удобна для обработки рисунков в формате *.jpg с их последующим экспортом в GIF при необходимости. Приложение к Фотошопу ImageReady позволяет не просто создавать гифы, но еще и делать их подвижными. Впрочем, число аниматоров растет день ото дня, так что юзер имеет широкий выбор. Некоторые создатели-аниматоры делают ставку на простоту и интуитивность интерфейса (Babarosa Gif Animator), другие – на расширенные возможности при работе с палитрой (Gifanim), третьи – на приспособленность анимации именно к веб-проектам (GIF Construction Set Professional), четвертые – на изготовление отдельных гиф-элементов сайта, например кнопочек (Active GIF Creator). Одной из смелых программ является CyD GIF Studio Pro, которая не только оптимизирует графическую палитру в ходе создания gif-анимации, но и умеет работать со сканером, а заодно свободно переводит в гифы большинство известных графических форматов: BMP, JPEG, PIC, PCX, TRGA, RGB, CEL, TIFF, PCD, PSD, PDD.

Из прочих программок нужно назвать «2D And 3D Animator», посредством которого создаются 2D фоновые рисунки и 3D (объемные) баннеры и кнопки для Web-страниц. Другая ценная программа, в которой, кстати, успешно совмещаются векторная и растровая графика, – Corel Paint Shop. Она легко устанавливается и еще легче эксплуатируется. В этой программке быстро и просто создаются за счет многочисленных шаблонов и инструментов весьма оригинальные картинки, которые могут с успехом украсить немало сайтов.

2.5. Программы для работы с текстом

Программы для обработки текста носят название текстовых редакторов. Чаще всего веб-дизайнер при составлении контента использует тексты, набранные в Microsoft Word. Word облегчает обработку и, самое главное, корректуру текста. Тщательно отредактированный в этой программе файл желательно вставить в Блокнот и сохранить там как документ *.txt в кодировке ANSI.

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

И напоследок назову Microgetics Font Effects, представляющий собой программу для создания оригинальных логотипов и заголовков для Web с использованием различных шрифтов. Впрочем, сложные логотипы, которые впоследствии придется переделывать под Web, удобно создавать и в другом продвинутом «софте». На меня произвели впечатление программы «AAA Logo» и «Green Box Logo».

2.6. Броузеры

Броузер (браузер) – это программа для просмотра документов, размещенных в Интернете. Тому, кто хочет вести персональную страничку, вполне достаточно одного броузера. Но для серьезной работы нужно установить на ПК несколько программ такого рода. Многие рекомендуют Internet Explorer (потому что он стандартный), Mozilla Firefox (потому что он обрел в последние несколько лет бешеную популярность) и Opera (потому что она нетипичная, сильно отличается от остальных). В ходе разработки сайта используется только один броузер, но когда ресурс почти готов, его следует открыть поочередно во всех трех программах, что позволит выявить недочеты и ошибки, незаметные в одной программе.

Полезный совет: на многих компьютерах жесткий диск (винчестер) разбит надвое, то есть имеются диски C и D. Начинающий юзер задается вопросом, зачем такие трудности, и в результате превращает «комп» в свалку. Дизайнер себе такого позволить не может. Диск D предназначается для хранения рабочих файлов – графики, html, текстов и прочих материалов, с которыми приходится иметь дело. Диск С предназначается только для программ, включая и дизайнерские. Автоматически машина стремится сохранить какой-нибудь рабочий файл на диске С в папочке «Мои документы». Когда вы не знаете, куда лучше сохранить свой файл, поступайте, как велит машина: это позволит не искать долго ваш файл впоследствии. Но когда найдете подходящую директорию на диске D, немедленно перебросьте туда свой файл. И дело даже не столько в порядке, сколько в безопасности. Во-первых, в случае системного сбоя рабочие файлы на С будут безнадежно разрушены. Во-вторых, есть риск, что системный сбой произойдет сам собой, если «комп» ошибочно примет рабочий файл за программный.

Глава 3. Сайт – инструмент для работы

3.1. Ответы на вопросы: «зачем» и «как»

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

На начальном этапе главным является создать грамотный контент, вникнуть в его логическую структуру и расставить приоритеты при разработке. Эти три вопроса решаются комплексно. Прежде всего, нужно подумать, на кого рассчитан наш сайт, иными словами, «user forever»![11] Так, издательство работает главным образом с четырьмя группами посетителей:

1) читающая публика, которая забредает на сайт в стремлении узнать что-нибудь о книгах и авторах. Читатели являются одновременно и покупателями, вот еще почему заслуживают обхождения и внимания;

2) авторы – их трудами создается товарная продукция, которой и ведется торговля, приносящая издательству прибыль;

3) штатные работники на вакантные должности – верстальщики, корректоры, редакторы, иллюстраторы и все прочие люди, которые нетленное творение иного автора превращают в книгу;

4) партнеры – книготорговые организации, типографии, библиотеки и т. д.

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

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

Лапидарность при составлении контента главной странички (равно как и некоторых других) – это и великая радость и большое зло для веб-дизайнера. Радость потому, что маленький текст легко и быстро читается и возбуждает интерес, желание продолжить ознакомление с ресурсом. Зло состоит в том, что поисковая система тем быстрее и легче находит ваш сайт, чем крупнее и богаче его контент. Сразу скажу, что эта проблема решается использованием скрытого текста. Дизайнер берет большой кусок текста, объемом около 500 знаков, и вставляет его в открытый html-код главной странички сразу после слова ( тэга) ‹body›. Чтобы этот текст был скрытым, он заключается в кавычки вида: ‹! – здесь ваш текст– ›. На страничке этот кусок не объявится, зато поисковик будет его свободно читать и засчитывать. (Убрав лишнее, возмести ущерб!)