1.3.7 Базы данных и СУБД для web-приложений

MySQL составляет всё более значительную конкуренцию таким дорогостоящим гигантам, как Oracle и MS SQL Server. Немаловажным фактором является то, что MySQL распространяется совершенно бесплатно. В настоящее время пакет MySQL доступен как программное обеспечение с открытым исходным кодом.

MySQL отличается хорошей скоростью работы, надежностью, гибкостью. Работа с ней, как правило, не вызывает больших трудностей. Поддержка сервера MySQL автоматически включается в поставку PHP.

1.4.1 Разработка интерфейса

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

Интерфейс в широком смысле - определенная стандартами граница между взаимодействующими независимыми объектами. Интерфейс задает параметры, процедуры и характеристики взаимодействия объектов.

Интерфейс пользователя - элементы и компоненты программы, которые способны оказывать влияние на взаимодействие пользователя с программным обеспечением, в том числе:

· средства отображения информации;

· командные режимы;

· устройства и технологии ввода данных;

· диалоги, взаимодействие и транзакции между пользователем и компьютером;

· обратная связь с пользователем;

· поддержка принятия решений в конкретной предметной области;

· порядок использования программы и документация на нее.

Есть несколько простых правил, позволяющих интерфейсу магазина быть понятым клиенту.

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

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

Чем проще выполнена верхняя часть страницы, тем легче запомнить название сайта и саму фирму.

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

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

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

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

Для наглядности необходимо предусмотреть специальные разделы, содержащие товары, сгруппированные по маркетинговым признакам, например, "Новинки", "Специальные предложения", "Товары дня", "Лидеры продаж".

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

Расчёт стоимости и вывод цен должен осуществляться в различных валютах. Чтобы сэкономить время заказчика на оплату товара, неплохо иметь в магазине готовую квитанцию для оплаты через банк.

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

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

Раздел "Вопросы и ответы" (FAQ), где покупатель может задать свой вопрос, а администратор магазина - ответить на него. Это способствует повышению качества обслуживания, удержанию старых клиентов и привлечению новых.

Отзывы и вопросы по товарам. Покупателю следует предоставить возможность просмотреть отзывы о товаре, оставить свой отзыв или задать вопрос - это способствует повышению качества описаний товаров.

Наличие обратной связи администратора с клиентами. Важно, чтобы администраторы как можно быстрее и максимально полно отвечали на письма.

Грамотная система управления. Вход в систему администрирования осуществляется только после ввода администратором логина и пароля. Администратор имеет возможность полностью управлять содержимым интернет-магазина:

· добавлять или удалять товары, описания и фотографии к ним, изменять их стоимость, условия доставки товаров и уровень скидок;

· редактировать разделы магазина (новости, статьи, вопросы и ответы, отзывы и вопросы к товарам);

· редактировать специальные разделы магазина (новинки, специальные предложения, товары дня, лидеры продаж);

· редактировать контактную информацию интернет-магазина;

· редактировать содержание заголовков и текстов писем, отправляемых покупателю при регистрации и покупке товара;

· составлять и рассылать письма с новостями магазина подписчикам;

· просматривать историю заказов и статистику покупателей;

· изменять курс валюты на витрине магазина.

Если заказчик интернет-магазина собирается работать ещё и с оптовыми клиентами, необходимо предусмотреть работу сайта как с розничными, так и с оптовыми ценами на товары.

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

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

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

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

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

Подводя итоги, следует выделить основные моменты, на которые нужно делать ставку при разработке интерфейса интернет-магазина:

· простота и информативность. Пользователь, попадая на сайт, должен получать четкую информацию о товаре, новинках, предстоящих релизах, а также о том, как он сможет оплатить заказ, каковы условия и сроки доставки;

· удобный и быстрый поиск необходимого товара;

· все товары, предлагаемые на сайте, должны быть в наличии;

· простая и предельно удобная навигация;

· грамотная цветовая гамма.

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

Понятие дизайна веб-страницы проще всего определить как внешний вид страницы влияет на ее восприятие посетителем (привлекательность или непривлекательность, легкость или сложность использования).

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

Тремя основными принципами разработки веб-страниц и небольших веб-узлов являются простота, предсказуемость и целостность [22].

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

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

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

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

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

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

Очень распространенной ошибкой считается использование на веб-страницах мелкого текста.

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

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

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

Выделяются следующие элементы, участвующие в создании стиля:

· шрифт; в пределах публикации шрифт должен иметь одинаковые характеристики (гарнитура (начертание), кегль (высота), цвет);

· абзац; в пределах публикации предпочтителен единый вид выравнивания;

· цветовая схема; единое оформление создаст у посетителя ощущение связности сайта;

· графическое оформление должно укладываться в общую цветовую схему; используя в оформлении фотографии в качестве иллюстраций, необходимо сделать грамотную тоновую и цветовую коррекцию, кадрирование, найти способ обработки краев;

· логотип.

На данный момент в зависимости от контекста можно выделить следующие типы веб-дизайна:

· текстовый дизайн: почти полное отсутствие изображений, что значительно ускоряет загрузку страницы;

· полиграфический дизайн: веб-страница имитирует печатное издание. Подобный дизайн распространен на корпоративных и рекламных сайтах, т.е. там, где необходимо образно-эмоциональное наполнение содержания. Как правило, основное впечатление пользователь получает за счет пиксельной графики;

· интерфейсный дизайн: минимизирование кода и предельная оптимизация изображений, тщательно продуманная навигация и общая схема сайта;

· динамический дизайн: активное использование динамических объектов, в частности, анимации;

· смешанные типы - комбинация представленных типов дизайна [7].

С особенностями разрешения дисплея связан вопрос выбора между подстраивающимися страницами (изменяется размер и осуществляется настройка под разные размеры окон) и фиксированными по размеру (что позволяет разработчику лучше управлять размерами страницы). В пользу каждого из подходов есть веские аргументы [7].

При использовании гибких страниц (т.е. резинового дизайна), текст и элементы HTML-файла попадают в окно браузера, заполняя все доступное пространство, вне зависимости от размеров дисплея. Если размер окна браузера изменяется, элементы повторно выводятся, чтобы настроиться на новые размеры. Этот подход имеет свои достоинства и недостатки:

· гибкую страницу можно настроить для вывода на любом дисплее;

· отсутствует нежелательное свободное место;

· на больших дисплеях длина строки может оказаться чрезмерной, что значительно ухудшает условия чтения;

· возможно негармоничное расположение элементов;

· результаты гибкого дизайна непредсказуемы: страница у разных пользователей будет выглядеть по-разному.

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

Подобный подход также имеет свои особенности:

· страница всегда будет выглядеть одинаково вне зависимости от размеров дисплея;

· страницы и столбцы с фиксированной шириной обеспечивают лучшее управление длинами строк;

· если размер данного окна браузера меньше сетки страницы, части страницы не будут видны и может потребоваться горизонтальная прокрутка, что почти всегда воспринимается как помеха.

Веб-страницы могут быть полностью фиксированными или гибкими, но также могут объединять в себе оба подхода.

Макет веб-сайта (каркас) не отображает детали эстетического оформления, а имеет отношение только лишь к информации основных страниц, показывая сырую навигацию, положение текстов, графики, ключевые заголовки и любые другие элементы, которые должны находиться на странице. Макеты отображают некоторую иерархию информации, но не диктуют точную форму и место её представления [10].

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

Макеты бывают простыми (компоновка содержимого и навигация по нескольким основным страницам сайта) и сложными (тексты, ссылки, навигация и графическое содержимое в более детальной форме).

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

Для облегчения задачи создания макетов используется следующий контрольный список:

· изображения, чертежи, иллюстрации;

· контент (общее направление содержимого или готовый текст);

· глобальная навигация (навигационная панель или общие элементы, которые появляются на каждой странице);

· описание основных функциональных возможностей;

· первичные ссылки (предполагаемая навигация), вторичные ссылки;

· мультимедиа (если есть);

· целевой размер окна;

· данные для заголовка и подвала (название проекта, название страницы, номер версии, дата, авторское право).

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

Шрифтовая композиция - это способ самовыражения, выливающийся в самостоятельную творческую форму и композицию.

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

Пример творческого использования шрифта - выделение текста. Он может быть заголовком, девизом, лозунгом. Иногда для выражения мысли достаточно использовать жирность или более крупный кегль.

При выборе шрифта необходимо учитывать следующие рекомендации:

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

· не следует применять такие приемы, как подчеркивание или перечеркивание: подобные эффекты могут ассоциироваться у пользователей с гипертекстовой ссылкой;

· навигационное меню на всех страницах должно иметь одни и те же форму, цвет, размеры и месторасположение, что обеспечивает легкость перемещения по серверу;

· не следует заполнять страницы ресурса избыточным количеством графических материалов;

· использование фонового цвета для отдельных символов текста, дает возможность создавать разнообразные композиции для заголовков, подписей к рисункам и пр. [25].

Шрифт определяет визуальный облик текста, который будет влиять на восприятие, создавать определенный образ или настроение, являться средством выделения или привлечения внимания.

В настоящее время существует множество шрифтов, но большую их часть можно классифицировать следующим образом:

· шрифты с засечками (Serif): "Times", "Century", "Garamond" и пр.; этот тип шрифтов состоит из символов, на концах которых располагаются "хвостики", называемые засечками (serifs);

· шрифты без засечек (Sans Serif): "Arial", "Verdana" и пр.; такие шрифты имеют округлый вид;

· декоративные (Decorative);

· рукописные (Script);

· символьные.

Кроме того, для всех шрифтов можно выделить еще две группы:

· пропорциональные;

· моноширинные шрифты (все кегельные площадки знаков имеют одинаковую ширину).

В веб-дизайне шрифты группируются по семействам и гарнитурам. Семейство гарнитур - специфический набор шрифтов со специфическими свойствами. Гарнитура указывает на шрифт внутри семейства.

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

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

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

Кроме того, некоторые шрифты не имеют жирного начертания. При применении к ним "font-style: bold; " или <strong> получается "математическая модель" жирного шрифта, а не реальный жирный.

В веб-дизайне существует понятие "безопасные шрифты", т.е. те, которые одинаково отображаются на большинстве компьютерах. Вот некоторые из них: "Arial", "Arial Black", "Courier New", "Georgia", "Impact", "Times New Roman", "Trebuchet MS", "Verdana".

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

При создании веб-ресурса при помощи цвета можно выделить важные или образующие элементы страницы: заголовки, ссылки, навигационные элементы, цитаты в тексте, маркеры, списки, рамки.

Первым и главным правилом подбора цвета для будущего веб-ресурса является четкое представление о безопасных цветах.

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

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

Если весь спектр цветов свернуть в виде трубки, то полученная фигура будет носить название "цветовой круг". С помощью цветового круга удобно подбирать цвета и манипулировать ими [25].

Цвета красный, зеленый и синий называются основными, желтый, голубой и пурпурный - дополнительными цветами. Основанная на представлении цвета человеком, модель HSB описывает цвет тремя основными характеристиками: оттенком, насыщенностью, яркостью.

Оттенком (Hue) называют лучи света, отраженные от объекта или прошедшим сквозь него. На цветовом круге выражается в градусах от 0° до 360°.

Насыщенность (Saturation) - видимая яркость или интенсивность цвета. Насыщенность определяет количество серого цвета в оттенке, измеряется в процентах от 0% (серый) до 100% (полная насыщенность).

Яркость (Brightness) зависит в основном от количества световых лучей, отраженных поверхностью данного цвета, что равно его яркости по отношению к другим цветам при данном освещении. Обычно измеряется в процентах от 0% (черный) до 100% (белый) [8].

При подборе цветовой палитры необходимо придерживаться следующих правил:

1) для привлечения внимания используются контрастные цвета, остальные цвета будут находиться в их диапазоне;

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

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

Нюансовыми цветами называются цвета близкие по оттенку, но различающиеся по насыщенности и яркости.

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

Некоторые стандартные цветовые схемы проиллюстрированы на рисунке 1.4.1.

Рисунок 1.4.1 - Стандартные цветовые схемы

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

Типы графических вставок в web-страницы:

· логотип - идентификатор корпоративного стиля;

· титульная графика - предоставляет посетителям информацию по тематической направленности веб-ресурса;

· навигационные кнопки - дополнительный метод перемещения пользователя по ресурсу;

· маркеры списков - часто используются для разделения параграфов и абзацев в документе;

· разделительные линии - обычно используются для разделения текстов и облегчения их восприятия;

· фоновые рисунки - улучшают внешний вид страниц, однако, зачастую, ухудшают восприятие пользователем текстовой информации и становятся визуальным шумом;

· фотографии - обычно используются для иллюстрирования информации, привлечения внимания, в оформлении основных элементов сайта (например, в титульной графике).

Простейшим методом внедрения изображений в HTML-документ происходит с помощью тега <img>. Этот тег имеет единственный обязательный атрибут <src>, который определяет адрес файла с картинкой:

<img src = "URL" alt = "альтернативный текст"/>.

Альтернативный текст - текст, который будет показан пользователю в случае невозможности вывода изображения. Рекомендуется всегда указывать в атрибутах тега ширину и высоту с помощью атрибутов <width> и <height>. Это нужно для того, чтобы браузер мог сразу просчитать и зарезервировать необходимое для изображений место на странице.

В вопросах использования графики существуют свои особенности:

· из двух совершенно одинаковых рисунков больше запоминается тот, который имеет бомльшие геометрические размеры;

· черно-белая веб-графика запоминается меньше, чем полноцветная;

· из двух совершенно одинаковых рисунков больше запоминается более яркий;

· из двух совершенно одинаковых рисунков больше запоминается более контрастный;

· примитивная графика, иллюстрирующая процессы, схемы и пр. понимается и запоминается быстрее и проще, чем сложная графика, иллюстрирующая те же самые процессы и схемы;

· графика с простейшими геометрическими формами (овал, квадрат, прямоугольник) воспринимается легче, чем графика со сложными геометрическими формами [21].

Основными форматами графических файлов в веб-дизайне являются GIF, JPEG, PNG.

GIF (англ. Graphics Interchange Format, формат для обмена изображениями) изначально предназначался для передачи растровых изображений по Сети, однако, в первой версии формата файл изображения получался слишком объемным, что на тот момент делало невозможным его передачу по Сети.

Среди новых функциональных возможностей обновленного формата оказались: поддержка прозрачности и анимации, значительное сокращение объема файла изображения за счет поддержки LZW-компрессии Универсальный алгоритм сжатия данных без потерь, созданный Абрахамом Лемпелем, Якобом Зивом и Терри Велчем. . Формат GIF считается стандартным для анимированных изображений.

JPEG (англ. Joint Photographic Experts Group, объединенная группа экспертов фотографии) применяется для хранения многоцветных фотографических изображений, т.к. обеспечивает сжатие полноцветного изображения практически без уменьшения количества цветов. Процесс сжатия происходит за счет уменьшения числа пикселей, содержащих информацию.

PNG (англ. Portable Network Graphics, переносимая сетевая графика) является растровым форматом хранения графической информации без потери качества во время сжатия.

Задумывался данный формат как замена GIF. Отсюда и схожие возможности, вроде наличия прозрачного фона. Однако, PNG имеет большой, по сравнению с GIF, объем файла с изображением, а также не поддерживает анимацию. Тем не менее, формат PNG отлично подходит для хранения и редактирования изображений на промежуточной стадии их создания [8].

Выводы по главе