Разработка и проектирование сайта профессионального училища

Анализ изучения ряда инновационных сайтов позволил нам выделить перспективные направления в сайостроении к ним относится:

Увеличение нагрузки на сайт;

Добавления новых видов контента;

Интеграция с другими информресурсами;

Увеличения поддоменов и количество сайтов.

В процессе создания сайта ГБОУ НПО Профессионального училища №63 мы попытались использовать ряд инновационных приемов сайтостроения.

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

При разработке сайта училища мы руководствовались выявленными особенностями образовательного учреждения и соответствующими критериями разработки сайта ГБОУ НПО Профессионального училища №63.

В соответствии с выделенными нами особенностями использования сайтов, разработанных критериев сайта, нами спроектирован и разработан сайт ГБОУ НПО Профессионального училища №63 описанию которого посвящена следующая глава нашей работы.

Глава 2. Проектирование и разработка веб-сайта профессионального училища №63

2.1 Проектирование сайта Профессионального училища №63

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

Эффективное использование информационно-коммуникационных технологий в проектировании сайта возможно с помощью:

формулировка цели разработки сайта;

обсуждение аудитории;

схемы поведения пользователей сайта;

требования к содержимому;

требования к внешнему виду;

модульная сетка;

требования к навигации;

требования к каналам связи;

структурная схема сайта;

кадровое обеспечение;

технические требования.



2.1.1 Формулировка цели создания сайта

Цель написания сайта Уфимского техникума предпринимательства и права:

определение структуры;

изучение образовательных сайтов и федерального закона об образовании;

определение CMS;

планирование сайта;

разработка сайта.

2.1.2 Обсуждение аудитории

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

неопытные пользователи;

пользователи с определенным опытом посещения веб-сайтов, не посещающие сайт часто;

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

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

2.1.3 Схемы поведения пользователей сайта

Начнем с того, как пользователь попадает на сайт.

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

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

2.1.4 Требования к содержимому

Требование к содержимому сайта отражено в федеральном законе «об Образовании» [48]:

1) сведения:

о дате создания образовательного учреждения;

о структуре образовательного учреждения;

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

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

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

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

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

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

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

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

о поступлении и расходовании финансовых и материальных средств по итогам финансового года;

2) копии:

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

свидетельства о государственной аккредитации (с приложениями);

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

3) отчет о результатах самообследования;

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

5) сведения, указанные в пункте 3.2 статьи 32 Федерального закона от 12 января 1996 года N 7-ФЗ "О некоммерческих организациях"

сайт училище пользователь навигация

2.1.5 Технические требования

При реализации сайта предполагается использовать нами базовые технологии веб-дизайна, такие как html(xhtml), flash-ролики, каскадная таблица стилей (css) и язык обработки сценариев на стороне клиента (JavaScript).

«Клиентом» в терминологии всемирной паутины, называют браузер конечного пользователя, а клиентскими технологиями, соответственно, технологии, с ним связанные. Суть этих технологий в том, чтобы переложить часть или всю работу по динамическому формированию страниц на веб-браузер. HTML (от английского Hyper Text Markup Language - «язык разметки гипертекста») - стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузером и отображается в виде документа, в удобной для человека форме [16]. Технология JavaScript - это достаточно простой язык программирования, позволяющий манипулировать содержимым HTML страниц, перемещать отдельные объекты по окну веб-браузера и производить другие относительно несложные действия.

Основные требования к технологии:

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

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



2.1.6 Требования к внешнему виду

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

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

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

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

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

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

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

Почему не рекомендуется использовать черный цвет фона (табл. 2) [16]:

Таблица 1 - Рекомендуемые цвет текста

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

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

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

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

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

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

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

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

2.1.7 Модульная сетка

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

Макет дизайна должен быть разработан с разрешением 1280x960, для хорошего отображения даже при минимальном расширении монитора.

2.1.8 Требования к навигации

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

Основные требования:

расположение горизонтально, по - центру и сверху;

интуитивно-понятное и легкое в использовании;

название - ссылка на главную страницу - вверху;

меню и другие элементы навигации должны быть доступны без горизонтального прокручивания полностью открытого окна браузера при разрешении экрана 1280х960 точек;

цветовая индикация.

2.1.9 Требования к каналам связи

Для нормальной работы сайта требуются:

протокол передачи данных HTTP;

пропускная способность канала связи не менее 9,6 Кбит/сек.

Также доставка электронных ресурсов всем желающим может осуществляться на электронных носителях.

2.1.10 Кадровое обеспечение

Сайт должен эксплуатироваться персоналом, который должен уметь следующее:

пользоваться ПК (Windows);

работать с веб-браузером.

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

исправление ошибок и неточностей;

литературная адаптация публикуемого контента;

оптимизация текстов и кода для поисковых систем;

проверка корректности отображения публикуемой информации и изображений.

Спроектировав сайт ГБОУ НПО ПУ № 63, мы учли тенденции современных системных требовании. Опираясь на цель исследования, нами были продуманны схемы поведения посетителей на сайте, модульная сетка, структурная схема сайта, требования к каналам связи, навигации, внешнему виду.

2.2 Реализация и размещение сайта

2.2.1 Реализация бета версии сайта

Шаг 1:

После того как определились с программой для создания сайта (у нас это CMS Joomla 1.5), нам нужно установить виртуальный сервер и мы решили установить Денвер. Он имеет нечто вроде ядра, или «сердца» -- так называемый «базовый пакет», занимающий около 5.5 MB. Все остальное поставляется в виде пакетов расширений. Базовый пакет содержит большинство необходимых программ и утилит:

Инсталлятор (поддерживается также инсталляция на flash-накопитель).

Apache, SSL, SSI, mod_rewrite, mod_php.

PHP5 с поддержкой GD, MySQL, sqLite.

MySQL5 с поддержкой транзакций.

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

Система управления запуском и завершением всех компонентов Денвера.

phpMyAdmin -- система управления MySQL через Web-интерфейс.

Эмулятор sendmail и SMTP-сервера (отладочная «заглушка» на localhost:25, складывающая приходящие письма в /tmpв формате .eml); поддерживается работа совместно с PHP, Perl, Parser и т.д.

Установка дистрибутива

Запустите скачанный инсталлятор Денвера. Вы увидите перед собой нечто вроде следующего (рис. 4):

Рис. 4 - Установка денвера

Вас спросят о том, в какой каталог вы хотели бы установить комплекс (по умолчанию используется C:\WebServers, вам нужно лишь нажать Enter, чтобы согласиться с этим выбором). В указанном каталоге будут расположены абсолютно все компоненты системы, и вне его никакие файлы в дальнейшем не создаются (исключая ярлыки на Рабочем столе).

Настоятельно рекомендуем вам устанавливать комплекс в каталог первого уровня -- то есть, C:\WebServers, а не, например, C:\My\WebServers. Дело в том, что инсталляторы пакетов расширений ищут базовый комплект именно на первом уровне по всем дискам. И, если не находят, заставляют вас ввести имя директории вручную. Наверное, вам не нужны лишние проволочки при установке расширений?

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

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

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

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

В некоторых версиях Windows 98 имеется ошибка, в результате которой диск с первого раза не отключается -- мои эксперименты и исследования показали, что это именно ошибка в subst, а не что-то иное.

Собственно, вот и все. Вы сможете выполнить установку комплекса, имея всего 2 клавиши на клавиатуре: Enter и Y (чтобы ввести Yes).

Шаг 2:

Первый запуск Денвера

Наконец, установка завершена. Сразу же щелкайте по созданному инсталлятором ярлыку Start Denwer на Рабочем столе, а затем, дождавшись, когда все консольные окна исчезнут, открывайте браузер и набирайте в нем адрес: http://localhost/denwer/. Выходить из Интернета при этом не обязательно. (Рис. 5)

Рис. 5 - Первый запуск денвера

Шаг 3:

Заведение новых БД и пользователей MySQL.

Создаем новую базу данных MYSQL, для этого в браузере набираем _http://localhost, если денвер установлен правильно, то должна открыться страница приветствия, пролистываем, ниже до строчки "

Рис. 6 - Создание базы данных

Переходим по этой ссылке на следующую страницу

Рис. 7 - Параметры новой БД

Указываем пароль администратора MySQL, имя новой базы данных (я назвал новую базу joomla17), задаем логин пользователя, который будет иметь доступ к базе данных (в моем случае root), указываем пароль (необязательно) и повторяем пароль еще раз.

Шаг 4:

Работа с папками в "Денвере"

Внутри папки с Вашим сайтом в обязательном порядке создайте еще одну папку с таким названием, как «www».

Теперь для того, чтобы информация о вновь созданном сайте обновилась в системной конфигурации денвера, необходимо его перезапустить. Поэтому нажимаем Restart Denwer. Пока он у Вас перезапускается, мы идем в папку с созданным сайтом и копируем путь, указанный в верхней строке окна. К примеру, z/homesait/www. Когда Вам удалось его скопировать, Вы можете начать извлекать содержимое с установочного дистрибутива, который Вы скачали ранее в директорию с Вашим сайтом, то есть четко по тому пути, который Вы скопировали до этого. Нажимайте «Ок» и у Вас тут же пойдет процесс разархивации. Другими словами, Вам нужно просто содержимое Вашего архива установочного дистрибутива поместить в директорию «WWW» сайта.

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

Шаг 5:

Установка CMS Joomla на "Денвер"

Для этого Вам понадобится в адресной строке ввести имя Вашего сайта, то есть «npo-pu63.ru». Обязательно вводите http://. Затем у Вам автоматически откроется «Мастер-установщик».

Необходимо выбрать предпочитаемый язык. По умолчанию будет установлен русский. Далее у Вас будут разнообразные проверки, после чего опять нажимайте на кнопку «далее». Затем высветится страница с указанием лицензии, с которой Вы можете ознакомиться. Нажимаем далее…

Рис. 8 - Выбор языка

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

Рис. 9 - Начальная проверка

нажимаем далее

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

Рис. 10 - Лицензия

Нажимаем далее

Далее настраиваются установки связи с базой данных.

Рис. 11 - Конфигурация базы данных

По умолчанию на локалхосте (веб-сервер Денвер) они следующие:

Тип базы данных: mysql,

название хоста: localhost,

имя пользователя: pu6315,

пароль: пустой,

имя базы: вводите любое, главное без пробелов и латинскими буквами, например: mybase или joomla.

Если устанавливаете Joomla на виртуальный хостинг.

Тип базы данных: Mysql

Название хоста: придет в письме после регистрации хостинга.

Имя пользователя: придет в письме после регистрации хостинга или необходимо самостоятельно создать пользователя через панель управления хостингом.

Пароль: задается при создании пользователя или высылается при регистрации хостинга.

База данных: нужно создать перед установкой Joomla.

После того, как все заполните нажимаем далее.

Следующее окно установок ftp. Здесь настройки устанавливать необязательно, особенно если ставите Joomla на локальный серер.

Рис. 12 - Конфигурация FTP

Нажимаем далее

И последний этап. Тут вводим название сайта, e-mail и пароль администратора. Так же есть возможность установить демо-данные. Если вы незнакомы с joomla то они позволят ознакомится с основными возможностями cms. Если хотите установить демо-данные, то нажимаете кнопку "установить", если нет, то просто нажимаете далее.

Рис. 13 - Название сайта

После установки обязательно нужно удалить в корне Вашего сайта папку installation. После удаления Вы можете зайти на сайт и работать с ним.

Доступ к админ-панели: http://вашсайт/administrator

Шаг 6:

Рис. 14 - Сайт ГБОУ НПО ПЛ №63

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

Выводы по второй главе

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

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

Спроектировав сайт, ГБОУ НПО ПУ №63 мы учли тенденции современных системных требовании. Опираясь на цель исследования, нами были продуманны схемы поведения посетителей на сайте, модульная сетка, структурная схема сайта, требования к каналам связи, навигации, внешнему виду. Проделав практическую работу мы получили, что сайт у нас располагается в сети Интернет под доменным именем http://pl63.elitno.net/. Сайт был разработан в системе CMS Joomla, дизайн сайта и панель навигации были выполнены в приятной цветовой схеме и удобном расположении. Так же нами были добавлены интерактивные элементы (чат, форум, слайдер).

Заключение

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

Таким образом анализ состояния информационного обеспечения учреждений профессионального образования показывает, что сайт является ведущим средством, позволяющим отразить необходимую информацию в которой нуждаются субъекты образовательного учреждения. Нами раскрыты недостатки и особенности сайтостроения, которые мы учтем при создании сайта ГБОУ НПО Профессионального училища №63.

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

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

Анализ изучения ряда инновационных сайтов позволил нам выделить перспективные направления в сайостроении к ним относится:

Увеличение нагрузки на сайт;

Добавления новых видов контента;

Интеграция с другими информресурсами;

Увеличения поддоменов и количество сайтов.

В процессе создания сайта ГБОУ НПО Профессионального училища №63 мы попытались использовать ряд инновационных приемов сайтостроения.

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

При разработке сайта училища мы руководствовались выявленными особенностями образовательного учреждения и соответствующими критериями разработки сайта ГБОУ НПО ПУ №63.

В соответствии с выделенными нами особенностями использования сайтов, разработанных критериев сайта, нами спроектирован и разработан сайт ГБОУ НПО ПУ №63.

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

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

Спроектировав сайт, ГБОУ НПО ПУ №63 мы учли тенденции современных системных требовании. Опираясь на цель исследования, нами были продуманны схемы поведения посетителей на сайте, модульная сетка, структурная схема сайта, требования к каналам связи, навигации, внешнему виду. Проделав практическую работу мы получили, что сайт у нас располагается в сети Интернет под доменным именем http://pl63.elitno.net/. Сайт был разработан в системе CMS Joomla, дизайн сайта и панель навигации были выполнены в приятной цветовой схеме и удобном расположении. Так же нами были добавлены интерактивные элементы (FAQ(вопрос ответ), форум, слайдер, фото-галерея).

Литература

1. Андерсон Э.У. Эффективный самоучитель по креативному веб-дизайну [Текст] / Э.У. Андерсон. - М.: DiaSoft 2008. - 665 с.

2. Бородаев Д.В. Веб-сайт как объект графического дизайна. [Текст]: монография / Д.В. Бородаев. - Харьков: Септима ЛТД, 2006. - 288 c.

3. Брежнева В.В. Информационное обслуживание: продукты и услуги, предоставляемые библиотеками и службами информации предприятий [Текст] / В.В. Брежнева, В.А. Минкина. - СПб.: Профессия, 2006. - 304 с.

4. Воройский Ф.С. Информатика. Энциклопедический систематизированный словарь-справочник: Введение в современные информационные и телекоммуникационные технологии в терминах и фактах [Текст] / Ф.С. Воройский. - 4-е изд. - М.: Физматлит, 2006. - 965 с.

5. Гаевский А.Ю. 100% самоучитель по созданию Web-страниц и Web-сайтов [Текст] / А.Ю. Гаевский, В.М. Романовский. - М. 2005. - 510 с.

6. Гарретт Дж. Веб-дизайн [Текст] / Дж. Гаррет. - Символ-Плюс 2008. - 185с.

7. Гендина Н.И. Использование формализованных методов при подготовке текста для веб-сайтов учреждений культуры [Текст] / Н.И. Гендина, Н.И. Колкова, О.И. Алдохина // Научные и технические библиотеки. - 2008. - №3. - С. 29-35.

8. Гендина Н.И. Лингвистические средства проектирования контента веб-сайтов [Текст] / Н.И. Гендина // Научные и технические библиотеки. - 2008. - №3. - С. 5-14.

9. Гончаров А.Ю. Web-дизайн: HTML, JavaScript и CSS. Карманный справочник [Текст] / А.Ю. Гончаров. - КУДИЦ-ПРЕСС, 2007. - 320 c.

10. Земсков А.И. Некоторые особенности работы с электронными документами [Текст] / А.И. Земсков // Научные и технические библиотеки. - 2008. - С. 112-125.

11. Иванов А. Подготовка сайта для индексирования в поисковых системах [Электронный ресурс] / Андрей Иванов. - Режим доступа: http://www.ashmanov.com/pap/ivsprep.phtm, свободный.

12. Иванов В.Е. Технология как фактор успеха [Текст] / В.Е. Иванов. - М.: 2002. - 133 с.

13. Инькова Н.А. Создание Web-сайтов: Учебно-методическое пособие [Электронный ресурс] / Н.А. Инькова, Е.А. Зайцева, Н.В. Кузьмина, С.Г. Толстых. - Режим доступа: http://club-edu.tambov.ru/methodic/fio/p5.doc, свободный.

14. Кирсанов Д.С. Веб-дизайн [Текст] / Д.С. Кирсанов. - М.: 2001. - 190 с.

15. Крамер Д.Н. HTML: наглядный курс Web-дизайна [Текст] / Д.Н. Крамер - М.: Компьютера, 2001. - 423с.

16. Кречетников К.Г. Рекомендации по проектированию мотивационной и содержательной составляющих образовательной среды вуза на основе информационных технологий [Электронный ресурс] / К.Г. Кречетников. - Режим доступа: http://www.auditorium.ru/aud, свободный.

17. Кудряев В.А. Организационные работы с документами: учебник [Текст]/ В.А. Кудряева - М.: ИНФРА - М, 2001 - 232 с.

18. Кузина И.А. Каскадные таблицы стилей [Текст] / И.А. Кузина, П.Б.Храмцов. - KIAE 1999. - 345 с.

19. Кузьмин Е.И. Информационно-образовательный портал «Культура и искусство»: на пути к эффективному образованию [Текст] / Е.И. Кузьмин, Т.А. Мурована, Т.В. Ершова // Научные и технические библиотеки. - 2008. - №2. - С. 48-51.

20. Лаптев В.В. Модульные сетки. Проектирование многополосных изданий [Текст] / В.В. Лаптев. - М.: РИП-холдинг, 2007. - 204 с.

21. Леонтьев В.П. Новейшая энциклопедия персонального компьютера 2003[Текст] / В.П. Леонтьев. - М.: ОЛМА - ПРЕСС, 2003. - 920 с.

22. Леонтьев С.Ю. Web-дизайн. Руководство пользователя [Текст] / С.Ю. Леонтьев. - М.: Компьютера, 2001. - 105 с.

23. Ломов А.Ю. HTML, CSS, Скрипты: практика создания сайтов [Текст] / А.Ю. Ломов. - Санкт-Петербург 2006. - 398 с.

24. Матросов А.В. HTML 4.0. [Текст] / А.В. Матросов, А.О.Сергеев, М.П. Чаунин. - СПб, 1999.- 270 с.

25. Нидерст А.В. Web-мастеринг для профессионалов. Настольный справочник [Текст] / А.В. Нидерист. - М.: Компьютера, 2001. - 234 с.

26. Никитов В.А. Информационное обеспечение государственного управления [Текст]/ В.А. Никитов. - М.: Славянский диалог, 2000. - 211 с.

27. Нильсен Я.В. Веб-дизайн. [Текст] / Я.В. Нильсен. - СПб: Символ-Плюс, 2003. - 512 с.

28. Нильсен Я.В. Web-дизайн: удобство использования Web-сайтов = Prioritizing Web Usability. [Текст] / Я.В. Нильсен. - М., 2007. - 368 с.

29. Селин Г. Интернет-пособие по созданию Web-сайта, его публикации и способах раскрутки [Электронный ресурс]/ Геннадий Селин. - Режим доступа: http://web-book.narod.ru, свободный.

30. Орлов С.А. Технологии разработки программного обеспечения: Учебник [Текст] / С.А. Орлов. - СПб.: Питер, 2002. - 102 с.

31. Панкова Е.В. Интернет-сайт среднего профессионального учебного заведения: эффективность поиска в Интернете [Текст] / Е.В. Панкова, С. А. Косинова // Научные и технические библиотеки. - 2008. - №3. - С. 41-44.

32. Попов И.И. Автоматизированные информационные системы: учебное пособие [Текст] / И.И. Попов. - М.: РЭА, 1998. - 232 с.

33. Пунина Т.Г. Проектирование и размещение в сети Интернет административных сайтов образовательных учреждений: Учебно-методическое пособие [Электронный ресурс] / Т. Г. Пунина. - Режим доступа: http://www.club-edu.tambov.ru/methodic/2007/ppsite/content.html, свободный.

34. Роббинс Д. Web-дизайн. Справочник [Текст] / Д. Роббинс. - КУДИЦ-ПРЕСС, 2008. - 816 с.

35. Рогачева Г.И. Современные информационные образовательные ресурсы [Текст] / Г.И. Рогачева // Информатизация школьного образования: материалы междунар. науч.-практ. конф. (17-18 сентября 2002 г.). - Барнаул, 2003. - С. 34-36.

36. Саак А.Э. Информационные технологии управления [Текст] / Е.В. Пахомов, В.Н. Тюшняков. - 332 с.

37. Смирнова И.Е. Начало Web-дизайна [Текст]/ И.Е. Смирнова. - М.: DiaSoft 2003. - 305с.

38. Сысоева Л.А. Системы электронного управления документами. Секретарское дело [Текст] / Л.А. Сысоева. - 2003. - 310 с.

39. Тлеукеева Р. Традиционные и электронные ресурсы: состояние, проблемы. эффективность использования [Текст] / Р. Тлеукеева // Библиотека. - 2008. - №1. - С. 15-19.

40. Шрайберг Я.Л. Библиотека, электронная информация и меняющееся общество в информационном веке [Текст] / Я.Л. Шрайберг // Научные и технические библиотеки. - 2007. - №1. - С. 25-55

41. Яшуков А.А. Проект «Москва Онлайн». Информационное общество [Текст]/ А.А. Яшуков. - 2003. - 410 с.

42. День за днём [Электронный ресурс] // Образовательные ресурсы и возможности сети Интернет). - Режим доступа: http://www.den-za-dnem.ru/page.php?article=394, свободный.

43. Документы ЮНЕСКО о построении информационного общества: Декларация принципов // Библиотечное дело XXI век. - 2005. - №1. - С.4-45

44. Ифнормекспресс [Электронный ресурс] // Свободный ресурс. - Режим доступа: http://www.internet.informexpress.ru/index/articles/articles_18.html, свободный.

45. Образовательные ресурсы сети Интернет: Каталог / Под ред. А.Н. Тихонова. - М.: 2006.

46. Профессия [Электронный ресурс] // Ресурсы Интернета для развития системы образования и науки в регионах (на примере политологии). - Режим доступа: http://www.prof.msu.ru/publ/ulan-ude/u18.htm, свободный.

47. Темпер Т.Н. Принципы качества веб-сайтов по культуре / под ред. Т.Н. Темпера, А. Темпера. - М.: 2006. - 61 с.

48. Российская Федерация. Законы. «Об образовании» [Электронный ресурс]: [федер. Закон: принят Гос. Думой 10 июля 1992 г.: по состоянию на 2 фев. 2011 г.]. - Режим доступа: http://mon.gov.ru/dok/proj/7786/, свободный.

49. Российская Федерация. Законы. «О некоммерческих организациях» [Электронный ресурс]: [федер. Закон: принят Гос. Думой 12 янв. 1996г.: по состоянию на 2 фев. 2011 г.]. - Режим доступа: http://www.pravomarket.ru/zakon/zakon_nekom.html, свободный.

Приложения

Руководство пользователю

Заходим на сайт http://pl63.elitno.net/ Нажимаем вкладку вход и вводим имя пользователя и пароль (рис. 15).

Рис. 15 - Вход пользователя на сайт

Появляется кнопка редактировать элемент (рис. 16), в нем можно редактировать страницы.

Рис. 16 - Кнопка «Редактировать элемент»

Редактируем статью на примере страницы «Добро пожаловать на сайт» (рис. 17).

Рис. 17 - Добавление новой информации

Чтобы добавить новости надо зайти в административную панель «http://pl63.elitno.net/administrator», авторизоваться, далее во вкладку Материалы, далее Менеджер материалов, (рис. 18).

Рис. 18 - Менеджер материалов

Далее создать материал (рис. 19)

Рис. 19 - Создать материал

Откроется Редактор текста, набираем статью, редактируем с помощью кнопок на панеле (рис. 20).

Рис. 20 - Панель редактирования текста

Указываем название статьи, указываем раздел и категорию, и нажимаем кнопку сохранить (рис. 21).

Рис. 21 - Сохранить

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

Рис.22 - Менеджер меню (добавление, удаление пунктов и подпунктов меню)

Рис. 23 - Панель сообщений

Рис. 24 - Менеджер расширений Установить\удалить (шаблоны, модули, компоненты, плагины, языки)

Рис. 25 - Менеджер модулей (создание, удаление, редактирование местоположения модуля и т.д.)



Рис. 26 - Менеджер шаблонов (выбор по умолчанию, редактировать)

Рис. 27 - Вкладка Компоненты (управление различными компонентами, создавать, настраивать)

Размещено на Allbest.ru