CC BY
151Технология создания образовательного web-сайта
Василина Евгеньевна Шамыкаева,
социальный педагог, автор интернет-ресурса «Блог социального педагога, психолога»
• информатизация образования • образовательные ресурсы • образовательный web-сайт < CMS «<Datalife Engine» •
Одним из приоритетных направлений процесса информатизации современного общества является информатизация образования. Информационно-коммуникационные технологии стали важнейшими средствами системы освоения образовательной программы и условием реализации предметного, метапредметного обучения, личностного развития для достижения целей воспитания, формирования информационной субкультуры.
Создание сайта: дань моде или вынужденная необходимость?
Современную школу уже нельзя представить без свободного доступа к сети Интернет, электронных и цифровых образовательных ресурсов, локальной сети, сообществ в социальных сетях, использования многообразного мультимедийного оборудования и программного обеспечения.
Ресурсы Интернета активно используются в процессе учебной деятельности, работе педагогов и жизнедеятельности школы. Информатизация образования коснулась педагогов, ставя перед ними новые компетенции: знание персонального компьютера, свободное владение пакетом программ Office, умелое пользование офисной техники, проектора, интерактивной доски в учебном процессе и т.д. Всё больше информационно-образовательная сре-
да образовательного учреждения переходит в направление цифровой информации, отходя от классических бумажных носителей, обращаясь к ресурсам Интернета.
Школьное сайтостроение — один из ключевых вопросов развития единой информационно-образовательной среды российского образования.
Образовательный web-сайт — это группа веб-страниц, логически взаимосвязанных между собой и выстроенных в определённую структуру на основе общей концепции. Создание образовательного web-сайта — серьёзная работа, и подойти к ней необходимо осознанно, обдумав всё от концепции до момента реализации проекта. Ресурс должен обеспечивать актуальность и полезность информации, удобство навигации, осмысленность оформления, быстроту загрузки.
В рамках современных тенденций образования автором статьи был создан образовательный web-сайт «Блог социального педагога, психолога» (http://mybloginfo.ru/), целью которого являлась организация информационно-образовательного пространства для методической поддержки, профессионального роста и обмена педагогическим опытом педагогов-психологов и социальных педагогов образовательных упреждений за счёт широкого использования средств Интернета.
110
Концепция создания образовательного web-сайта на CMS «Datalife Engine»
Концепция создания образовательного web-сайта включает следующие этапы
(рис. 1):
• методологический этап (формирование идеи интернет-ресурса, целей и задач, тематики);
• технологический этап (разработка и реализация сайта).
Изначально необходимо точно определить цель и тему создания сайта, аудиторию — от этого будут зависеть многие его параметры (контент, структура, дизайн и пр.).
Для удобного доступа к информации сайта его нужно разумно организовать, содержание необходимо разбить на основные темы (блоки, разделы, подразделы, категории).
Технология создания образовательного web-сайта CMS «Datalife Engine»
Разработку сайта следует начинать с выбора системы управления контентом сайта.
Система управления содержанием или система управления контентом (англ. Content management system, CMS) — это
информационная система или компьютерная программа, используемая для организации процесса создания, редактирования и управления содержимым сайта.
В Сети существует множество различных систем управления контентом. По виду их можно подразделить на несколько основных подгрупп:
• платные и бесплатные;
• по виду контента: портал, социальная сеть, интернет-магазин, файловое хранилище и т.д.
Рис.1. Концепция создания образовательного web-сайта
111
Популярными системами управления контентом являются Wordpress, Joomla и DataLife Engine (DLE).
Wordpress — это бесплатная CMS, изначально задумывалась как платформа для создания блогов, но на этом движке можно делать сайты любых типов благодаря огромной базе дополнений и тем оформления.
Joomla — бесплатная CMS для создания информационных ресурсов. Среди достоинств: хорошая расширяемость с помощью модулей, хорошая защищённость, можно самостоятельно создавать модули, широкий выбор шаблонов.
DataLifeEngine (DLE) — это платная CMS, подходит для создания новостных и информационных ресурсов. Она имеет большое количество настроек, которые позволяют использовать сайт для разнообразных целей. Движок может быть интегрирован практически в любой существующий дизайн и не имеет никаких ограничений по созданию шаблонов. Ещё одна ключевая особенность DataLife Engine — низкая нагрузка на системные ресурсы. Даже при очень большой аудитории сайта нагрузка не сервер будет минимальной. Движок оптимизирован под поисковые системы, что приведёт на ваш сайт дополнительных посетителей.
Из всех вышеперечисленных подробнее остановлюсь на DLE, так как данная система управления контентом более проста в управлении, настройке и редактировании.
После выбора CMS необходимо определиться с шаблоном для сайта.
Вначале устанавливается сайт на компьютере на локальном хостинге (Localhost).
щ Денвер - локальный сервер. Скачать ,,, ^ ^ ■■ f ^ www.denwer.ru
Denwer
Денвер - локальный сервер. Скачать Де1 localhost (PHP 5.3.13, MySQL 5.1, Postgre
Джентльменский набор Web-разработчика («Д.нжр», читается (Apache, PHP, MySQL, Perl и т.д.) и программная оболочка, испо «домашней» (локальной) Windows-машине без необходимости удобство при удаленной работе сразу над несколькими незг накопителе,
Скачать Денвер 3 8.2 мв
Состав: Apache 2.2.22 + SSL( PHP 5.3.13 + XDebug, MySQL 5.5, phpMyAdmin 3.5, многопроектность, работа с Flash-накопителем
Рис. 2. Денвер — локальный сервер
Для этого скачиваем в сети Интернет программу DENWER.
Denwer — это программная оболочка, предназначенная для создания и редактирования сайтов на локальном компьютере, без необходимости подключения к сети Интернет (рис. 2).
Создаём базу данных для будущего сайта на локальном сервере, используя возможности Denwer (рис. 3)
После создания базы данных для сайта необходимо скопировать установочные файлы CMS в папку на локальном компьютере. Для примера, создана папка «D:\\WebServers\ home\blog». Путь «D:\\WebServers\home\ blog» может отличаться:
1) в зависимости от того, на какой диск устанавливается Denwer;
2) как назовёте папку локального сервера;
Рис. 3. База сайта на локальном сервере (пока пустая)
112
Рис. 4. Стартовая страница установки сайта
3) как назовёте папку, где хранятся файлы сайта.
Так выглядит стартовая страница установки сайта на локальный хостинг «Мастер установки скрипта» (рис. 4)
Для продолжения установки нажмите кнопку «Начать установку».
Первым пунктом в установке сайта будет «Лицензионное соглашение». Его предметом является право использования одной лицензионной копии программного продукта DataLife Engine, в порядке и на условиях, установленных соглашением. Установка и использование продукта будут означать ваше полное согласие со всеми пунктами настоящего соглашения. Внимательно прочитайте соглашение по использованию DataLife Engine. Поставьте «галочку» в чек-боксе «Я принимаю данное соглашение» и нажмите на кнопку «Начать установку».
Следующая страница — это «Проверка установленных компонентов РНР». Здесь необходимо, чтобы все пункты были обозначены зелёным цветом (рис. 5).
Страница «Проверка на запись важных файлов системы» отвечает сама за себя — производит проверку на запись важных файлов системы. Здесь так же необходимо, чтобы все пункты были обозначены зелёным цветом.
Далее следует пункт «Настройка конфигурации системы» (рис. 6). Здесь вы пропи-
Рис. 5. Проверка установленных компонентов РНР
Рис. 6. Настройка конфигурации системы
сываете название ранее созданной базы данных, имя пользователя для этой базы, имя и пароль администратора вашего сайта.
113
► Вы вошли как: 0 > Главная » Просмотр сайта ► Выход
щ
Установка успешно завершена
Поздравляем Вас, DataLife Engine был успешно установлен на Ваш сервер. Вы можете просмотреть теперь главную страницу вашего сайта и посмотреть возможности скрипта, Либо Вы можете зайти в панель управления DataLife Engine и изменить другие настройки системы.
Внимание: при установки скрипта создается структура базы данных, создается аккаунт администратора, а также прописываются основные настройки системы, поэтому после успешной установки удалите файл install.php во избежание повторной установки скрипта!
Приятной Вам работы
SoftNews Media Group
DataLife Engine
Copyright 2004-2012 ©SoftNews Media Group. All rights reserved.
Рис. 7. Успешная установка
©Веб I
loealhost/tools/phpmyadm in/i n d ex.php
J Server: localhost ►
of structure ..gSQL ^Search ¿giQuery
Export ¡^ii Import Records 1
Designer
Type
^Operations Collation
Privileges J^Drop Size Overhead
blog (36) bk>g (36}
И dIe_admin_logs Я 9 S! ¥ ш X « MylSAM cp 251_general_ci l.e К В
И dte_ad m i n_ s ectîon s 5! Ш El; ¥ 1 X в MylSAM cp 251_general_ci 2-е к В
□ dle_ banned Il 9 SI ¥ :ff X в MylSAM cp 251_general_ci i.e к 1В
щ dte.banners я S S ¥ Ж X 1 MylSAM cp 251_general_ci 2.2 К в
и dte_category ni Ш S! ¥ H X 1 MylSAM cp 251_general_ci 2-е к в
и dle_comments il S H ¥ f ш в MylSAM cp 251_general_ci i.e к в
и dle_comptaint я £ H ¥ Ж X в MylSAM cp 251_general_ci i.e к в
ю dle_email m ES ESI ¥ il X в MylSAM cp 251_general_ci S.7 к в
в dlefiles я S И ¥ Я X в MylSAM cp 251_general_ci i.e к в
БЖ dle_flood ¡1 9 ¡3 ¥ И щ в MylSAM cp 251_genera!_ci i.e к в
и dte_ignore_list в ES ¥ ж X в MylSAM CP 251_general_ci i.e к в
ЕС dlejmages If m ¥ f X в MylSAM cp 251_general_ci i.e к в
а dle_login_log я 9 sa ¥ 'S X в MylSAM CP 251_general_ci i.e к в
О dte_k>gs я ES H ¥ ff к в MylSAM cp 251_general_ci i.e к в
В dle_k>stdb я if "m ¥ я X в MylSAM cp 251_general_ci i.e к в
в dle_mail_log ® ^ H 3< я X в MylSAM cp 251_general_ci i.e к в
в dle_notice m ES H ¥ '« X в MylSAM cp 251_general_ci i.e к в
н dtepm 1ЛЯ ES ¥ W шш в MylSAM cp 251_general_ci i.e к в
и dle_poll if a ¥ я X в MylSAM CP 251_general_ci i.e к в
131 dte_poll_k>g Ш № H ¥ s X в MylSAM CP 251_general_ci i.e к в
и dle_post H 19 El ¥ ж X 4 MylSAM cp 251_general_ci 35.4 к в
И dle_post_extras 11 If m ¥ я X 4 MylSAM cp 251_general_ci 4.1 К в
в dfe_post_log я 9 я ¥ ж X в MylSAM CP 251_general_ci i.e к в
о dle_question я ES ¥ ш- Х|| в MylSAM cp 251_general_ci i.e к в
dle_rss m If i ¥ я X MylSAM CP 251_general_ci 2.1 к в
■а die rssinform m es ICI a m шл ■ MvlSAM CD 251 oeneral ci 2.1 К LB на
114
Последняя страница извещает вас об успешной установке сайта на хостинге. Красным цветом обозначен важный пункт «Внимание: при установке скрипта создаётся структура базы данных, создаётся аккаунт администратора, а также прописываются основные настройки системы, поэтому после успешной установки удалите файл install. php во избежание повторной установки скрипта!». Обязательно удалите или переименуйте файл «install.php» (рис. 7).
Если вы посмотрите ранее созданную базу, то увидите, что она заполнена таблицами, необходимыми для вашего сайта (рис. 8). Эта база будет пополняться данными по мере развития сайта.
При переходе по ссылке сайта (в нашем примере, это http://blog/) вы увидите ваш сайт на локальном хостинге (рис. 9).
После установки сайта, вы уже можете работать над его наполнением, если, конечно, вас всё устраивает. Но как показывает практика, пользователи всегда хотят что-то исправить, добавить или удалить. Перейдя в панель администрирования, вы увидите пункты управления сайтом (рис. 10).
Панель администрирования (ад-минцентра) даёт ряд возможностей:
Рис. 10. Панель администрирования
Рис. 11. HTML-редактор Dreamweaver
• добавление, редактирование и удаление новостей;
• возможность распределения доступа для конкретной новости;
• создание неограниченных групп пользователей с возможностью назначения им различных прав доступа;
• средства для создания и редактирования шаблонов непосредственно в админцентре;
• возможность корректировки времени;
• возможность изменения автора и даты публикации;
• автоматическая публикация статьи при наступлении установленного времени;
• возможность фиксации новостей (будут всегда наверху, независимо от даты);
• автоматическое урезание загруженных картинок с сохранением пропорций до указанных размеров;
• наложение водяных знаков на картинки;
• быстрый поиск и замена в базе данных и другие.
Для расширенной возможности редактирования файлов на сайте лучше использовать HTML-редактор. При работе можно использовать Dreamweaver (рис. 11).
Следующий шаг после редактирования шаблона и первичного заполнения сайта информацией — выбор реального хостинга и подбор доменного имени.
Хостинг — это своего рода аренда помещения, только вы арендуете не квадратные метры, а дисковое пространство на вебсервере в Mb (мегабайтах). Выбор хостинг-провайдера — одно из ключевых решений
115
Сводка Смена пароля Информация о владельце Баланс и тарифный план Пополнение баланса Годовой абонемент Логи авторизаиий Использование CPU Использование MySQL Ограничение доступа к панели Сообщения Мои заметки
► Почта
► Сайт
► Домены
► Создание сайта
► Статистика
► Партнерская программа
► Реклама на Google
Взаимодействие со специалистами Выход
Сводка
Аккаунт
Тарифный план Стандарт Изменить
Состояние счета Пополнить
Тип аккаунта Абонементное обслуживание
Стоимость, руб./месяц 0.00
Статус Активен
Дисковая квота, МЬ
Сайт:
Использование места, МЬ База данных:
Почта:
при превышении дисковой квоты: (ф отвергать новую почту © увеличивать квоту
Уведомление на контактные e-mail
[У1 Ежемесячная сводка
Уведомление об окончании средств на все email аккаунта [У] Уведомления об окончании делегирования доменов
Информационная рассылка «Новости Majordomo»Ha все почтовые ящики аккаунта О Получать техническую рассылку/новости П Смена пароля к контрольной панели IH Смена пароля к основному FTP-входу 1Г1 Вход в контрольную панель аккаунта [У] Уведомление об окончании средств на контактный email
включено включено включено включено выключено выключено выключено выключено
а 14 дней -г- включено
Рис. 12. Личный кабинет
Рис. 13. Домен сайта
при создании сайта, т.к. от этого зависит много факторов: интерес пользователей, посещаемость, безопасность сайта, техническое обслуживание. Для своего сайта я выбрала хостинг от Majordomo.ru (г. Санкт-Петербург).
Необходимо также внимательно подойти к выбору доменного имени.
Доменное имя — это уникальная алфавитно-цифровая последовательность, обозначающая имя сайта, адрес его расположения в сети. В настоящее время хос-
тинг-провайдеры сами предлагают услугу регистрации и поддержки короткого доменного имени. К примеру, вы создаёте сайт о компьютерах. Для этого вы приобрели хостинг в зоне RU и доменное имя выбрали «computer». Соответственно адрес вашего сайта в сети Интернет будет «computer.ru». Раньше имена сайтов были допустимы только в латинице, но некоторое время назад в Сети появилась зона РФ. Стало возможно использовать имена сайтов в кириллице. Например, «компьютер. рф».
Рассмотрим процедуру размещения сайта на реальном хостинге.
После того, как вы выбрали хостера (рассмотрим на примере majordomo.ru), необходимо пройти процедуру регистрации (рис. 12).
По окончании процедуры регистрации, нужно подключить и зарегистрировать домен. Список активных доменов можно посмотреть в разделе «Домены» (рис. 13).
116
Рис. 14. FTP-доступ с помощью программы Total Commander
Для того чтобы закачать файлы вашего сайта (файлы CMS, шаблонов и т.д.), воспользуйтесь FTP-доступом.
FTP — это специальный протокол для передачи файлов. Для закачки файлов на сервер можно воспользоваться как FTP-досту-пом через кабинет клиента, так и с помощью специальные программы (с настройками, выданными хостером), например Total Commander (рис. 14).
Теперь остаётся лишь закачать базу данных на удалённый сервер (сервер хостинга). Обычно на серверах используется тот же PhpMyAdmin, но могут быть и другие программы. Для того чтобы выгрузить базу данных с локального хостинга, воспользуйтесь функцией выгрузки программы PhpMyAdmin (рис. 15). При выгрузке вы можете определить необходимый вам формат (обычно это SQL) и выбрать сжатие. Для того чтобы закачать выгруженную вами базу на удалённый сервер, воспользуйтесь функцией загрузки программы сервера (рис. 16).
После того, как вы успешно закачали файлы и базу данных на сервер хостинга, необходимо изменить файл настроек вашей системы управления содержимым сайта (рис. 17). В CMS DataLife Engine настройки сервера хранятся в файле «dbconfig.php». При внесении изменений в данный файл
Рис. 15. Выгрузка базы данных с локального хостинга
будьте внимательны. Если вы пропишете неправильно какую-либо из строк (сервер, имя базы, имя пользователя или пароль), ваш сайт работать не будет. Не путайте имя пользователя базы данных с именем пользователя сайта.
Завершив все вышеописанные действия, можно считать, что размещение вашего сайта в сети Интернет успешно завершено.
117
Рис. 16. Загрузка базы на удалённый сервер
и производить множество других операций.
Рис. 17. Файл настроек сервера
Но работа над сайтом на этом не заканчивается. Можно, конечно, оставить всё как есть. Но со временем приходится что-то улучшать, вносить изменения в файлы шаблонов, подключать или отключать скрипты
Немаловажное действие, которое приходится выполнять периодически после реализации интернет-ресурса — копирование и сохранение базы данных, файлов сайта. Полностью оставлять сайт без контроля не стоит, может произойти повреждение файлов или базы данных по независящим от вас или хостера обстоятельствам (взлом сайта, атака пиратов и прочее). Необходимо позаботиться о сохранности сайта. Есть множество программ и скриптов, которые могут выполнить эту работу за вас. Но лично я не доверяю эту работу сторонним программам и выполняю её самостоятельно. Сохранение провожу раз в месяц или же после внесения глобальных изменений в структуру сайта или базы данных. □
118
