- •Часть 1. Компьютерная графика и web-дизайн. Теоретические основы.
- •Цветовая модель rgb
- •Цветовая модель cmyk
- •Цветовая модель lab
- •Структура гиперссылки
- •Категории гиперссылок
- •Формы гиперссылок
- •Дизайн гиперссылок
- •Принципы юзабилити
- •Назначение навигации
- •Глобальная навигация
- •Нарушения навигации
- •Организация навигации при помощи закладок
- •О блако тегов
- •1. Сбор страниц
- •2. Индексирование страниц
- •Проблемы поисковых систем
- •Создание системы поиска
- •Интерфейс поиска
- •Дизайн страницы результатов
- •Отрицательный результат поиска
- •Принципы разработки отдельных страниц Главная страница
- •Splash-страница
- •Специальные навигационные страницы
- •Страницы для обратной связи
- •Выходные страницы
- •Страницы с фиксированными размерами
- •Масштабирование по горизонтали
- •Введение в web-типографику
- •Правила составления текстов для web
- •Главные правила текстового дизайна
- •Создание логотипа
- •Выбор цветовой гаммы сайта
- •2. Эксплуатационный опрос
- •3. Определение технических подробностей
- •4.Изучение аудитории
- •5.Анализ отрасли
- •6. Составление первичной документации
- •1. Структурирование сайта с точки зрения контента
- •Основные ошибки клиента
- •2. Создание карты сайта
- •3. Установка соглашений об именовании
- •1. Разработка концепции дизайна
- •2. Выверка
- •3. Создание графических шаблонов и руководства по стилю оформления
- •1. Подготовка к производству
- •2. Заключение договора о хостинге
- •3. Формирование файловой структуры
- •4. Компоновка страниц
- •5. Контроль качества
- •1. Передача сайта
- •2. Запуск
- •3. Сопровождение
- •Баннер с позиции рекламодателя
- •Баннер с позиции дизайнера
- •Часть 2. Разработка web-узлов. Практическое задание.
- •1. Запись данных: insert
- •2. Чтение данных: select
- •3. Обновление данных: update
- •4. Удаление данных: delete
- •Описание
- •Синтаксис
- •Описание
- •Синтаксис
- •Синтаксис
- •Аргументы
- •Описание, примеры
- •Связь между окнами
- •Строка параметров
- •Основные кроссбраузерные параметры
- •Заметки
- •Конструкция включений require
- •Конструкция включений include
- •Часть 3. Верстка и допечатный процесс.
- •1. Каждая статья должна иметь прямоугольную форму и состоять из прямоугольных блоков
- •2. Обтекаемая текстом фотография должна занимать по ширине целое число колонок
- •3. Колонку текста нельзя прерывать элементами графического дизайна
- •4. При вертикальной верстке элементы статьи должны располагаться в строгом порядке: 1) фотография, 2) подпись к фотографии, 3) заголовок, 4) текст
- •5. Из нескольких иллюстраций к статье следует выбирать одну ведущую
- •1. Материалы должны быть явно отделены друг от друга.
- •2. Материалы должны выстраиваться в иерархию.
- •3. Заголовки соседних материалов не должны слипаться.
- •4. Следует соблюдать иерархию фотоматериалов.
- •5. Полоса должна быть визуально сбалансирована.
- •6. Больше трёх-четырёх гарнитур на полосе использовать нельзя.
- •Часть 4. Операционные системы и компьютерные сети. Вопрос №1. Диапазоны ip-адресов локальных сетей, их назначение
- •Вопрос №2. Прямые и обратные dns-запросы, структура домена .In-addr.Apra
- •Вопрос №3. Напишите консольные команды и их параметры, позволяющие запускать, останавливать и перезапускать сервис Apache, а также просматривать прослушиваемые сервисами порты локального хоста
- •Вопрос №5. Напишите инструкции файла настроек Apache, запрещающие в текущем каталоге доступ ко всем файлам с расширением log отовсюду, кроме локального хоста
- •Вопрос №6. Напишите инструкции файла настроек Apache, разрешающие доступ в текущий каталог только прошедшим аутентификацию пользователям
- •Вопрос №7. Напишите инструкции файла глобальных настроек Apache, организующие виртуальный хост Вопрос №8. Опишите назначение поставляемых в пакете веб-сервера Apache утилит htpasswd, ab
Часть 3. Верстка и допечатный процесс.
Гарнитура шрифта. Классификация гарнитур.
Шрифт — это комплекс визуально различных, но единообразно спроектированных знаков всего алфавита, включая буквы, цифры, денежные символы и прочие знаки.
Гарнитурой называется совокупность или коллекция шрифтов, которые обладают определенным сходством. (одним и тем же изгибом засечек, соотношением углов или межбуквенных просветов).
Большинство гарнитур делятся на две основные группы — сериф (шрифт с засечками) и сан-сериф (шрифт без засечек).
У серифа есть маленькие засечки по краям каждой буквы. Для этих шрифтов характерно также наличие тонких и широких штрихов и плавное изменение их толщины. Наиболее распространенная серифная гарнитура — гарнитура Times. (Garamond, bodony, century)
К серифным шрифтам относят также брусковые шрифты, отличающиеся тем, что имеют засечки, ограниченные прямыми линиями. (Courier New.)
В сансерифных шрифтах засечки отсутствуют. (arial, tahoma, optima)
Для таких шрифтов характерны подчеркнуто геометрическая форма, штрихи одинаковой толщины, аккуратные и открытые, обладающие значительной высотой строчные буквы. Шрифты без засечек наилучшим образом подходят для оформления заголовков; они используются при проектировании логотипов, в информационных бюллетенях и фирменной документации.
Шрифты без засечек уместно использовать для основного газетного текста, если газета печатается на бумаге среднего и низкого качества. На плохой бумаге маленькие изящные засечки расплываются при впитывании типографской краски, и текст становится неудобочитаемым.
Существуют и другие группы шрифтов — например, рукописные и декоративные шрифты. Они используются в случае, когда надо достичь особого эффекта. Они неудобочитаем.
Начертание шрифта (наклон, насышенность, плотность).
Насыщенностью шрифта называют степень «черноты» или «светлоты» букв, зависящую от толщины штрихов и независящую от их размеров. Как правило, гарнитура шрифта включает в себя средний (medium) и жирный (bold) варианты насыщенности.
Наклон шрифта определяется углом, который его знаки образуют с вертикальной осью. В связи с этим существует прямой шрифт и наклонный.
Термином начертание шрифта обозначают комплект знаков определенного рисунка. Начертание может быть нормальным, полужирным, курсивным, подчеркнутым, выворотным, оттененным. В компьютерном наборе появляются новые различные начертания: верхний индекс, нижний индекс, утопленный, приподнятый и др.
Есть существенные различия между курсивным (italic) и наклонным (oblique) начертаниями шрифта. Первый — это специальный шрифт, существующий самостоятельно и являющийся производным от некоторого оригинального шрифта. Наклонный шрифт — это такой шрифт, которому механически был придан некоторый наклон без изменения оригинальной формы букв.
ПЛОТНОСТЬ ШРИФТА — один из признаков начертания шрифта, по которому шрифты в зависимости от зрительного соотношения ширины знаков с их высотой делятся на шрифты узкого, нормального и широкого начертания. Чем соотношение больше, тем шрифт менее плотный, более широкий.
Параметры шрифта: кегль, трекинг, интерлиньяж, кернинг (понятие, способы измерения, правила использования при верстке).
Высота шрифта называется кегль и измеряется в пунктах (1 пункт = 1/72 дюйма) — от линии высоты прописного знака до линии нижних выносных элементов (см. рис. 4).
Различные шрифты с одинаковым кеглем могут выглядеть по-разному.
12-пунктовый Impact выглядит крупнее по сравнению с 12-пунктовой «Академией».
Это связано с тем, что соотношение в росте строчных и прописных букв у разных шрифтов различное, а визуальный «вес» шрифта определяют именно строчные буквы, поскольку в тексте их большинство.
Шириной шрифта называют относительную ширину его букв. Степень ширины может измеряться от сверхсжатой до сверхширокой с целым рядом промежуточных значений и обычно обозначается в процентах как доля от изначальной ширины знаков. От этой характеристики существенно зависит количество текста, размещаемого на одной странице.
Ширину изменяют, например, при газетной верстке, чтобы статья (или ее заголовок) заняла точно отведенное под нее место. Профессионалы негативно относятся к этой мере.(нарушают пропорции и приводят к появлению уродливых нечитабельных букв)
Межбуквенный пробел или трекинг определяет интервал между отдельными буквами в слове. Этот параметр влияет на визуальное равновесие слов.
Если межбуквенные пробелы слишком велики, возникают трудности в быстром различении пробелов между словами, что существенно замедляет скорость чтения. Если же межбуквенное пространство слишком сжато, становится трудно различать отдельные буквы, что также препятствует скорости чтения.
Применяют при газетной верстке. При этом максимально допустимым считается изменение трекинга от +7 до -4 единиц между знаками.
Кернинг означает изменение пробелов между парами букв внутри слова. Цель кернинга состоит в том, чтобы достичь равновесия оптического пространства между буквами в слове. Необходимость в применении кернинга связана с тем, что пробелы между некоторыми парами букв визуально отличаются от остальных. К числу таких пар могут относиться VA, LV, LT, ГА и др. Как правило, в современных шрифтах кернинговые пары учтены.
Интерлиньяжем называется пробел между строками. Он отмеряется от базовой линии одной строки до базовой линии другой строки. Подходящий интерлиньяж помогает скользить взглядом со строки на строку и обеспечивает наилучшее восприятие текста. Интерлиньяж измеряется в пунктах. Наиболее подходящим считается интерлиньяж, равный 120% от кегля шрифта.
При верстке газеты или другого многоколоночного издания необходимо отслеживать, чтобы интерлиньяж в соседних колонках непременно оставался равным, т.е. соседние строки располагались на одной горизонтали.
Форматы шрифтов в ЭВМ. Назначение программы Adobe Type Manager.
Шрифты в ЭВМ хранятся в виде файлов, содержащих информацию, которая необходима программам при отображении документа на экране или распечатывании на бумаге. Как и все графические объекты в ЭВМ, шрифты могут быть векторными и растровыми.
Символы растровых шрифтов представляют собой матрицу точек. При увеличении таких символов качество изображения резко теряется, края становятся похожими на лестницу. Однако такие шрифты быстро отображаются на экране монитора. Очевидно, что растровые шрифты должны включать в себя варианты начертания для различных кеглей.
При печати документов используются векторные шрифты. Символы векторных шрифтов представляют собой контур, составные элементы которого описываются математическими формулами. Векторные шрифты прекрасно масштабируются, поэтому нет необходимости хранить в компьютере шрифты разных размеров.
История развития цифровых шрифтов насчитывает три типа, используемых для допечатной подготовки: Adobe Type 1, Adobe Type 3 и TrueType.
Шрифты Type 1 состоят из двух файлов — экранного шрифта и шрифта принтера. Экранный шрифт является растровым и используется для вывода информации на экран монитора. При установке он заносится в специальную системную папку операционной системы (в Windows такой папкой является FONTS). Шрифты принтера являются векторными. Стоит заметить, что экранный вариант шрифтов Type 1 может незначительно отличаться от принтерного варианта, что, конечно, является недостатком технологии. Однако фирма Adobe разработала программу по управлению шрифтами — Adobe Type Manager. Эта системная программа устраняет недостатки: шрифты на экране и при печати выглядят идентично.
Векторный вариант шрифта Type 1 описывается кривыми третьего порядка, называемыми кривыми Безье.
Кроме того, в 1996 году появилась новая программа — ATM Deluxe. Она обладает всеми возможностями Adobe Type Manager, но позволяет кроме этого создавать и управлять наборами шрифтов.
Как правило, не рекомендуется держать в системной папке более 50 шрифтов. Однако каждый новый проект (очередная книга, рекламный буклет и пр.) может потребовать новых шрифтов, в результате чего системная папка неотвратимо перегружается. С помощью утилиты ATM Deluxe шрифты можно объединять в наборы и, не помещая их в системную папку, подгружать и удалять из системы по мере необходимости прямо в процессе работы.
Шрифты Type 3, призванные усовершенствовать технологию Type 1, являются относительно новыми и непроверенными, поэтому грозят потенциальными неприятностями. (не рекомендуют использовать)
Формат TrueType был разработан фирмами Apple и Microsoft, не желавшими примириться с господством на этом рынке сравнительно мелкой фирмы Adobe. Положительной особенностью TrueType является то, что растровая версия для монитора и векторная версия для принтера хранятся в одном файле, для установки которого достаточно просто поместить его в системную папку.
Основные элементы статьи. Правила работы с заголовком и текстом.
Среди многочисленных элементов газетной полосы всего четыре являются необходимыми. Заголовок, текст, фото, и комментарий к фото — из этих элементов складывается статья.
Заголовок — крупная надпись, сопровождающая статью. На газетной полосе он выполняет четыре задачи:
вкратце отражает содержание статьи;
дает понять, что приоритетно, а что второстепенно;
заманивает читателя;
организует материал на странице.
Заголовки современных газет, как правило:
написаны как обычный текст (т.е. с соблюдением традиционных правил использования заглавной и строчной буквы)
выровнены по левому краю
чаще бывают широкими, чем узкими
совсем необязательно содержат подзаголовки
Ниже приводятся возможные варианты оформления заголовка
Шапка, проталкиватели, треноги, дамское седло.
«
Рис.
4. ШАПКА. Стандартный вариант верстки.
Рис.
5. ПРОТАЛКИВАТЕЛИ. Подводят к заголовку
с помощью слова или фразы, привлекающей
внимание. Проталкиватель обычно меньше
по размеру, чем основной заголовок, и
контрастирует с ним по стилю и оформлению.
Число строк в классическом заголовке зависит от ширины статьи (в колонках). Узкие новостные ленты сопровождаются многострочными заголовками сравнительно небольшого кегля. Над широкими статьями помещается крупный заголовок в одну строку.
Текст — собственно статья. Главный строительный материал в газетном деле. Серое вещество, передающее большую часть информации, содержащейся в газете.
Главной структурной единицей текста с точки зрения верстки является абзац. Для отделения абзацев друг от друга используется красная строка либо вертикальный отступ.
При разбиении текста на абзацы возникают висячие строки. Они бывают двух типов. Висячей строкой называют первую строку абзаца, которая оказалась последней в своей колонке или последнюю строку абзаца, которая оказалась в колонке первой. Такое негармоничное разбиение абзаца по колонкам несет негативный художественный и смысловой оттенок, поэтому висячих строк следует избегать. Висячей строкой называется также последняя строка абзаца, если ее длина меньше четверти ширины колонки.
Текст газетной статьи разбивается на колонки. В зависимости от стиля, которого придерживается издание, ширина колонки может быть фиксирована для всей газеты, либо выбираться произвольно для каждой статьи.
Ширина колонки зависит от размера текста, т.е. от кегля шрифта, которым набран текст. По общему правилу, чем длиннее строки, тем больше должен быть кегль. Оптимальный размер газетного текста — 9-10 пт (довольно часто используется и кегль в 8 пт, но такой текст уже трудно читать пожилым людям со старым зрением).
Оптимальная ширина газетной колонки составляет 5—6 см.
Оптимальная высота колонки находится в пределах от 5 до 25 см.
Строки во всех колонках должны обязательно располагаться на одном уровне.
Б
Б
уквица. Это первая буква абзаца, увеличенная до высоты нескольких строк (обычно 2 или 3), обычно «утопает» в абзаце.
Врезка представляет собой цитату из статьи (или её анонс), набранную увеличенным кеглем и размещенную внутри статьи в самостоятельном блоке. Блок может быть выделен рамкой.
Выделение фрагментов текста. Можно использовать полужирное или курсивное начертание, чтобы акцентировать внимание читателя на ключевых фразах материала и в то же время «украсить» текст. Полужирный шрифт привлекает внимание независимо от контекста. Если же необходимо акцентировать внимание следует использовать курсив, который не притягивает взгляд читателя, еще не добравшегося до нужного места.
Подчеркивание же необходимо применять с осторожностью. Более трёх строк вообще никогда нельзя подчеркивать.
Выворотка и фон. Вывороткой называют белый текст на черном фоне. Может использоваться при оформлении врезки, дополнительного материала.
Основные элементы статьи. Правила работы с фотографией и подписью к фотографии.
Среди многочисленных элементов газетной полосы всего четыре являются необходимыми. Заголовок, текст, фото, и комментарий к фото — из этих элементов складывается статья.
Фотография привлекает взгляд читателя больше любых других элементов и способна заинтересовать его материалом.
Фотографии бывают трех конфигураций. Горизонтальная форма наиболее распространена, поскольку человеку свойственно видеть мир в горизонтальной плоскости. Вертикальная считается динамичной. Квадратные фото самые скучные.
Размер фотографии должен быть достаточным для того, чтобы все значимые детали можно было различить без напряжения. Предпочтительнее использовать одну крупную фотографию, чем несколько мелких. Фотографий 4x4 см и меньше следует избегать вообще.
Фотография может иметь направление. Фото, имеющее строгую направленность, обязательно должно «смотреть» на текст, который оно иллюстрирует.
Существует ряд рекомендаций касательно содержания фото. Одна из самых ценных: лучше пренебречь снимком, иллюстрирующим статью буквально в пользу снимка, который интересно разглядывать. Если статья посвящена уборке зерновых, то вместо круглого стола дать фотографию работающего комбайна.
При подборе иллюстраций следует избегать фотографий из клипартов — сборников изображений в цифровой форме на дисках, особенно из пиратских. Сканировать изображения со старых газет или журналов тоже следует очень осторожно, поскольку при печати с низким разрешением возникает явление муар (будет рассмотрено ниже). Не стоит использовать одни и те же фотографии несколько раз.
Коллаж представляет собой фрагменты различных фото, объединенных в единую композицию. Коллаж может быть очевидным, а может, благодаря искусству дизайнера, восприниматься как «правдивая» фотография. Чтобы не вводить читателя в заблуждение, коллаж должен сопровождаться надписью: «Коллаж <имя автора>». Рядом с каждой фотографией также следует указывать имя фотографа.
Комментарий к фото объясняет читателю, что происходит на фотографии, где и когда это случилось. Качественно написанный комментарий объясняет читателю, почему важны этот текст и заметка. К сожалению, этим элементом статьи часто пренебрегают.
Шрифт, которым набран комментарий, должен отличаться от шрифта основного текста. Размещается комментарий, как правило, под фото, но вполне допустимы варианты с выравниванием по его правой или левой стороне.
Можно разместить комментарий с рваным левым краем, выровненный по левой стороне фото. В этом случае он должен идти вдоль внешнего края страницы. Это удобно, поскольку он не будет сливаться ни с каким другим текстом.
Комментарий можно расположить справа от фотоснимка с выравниванием по левому краю.
Комментарий никогда не следует размещать на самой фотографии. Если у снимка есть маловыразительная область, которая, как будто, подходит для этих целей, следует кадрировать (обрезать) снимок.
В идеале каждое фото должно сопровождаться своим комментарием. Но иногда композицию из нескольких фотографий уместно сопроводить общим комментарием, расположив его так, чтобы он относился ко всем снимкам сразу.
Комментарий должен быть достаточно длинным, чтобы вкратце объяснить все детали фотографии.
Правила верстки газетной статьи.
При взаимном размещении четырех составляющих статьи необходимо руководствоваться следующими непреложными правилами:
