Принципы разработки web-сайтов (на примере ЗАО "Кондитерская фабрика "Саратовская")

 

.4.4 Решетка

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

 

Рисунок 1.5 - Решетка

 

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

1.4.5 Иерархия

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

 

Рисунок 1.6 - Узкая иерархия

 

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

Рисунок 1.7 - Широкая иерархия

 

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

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

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

 

Рисунок 1.8 Запутанные деревья

 

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

 

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

 

Рисунок 1.9 - Полное связывание

 

При полном связывании количество ссылок равно числу страниц, помноженному на число страниц минус один. Это  означает, что для сайта из пяти страниц количество ссылок будет равно 20. Для сайта из 20 страниц количество ссылок составит 90. Для сайта из 100 страниц - число ссылок составит 9900 (100x99) и для 1000-страничного сайта их число будет в районе одного миллиона! В действительности с точки зрения практичности полное связывание не является хорошим выбором. Если в качестве максимального допустимого количества ссылок на странице принять число девять, то сайт в стиле полного связывания может состоять из десяти страниц. В действительности, большинство сайтов склонны использовать частичное связывание с перекрестными ссылками только на наиболее важные страницы.

 

.4.7 Смешанные формы

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

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

 

Рисунок 1.10 - Смешанная иерархия

 

.4.8 Стиль паутины

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

 

Рисунок 1.11 - Паутина

 

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

 

1.5Юзабилити web-сайта

 

Юзабилити сайта является всеобъемлющим термином, определяющим комплекс мер, результатом которого является создание удобного и понятного сайта. Термин "юзабилити" можно рассматривать как "конечную суммарную степень удобства, меру интеллектуального усилия, необходимого для получения полезных качеств вещи, и скорость достижения положительного результата при управлении ею".

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

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

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

Особенности поведения пользователей. В принципе, поведение пользователей  на веб-сайте не особо отличаются от их поведения в, скажем, магазине. Пользователи мельком окидывают взглядом каждую новую страницу, просматривают отрывки текста и кликают на первую зацепившую их внимание ссылку, или хотя бы отдаленно похожую на ту, которую они искали. На самом деле, на большую часть страницы они даже не смотрят. Многие пользователи ищут что-нибудь интересное (или полезное) и "кликабельное"; как только на глаза попадается подходящий "кандидат", пользователь быстро кликает и переходит по ссылке. Если результат не оправдал его ожиданий, пользователь кликает "назад" и продолжает поиск.

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

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

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

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

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

 

Глава 2. Технологии, применяемые  при разработке web-сайтов

 

2.1Модель "Клиент-сервер"

 

Модель «клиент-сервер» - это технология взаимодействия в  информационной сети. Сервером сети Интернет называется компьютер, на котором установлена  специальная программа (она тоже называется сервером, web-сервером или  http-cepвером), которая отображает web-страницы по запросу клиентской машины, а так же выполняет множество других полезных функций. Владелец и администратор сервера могут гибко менять необходимые настройки, разрешать или запрещать доступ к его ресурсам, подключать, настраивать и запускать ряд дополнительных программ и функций, таких как скрипты CGI или приложения SSI, то есть полностью конфигурировать его работу по мере необходимости. Когда домашний компьютер связывается с сервером и получает от него все необходимые данные, например код web-страницы, он выступает в роли "клиента", а всю систему в этом случае принято называть связкой "клиент-сервер".

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

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

Программное обеспечение  клиентов может включать:

·Браузер или универсальный  клиент. Это программа, которая обеспечивает загрузку и отображение Web-страниц. Кроме того, современные версии этого  ПО позволяют выполнять небольшие клиентские приложения (скрипты и апплеты), расширяющие возможности обычных Web-страниц, а также осуществлять путешествия в виртуальных мирах.

·Почтовые приложения, работающие с электронной почтой.

·Другие мультимедийные средства, как, например, воспроизведение звуковых и видеороликов.

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

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

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

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

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

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