2.3 Ограничения в разработке web-сайта «Информатика в школе»

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

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

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

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

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

Третья цель эргономики - обеспечение условий для развития личности человека в процессе труда.

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

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

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

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

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

Адаптивность. Для быстрого приспособления посетителей на сайте, изображения и анимация не должны отвлекать внимание от текстовой информации. Таким образом, графические иллюстрации используются только для визуального дополнения текста. Между цветом фона и текстом обеспечен достаточный контраст, чтобы слабовидящие люди могли прочитать текст. Размер шрифта адаптирован таким образом, чтобы пользователи могли увеличить размер шрифта, если это необходимо. Кроме того, шрифты не настолько малы, чтобы утомлять глаза и делать текст неразборчивым. На сайте применяются такие безопасные шрифты как Tahoma и Geneva.

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

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

К первичным цветам относятся: синий, красный и желтый.

К вторичным цветам, которые получаются при смешивании, относятся: оранжевый, зеленый и фиолетовый.

Третичные цвета образуются смешиванием первичных и вторичных цветов: оттенки сине-зеленого, красно-оранжевого и так далее. В соответствии с рисунком 5 показаны виды цвета.

Рисунок 5. RGB и CMYK

RGB (от сокр. Red+Green+Blue) — составлена из красного, синего и зеленого цвета, которые при смешении дают белый цвет.

CMYK (от сокр. Cayn+Magenta+Yellow+Key) — при смешивании голубого, пурпурного и желтого образуют черный цвет.

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

Гармонирующие цвета — цвета которые находятся рядом друг с другом, так же могут гармонировать любые другие цвета, если они не сильно контрастны.

Не гармонирующие цвета — цвета, которые совершенно не сочетаются друг с другом.

Основные цвета. Они отвечают за само меню, кнопки, блоки, подвал.

Второстепенные цвета. Цвета, которые отвечают за границы меню, блоков, цвета текстов, ссылок и прочих элементов дизайна.

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

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

Ниже приведено описание цветов и их характеристики:

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Не следует делать яркие, кричащие цвета, синий фон и красный текст.

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

2.4 Анализ существующих средств управления Web-сайтами

2.4.1 Система управления контентом Joomla

Joomla относится к портальной системе управления содержимым, она строится на модульно-компонентной системе: к сайту подключаются дополнительные модули, компоненты и плагины, которые расширяют функционал ресурса. С распространением Joomla появилось большое количество различных модулей и компонентов для этой системы и найти что-то нужное может каждый. В сети существуют два портала русскоязычной поддержки, где можно найти практически все. Собственно с помощью модулей сайт на основе Joomla можно сделать все задуманное - от простого блога до сложного web-портала. Шаблонов (тем оформления) в Интернете огромное количество, хотя даже при таком разнообразии уже часто встречаются сайты с открыто одинаковым оформлением. Из-за такой многоцелевой направленности Joomla теряет в удобстве администрирования - это уже негативные стороны – административная панель Joomla крайне неудобна и очень сильно запутана. Переходим к минусам, Joomla тяжелая система, тяжела в разрезе нагрузки на сервер, также сложна в доработке. Некоторые пользователи этой системы утверждают, что Joomla «система с непрозрачной и запутанной логикой», действительно, если необходимо что-то дополнить или изменить часто бывает сделать эти изменения сложнее, чем в других системах. В целом чтобы успешно, не задумываясь, пользоваться CMS Joomla нужно время для обучения и понимания системы и при этом Joomla одна из лучших CMS на сегодняшний день. В соответствии с рисунком 6 показан пример сайта сделанный на Joomla.

Особенности Joomla:

- Функциональность можно увеличивать с помощью дополнительных расширений (компонентов, модулей и плагинов).

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

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

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

- Начиная с версии 1.6 встроена многоязычность.

- Начиная с версии 2.5 расширена поддержка баз данных. Реализована поддержка Microsoft SQL Server, а с версии 3.0 — PostgreSQL

Замена оформления для Joomla - не заметная проблема. На данный момент образовано большое количество готовых шаблонов, которые подойдут практически для каждого web-сайта. А для любителей редкостного оформления здесь также всё правильно обдумано: шаблон для CMS Joomla формируется очень легко.

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

Рисунок 6. Сайт на Joomla