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

Содержание

Введение

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

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

1.2 JavaScript

1.3 PHP

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

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

2.2 Порядок выполнения задачи

2.3 Проведение тестирования

Заключение

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

Введение

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

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

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

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

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

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

1.1 Язык гипертекстовой разметки (Html)

World Wide Web, или, что-то же самое Всемирная паутина, WWW составляет основную компоненту глобальной компьютерной сети Интернет. Зародившись еще в 60-е гг., Интернет долгое время использовалась лишь узким кругом специалистов для обмена информацией по электронной почте. Сеть управлялась операционной системой UNIX - для научных целей это подходило, но достаточно сложный текстовый интерфейс UNIX'a существенно ограничивал масштабы применения сетевых технологий. Годом рождения World Wide Web считается 1989 - в этом году был изобретен язык, ставший впоследствии основным языком web-документов - это язык - HTML (HyperText Markup Language - язык разметки гипертекста).

Автором языка HTML является Тим Бернерс-Ли, выпускник Оксфордского университета, работавший в то время по контракту в Женеве, в Европейской лаборатории физики элементарных частиц (CERN, Conseil Europeen pour la Recherche Nucleaire) консультантом по программному обеспечению. CERN - достаточно большая организация, и потому, чтобы лучше ориентироваться в ее структуре, не хранить в памяти данные о большом количестве проектов, должностных лиц и пр., Тим Бернерс-Ли разработал для своего личного пользования программу Enquire, на основе которой через несколько лет для лаборатории было создано своего рода информационное пространство. Программа Enquire позволяла осуществлять так называемый "нелинейный" поиск документов - т.е. переходить от одного документа к другому без обращения к оглавлению или справочнику.

Язык HTML составляет основу технологии гипертекста. Гипертекстовый документ содержит так называемые гиперссылки.

Язык разметки документов - это набор специальных инструкций, называемых тэгами, предназначенных для формирования в документах какой-либо структуры и определения отношений между различными элементами этой структуры. Тэги языка, или, как их иногда называют, управляющие дескрипторы, в таких документах каким-то образом кодируются, выделяются относительно основного содержимого документа и служат в качестве инструкций для программы, производящей показ содержимого документа на стороне клиента. В самых первых системах для обозначения этих команд использовались символы “<” и “>”, внутри которых помещались названия инструкций и их параметры. Сейчас такой способ обозначения тэгов является стандартным.

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

Язык HTML не является собственно языком программирования; это есть средство описания структуры документа, его стиля и связей его с другими документами. Для просмотра Web-документов используются специальные программы - так называемые браузеры (англ.: to browse - 1) пастись, ощипывать побеги; 2) читать, заниматься беспорядочно, урывками.) Вообще-то, возможности браузеров много шире, но пока ограничимся их определением как средством просмотра web-документов. Именно браузерам Интернет обязана своей популярностью.

1.2 JavaScript

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

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

При генерации страниц в Web возникает дилемма, связанная с архитектурой "клиент-сервер". Страницы можно генерировать как на стороне клиента, так и на стороне сервера. Последнее реализуется через механизм подстановок на стороне сервера (Server Site Includes). Компания Netscape распространила в 1995 году механизм управления страницами и на клиента, разработав язык программирования JavaScript.

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

К возможностям JavaScript можно, например, отнести следующее:

· отображать изменяющиеся данные, такие как текущее время или дата;

· программировать переменное содержание в зависимости от даты, броузера пользователя или других условий;

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

Для языка высокого уровня JavaScript обладает довольно сильными возможностями. Он не позволяет работать на уровне машинных кодов, однако вы получаете доступ ко многим возможностям браузеров, Web-страниц, а иногда и системы, в которой работает браузер. В отличие от Java™ или С, программы на JavaScript обходятся без компиляции, а вашему браузеру не придется загружать виртуальную машину для выполнения программного кода. Программируй и загружай!

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

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

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

Но вот на сцене появляется JavaScript. Теперь элементы формы можно проверить до того, как пользователь передаст информацию Web-серверу. Это приводит к уменьшению количества транзакций HTTP, а также заметному снижению вероятности ошибки при повторном заполнении формы. Кроме того, JavaScript позволяет читать и записывать cookie -- когда-то эта операция выполнялась исключительно средствами Web-сервера для работы с заголовками.

1.3 PHP

РНР изобретен Расмусом Лердорфом в конце 1994 года. Первая версия выпущена в 1995 году под именем «Инструментарий Персональных Домашних Страниц», затем она была переработана и названа PHP/FI Version 2 (FI -- модуль обработки данных для форм). Также была добавлена поддержка баз данных mSQL. С этого момента в разработке стали принимать участие добровольцы.

Статистика используемости РНР приблизительна, но, согласно исследованию, проведенному Netcraft, в начале 2001 года РНР использовался на более чем 5 300 000 сайтах по всему миру. Для сравнения: в это время число IIS серверов было примерно таким же (5 млн). Разработка интерпретатора РНР приняла форму организованного командного процесса, ядро интерпретатора разрабатывает компания Zend.com. При этом РНР распространяется свободно: его последнюю версию можно загрузить с сайта PHP.net. Модули РНР поставляются в комплекте с сервером Apache, в комплектах систем Linux.

Изначально аббревиатура РНР означала Preprocessor of Home Pages -- препроцессор домашних страниц. Это язык внедряемых в HTML-страницы сценариев, исполняемых на сервере. По большей части его синтаксис заимствован из таких языков, как С, Perl, Java, и при этом добавлена масса возможностей, которых этим языкам недостает. Проще говоря, синтаксис РНР -- это разумная альтернатива и строгости С, и «беспредельности» Perl.

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

Основными конкурентами РНР являются технологии JSP (Java Server Pages и Java Scriptlets), ASP (Active Server Pages), Perl, SSI (Server Side Includes), Cold Fusion Server Pages.

Рассмотрим те недостатки, которые присущи указанным технологиям. JSP -- достаточно сложный для изучения и использования язык. ASP, основанный на синтаксисе VBScript (Visual Basic), имеет всего несколько десятков собственных функций и поэтому вынужден использовать СОМ-объекты; кроме того, он ориентирован исключительно на работу под Windows. Perl -- язык головоломный, и его вольности затрудняют его понимание. SSI позволяет всего лишь компоновать HTML-страницу из нескольких файлов. CF -- коммерческий продукт, что является его основным недостатком.

Основные достоинства РНР:

· бесплатен; постоянно совершенствуется; работает на UNIX и Windows платформах;

· допускает работу с большинством СУБД;

· имеет широкий набор функций (более 3 тыс.);

· допускает объектно-ориентированное программирование;

· способен использовать протоколы HTTP, FTP, ШАР, SNMP, NNTP, РОРЗ, net sockets и другие;

· позволяет выполнять все операции, что и перечисленные его конкуренты, и даже работать с файлами графики. Можно также запускать РНР-скрипты как интерпретируемые файлы и компилировать исполняемые приложения (в том числе с поддержкой графического интерфейса GTK).

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

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

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

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

1. Сайт должен содержать не менее 10 взаимосвязанных страниц.

2. Сайт содержит тематическое фотослайд - шоу, не менее 10 слайдов. Для фотографий была создана анимация/ интерактивность.

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

4. Сайт содержит форму регистрации и по возможности другие формы.

5. Сайт содержит блок статей в зависимости от тематики.

6. Сайт содержит главную страницу, отражающую суть ресурса соответственно выбранной тематике. Главная страница сайта включают всю требуемую информацию: cлайд шоу (не менее 10 слайдов), описание сайта, название блок статей (не менее 5 статей), интерактивное меню.

7. Веб-страницы должны быть выполнены в едином стиле, подходящим к выбранной тематике, включать в себя навигацию по разделам, иметь одинаковый текстовый шрифт не менее 14 кеглей и не более 20, за исключением заголовков (от 26 до 72 кеглей).

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

9. Блоки контента должны быть строго структурированы и выровнены по одной линии относительно друг друга. Весь текст должен выделяться (текст - не картинка).

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

11. В остальном приветствуется индивидуальный творческий подход к оформлению и верстке сайта.

2.2 Порядок выполнения задачи

Написание сайта началось с продумывания гибкой архитектуры проекта. Было принято решение использовать язык PHP на сервере, для базы данных MySQL и построить отображение сайта на HTML, CSS, JavaScript.

Файловая архитектура представлена на рисунке 2.1.

Рисунок 2.1 Файловая архитектура

Следующим этапом стало проектирование базы данных, для хранения информации (рисунок 2.2 и рисунок 2.3).

Рисунок 2.2 Структура базы данных таблица Пользователи

Рисунок 2.3 Структура базы данных таблица Чат

После составления серверной части сайта, нужно соединить сайт с созданной базой данных. Для этого был создан файл bd.php (рисунок 2.4).

Рисунок 2.4 Соединение с базой данных

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

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

Рисунок 2.5 Регистрация

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

Рисунок 2.6 Сохранение пользователя

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

После этого, с главной страницы сайта нам нужно сделать возможность авторизоваться на сайте (войти на сайт под своим профилем). Для этого на главной странице разметим форму для входа (рисунок 2.7).

Рисунок 2.7 Авторизация

Механика следующая: пользователь вводит свой логин и пароль, мы проверяем данные на то, правильно ли они введены или нет, фильтруем их, и отправляем прямым запросом в базу данных, чтобы получить информацию о данном пользователе и проверяем, подходит ли пароль. Если все в порядке, мы говорим пользователю, что авторизация прошла успешно. Записываем информацию в сессии и завершаем процедуры (рисунок 2.8)

Рисунок 2.8 Авторизация

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

Рисунок 2.9 Форма для ввода и сообщения

Теперь нужно более подробно описать процесс отправки и получения сообщений. Для отправки нужно использовать JavaScript (если быть точнее, то его модуль Ajax). Задача: сообщение должно отправлять нажатием кнопки Enter на клавиатуре, для большего удобства. Выше приведен код самой формы (рисунок 2.9). На рисунке используется два JavaScript метода: load_messes() - отвечает за асинхронную загрузку сообщений, setInterval(load_messes, 3000) - устанавливает интервал между асинхронными запросами. Функция представлена на рисунке 2.10.

Рисунок 2.10 Код

Следующим этапом, сделаем возможность асинхронной отправки сообщений на сервер. Для этого напишем функцию send(); (рисунок 2.11).

Рисунок 2.11 Код функции

Функция отправляет данные из формы, методом POST, и после успешной отправки производит загрузку сообщений из базы данных.

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

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

Пункт 2, говорит о том, что у нас должно быть слайдшоу (рисунок 2.12).

Рисунок 2.12 Слайдщоу

Третий пункт, логотип (рисунок 2.13).

Рисунок 2.13

Четвертый пункт, создание формы регистрации. Она у нас сделана.

Пятый пункт, сайт содержит статьи.

Шестой пункт, выполнен полностью.

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

Восьмой пункт, сайт оформлен и все ссылки подсвечены.

Девятый пункт, весь текст структурирован и выровнен.

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

2.3 Проведение тестирования

Этапы тестирования сайта я поделил на несколько подэтапов: тестирование регистрации, авторизации, профиля, переписок.

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

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

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

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

В результате проведения тестирования, по данным этапам, можно сделать вывод, что условия выполнены.

Заключение

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

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

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

гипертекст сайт форум

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

1. Джейсон Мейнджер. Java: основы программирования :Пер. с англ. - К.: Издательская группа BHV,1997.-320с.

2. Кристиансен Т., Торкингтон Н. Perl: Библиотека программиста :Пер. с англ.- СПб.: Издательство «Питер», 2000. - 736с.: ил.

3. Холзнер Стивен. Perl: специальный справочник :Пер. с анг. - СПб.: Питер, 2000. - 496с.: ил.

4. Хейл, Бернард Ван. JDBC: Java и базы данных :Пер. с англ. М.,1999.-320с.

5. http://phpclub.unet.ru

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