Web-ресурс организации учебного процесса

 

Web-ресурс организации учебного процесса

1.Постановка задачи

кафедра преподаватель база учебный

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

1.1Техническое задание

Назначение и основные функции

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

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

Функции системы:

1.Для администратора:

a.ведение базы данных преподавателей

b.редактирование раздела новостей.редактирование списка учебных дисциплин.добавление расписания занятий и т.п.

2.Для преподавателей:.добавление новостей

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

3.Для студентов

Доступ в режиме чтения к личному закрытому разделу преподавателей (по паролю), доступ к открытым разделам (без пароля).

.Для обычных пользователей

Доступ к открытой информации.

Информационные разделы сервера

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

)Главная страница сайта. Здесь отображаются пять самых свежих новости кафедры. За заполнение и редактирование этой страницы отвечает администратор системы.

2)Страница о нас. На этой странице можно узнать историю кафедры, которая существует уже более сорока лет.

)Страница предмета. При нажатии в меню на кнопку «Предметы», выпадает список предметов, которые преподают на кафедре прикладной математики и информатики. Выбрав нужный предмет, пользователь переходит на страницу с данным предметом, на которой он может увидеть краткое описание предмета и список преподавателей, читающих лекции или ведущих практики по данному предмету.

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

Рис. 1. Страница преподавателя

)Контакты. Здесь отображаются телефоны кафедры и зав. кафедры, а так же расположение кафедры.

Рис. 2. Контакты кафедры

Примечание. На страницаx: «Главная», «О нас», «Контакты» - справа находится колонка с полезными ссылками, в виде баннеров, такими как сайт ПГНИУ - www.psu.ru и сайт механико-математического факультета - www.psu.ru/fakultety/mekhaniko-matematicheskij-fakultet.

Безопасность

Вход преподавателя осуществляется по логину и паролю, которые индивидуальны для каждого преподавателя.

Рис. 3. Форма для авторизации преподавателя

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

Рис. 4. Форма для ввода пароля на скачивание файлов

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

2.1Дизайн

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

Для начала разрабатывается макет сайта с учетом принципов удобства восприятия - юзабилити. Рассмотрим структурные составляющие сайта на схематическом примере:

Рис. 5. Схема структуры главной страницы

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

Проанализировав некоторые существующие сайты кафедр различных ВУЗов (такие как: tsp.susu.ac.ru, auditory.ru, neurobiology.ru), я пришла к выводу, что создаваемый сайт кафедры должен обладать лаконичным дизайном, понятным и простым интерфейсом для любой группы пользователей. Так же следует создать удобную навигацию по сайту и подобрать правильное цветовое решение.

Рассмотрим некоторые пункты, которые следует учесть при оформлении:

Главная страница сайта

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

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

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

Рис. 6. Главная страница

Рис. 7. Меню сайта

Дополнительное меню сайта - как правило, имеет наиболее сложную структуру. Имеет иерархическую структуру и бывает 3-х видов:

·Выпадающее меню - раскрывается при наведении на пункт меню.

·Раскрывающееся меню - при клике на кнопку меню раскрывает структуру.

·Раскрытое меню - обычно имеет древовидную, статическую структуру.

Для пунктов «Предметы» и «Преподаватели» для удобства я решила использовать раскрывающееся меню.

Рис. 8. Раскрывающееся меню

Шапка сайта

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

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

Боковая панель

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

В боковой панели моего сайта находятся баннеры.

Footer

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

Рис. 9. Боковая панель сайта

Рис. 10. Footer сайта

2.2Структура базы данных

СУБД

Большинство сайтов для своего функционирования используют базу данных.

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

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

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

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

Создание базы данных

У системы должна быть единственная база данных, я назвала ее mmf.

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

Структура

Предметы.

Поля: номер предмета, название предмета, изображение предмета, приоритет, краткая информация.

Преподаватели.

Поля: номер преподавателя, Ф.И.О., информация, фото, логин, пароль, пароль для документов.

Предмет-Преподаватель.

Поля: номер, номер предмета, номер преподавателя.

Новости.

Поля: номер новости, дата, заголовок, текст, краткий текст новости

Новости преподавателя.

Поля: номер новости, дата, заголовок, текст, краткий текст новости, номер преподавателя.

Категория файлов.

Поля: номер, номер преподавателя, приоритет, название

Файлы.

Поля: номер файла, номер категории файла, название, доступ, комментарии.

Заключение

Результатам моей работы стало создание и оформление Web сайта на я серверном языке Web-программирования PHP для кафедры Прикладной математики и информатики. Была разработана оптимальная структура базы данных для работы с информационным наполнением сайта и созданы функционалы администратора, преподавателя, студента и обычного пользователя. При выполнении работы были подробно изучены технологии программирования на серверном языке Web-программирования PHP, также закреплены знания по основным аспектам использования СУБД MySQL в языке PHP.

Библиографический список

1.Бенкен, Е.С. PHP, MySQL, XML: программирование для Интернета / Е.С. Бенкен. - СПб: BHV, 2007.

.Суэринг, С. PHP и MySQL. Библия программиста / С. Суэринг, Т. Конверс, Д. Парк. - М.: Диалектика - 2010.

.Дэвис, Е.М., Филипс, Дж.А. Изучаем PHP и MySQL / Е.М. Дэвис, Дж.А. Филипс. - СПб.: Символ-Плюс - 2008.

.Бейли, Л.М. Изучаем PHP и MySQL / Л. Бейли, М. Моррисон. - М.: Эксмо - 2010.

.Кузнецов, М.В., Симдянов, И.В. PHP. Практика создания Web-сайтов [Текст] / М.В. Кузнецов, И.В. Симдянов. - СПб.: БХВ-Петербург - 2008.

.Кожемякин, А.А. HTML и CSS в примерах. Создание Web-страниц / А.А. Кожемякин. - М.: Альтекс-А, 2004.

.#"justify">.#"justify">Приложение

Файл index.php

<?_start();_register ('access_file');

//var_dump ($_SESSION['access_file']);('includes/connect.php');_once 'core.php';

//ini_set ('display_errors', 1);(! isset ($_GET['page'])) {$_GET['page'] = «;}

// ОТДАЧА на выкачку файла(isset ($_POST['file_id']) && isset ($_REQUEST['go_file']))

{

//var_dump($_POST);

$db = Singleton:getInstance();

$sth = $db->prepare ('SELECT f_name, ffile FROM tfiles WHERE id=:id LIMIT 1');

$sth->bindValue (':id',$_POST ['file_id'], PDO:PARAM_INT);

$sth->execute();

$res = $sth->fetchAll (PDO:FETCH_ASSOC);

// даем имя загружаемому файлу-то, под каким браузер предложит его сохранить…

header ('Content-Disposition: attachment; filename=» '.$res[0] ['f_name'].'.'.mb_substr ($res[0] ['ffile'], strpos ($res[0] ['ffile'], '.'), strlen ($res[0] ['ffile'])).'"');

// указываем, какой файл нужно взять с сервера и именно передать, а не просто показать пользователю

header («Content-Type: application/x-force-download; name='docs/$res[0] [ffile]»);

// открываем файл для чтения и отдаем его пользователю…

readfile ('docs/'.$res[0] ['ffile']);

// var_dump($res);

}($_GET['page']) {'about':

$page = 'about.php';

$title = 'Все о нас';;'teacher':(isset ($_GET['id'])) {

$q= «SELECT max(id) as maxid FROM teacher»;

$result=mysql_query($q);(($_GET['id']>$result+1)||($_GET['id']<=0))

{(«Location: #"justify">}

{

$page = 'teacher.php';

$title = 'Преподаватель';

}

};'subject':(isset ($_GET['id']))

{

$q= «SELECT max(id) as maxid FROM subject»;

$result=mysql_query($q);(($_GET['id']>$result+1)||($_GET['id']<=0))

{(«Location: #"justify">}

{

$page = 'subject.php';

$title = 'Предмет';

}

};'news':

$page = 'news.php';

$title = 'Новости кафедры';(isset ($_GET['id']))

{

$q= «SELECT max(id) as maxid FROM news»;

$result=mysql_query($q);(($_GET['id']>$result+1)||($_GET['id']<=0))

{(«Location: #"justify">}

{

$title = 'Новости кафедры';

}

};'contacts':

$page = 'contacts.php';

$title = 'Контакты кафедры';;:

$page='main.php';

$title = 'Кафедра ПМиИ';

}

$str = «<<<<<<<$title>>>>>>>$page»;

?>

<! DOCTYPE HTML>

<html>

<head>

<meta http-equiv= «content-type» content= «text/html» charset= «UTF-8»/>

<meta name= «author» content= «admin»/>

<link rel= «shortcut icon» href= «img/icon.ico» />

<link rel= «stylesheet» type= «text/css» href= «css/style.css» />

<script type= «text/javascript» src= «jq_lib.js»></script>

<script type= «text/javascript» src= «jqStyle.js»></script>

<title><?=$title?></title>

</head>

<body>

<div id= «wrapper»>

<div id= «header»>

<h1><a href= "#»>Кафедра прикладной математики и информатики</a></h1>

</div>

<div id= «menu»>

<ul>

<li><a href= «index.php»>Главная</a></li><li><a href= «index.php? page=about»>О нас</a></li><li><a onclick= «drop (this, 's')»>Предметы</a></li><li><a onclick= «drop (this, 't')»>Преподаватели</a></li><li><a href= «index.php? page=news»>Новости</a></li><li><a href= «index.php? page=contacts»>Контакты</a></li>

</ul>

<?

$obj = new subj;

$list = $obj->get_list_subj();

?>

<div id= «s»>

<div>

<? $i=0;($list as $key) {($i % 7==0 && $i>0) {echo '</div> <div>

<a href= «index.php? page=subject&id=<?=$key['id']?>»><?=$key ['s_name']?></a>

<?$i++;}?>

</div>

</div>

<?

$obj = new teach;

$list = $obj->get_list_teach();

?>

<div id= «t»>

<div>

<? $i=0;($list as $key) {($i % 7==0 && $i>0) {echo '</div> <div>

<a href= «index.php? page=teacher&id=<?=$key['id']?>»><?=$key ['t_name']?></a>

<?$i++;}?>

</div>

</div>

</div>

<div id= «photo_wrap»>

</div><br />

<? require $page;?>

<br />

<div id= «footer»>

<div id= «footer_tr»><p>2013 год. ПГНИУ, Кафедра ПМИ &copy;</p></div>

</div>

</div>

</body>

</html>

Файл main.pxp

<? if (! isset ($_GET['id'])) {

$obj = new news;

$list = $obj->get_list_news();

?>

<table width= «1000»>

<tr>

<td style= «background: rgba (243, 243, 243, 0.83);» width= «750» valign= «top»>

<div id= «content_wrap»>

<table width= «100%»><tr><td width= «220» valign= «top»><h2>Новости кафедры</h2></td><td valign= «top»><div>

<? foreach ($list as $key) {?>

<div>

<div>

<h3><?=$key ['n_name']?></h3>

<p><a href= «index.php? page=news&id=<?=$key['id']?>»><?=$key ['short_news']?></a></p>

<a href= «index.php? page=news&id=<?=$key['id']?>»>

<div style= «clear: both;»></div>

</div>

<?}?>

</div>

</td>

<td width= «20»></td>

<td style= «background: rgba (243, 243, 243, 0.83);» id= «right_sidebar»>

<table width= «100%»><tr><td width= «100» valign= «top»><h2>Сcылки</h2></td><td valign= «top»><div>

<a href= «#"justify"><a href= «#"justify"></td>

</tr>

</table>

<?} elseif (isset ($_GET['id'])) {

$id = (int)$_GET['id'];

$obj = new news;

$news = $obj->get_single_news ($_GET['id']);

?>

<table width= «1000»>

<tr>

<td style= «background: rgba (243, 243, 243, 0.83);» width= «750» valign= «top»>

<div id= «content_wrap»>

<table width= «100%»><tr><td width= «220» valign= «top»><h2>Новости кафедры</h2></td><td valign= «top»><div>

<div>

<div>

<h3><?=$news ['n_name']?></h3>

<p>

<div style= «clear: both;»></div>

</div>

</div>

</td>

<td width= «20»></td>

<td style= «background: rgba (243, 243, 243, 0.83);» id= «right_sidebar»>

<table width= «100%»><tr><td width= «100» valign= «top»><h2>Сcылки</h2></td><td valign= «top»><div>

<a href= «#"justify"><a href= «#"justify"></td>

</tr>

</table>

<?}?>

Файл news.php

<? if (! isset ($_GET['id'])) {

$obj = new news;

$list = $obj->get_list_news();

?>

<table width= «1000»>

<tr>

<td style= «background: rgba (243, 243, 243, 0.83);» width= «750» valign= «top»>

<div id= «content_wrap»>

<table width= «100%»><tr><td width= «220» valign= «top»><h2>Новости кафедры</h2></td><td><div>

<? foreach ($list as $key)

{?>

<div>

<div>

<h3><?=$key ['n_name']?></h3>

<p><a href= «index.php? page=news&id=<?=$key['id']?>»><?=$key ['short_news']?></a></p>

<a href= «index.php? page=news&id=<?=$key['id']?>»>

<div style= «clear: both;»></div>

</div>

<?}?>

</div>

Web-ресурс организации учебного процесса 1.Постановка задачи кафедра преподаватель база учебны

Больше работ по теме: