Изготовление Интернет-сайта

4. Содержание и основная функциональность интернет- сайта

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

4.1 Структура. Воспринимаемый объем информации зависит от файловой структуры (так называемой карты сайта). Рекомендуется использовать древовидную структуру сайта.
При составлении концепции необходимо различать две структуры:
Информационная структура показывает, какая информация размещается на сайте. Например, для типичного корпоративного интернет- сайта торговой компании такая структура может включать:
* каталог - развернутое описание товаров и услуг, подготовленное специалистом-товароведом;
* прайс-лист - информация о наличии товаров, связанная с каталогом функционально;
* новости компании - самые значимые коммерческие предложения и изменения;
* информацию о компании - время, место и порядок работы;
* справочную информацию - новости рынка, обзоры и советы.

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

4.2 Объем информации. При планировании наполнения и компоновки создаваемого итернет-сайта стоит исходить как минимум из двух правил, которые в подавляющем большинстве случаев оказываются верными:
* оптимальный объем текста для одной HTML-страницы находится в пределах четырех-пяти "экранов" при разрешении монитора 600Х800 пикселей. Документы большего размера редко дочитывают до конца, если в них не содержится особо
ценной для посетителя информации;
* пользователь изначально воспринимает сайт как сборник нужной информации и отдает предпочтение наиболее предметным ресурсам. Поэтому корпоративные буклеты, которые в основном должны убедить посетителя в ценности того или иного товара, здесь "не работают". А вот справочники, пособия по работе, ответы на часто задаваемые вопросы и т.п. весьма популярны.

Отсюда следует, что основная информационная часть каждой отдельной HTML-страницы должна находиться в пределах первого экрана. Для коротких материалов достаточно развернутого подзаголовка, а для больших возможна короткая аннотация. Одним из вариантов может стать размещение материалов в виде коротких анонсов с потенциальной возможностью прочесть полный документ. Кроме того, лучше избегать размещения рисунков и фотографий, занимающих всю ширину первой страницы экрана. Тогда посетитель сразу сможет приступать к чтению, не дожидаясь загрузки картинки и не "прокручивая" экран. Стоит также обратить пристальное внимание на способ подачи материалов. Это значит, что нужно избегать вводных абзацев, не несущих прямой информационной нагрузки, пространных рассуждений и т.п. С другой стороны, не стоит стремиться постоянно "украшать" текст графикой или фотографиями. Необходимо учитывать, на каких пользователей рассчитан сайт.
Возможны два варианта:
* ориентация на случайно зашедших пользователей, которые, скорее всего, больше не посетят Ваш ресурс. В этом случае на первой странице необходимо разместить максимум информации;
* ориентация на постоянных посетителей, которые снова и снова возвращаются на Ваш сайт, с тем чтобы получить новую информацию и т.д. В этом случае на первой странице следует размещать только заголовки с ссылками.

Тексты должны содержать максимум содержательной информации и минимум рекламной. Сначала в сжатом виде излагается информация общего характера, а для ознакомления с деталями (например, с дополнительными техническими характеристиками сложных электронных устройств) пользователь переходит по ссылке к специальной странице с информацией в развернутом виде. При этом дается краткая предварительная информация о том, какая информация представлена по данной ссылке. Собственно объем текста - количество строк, знаков и т.д.- зависит от конкретного материала и построенной системы ссылок. Общая рекомендация: основной текст должен помещаться на одной странице, по возможности без прокрутки. На практике это удается не всегда. Помочь здесь может система ссылок: более подробная информация (например, нужная не всем) помещается в отдельном файле.
Эксперты отмечают, что на каждой странице должно быть не более 20 - 30 Кб HTML-текста.

4.3 Информационная и справочная поддержка.
Любой профессиональный веб-сайт должен содержать справочнк. Здесь вполне уместна аналогия с печатной продукцией. Отличие профессионального научного издания от простой перепечатки того же текста состоит в объеме справочной информации: именные и тематические указатели, расширенный список литературы по этой тематике и, конечно, комментарии. Эти же правила должны сохраняться в рамках сайта. Это может быть достигнуто следующими способами:
* на сайте необходимо поместить расширенное оглавление. Согласно многим исследованиям, пользователи любят, когда тексту или статье предшествует оглавление или аннотация. Тексты новостей лучше оформлять в стиле "перевернутой пирамиды", то есть сначала подавать читателю новость, выводы, а уж потом подробности. Такой подход позволит сразу получить необходимую информацию и целиком захватить внимание пользователя. У читателя просто не останется вопросов о том, на какую тему все-таки написана статья и стоит ли тратить на нее время;
* Если интернет-сайт содержит множество различных разделов, ссылок и страниц, может быть целесообразно предусмотреть функцию поиска по ключевым словам;
* Перед большими фрагментами текста, а также для отдельных документов, хранящихся в отдельных файлах, рекомендуется давать аннотации. Это сильно экономит время работы пользователей и свидетельствует о том, что сайт выполнен на профессиональном уровне;
* необходимо, чтобы посетитель всегда понимал, в каком разделе интернет-сайта он работает и как ему вернуться "домой" - на базовую страницу. Этот вопрос решается средствами справочной поддержки и навигации;
* целесообразно реализовать систему контекстных справок это дает пользователю возможность получать ответы на текущие вопросы прямо "на месте".
Сайт, выполненный профессионально, должен иметь хорошо организованную справочную поддержку. Помимо традиционных элементов (оглавления, аннотации и т.д.) целесообразно организовать поиск по ключевым словам, а также использовать справочную информацию совместно с навигацией, гиперссылками и примерами.

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

4.5 Функциональность электронной коммерции (е-commerce). За словосочетанием "электронная коммерция" кроется достаточно широкий спектр понятий: от размещенного в Интернет прайс-листа до полноценного электронного магазина с оплатой по кредитным картам. Провести разграничительную черту между "настоящей электронной коммерцией" и размещением информации о товарах и услугах в Интернет достаточно сложно, поскольку не существует единого мнения о том, какими характерными функциональными возможностями она должна обладать. Есть, кстати, фирмы, которые ведут в сети полный цикл отношений с клиентом. К таким организациям относятся в первую очередь разнообразные информационные и аналитические агентства, предприятия сектора В2В (в первую очередь электронные биржи), продавцы программного обеспечения. То есть речь идет о предприятиях, торгующих информацией или услугами, которые можно оказать (передать) посредством Интернета (дистанционно).
Попытаемся определить основные функции, которые можно возложить на сайт как инструмент ведения электронного бизнеса.
При работе с партнерами:
* передача и распределение региональных заказов;
* обмен финансовой документацией;
* обмен и централизация информации о состоянии складов;
* проведение транзакций при помощи систем дистанционного банковского обслуживания.

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

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

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

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

5.1 Первая страница. Именно первая страница является отправной точкой для "хождения по сайту". Вот почему здесь должны быть представлены не только ссылки на основные разделы ресурса, но и анонсы наиболее важных обновлений. Таким образом, правильно выполненная первая страница являет собой гибрид рубрикатора сайта и подобия первой полосы новостной газеты. Это позволяет сразу обратить внимание читателя на нужные материалы.

5.2 Типы внутренних страниц. Желательно, чтобы веб-сайт был организован понятно для впервые зашедшего на него пользователя. Рекомендуется разделять все страницы на две основные группы:
* навигационные/индексные. Такие страницы должны состоять из ссылок и содержать минимум информации;
* информационные. Эти страницы содержат основную информацию (тексты, рисунки, таблицы и т.д.), а также, возможно, перекрестные ссылки.
Рекомендуется избегать большого числа мелких индексных страниц - их лучше объединять в более крупные. Кроме того, таким образом, удаляются лишние переходы, повышается скорость доступа к нужной информации. По оценке экспертов, на навигационной странице должно быть не менее пяти ссылок. В противном случае её нужно объединять с другими навигационными страницами.
Рассмотрим иерархию разделов в оглавлении. По разным оценкам, на каждую последующую страницу сайта переходит 20 - 40% посетителей предыдущей. Примем в качестве рабочего значение в 30% и посмотрим, сколько посетителей дойдет до четвертого раздела интернет-сайта.

Предположим, что на первой странице сайта ВашаФирма.RU тысяча ежедневных посетителей:
ВашаФирма.RU - 1000 посетителей
О компании - 300 посетителей
Пресс-релизы - 90 посетителей
Свежий пресс-релиз - 27 посетителей
Двадцать семь человек из тысячи, или 2,7% от общего числа посетителей!
Это говорит о том, что затрудненная, запутанная за счет большого количества иерархических уровней система навигации автоматически уменьшает количество посещений подразделов и сайта в целом. Удобную навигацию можно описать следующим образом. Посетитель, не ломая голову, может получить доступ к любому материалу сайта, дважды (максимум - трижды) щелкнув мышью. И именно анонсы, расположенные на первой странице, позволяют экономить время и читать только самые интересные, с точки зрения посетителя, статьи. Это удобство порождает неосознанную симпатию, симпатия - привязанность, привязанность - желание вернуться завтра и прочесть что-нибудь новое.

Если Вы уже встречались с неконструктивным обсуждением эскизов с людьми, считающими себя художниками, которых "каждый обидеть может", то согласитесь, что в большинстве случаях такое обсуждение протекает в плоскости вкусовщины. Даже хорошие дизайнеры часто искренне не понимают, как менеджер проекта или специалист по маркетингу, не имея художественного образования, может их чему-то "учить".
Действительно в арсенале знаний менеджера, как правило, нет аргументов из теории восприятия пользователем информации.
Поэтому далее речь пойдет о психологических принципах взаимодействия пользователя с веб-сайтами. Мы поговорим о сочетании цветов, фигур и фона, движущихся объектов, иллюзий, а также коснемся экспериментальных данных результатов взаимодействия человека с компьютерными системами. Дизайн становится камнем преткновения для многих создателей веб-сайтов. С одной стороны, сайт должен привлекать внимание, вызывать положительные эмоции и быть хорошо запоминающимся. С другой стороны, ресурс не должен быть перегружен графическими элементами, затрудняющими передачу данных.
Таким образом, дизайн - важнейший, хотя и не единственный элемент эргономики. Именно по поводу дизайна возникают основные споры между заказчиком и изготовителем, именно к дизайну предъявляется наибольшее число претензий.
А между тем дизайн бизнес-сайта должен соответствовать ТОЛЬКО двум основным требованиям:
* содержать элементы узнаваемого фирменного стиля;
* по возможности не мешать работе с содержательной частью ресурса.
Понятие "дизайн интернет-сайта" воспринимается людьми по-разному. Для одних дизайн — единый оформительский стиль и цветовая гамма, для других - совокупность взаимосвязанных смысловых и оформительских элементов, которые должны обеспечить высокую функциональность конечного продукта. Второе определение ближе к действительности. Поэтому в дальнейшем под веб-дизайном мы будем подразумевать именно взаимосвязь смысловых и графических элементов.
Если Вы обратились в хорошую веб-студию, то специалисты, которые в ней работают, наверняка обладают большим опытом, и указывать им, как именно располагать графические элементы на странице неразумно. Различные мнения и пожелания вы можете выражать относительно общей структуры сайта. Нередки случаи, когда заказчик требует от исполнителя воплощения решений, виденных им ранее на сайтах конкурентов. Чаще такие решения касаются общего оформления страниц. Собственная практика позволяет с высокой степенью уверенности сказать, что по необъяснимым причинам заказчики чаще всего требуют копирования самых бессмысленных, а зачастую и бесполезных компонентов оформления сайта, к которым, в частности, относятся:
* разнообразные бегущие строки;
* всевозможные мигающие картинки;

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

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

7. Основные разделы технического задания для проектирования сайта.
Техническое задание (ТЗ) должно быть отправной точкой для технического проектирования сайта, оно должно разъяснять все вопросы и не допускать разночтений при осуществлении поставленных задач. Классическое техническое задание на проектирование веб-сайта как частный случай ТЗ на автоматизированную систему или программное средство содержит следующие разделы:
1. Общие сведения о проекте. Здесь описывают полное наименование системы, наименование и реквизиты для взаимодействия заказчика и исполнителя; приводят сведения о финансировании разработки, определяют порядок
предъявления заказчику результатов работы.
2. Назначение и цели создания сайта. Здесь описывают вид автоматизируемой деятельности, например поиск новых покупателей и оформление заказа.
3. Характеристики сайта. Здесь описывают условия эксплуатации веб-сайта; устанавливают ограничения по объему размещаемой в базе данных информации; приводят прогнозы по увеличению функциональных возможностей или изменения конфигурации ресурса; оговаривают уровень отказоустойчивости и возможности использования программной основы на различных типах аппаратного обеспечения.
4. Требования к сайту. Это основной по объему и по важности раздел ТЗ. Здесь описывают требования к системе в целом, требования к функциям и задачам, выполняемым системой, и требования к видам обеспечения:
* требования к веб-сайту в целом относятся к структуре и функционированию, надежности и безопасности, эргономике и технической эстетике, эксплуатации и ремонту, хранению и защите данных от взлома;
* требования к функциям и задачам веб-сайта определяют перечень функций каждой подсистемы (разделов, сервисов), подлежащих автоматизации, требования к качеству реализации каждой функции и форме представления информации;
* требования к видам обеспечения интернет-сайта ориентированы на математическое, информационное, лингвистическое, организационное, методическое и другие виды обеспечения сайта.
5. Состав и содержание работ по созданию сайта. Здесь описывают перечень стадий и этапов создания веб-сайта.
6. Требования к составу и качеству работ по внедрению сайта. Здесь приводится перечень основных мероприятий при подготовке к эксплуатации:
установка сайта на хостинг-сервер, и т.д.

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

Из вышесказанного следует вывод - за качественным сайтом обращайтесь к профессионалам (к примеру, http://globalsitegroup.ru/

Внимание! Информация, указанная в статьях, может не совпадать с официальной позицией компании Global Site Group. Компания не несет ответственность за достоверность сведений, указных в статьях.

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

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