Размещено на http://www.allbest.ru/

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

Анапский индустриальный техникум

ДИПЛОМНЫЙ ПРОЕКТ

на тему: "Разработка internet-приложения на примере создания сайта для СОШ №12"

Анапа

2013 г.

Содержание

Введение

1. Теоретическая часть

1.1 Сайты

1.2 Классификация сайтов

1.3 Тематические (информационные) сайты

2. Выбор технологий разработки интернет приложения

2.1 Язык гипертекстовой разметки HTML и его средства разработки

2.2 Редактор Notepad++

2.3 Язык PHP и его средства разработки

2.4 WYSIWYG-редакторы. Macromedia Dreamweaver MX

2.5 Виртуальный web-сервер Denver и MySQL базы

3. Практическая часть

3.1 Изучение предметной области проекта

3.2 Этапы разработки сайта

3.3 Структура навигации и страницы

3.4 Разработка сайта. Структура сайта и БД

3.5 Описание страницы "Обратная связь"

Заключение

Список литературы

Приложение

сайт тематический гипертекстовый сервер

Введение

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

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

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

Большое значение в организации работы с системами телекоммуникаций имеет возраст учеников.

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

Если занятия проводятся в старших классах, то ученикам интереснее самим искать информацию в Сети.

Цель моего проекта - разработать Интернет-приложение на примере сайта для МБОУ СОШ № 12, тем самым предоставить пользователям сети Интернет доступ к информационно-образовательному ресурсу, для самостоятельного изучения информации.

1. Общая часть

1.1 Понятие сайта

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

Первый в мире сайт info.cern.ch появился в 1990 году. Его создатель, Тим Бернерс-Ли, опубликовал на нём описание новой технологии World Wide Web, основанной на протоколе передачи данных HTTP, системе адресации URI и языке гипертекстовой разметки HTML. Также на сайте были описаны принципы установки и работы серверов и браузеров. Сайт стал и первым в мире интернет-каталогом, так как позже Тим Бернерс-Ли разместил на нём список ссылок на другие сайты.

Все инструменты, необходимые для работы первого сайта, Бернерс-Ли подготовил ещё раньше - в конце 1990 года появились первый гипертекстовый браузер WorldWideWeb с функционалом веб-редактора, первый сервер на базе NeXTcube и первые веб-страницы.

"Отец" веба считал, что гипертекст может служить основой для сетей обмена данными, и ему удалось претворить свою идею в жизнь. Ещё в 1980 году Тим Бернерс-Ли создал гипертекстовое программное обеспечение Enquire, использующее для хранения данных случайные ассоциации. Затем, работая в Европейском центре ядерных исследований в Женеве (CERN), он предложил коллегам публиковать гипертекстовые документы, связанные между собой гиперссылками. Бернерс-Ли продемонстрировал возможность гипертекстового доступа к внутренним поисковику и документам, а также новостным ресурсам Интернета. В результате, в мае 1991 года в CERN был утверждён стандарт WWW.

Тим Бернерс-Ли является "отцом" основополагающих технологий веба - HTTP, URI/URL и HTML, хотя их теоретические основы были заложены ещё раньше. В 1940-х годах Ванневар Буш выдвинул идеи расширения памяти человека с помощью технических устройств, а также индексации накопленной человечеством информации для её быстрого поиска. Теодор Нельсон и ДагЭнгельбарт предложили технологию гипертекста - "ветвящегося" текста, предоставляющего читателю разные варианты чтения. Xanadu, так и не законченная гипертекстовая система Нельсона, была предназначена для хранения и поиска текста, в который введены взаимосвязи и "окна". Нельсон мечтал связать перекрёстными ссылками все тексты, созданные человечеством.

На сегодняшний день сайт является одним из самых современных средств предоставления и передачи информации.

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

1.2 Классификация сайтов

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

· корпоративные сайты;

· презентационные сайты;

· интернет-магазины;

· тематические сайты.

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

1.3 Тематические (информационные) сайты

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

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

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

Современный тематический сайт должен обладать следующими свойствами:

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

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

· Навигация. Система навигации - это то, с помощью чего посетитель перемещается по страницам сайта. Она должна быть простой и очевидной.

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

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

2. Выбор технологий разработки интернет приложения

2.1 Язык гипертекстовой разметки HTML

Язык разметки гипертекстовых страниц HTML представляет собой язык, разработанный специально для создания web-документов. Он определяет синтаксис и размещение специальных инструкций (тегов), которые не выводятся на экран, но указывают браузеру, как отображать содержимое документа.

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

Стандарт HTML и другие стандарты для Web разработаны под руководством консорциума W3C (World Wide WebConsortium). Стандарты, спецификации и проекты новых предложений можно найти на сайте http://www.3w.org/. В настоящее время действует спецификация HTML 4.0, поддержка которой со стороны основных браузеров постоянно растет.

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

Средства разработки HTML страниц

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

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

К таким редакторам можно отнести следующие программные продукты:

а) AptanaStudio - среда разработки для создания Web-приложений, поддерживает подсветку и автодописывание текста HTML, JavaScript, CSS. А также множества других языков при помощи подключения дополнительных модулей.

б) Notepad++ - текстовый редактор, который позиционируется как замена обычному блокноту, в нем реализована подсветка синтаксиса различных языков программирования.

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

2.2 Текстовой редактор Notepad++

Тем, кто предпочитает набирать код HTML вручную, но кому не хватает функциональности Блокнота и подобных ему программ, можно посоветовать программу под названием Notepad++. Эта программа по сути весьма похожа на Блокнот, однако разработчики специально предусмотрели некоторые удобства для того, чтобы писать код HTML (а также языков Java, С, C++, Perl и еще некоторых). Это выражается в том, что при написании HTML-документа все теги автоматически подсвечиваются синим цветом, их атрибуты -- темно-синим, а значения атрибутов -- зеленым (цвета можно настроить по собственному желанию, так же, как и шрифт). Это очень удобно. К примеру, если автор случайно ошибется в имени тега или атрибута, то оно останется черным, и он сразу поймет, что здесь что-то не то. Правда, проверка не является "интеллектуальной": программа может спокойно "разрешить" приписать тегу какое-либо свойство, которого у него в принципе быть не может (спокойно подсвечивает абракадабру типа <BR ALIGN="top"> или </BR>).

В отличие от Блокнота, Notepad++ -- редактор многооконный. В нем можно открыть сразу несколько документов и работать, легко переключаясь между ними с помощью списка в левой части окна или вкладок в нижней части, Веб-редактор Notepad++ позволяет автоматизировать набор многих тегов. Если не хочется набирать их вручную (многие этого не любят просто из-за того, что приходится переключаться на латинский шрифт), то обратите внимание на левую нижнюю часть окна программы. Там приведен список наиболее распространенных HTML-тегов, которые можно вставлять в свой основной текст двойным щелчком мыши. Правда, в списке указаны не сами теги, а их описание. Например, чтобы вставить тег <BR>, нужно выбрать из списка пункт Block > Break Line. Однако к этому быстро привыкаешь. Почти все пункты списка вставляют теги вместе с закрывающим парным тегом. Например, если выбрать пункт Block > Preformatted, в текст автоматически будут добавлены теги и <PRE> и </PRE>. Некоторые пункты добавляют сразу целые блоки-заготовки. Если, к примеру, выбрать пункт Table (Таблица), в текст будет вставлен такой код:

<TABLE ALIGN="left" BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH="lOO">

<TR ALIGN="left" VALIGN='micldle'>

У тега <BR>, как было указано выше, нет закрывающего парного тега; кроме того, он не может иметь атрибут ALIGN=. Впрочем, броузеры просто игнорируют подобные ошибки.

<TH></TH> <TH>?</TH>

<TR ALIGN="left" VALIGN=middle">

<TD> ? </TD>

<TD> ? </TD> </TABLE>

Значения этих тегов и их атрибутов мы рассмотрим позже, а пока обратим внимание на то, что кроме списка тегов Notepad++ предоставляет нам также возможность выбирать из списка специальные символы (список HTML Characters), а также, если потребуется, любой управляющий символ, например символы псевдографики DOS и другие.

Те, кто часто вводят какие-либо последовательности символов, что при написании веб-страниц не редкость, могут облегчить свою задачу, записав в Notepad++ соответствующие макросы. Для записи макроса надо нажать комбинацию клавиш CTRL+ SHIFT+ R (или выбрать из меню Macros пункт Record). При этом начнется запись макроса, то есть все последующие действия будут запомнены. Чтобы закончить запись, надо снова нажать комбинацию клавиш CTRL+ SHIFT+ R, после чего присвоить имя файлу макроса, а также дать название для представления макроса в меню. Здесь можно также дать, если нужно, краткое описание макроса и указать имя его автора. После нажатия на кнопку ОК название макроса появится в меню Macros. Выбрав его, можно ввести сразу всю заданную последовательность символов.

Для удобства отладки можно установить флажок в пункте Line Numbers (Нумерация строк) в меню View (Вид), -- в этом случае все строки текста будут пронумерованы. Хочется отметить, что если в меню Configure (Настройка) включен пункт Word Wrap (Перенос по словам) для автоматического переноса концов длинных строк в видимую часть экрана, то каждая такая длинная строка все равно будет нумероваться одним номером, а не двумя или тремя (кстати, такая нумерация почему-то недоступна в замечательной программе Homesite, о которой речь пойдет ниже). А если в меню View (Вид) включить флажок Visible Spaces (Отображать пробелы), то можно увидеть на экране и "невидимые символы", такие, как пробелы, символы табуляции и прочие.

В программе Notepad++ можно легко сравнить два файла, выбрав из меню tools (Сервис) пункт Compare Files (Сравнить файлы). А если есть два (или более) похожих файла, в некоторые местах которых надо внести изменения, удобно использовать функцию Synchronize Scrolling (Одновременная прокрутка) из меню Configure (Настройка). В этом случае можно открыть сразу несколько файлов, например, выбрав из меню Windows (Окна) пункт Tile Vertically (Расположить по вертикали), и тогда при прокрутке одного из них другие прокручиваются синхронно.

Среди других полезных функций программы Notepad++ стоит отметить возможность автоматической смены клавиатурного регистра командой Edit > Change Case (Правка > Сменить регистр), автоматического копирования в буфер слова или строки, на которой находится курсор, с помощью команд Edit > Cut Other (Правка > Вырезать) и Edit > Copy Other (Правка > Копировать), а также функцию проверки орфографии Tools > Spelling (Сервис > Правописание). И, конечно, здесь присутствует возможность просмотра созданного файла в броузере View > In Web Browser (Вид > В броузере).

2.3 Язык PHP

Еще одна из Web-технологий активно используемых при создании страниц это PHP. PHP - скриптовый язык программирования. Распространенность в области построения Web-сайтов обусловлена большим количеством встроенных средств для разработки Web-приложений:

· автоматический перехват параметров POST и GET запросов, а также переменных окружения Web-сервера;

· поддержка большого количества интерфейсов баз данных

· встроенные функции для использования HTTP запросов;

· работа с cookies и сессиями;

· поддерживается работа с файлами, и сокетами;

Синтаксис PHP во многом подобен языку Си. Конструкции языка, такие как цикл foreach и ассоциативные массивы, взяты из Perl.

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

PHP-интерпретатор выполняет код, который находится внутри ключевых слов.

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

Переход на новую строку в PHP будет расценен как пробел, так же его обрабатывает HTML и некоторые другие языки. Команды должны разделяться через точку с запятой (;), за исключением некоторых конструкций языка, например конструкции проверки значения if/else и циклов.

Язык PHP поддерживает разные типы комментариев - как в языке Си (ограничителями являются /* */), языка C++ (начинаются с // и заканчиваются вместе с окончанием строки), а также UNIX подобные комментарии (с символа # до конца строки).

PHP это язык программирования с динамической типизацией, то есть не требуется указывать типа при объявлении переменных. PHP поддерживает типы данных: целый тип (integer), вещественный тип данных (float, double), логический тип (boolean), строковый тип (string), и специальный тип NULL, также поддерживаются массивы. Массивы могут состоять их числовых и строковых данных. Элементами массива могут быть данные любых типов, а также другие массивы. Расстановка элементов и их индексов сохраняется. Для обращения к переменным используется символ $, за которым должно идти имя переменной.

В PHP имеются уже определенные глобальные массивы. Эти предопределённые массивы, находятся в глобальной области видимости, использование директивы global не требуется. Преимущественно в этих массивах содержатся данные из запроса пользователя (данные GET-запроса, данные из полей форм при отправке методом POST, и т. П.).

PHP является объектно-ориентированным языком. Для определения класса в этом языке используется ключевое слово class. Функции и поля класса могут быть открытыми (public, это значение по умолчанию), защищёнными (protected) и скрытыми (private). PHP поддерживает три основных механизма ООП - инкапсуляции, полиморфизма и наследования. Методы класса могут быть финальными, абстрактными. Экземпляры класса создаются с помощью оператора new, обращение к полям и методам объекта класса производится с использованием оператора ->. Как и в Си для доступа к членам класса из его методов используется переменная $this.

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

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

Средства разработки PHP скриптов

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

Отличительными особенностями являются:

· функция сворачивания блоков кода;

· автоматическая генерация кода для работы с классами, например доступ к члену класса;

· подсветка ошибок;

· поддержка различных версий языка PHP;

· возможность отладки программ не только локально, но и удаленно;

· поддержка синтаксиса языков HTML, CSS и JavaScript;

· интерфейсы для просмотра различных баз данных;

· поддержка протоколов передачи данных и протокола SSH;

· панели для различных браузеров, облегчающие отладку кода;

ZendStudio обладает развернутым функционалом и может предоставить все необходимые средства для создания PHP программы.

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

Отметим, что поддержка PHP есть и еще в одной довольно популярной и распространенной среде разработки Eclipse.

Как мы видим, для создания PHP скриптов существует несколько больших проектов, каждый из которых обладает все набором необходимых функций.

2.4 WYSIWYG-редакторы

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

К таким редакторам можно отнести следующие программные продукты:

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

б) Microsoft OfficeSharePointDesigner - программный продукт компании Microsoft, сочетает в себе WYSIWYG, HTML-редактор, и инструменты для создания дизайна страницы. Данное приложение входит в состав Microsoft Office 2007. Стоит отметить, что Microsoft OfficeSharePointDesigner является приемником другого популярного редактора Microsoft FrontPage.

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

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

Macromedia Dreamweaver MX

Macromedia Dreamweaver - программа для создания Web-страниц. Ее возможности шире по сравнению с обычными функциями подобных редакторов.

Dreamweaver позволяет создавать объекты и страницы с использованием языка DHTML, поддерживает каскадные таблицы стилей, а также слои и действия JavaScript.

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

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

В основе этого редактора лежит принцип "Мы не трогаем ваш код". То есть, если взять корректный HTML, открыть его и затем сохранить, он останется неизменным. Работает в паре с редакторами типа Homesite (т.е. отслеживает и загружает новую версию открытого документа если он был изменен другой программой). Программа хорошо работает со скриптами, может оптимизировать страницы для разных браузеров, умеет проверять ссылки и аплоадить отредектированные страницы на сайт.

Новые возможности Dreamweaver значительно облегчают процесс создания страниц и управления сайтом.

Профессиональный инструмент для создания web-сайтов и приложений.

Впервые художники, дизайнеры и программисты могут работать в единой мощной среде, предназначенной для проектирования, разработки и администрирования профессиональных web-сайтов и приложений. Macromedia Dreamweaver MX объединяет признанные средства визуальной разметки с функциями быстрой разработки web-приложений Dreamweaver UltraDev и мощными возможностями редактора Macromedia HomeSite, а также легко интегрируется с Flash. Лучший в мире инструмент для создания web-сайтов теперь полностью отвечает ожиданиям пользователей, помогая в построении ярких, интерактивных и эффективных интерфейсов.

Полный контроль над внешний видом и деталями реализации приложений.

Повышать продуктивность, возможно используя новую интегрированную рабочую среду, общую с Macromedia Flash и Macromedia Fireworks, которая включает снабженные закладками окна документов, перемещаемые инструментальные панели и встроенное окно просмотра файлов. Ускорение процесса разработки достигается использованием профессиональных образцов кода и шаблонов дизайна, в том числе примеры структуры сайтов, формы, а также готовые функции JavaScript для интерактивного взаимодействия на стороне клиента. Мастер настройки сайтов поможет быстро задать конфигурационную информацию для динамических сайтов, внутренних рабочих сайтов и сайтов, расположенных у Интернет-провайдеров (ISP). Писать код быстрее, чем когда-либо раньше, можно при помощи таких мощных инструментов, как подсказки по синтаксису, редакторы тегов, гибкое цветовое выделение, средства выбора тегов и вставки готовых фрагментов, а также функции проверки кода.

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

Благодаря Macromedia Dreamweaver и интегрированной среде разработки для создания сайтов на основе HTML, XHTML, XML, ASP, ASP.NET, JSP, PHP или Macromedia ColdFusion возможно настроить и совершенствовать саму среду разработки с помощью более 700 расширений, свободно распространяемых через сайт Macromedia Exchange for Dreamweaver. Разработка стандартных web-приложений в кратчайшие сроки, стало возможным благодаря библиотечному коду для работы с базами данных и обновления web-форм, навигации в наборах записей или аутентификации пользователей. ColdFusion используется для быстрой разработки web-приложений, внутри которого имеются мастера создания сайтов, примеры кода и справочные материалы. Профессиональные разработчики на платформе ColdFusion могут воспользоваться такими новейшими возможностями, как модули ColdFusion Components, web-службы, а также встроенные средства отладки и трассировки.

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

При разработке проекта была использована кросс-платформенная универсальную среду разработки Dreamweaver с поддержкой стандартов J2EE и .NET и работающую на платформах Windows и Macintosh, а также поддержка XML, включающей возможность создания, редактирования и проверки XML-кода и импорта XML-схем. При помощи проверки web-служб на соответствие стандартам генерацию XHTML, удобное преобразование из HTML в XHTML и расширенную поддержку каскадных таблиц стилей CSS2 данный проект обретает качественный уровень отображения информации. Применяя инструменты проверки соответствия установленным требованиям для тестирования доступности и удобства использования отдельных web-страниц, web-сайтов, справочной системы и интерактивного интерфейса web-разработки для авторов Dreamweaver расширяет свою сферу применения.

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

2.5 Виртуальный web-сервер Denver и MySQL базы

Возникают ситуации, когда необходимо проверить полный вид интернет-страниц. Однако, это невозможно сделать при работе дома - так как технологии SSI (Server-Side Includes - Включения на стороне сервера), CGI (Common Gateway Interface - Общий шлюзовой интерфейс) и РНР требуют использования сервера. Для решения этой проблемы специалисты устанавливают на домашний компьютер (даже и не подключенный к Интернету) специальную программу - Web-сервер Denwer 3. Denwer "Денвер" - Джентльменский набор Web-разработчика "Д.н.w.р" - проект Дмитрия Котерова, набор дистрибутивов (Apache, PHP, MySQL, Perl и т.д.) и программная оболочка, используемые Web-разработчиками для разработки сайтов на "домашней" (локальной) Windows-машине без необходимости выхода в Интернет. Главная особенность Денвера - удобство при удаленной работе сразу над несколькими независимыми проектами и возможность размещения на Flash-накопителе. По мнению специалистов web-программирования, эмулятор веб-сервера Denwer 3 подходит для создания собственного хостинга, а так же позволяет реализовывать базы данных в собственных сайтах, используя в системе управления базами данных MySQL - язык структурированных запросов.

Для запуска Денвера нажимаем по созданному на рабочем столе ярлыку "Start Denwer" и набираем в адресной строке браузера http://localhost/ Должно появиться окно запуска программ (рисунок 2.1).

Рисунок 2.1 - Запуск программы Denwer

Создаем свою папку хранения интернет - страниц на web - сервере Denwer.

Для этого воспользуемся следующей инструкцией:

- заходим в локальный диск С - WebServers - home.

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

- например, папку "test1.ru". В папке "test1.ru" создаём папку "WWW".

- сделанные работы сохраняем с расширением ".php " .

Для просмотра результата выполнения скрипта нужно запустить Denwer. Затем открыть любой браузер и в адресной строке браузера написать http://test1.ru/index.php, где index.php имя который мы хотим выполнить.

MySQL является решением для малых и средних приложений. Входит в состав серверов WAMP, APPServ LAMP и в портативные сборки серверов Денвер, XAMPP. Обычно MySQL используется в качестве сервера, к которому обращаются локальные или удалённые клиенты, однако в дистрибутив входит библиотека внутреннего сервера, позволяющая включать MySQL в автономные программы.

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

MySQL 5.1

Версия MySQL 5.1 продолжает путь к стандарту SQL:2003. MySQL 5.1 содержит следующие нововведения.

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

Изменено поведение ряда операторов, для обеспечения большей совместимости со стандартом SQL2003.

Построчная репликация (англ. row-based replication), при которой в бинарный лог будет записываться только информация о реально измененных строках таблицы вместо оригинального (и, возможно, медленного) текста запроса. Построчную репликацию можно использовать только для определенных типов sql-запросов, в терминах MySQL -- смешанная репликация (англ. mixed replication).

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

Дополнительный набор функций для обработки XML, реализация поддержки XPath.

Новые средства диагностики проблем и утилиты для анализа производительности. Расширены возможности по управлению содержимым лог-файлов, логи теперь могут быть сохранены и в таблицах general_log и slow_log. Утилита mysqlslap позволяет провести нагрузочное тестирование БД с записью времени реакции на каждый запрос.

Для упрощения операции обновления подготовлена утилита mysql_upgrade, которая выполнит проверку всех существующих таблиц на предмет совместимости с новой версией, и при необходимости выполнит надлежащие корректировки.

MySQL Cluster отныне выпущен как отдельный продукт, базирующийся на MySQL 5.1 и хранилище NDBCLUSTER.

Значительные изменения в работе MySQL Cluster, такие, как, например, возможность хранения табличных данных на диске.

Возврат к использованию встроенной библиотеки libmysqld, отсутствовавшей в MySQL 5.0.

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

Реализация парсера полнотекстового поиска в виде plug-in.

Новый тип таблиц Maria (устойчивый к сбоям клон MyISAM).

Тип таблиц Maria

Maria (начиная с версии 5.2.x -- Aria) -- расширенная версия хранилища MyISAM, с добавлением средств сохранения целостности данных после краха.

Основные достоинства Maria.

В случае краха производится откат результатов выполнения текущей операции или возврат в состояние до команды LOCK TABLES. Реализация через ведение лога операций.

Возможность восстановления состояния из любой точки в журнале операций, включая поддержку CREATE/DROP/RENAME/TRUNCATE. Может быть использовано для создания инкрементальных резервных копий, через периодическое копирование журнала операций.

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

В будущем будет реализовано два режима: транзакционный и без отражения в журнале транзакций, для некритичных данных.

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

MySQL 5.5

Ветка MySQL 5.5 базируется на невыпущенной серии MySQL 5.4 и содержит ряд значительных улучшений, связанных с повышением масштабируемости и производительности, среди которых:

Использование по умолчанию движка InnoDB.

Поддержка полусинхронного (semi-synchronous) механизма репликации, основанного на патчах к InnoDB от компании Google.

Улучшение функций по секционированию данных. Расширенный синтаксис для разбиения больших таблиц на несколько частей, размещенных в файловых системах (partitioning). Добавлены операции RANGE, LIST и метод оптимизации "partition pruning".

Новый механизм оптимизации вложенных запросов и JOIN-операций.

Переработана система внутренних блокировок.

Интегрированы патчи Google с оптимизацией работы InnoDB на процессорах с большим количеством ядер.

MySQL 6.0

Версия MySQL 6.0 была заморожена на стадии альфа-тестирования. Первоначально было принято решение о создании версии 5.2, вскоре эта версия была переименована в 6.0. Однако, позже информация о MySQL 6.0 исчезла с сайта, а разработчики сосредоточились на версии 5.5 и следующей за ней версии 5.6.

Одним из основных нововведений версии 6.0 планировался новый тип таблиц Falcon, разработанный в качестве потенциальной замены для InnoDB компании Innobase, приобретённой компанией Oracle. В связи с приобретением в 2010 году Sun Microsystems тем же Oracle, судьба Falcon остаётся под вопросом.

Технические характеристики

Максимальные размеры таблиц

Максимальный размер таблиц в MySQL 3.22 до 4 ГБ, в последующих версиях максимальный размер до 8 млн ТБ (2⁶³ байт).

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

В отличие от MyISAM в InnoDB имеется значительное ограничение на количество столбцов, которое можно добавить в одну таблицу. Размер страницы памяти по умолчанию составляет 16 килобайт, из которых под данные отведено 8123 байта. Размер указателя на динамические поля составляет 20 байт. Таким образом, в случае использования динамического формата строки (ROW_FORMAT=DYNAMIC), одна таблица может вместить максимум 409 столбцов типа blob или text.

Локализация

Начиная с версии 4.1 в СУБД MySQL внедрена новая система кодировок и сортировок. При использовании кодировки Windows-1251, перед выполнением SQL-инструкций необходимо настроить кодировку соединения при помощи операторов:

SET character_set_client='cp1251';

SET character_set_results='cp1251';

SET character_set_connection='cp1251';

Эти три оператора эквивалентны вызову одного оператора:

SET NAMES 'cp1251'

Переменная character_set_client устанавливает кодировку данных отправляемых от клиента, переменная character_set_results устанавливает кодировку данных отправляемых клиенту, переменная character_set_connection устанавливает кодировку, в которую преобразуется информация пришедшая от клиента, перед выполнением запроса на сервере.

При использовании Юникода UTF-8 этот оператор выглядит следующим образом:

SET NAMES 'utf8'

Кодировка ISO 8859-5 не поддерживается.

3. Практическая часть

3.1 Изучение предметной области проекта

При изучении предметной области проекта определились задачи, цели и требования данного проекта, а именно необходимо было создать интернет-приложение для МОУ СОШ №12. Область применения этого приложения -- информационная деятельность. Цель сайта -- ознакомить людей с деятельностью школы и получением всей необходимой информации связанной как с учебным процессом так и всей прочей информацией проходящей в рамках школы. Технические требования:

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

"Главная", "О школе", "Педагоги", "Новости", "Фотоальбом", "Доска почета", "Учебный процесс", "Обратная связь", "Гостевая".

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

1. Ширина сайта фиксирована разрешением 1024px.

2. Количество изображений на сайте не ограничено. Допускается использование изображений только в форматах gif, png и jpg.

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

4. Интернет-приложение одинаково отображаться в различных браузерах.

3.2 Этапы разработки сайта

Первой задачей практической части является описание разработки сайта. Как правило разработка делится на следующие этапы:

· Подготовка проектной документации

· Работы над функциональной частью сайта

· Наполнение контентом

Рассмотрим конкретно каждые из них.

Подготовка проектной документации.

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

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

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

Разработка оригинал-макета сайта

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

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

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

Разработка статического прототипа

После утверждения оригинал-макета заказчиком необходимо сверстать статический прототип (шаблон) интернет-приложения.

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

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

Работы над функциональной частью сайта

На данном этапе происходит создание программной части интернет-приложения.

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

Наполнение контентом

На этом этапе происходит наполнение контентом всех страниц сайта.

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

3.3 Структура навигации и страницы

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

Первой страницей, где оказывается пользователь, является главная страница. Данная страница должна содержать название сайта, описание сайта, ссылки на другие страницы.

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

На рисунке 1 представлена структура сайта, где указаны основные страницы:

1. "Главная" - содержит информацию виде деятельности предприятия.

2. "О школе" - содержит информацию о школе.

3. "Педагоги" - содержит список преподавателей школы.

4. "Новости" - содержит статьи новостей школы.

5. "Фотоальбом" - содержит фотографии с кратким описанием.

6. "Доска почета" - содержит информацию об отличившихся учениках школы.

7. "Учебный процесс" - содержит необходимые для скачивания файлы.

8. "Обратная связь" - содержит форму связи с администрацией сайта.

9. "Гостевая книга" - позволяет оставить отзывы посетителей.

Рисунок 1. Структура навигации

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

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

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

К преимуществам табличной верстки можно отнести:

· Создание многоколонных документов

· Таблицы удачно подходят для создания "резинового" макета, ширина которого привязана к ширине окна браузера

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

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

К недостаткам табличной верстки можно отнести:

· Долгая загрузка

· Громоздкий код

· Плохая индексация поисковиками

· Затруднено разделение содержимого и оформления

· Невозможность наложения слоев

В последнее время самым популярным направлением в верстке является так называемая блочная верстка, реализуемая с помощью тегов <div>...</div>. Ее еще называют версткой при помощи слоев. Это вызвано тем обстоятельством, что блоки <div>...</div> часто вложены друг в друга и образуют своего рода "слои".

Преимущества использования блочной верстки:

· Блочная верстка отлично связывается со стилями, код при этом получается компактным и поисковые системы его лучше индексируют

· Слои-блоки можно накладывать друг на друга, что облегчает расположение элементов на веб-странице

· Более быстрая загрузка страниц с блочной версткой по сравнению со страницами табличной верстки

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

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

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

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

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

Рисунок 2. Макет строения страницы.

На рисунке 2 представлен макет страницы сайта, на котором отражены структурные элементы страницы:

1. "Шапка сайта" - заключающий в себе баннер коллектива

2. "Левый контент, Меню сайта (Навигация)" - осуществляет переход между страницами сайта

3. "Основной контент" - в данном блоке отображается информация необходимая для пользователя

4. "Нижний колонтитул" - содержит в себе информацию о разработчиках сайта

3.4 Разработка сайта. Структура баз данных и всего сайта

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