Разработка сайта
Основы создания сайта. Планирование Web-сайтов. Помещение графических изображений на Web-страницу. Использование таблиц стилей для размещения элементов Web-страниц. Создание сайта "Игрушки", требования к надежности. Основные возможности программы.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | курсовая работа |
| Язык | русский |
| Дата добавления | 18.01.2012 |
| Размер файла | 41,4 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Размещено на http://www.allbest.ru/
Введение
В 1994 году началась революция - World Wide Web. Всемирная паутина World Wide Web (WWW) соткана из Web-страниц, которые содержат в себе разную информацию в зависимости от тематики Web сайта. Полезность Internet повышалась вместе с развитием вычислительной техники с запаздыванием примерно в 10 лет. В конце 80-х годов появление персональных компьютеров перенесло информатику из царства знатоков к широкой публике. Internet в ходе своего развития и повсеместного распространения занимается именно таким переносом.
Ученые и преподаватели использовали Web уже несколько лет, но общество в целом еще только начинало осознавать его привлекательность. По всему миру пользователи компьютеров были увлечены мыслью о доступе к гигантской общемировой компьютерной сети, но полученная информация часто разочаровала - Интернет был исключительно текстовой средой.
Позже когда Web находился на заре своего развития, дизайну и разметке страниц уделялось совсем немного внимания.
Дизайнеры поняли, что точная технология размещения графики позволяющая точно повторить красоту печатной страницы стала популярной, хотя и ограниченной с точки зрения скорости и дизайна Web-страницы.
Среди большого множества средств и программных продуктов было очень сложно ориентироваться. Каждая компания разработчик пыталась ввести нечто новое в свои средства. Это очень сильно отражалось на пользователе, который порой даже не мог отобразить Web документ на своём компьютере. Постоянно существовала необходимость устанавливать всё новое программное обеспечение для просмотра и работы с Web документами, которые были созданы при помощи нового языка программирования для Web. Также они не могли справиться с поставленными задачами, и приходилось смешивать некоторые средства разработки для Web.
World Wide Web (или просто Web) облегчает использование Internet, всемирной компьютерной сети, которая была создана в конце 60-х годов. Первоначально работа Internet (в том числе и получение данных от компьютеров, подключенных к этой сети) требовала от пользователя знания огромного числа сложных команд, похожих на заклинания.
В 1992 году Тим Бернерс-Ли и другие исследователи создали Web, который позволил «просматривать» ресурсы Internet, не прибегая к помощи сложных команд. За несколько лет существования Web браузеры - программы, предназначенные для просмотра Internet, - сделали Web еще простым и одновременно мощным.
Слово Web используется в двух разных смыслах. Обычно под словом «Web» подразумевают World Wide Web - всемирную «паутину», однако в применении к FrontPage под Web подразумевается набор страниц, созданных в этом приложении для Web - сайта.
В основу Web был положен гипертекст (hypertext) - метод связывания блоков, или «страниц», данных, придуманный еще в шестидесятых годах. Однако только в девяностых годах Бернерс-Ли и его сотрудники перенесли концепцию гипертекста в Internet, создав HTTP - Hypertext Transfer Protocol (протокол передачи гипертекста). С появлением HTTP родился и World Wide Web.
Сегодня в Internet существуют миллионы Web - сайтов. Можно получать доступ к информации по различным темам, открыть в Web свой бизнес. Более того, в Web можно найти и сведения о нем самом и о тех технологиях, на которых он основан.
Если в основу World Wide Web были положены протокол HTTP и гипертекст, то Web основан на HTML - Hypertext Markup Language (Язык описания гипертекстовых документов). В HTML для определения содержания и формата гипертекстовых документов используются команды, называемые тегами (tags). Web - браузер преобразует эти команды в текст и графические изображения и располагает их нужным образом на экране компьютера.
Кроме описания формата текста и положения графики на странице язык HTML используется и для других целей. Гиперссылка дает команду Web - браузеру перейти к новой странице в Internet и отобразить ее содержимое на экране.
Сейчас на многих Web - страницах используются специальные программы - скрипты (scripts), написанные на таких языках Microsoft VBScript или JavaScript. При помощи таких «мини - программ», встроенных в код Web - страниц, можно управлять форматированием, выводом изображений, воспроизведением мультимедиа - в этом скрипты похожи на программы, созданные при помощи других языков программирования. Однако на сегодняшний день самым мощным средством, позволяющим управлять выполнением скриптов, является DHTML - Dynamic HTML (Динамический HTML). DHTML позволяет создавать простые анимации и многие другие эффекты.
Для того чтобы создать Web - сайт при помощи FrontPage, нет необходимости учить HTML, языки скриптов или DHTML. FrontPage позволяет просто набрать текст, который можно поместить на Web - страницу, расположить в нужных местах рисунки, встроить звуковое оформление. Используя FrontPage, можно создавать эффекты, для которых обычно требуются скрипты или программы DHTML. Конечно, можно набирать коды HTML, скрипты или коды DHTML, однако при работе с FrontPage этого не требуется.
Цель моей курсовой работы заключается в том, чтобы научиться разрабатывать свой Web - сайт и создавать гиперссылки (hyperlinks).
1. Основные понятия
1.1 Основы создания сайта
Интернет - глобальная информационная сеть, части которой логически взаимосвязаны друг с другом посредством единого адресного пространства, основанного на протоколе TCP/IP. Интернет состоит из множества взаимосвязанных компьютерных сетей и обеспечивает удаленный доступ к компьютерам, электронной почте, доскам объявлений, базам данных и дискуссионным группам.
Интернет - это будущее коммуникаций. На сегодняшний день Сеть позволяет получать видео изображение из любого уголка мира, отправлять письма с картинками, использовать Интернет телефонию и проводить международные телеконференции.
Веб-дизайн
Web-design
Веб-дизайн - дизайн сайтов и их отдельных элементов, создание графических рекламных материалов в Internet. Обычно услуги веб-дизайна предоставляют студии веб-дизайна.
Веб-сервер
Web-сервер; WWW-сервер
Web Server
Веб-сервер - сервер, обеспечивающий предоставление информации в службе глобального соединения. Веб-сервер хранит и предоставляет во внешнюю сеть данные, организованные в виде веб-страниц. Веб-сервер отвечает за обработку запросов клиентов к веб-сайту и исполнение CGI-, JSP-, ASP-, PHP- и других приложений.
Веб-страница
Web-страница; WWW-страница; Страница
Web-page
Веб-страница - самостоятельная часть веб-сайта; документ, снабженный уникальным адресом (URL). Веб-страница может иметь статическое или динамическое построение. Обычно веб-страницы организуется в виде гипертекста с включениями текста, графики, звука, видео или анимацию. В сети Интернет просмотр веб-страниц осуществляется посредством браузера.
Главная страница - начальная страница веб-сайта. Обычно главная станица несет основную презентативную и навигационную нагрузку.
Личные страницы - веб-страницы, которые принадлежат физическим лицам. Содержание и оформление личной страницы зависит только от ее автора.
Веб-сайт
Web-сайт; Сайт
Web site; Site
Веб-сайт - совокупность веб-страниц с повторяющимся дизайном, объединенных по смыслу, навигационно и физически находящихся на одном веб-сервере.
Web - сайт (или Web - узел) - это набор связанных между собой близких по смыслу Web - страниц и файлов. Web - сайты обычно посвящены какой-то определенной теме и содержат информацию, относящуюся к частному лицу или компании.
На каждом Web - сайте существует одна особенная Web - страница, называемая домашней или главной страницей (homepage). Все посетители сайта сначала попадают на эту страницу. Щелкнув на той или иной гиперссылке, пользователи смогут попасть и на другие страницы сайта. Web - страницы, на которые указывают гиперссылки, могут быть расположены и на том же самом компьютере, где размещена домашняя страница, и на любом другом компьютере, подключенном к Internet.
Гиперссылка - это текст или изображение на Web - странице, при щелчке на котором происходит переход к другой Web - странице или сайту.
Гиперссылка - это инструкция HTML, включенная в код Web - страницы. Эта инструкция дает Web - браузеру команду открыть другую страницу или другой файл после того, как пользователь щелкнет на соответствующем фрагменте текста или графическом изображении. Новый файл, который откроет браузер, может быть любой Web - страницей из World Wide Web, Web - страницей на интернет - сервере в корпоративной сети или просто файлом, который хранится на компьютере пользователя.
Гиперссылка состоит из двух частей: самой гиперссылки и адреса назначения (target), определяющего путь к Web - странице, которая загрузится после щелчка на гиперссылке. Когда пользователь помещает указатель мыши на гиперссылку, он принимает форму указывающей руки. Такая форма указателя сообщает пользователю, что объект (графическое изображение или текст), расположенный под ним, представляет собой гиперссылку.
Браузер - от английского слова Browser (окно просмотра или обозреватель), т.е. программа-обозреватель Internet - Internet Explorer, Opera или любая другая.
Интерфейс - совокупность средств и правил, которые обеспечивают взаимодействие устройств, программ и человека.
Web - сайт размещается на Web - сервере (Web - server) - компьютере, предоставляющем доступ к Web - страницам посетителям сайта. Однако можно создать Web - сайт непосредственно в файловой системе компьютера, а затем, когда он будет готов, опубликовать его на Web - сервере. Обычно Web - сервер подключен к Internet, что позволяет просматривать Web - страницы, размещенные на нем, в World Wide Web. Многие компании и организации устанавливают Web - серверы и в интранет - сетях. На таких серверах лучше всего размещать Web - сайты, содержащие внутри корпоративную информацию, предназначенную только для сотрудников компании. К некоторым страницам интернет - сайта может быть открыт доступ и из World Wide Web, в то время как остальные страницы будут доступны только из локальной сети компании.
Поиск Web - сервера.
Большинство Internet - провайдеров (Internet service provider - ISP) предоставляют услугу по размещению Web - сайта (эта услуга называется Web - хостингом - Web hosting) как часть набора услуг при получении доступа к Internet. При этом провайдер выделяет часть дискового пространства на Web - сервере для хранения Web - файлов. Для простейших Web - сайтов набор услуг по их размещению и поддержке, оказываемый Internet - провайдерами, бывает вполне достаточен. Большие и сложные Web - сайты стоит размещать на выделенном (dedicated) сервере (иначе называемом выделенным Web - хостом), где можно получить больший объем дискового пространства. На выделенном сервере также может быть установлено и более быстрое оборудование.
Планирование Web - сайтов
Теперь необходимо решить, какой материал будет содержать Web - сайт, представляющий клиента World Wide Web. Для начала стоит определить, каким будет назначение создаваемого Web - сайта.
Web - сайты могут создаваться и для других целей. Один сайт может предоставлять техническую поддержку пользователям какого-либо программного продукта. На другом сайте может быть расположен каталог товаров и обеспечена возможность безопасно размещать заказы. Цель создания Web - сайта определяет его оформление и содержание.
Затем необходимо определить, как Web - страницы сайта будут связаны друг с другом. Очевидно при помощи гиперссылок.
Фрейм (frame) представляет собой отдельную область, содержимое которой отображается независимо от домашней страницы. Можно переходить от одной страницы к другой, при этом они будут отображаться в правом фрейме, а содержимое левого фрейма (например, меню с гиперссылками) будет оставаться неизменным.
Помещение графических изображений на Web - страницу.
Существуют два основных типа графических изображений: фотографии и рисунки. Файлы, содержащие фотографические изображения, могут быть разных форматов, но для Web - браузеров чаще всего используются либо GIF (Graphics Interchange Format - формат обмена графическими данными), либо JPEG (Joint Photographic Group - формат объединенной экспертной группы по фотографии). В форматах GIF и JPEG используются алгоритмы сжатия изображений, что дает возможность хранить изображения в файле меньшего размера, чем в случае других форматов. Файлы изображений в этих форматах будут загружаться быстрее.
Добавление звуковых и музыкальных фрагментов к Web - странице.
Большая часть Web - страниц несет в себе какую-либо информацию, однако информация - не единственное, ради чего стоит создавать страницы. Нужно сделать так, чтобы Web - сайт было просто приятно просматривать. Один из способов сделать сайт более привлекательным - добавить на домашнюю страницу фоновое звуковое оформление. Фоновый звук будет воспроизводиться все время, пока страница будет открыта в Web - браузере. Но так же просто можно помещать на страницы и видеоклипы. Когда посетитель Web - сайта загружает страницу с встроенным видеоклипом, будут одновременно воспроизводиться видео и звук. Также можно создавать гиперссылки к файлам, содержащим видеоклипы.
Использование таблиц стилей для размещения элементов Web - страниц.
Одним из привлекательных, но не очень простых приемов является возможность контролировать внешний вид Web - страниц при помощи таблиц стилей (style sheets). Таблица стилей Web - страницы представляет собой отдельный текстовый файл, в котором задаются различные элементы страницы.
Таблицы стилей иначе называются «иерархическими таблицами стилей». Название отражает тот факт, что к одной Web - странице может быть одновременно применено несколько стилей разного уровня.
Создание всплывающих кнопок.
Видеоклипы не являются единственным типом анимации, которая доступна при работе с FrontPage. Еще один популярный мультимедийный эффект - всплывающая кнопка (hover button), внешний вид которой изменяется, когда посетитель сайта наводит на нее указатель мыши.
Всплывающая кнопка представляет собой Java - апплет (программу), создаваемый FrontPage. Можно использовать всплывающую кнопку для перехода к другой Web - странице. Когда посетитель Web - сайта наводит указатель мыши на всплывающую кнопку, она реагирует на это, например, меняет цвет или принимает вид нажатой кнопки. Когда посетитель щелкнет на такой кнопке, на экране откроется страница, на которую была задана ссылка с данной кнопки.
Проверка орфографии Web - страницы.
Прежде опубликовать Web - сайт на сервере, неважно, в Internet или в локальной сети, необходимо сделать его как можно более совершенным. Ошибки, допущенные по невнимательности, могут произвести отрицательное впечатление о сайте.
Публикация Web - сайта.
После проверки орфографии Web - сайт готов к публикации. Публикация сайта - это именно то, для чего создается замечательный сайт. Также стоит опубликовать сайт и на компьютере, создав резервную копию. Если изменить рабочую копию сайта, а затем захотеть отменить изменения, вернувшись к старой версии, то сайт, опубликованный на локальном компьютере, как раз пригодится.
Модификация и поддержка Web - сайта.
Работа над Web - сайтом продолжается и после его публикации. Время от времени придется модифицировать Web - сайт, чтобы обогатить его новыми идеями, а также для того, чтобы удовлетворить требованиям. Модификация Web - сайта представляет собой загрузку новых страниц или исправленных версий старых Web - страниц.
Удаление файлов Web - сайта с Web - сервера.
В принципе существует два способа удалить Web - сайт с удаленного Web - сервера. Во-первых, можно удалить все файлы сайта, но при этом оставить папку, содержащую сайт. Во-вторых, можно удалить файлы вместе с папкой. Файлы можно удалять самостоятельно, однако удаление папки лучше оставить системному администратору.
1.2 Постановка задачи
Сайт «Игрушки» разработан в результате технического задания на курсовое проектирование. Предназначен для получения интересующей информации через Internet.
Основание для разработки:
Основанием для разработки является задание на дипломное проектирование, выданное Челябинским энергетическим колледжем (ЧЭнК).
Тема разработки: создание сайта «Игрушки».
Назначение разработки:
Сайт предназначен для размещения текущей информации о игрушках; для поиска и просмотра данных.
Требования к функциональным характеристикам:
Разработанный сайт должен осуществлять переход по гиперссылкам от одной странице к другой.
- Разделы
1) Главная страница: содержание сайта.
2) Страница «история появления» должна содержать сведения о происхождение игрушек.
3) Страница «производитель» должна включать в себя: перечисление производителей наиболее качественных игрушек
4) Страница «экспертиза» должна содержать информацию об основных характеристиках игрушки и её функциональном назначении.
5) Страница «фотоальбом» должна содержать фотографии различных игрушек.
6) Страница «вредные игрушки» должна содержать статистику и основной перечень последствий возникающих при контакте с вредными игрушками.
7) Страница «руководство по выбору» должна содержать рекомендации по выбору игрушки для ребёнка.
Требования к надежности
Пользователь не должен вносить какую-либо информацию в программу, которая бы повлекла порчу программы или потерю достоверности информации.
Условия эксплуатации:
Для просмотра сайта в Internet необходима программа Internet Explorer, а для доступа в Internet необходим модем.
Требования к составу и параметрам технических средств:
Для нормальной работы сайта необходимо:
- центральный процессор класса Pentium III 433 МГц;
- объём оперативной памяти не менее 128 Mb;
- стандартный манипулятор «мышь»;
- стандартный SVGA монитор;
- программа Internet Explorer;
- операционная система типа Windows 98, 2000, XP;
- модем.
Требования к информационной и программной совместимости:
На входе и выходе сайта информация должна быть текстового и числового типа и предоставляться на русском языке. Метод решения задачи, язык программирования и программные средства выбираются разработчиком. Данный сайт создан в системе визуального объектно-ориентированного программирования Ace Html Pro v6.2, так как она позволяет многое делать руками, но нужные меню, как правило, под рукой. Включает кучу заранее подготовленных Java-апплетов. Есть практически все, что надо для нормальной работы. Удобная настройка интерфейса позволяет включать только те меню и функции, которыми приходится часто пользоваться, тэги специфичные для IE или NN отмечены (что весьма удобно), есть поддержка ASP, PHP, WML, XML. Интерфейс удовлетворяет всем требованиям Windows и автоматически настраивается на ту систему, которая установлена на компьютере пользователя.
Требования к программной документации:
В программной документации должны содержатся:
- техническое задание;
- текст сайта;
- пояснительная записка.
Технико-экономические показатели:
Данный сайт не требует больших ресурсов вычислительной системы. Не занимает место на жестком диске. Но необходима программа для просмотра сайта - Internet Explorer.
Стадии и этапы разработки:
Сайт разрабатывается несколько этапами:
1 этап: - определение назначения и функций сайта;
2 этап: - выбор цветового и стилистического оформления;
3 этап: - определение страниц и содержание;
4 этап: - выбор языка программирования, удовлетворяющего функциям и назначениям сайта;
5 этап: - создание графических элементов сайта;
6 этап: - верстка сайта.
Для сайта должна быть разработана программная документация.
Порядок контроля и приемки:
Программа должна быть испытана различными методами тестирования.
Основным методом обнаружения ошибок в программе, разработанной в отчёте, является тестирование.
Тестирование представляет собой процесс выполнения программы с целью проверки правильности результатов ее работы. Оно включает в себя преднамеренное конструирование трудных наборов входных данных, создающих наибольшие возможности для отказа программы.
Основной метод для обнаружения ошибок в программе - проведение испытаний. Испытание представляет собой процесс выполнения программы с целью проверки правильности результатов ее работы и соответствия заданным характеристикам. Процесс испытаний включает в себя преднамеренное конструирование сложных наборов входных данных, создающих наибольшие возможности для отказа программы.
Порядок проведения испытаний:
- запуск сайта;
- ссылка должны ввести на определенную ей страницу;
- корректное отображение графических элементов;
- корректное отображение сайта в различных пользовательских режимах;
- функциональность и соответствие проекта поставленной задаче.
2. Разработка сайта
2.1 Анализ предметной области
Согласно техническому заданию на дипломное проектирование необходимо разработать сайт «Игрушки». Он предназначен для размещения текущей информации, для автоматизации поиска данных, а также вывода результатов.
Автоматизация процесса поиска данных позволяет решать множество проблем, связанных с поиском необходимой информации.
Одним из таких сайтов является «Игрушки». Этот сайт позволяет размещать информацию и производить поиск информации по различным критериям.
Основные возможности программы:
- выбор необходимой информации;
- переход по гиперссылкам и кнопкам;
- простой и удобный интерфейс для работы пользователя.
Выбор метода решения
В настоящее время существует большое количество способов создания программного обеспечения аналогичного сайту «Игрушки».
Для решения поставленной задачи можно выделить такие программные средства как:
- язык разметки гипертекста (HTML);
- среда объектного визуального программирования FrontPage 2003;
- текстовый редактор Блокнот (Notepad);
- скрипт языки JavaScript и / или VBScript;
С помощью любого из этих средств можно обеспечить полное выполнение технического задания на проектирование.
Для создания программного продукта сайт «Игрушки» наиболее удобным средством является программа FrontPage 2003, так как она позволяет многое делать руками. Есть практически все, что надо для нормальной работы, и еще это наиболее наглядная программа.
Сайт, разработанный в дипломном проекте, упрощает и ускоряет процесс поиска и отображения необходимой информации на экране.
Сайт может использоваться как самостоятельный продукт.
2.2 Разработка структуры сайта
сайт надежность программа стиль
На первое место в процессе создания сайта выходит забота о правильности путей к файлам. Если заранее продумать систему именования файлов и каталогов на своем локальном компьютере, то впоследствии будет меньше проблем при размещении сайта на Web-странице.
Хотя файловая структура сайта может быть разной, всегда нужно помнить некоторые правила. Необходимо учитывать возможность обновления сайта в дальнейшем. Если придется заменять при этом файлы, значит, придется менять и все ссылки, а это может отнять много времени и сил.
Известны такие типы организации Web-сайтов.
- Все файлы в одном каталоге. Маленькие сайты с несколькими HTML-страничками и несколькими изображениями могут позволить себе хранить все свое содержимое в одном каталоге. Одним из самых больших достоинств такой системы является то, что в локальных ссылках не нужно указывать путей. Недостаток состоит в том, что такая система оказывается перегруженной, если сайт разрастается: в этом одном каталоге, как на какой-то свалке, невозможно ничего найти. Обновлять такой сайт непросто.
- Функциональные каталоги. Одним из способов организации сложных сайтов является следующий. В каждом из каталогов хранятся файлы, относящиеся к одной и той же функциональной части системы. На верхнем уровне, например, будет только главная.html и относящаяся к нему графика. В каталогах следующего уровня будут содержаться файлы, относящиеся к какому-либо разделу сайта: «описание больницы», «меню» и т.д. в каждом из каталогов могут быть собственно HTML-файлы и относящиеся к ним графические или мультимедиа-файлы.
- Каталоги по типам файлов. Некоторые Web-дизайнеры предпочитают хранить в каждом из каталогов файлы одного типа, независимо от того, какой функциональной части сайта они принадлежат. В главном каталоге сайта при этом будет только index.html прочие каталоги могут содержать, например, все изображения сайта, HTML-странички, скачанные файлы и т.д. Главным достоинством такого подхода является то, что файлы при обновлении необходимо заменять только один раз. Например, если одна и та же картинка используется на нескольких страницах, достаточно будет заменить ее только в одном месте: там, где хранятся изображения. При этом все ссылки на всех страницах будут указывать на обновленный файл (надо, конечно, не забывать назвать его так же, как старый).
После того как определен подход к файловой организации будет использоваться, нужно создать все необходимые каталоги, как на сервере, так и на своем компьютере. То есть если используется каталог images, то, как на сервере. Так и на локальной машине должен существовать относительный путь, содержащий этот каталог. Создание файловой структуры выполняет 2 функции. Во-первых, уберегает от случайных ошибок размещения файлов в неправильных каталогах на сервере. Во-вторых, облегчает процесс создания относительных URL (гипертекстовых ссылок).
2.3 Разработка интерфейса сайта
Термин «интерфейс» широко используется в областях, где человеку приходится иметь дело с обработкой информации на компьютере. В переводе с английского языка Interface означает внешнее лицо. В компьютерном мире известно множество разновидностей интерфейсов: интерфейс пользователя, графический интерфейс, интерфейс ввода-вывода, внешний или внутренний интерфейс, интеллектуальный интерфейс, человеко-машинный интерфейс, программный интерфейс и т.д.
Интерфейс - совокупность средств и правил, которые обеспечивают взаимодействие устройств, программ и человека.
Особенно важен интерфейс, обеспечивающий взаимодействие пользователя с персональным компьютером, называемый пользовательским интерфейсом. От удобства этого интерфейса во многом зависит успех нового программного продукта в конкурентной борьбе на рынке программных средств. Пользовательский интерфейс может быть символьным и графическим.
Символьный интерфейс используется обычно при работе видеосистемы в текстовом режиме. Информация выводится на экран монитора посимвольно. До появления Windows все операционные системы, в том числе MS DOS и ее оболочка Norton Commander, предоставляли пользователю символьный интерфейс. Он достаточно экономичен по потреблению ресурсов и способен обеспечить вполне комфортную работу пользователя. Исключение составляет интерфейс командной строки операционной системы MS DOS, который требует от пользователя знания синтаксиса команд.
Графический интерфейс появляется тогда, когда видеосистема может работать в графическом режиме, т.е. выводить на экран монитора информацию поточечной. Переход к графическому пользовательскому интерфейсу стал возможен благодаря улучшению технических характеристик персонального компьютера. Такой интерфейс предъявляет повышенные требования к быстродействию видеосистемы, но вместе с тем при этом достигается основная цель - создается комфортная среда работы пользователя, т.к. человеку более естественно и удобно оперировать образами (картинками). Графический интерфейс по сравнению с символьным, воспринимается как более понятный и интуитивно ясный.
Графический пользовательский интерфейс - интерфейс, где для взаимодействия человека и компьютера используются графические средства.
Ярким примером графического пользовательского интерфейса служит интерфейс Windows. При разработке этой операционной системы специалисты широко использовали возможные графические средства: рисунки, специальные значки, цветовое оформление, разнообразные начертания шрифтов, дизайн экрана и др.
Графический интерфейс Windows позволяет более оперативно задавать команды операционной системы, запускать программы, выбирать файлы, кнопки, пункты меню.
Оформление Web-сайта.
Цвет и фон страницы выбирается по желанию Web-мастера, но нужно учитывать и тот факт, что от них зависит визуальное восприятие всего сайта. Не нужно все чрезмерно затемнять, текст удобно читать, если его хорошо видно. Не применяйте черный цвет, мотивируя это продлением срока службы мониторов пользователей. По статистическим данным посещаемость «черных» сайтов не очень высока.
Подбирая цвет фона, необходимо учитывать, как он будет гармонировать со всеми остальными элементами: цветом текста, цветом гиперссылок. Крайне необходимо обеспечить достаточный цветовой и яркостный контраст между навигационными элементами на странице и фоном. Если в качестве фона используется изображение, то оно должно быть едва заметным. Это изображение должно содержать только нейтральные, неконтрастирующие друг с другом цвета.
Не желательно создавать очень большие таблицы, можно разделить таблицу на несколько более мелких.
Использование стилей.
Технология таблиц каскадных стилей (CSS) - это набор правил оформления и формирования, которых может быть применен к различным элементам Web-страницы. В стандартном языке HTML для присвоения какому-либо элементу определенных свойств, - таких как цвет, размер и тому подобное - приходится каждый раз их заново описывать. Применяя технологию CSS, достаточно будет один раз описать свойства элементов и определить это описание как стиль.
Всегда необходимо выдерживать принятый стиль. Если сайт с разветвленной структурой, необходимо оформить его страницы одинаково, т.е. выдержанными в рамках одного стиля. На всех страницах должны быть одни и те же управляющие элементы, одинаковые интервалы и подобные шрифты.
Применяя текстовые фильтры, можно добиться хорошего дизайна сайта даже без использования «навороченных» изображений. К тому же, в отличие от изображений, эти фильтры не усложняют загрузку страниц.
2.4 Выбор и обоснование среды программирования
Для создания сайта может быть использовано несколько методов. Наиболее распространенные - текстовый редактор (блокнот), язык описания гипертекстовых документов HTML, программа Microsoft FrontPage2003, специальные программы - скрипты, написанные на таких языках Microsoft VBScript или JavaScript.
При помощи Microsoft VBScript или JavaScript можно управлять форматированием, выводом изображений, воспроизведением мультимедиа - в этом скрипты похожи на программы, созданные при помощи других языков программирования. На сегодняшний день самым мощным средством, позволяющим управлять выполнением скриптов, является DHTML - Dynamic HTML (динамический HTML). DHTML позволяет создавать простые анимации и многие другие эффекты.
В HTML для определения содержания и формата гипертекстовых документов используются команды, называемые тегами (tags). Web-броузер преобразует эти команды в текст и графические изображения и располагает их нужным образом на экране компьютера.
Кроме описания формата текста и положения графики на странице язык HTML используется и для других целей. Гиперссылка дает команду Web-браузеру перейти к новой странице в Internet и отобразить ее содержимое на экране.
Данный сайт разработан с помощью программы FrontPage 2003.
Для того чтобы создать Web-сайт при помощи FrontPage 2003, нет необходимости учить HTML, языки скриптов или DHTML. FrontPage 2003 позволяет просто набрать текст, который можно поместить на Web-страницу, расположить в нужных местах рисунки, встроить звуковое оформление. Используя FrontPage 2003, можно создавать эффекты, для которых обычно требуются скрипты или программа DHTML.
FrontPage 2003 позволяет не только легко создавать Web-страницы и Web-сайты, но и управлять ими.
При помощь ярлычков можно выбирать различные режимы просмотра и редактирования Web-страниц.
Используя средства FrontPage 2003, можно отобразить Web-сайт в нескольких режимах просмотра. На панели Views (режимы просмотра) расположены значки, позволяющие выбрать тот или иной способ отображения или редактирования сайта.
В списке папок отображаются все папки и файлы, относящиеся к текущему Web-сайту, а в окне просмотра страниц Page отображается выбранная Web-страница.
FrontPage 2003 - это симпатичный и сравнительно простой html редактор, который позволяет многое делать руками. Включает множество заранее подготовленных Java-апплетов. Есть практически все, что надо для нормальной работы. Удобная настройка интерфейса позволяет включать только те меню и функции, которыми приходится часто пользоваться.
2.5 Тестирование сайта
2.5.1 Понятие тестирования
Тестирование представляет собой процесс выполнения программы с целью проверки правильности результатов ее работы. Оно включает в себя преднамеренное конструирование трудных наборов входных данных, создающих наибольшие возможности для отказа программы.
Основной метод для обнаружения ошибок в программе - проведение испытаний. Испытание представляет собой процесс выполнения программы с целью проверки правильности результатов ее работы и соответствия заданным характеристикам. Процесс испытаний включает в себя преднамеренное конструирование сложных наборов входных данных, создающих наибольшие возможности для отказа программы.
Порядок проведения испытаний:
- запуск сайта;
- ссылка должны ввести на определенную ей страницу;
- корректное отображение графических элементов;
- корректное отображение сайта в различных пользовательских режимах;
- функциональность и соответствие проекта поставленной задаче.
2.5.2 Виды и методы тестирования
Что бы проверить, как на самом деле выглядит созданная страница, имеет смысл воспользоваться Web-браузером. Почти любой из них может загружать Web-страницу с жесткого диска точно так же, как из Internet. Необходимо в меню браузера найти команды типа File (файл), Open File (открыть файл). Диалоговое окно команды Open File позволяет открыть нужный файл.
Для тестирования документа в браузере:
1. выберите File Save File, чтобы сохранить все изменения в редакторе. Перейдите на окно браузера и выберите File Open File, чтобы открыть сохраненный элемент.
2. документ должен появиться в браузере. Проверьте его на наличие ошибок, опечаток, гиперссылок.
3. перейдите обратно в окно текстового редактора и внесите все необходимые коррективы. Отредактированный файл необходимо сохранить.
4. если страница уже открыта в браузере, то для того, чтобы увидеть проделанные изменения, нужно щелкнуть на кнопке «Обновить».
2.5.3 Процесс тестирования
Процесс тестирования проходит в несколько этапов:
1. сохранение данных в редакторе с расширением html (расширение для просмотра Web-сайтов) и открытие этого документа в Internet Explorer (окно браузера).
2. выбранный документ появился в окне браузера. Проверка орфографических ошибок, опечаток, работы гиперссылок, нажатия кнопок, интерфейс (достаточно прост ли он для пользователя, совместимость цветов, размер изображений, текста).
3. в процессе проверки орфографии были допущены ошибки. Изменения были внесены в окно текстового редактора и сохранены в этом же текстовом редакторе с тем же именем.
4. для просмотра изменений снова вернулись в окно браузера и нажали «Обновить». Если снова обнаружились недочеты необходимо вернуться к пункту 3.
В результате тестирования были обнаружены ошибки, связанные с орфографией и интерфейсом. Все эти ошибки были устранены. Все гиперссылки.
Работа гиперссылок:
1. С главной страницы можно перейти на страницы:
1. «История появления»
2. «Производители»
3. «Наша экспертиза»
4. «Фотоальбом»
5. «Вредные игрушки»
6. «Руководство по выбору»
Работа ссылок:
1. При нажатии на перечисленные выше ссылки можно перейти на интересующую страницу со страницы «Главная».
2.6 Программная документация
2.6.1 Руководство оператора
Руководство оператора предназначено для более эффективной эксплуатации программы с оператором. Описывается, для чего необходима программа и ее применение, необходимые условия для выполнения и работы программы, и порядок работы с программой, чтобы у пользователей не возникало вопросов по обращению с программой.
Назначение
Программа предназначена для наглядности получения данных через всемирную паутину. Основными функциями сайта являются: получение информации и переход по гиперссылкам.
Условия выполнения программы
Программа будет выполняться при наличии программы Internet Explorer. Также необходим модем для выхода в Internet. Для обеспечения нормальной работы программы должна быть использована следующая конфигурация компьютера:
- центральный процессор класса Pentium III 433 МГц;
- объём оперативной памяти не менее 128 Mb (т.к. при меньшем объеме скорость загрузки страниц будет меньше);
- стандартный манипулятор «мышь»;
- стандартный SVGA монитор;
- операционная система типа Windows, 98, 2000, XP;
Выполнение программы
Для просмотра сайта «Игрушки» может использоваться файл «главная» на дискете, либо файл с таким же названием на жестком диске компьютера. Так же можно вызвать программу, открыв приложение Ace Html Pro v6.2 и среди представленного списка Web-страниц выбрать главная.
При открытии файла «Главная» появляется диалоговое окно Internet Explorer. В этом окне можно перейти на интересующую страницу щелкнув по соответствующим названиям.
На странице имеются функциональные копки, позволяющие перейти на другую страницу. Такими кнопками являются:
- кнопка «на главную» (позволяет, перейти на страницу с именем главная);
Кнопка «на главную»
При нажатии на кнопку «на главную» должен осуществляться переход со страницы, содержащей эту кнопку на главную страницу.
Сообщения оператору
В ходе выполнения программы никакие сообщения пользователю не выдаются, т.к. пользователь не может вводить информацию.
2.6.2 Руководство программиста
Назначение и условия применения программы
Программа предназначена для наглядности получения данных через всемирную паутину. Основными функциями сайта являются: получение информации и переход по гиперссылкам.
Для обеспечения нормальной работы программы должна быть использована следующая конфигурация компьютера:
- центральный процессор класса Pentium III 433 МГц;
- объём оперативной памяти не менее 128 Mb;
- стандартный манипулятор «мышь»;
- стандартный SVGA монитор;
- программа Internet Explorer;
- операционная система типа Windows, 98, 2000, XP;
- модем.
Обращение к программе
Загрузки сайт можно с дискеты, жесткого диска, открыв файл с именем главная.html. С этой страницы при нажатии на кнопку мыши можно перейти на страницы с этих же страниц можно вернуться на главную.
Входные и выходные данные
Сайт предназначен для поиска информации т.к. техническим заданием определено, что пользователь не должен вносить какую-либо информацию в программу, которая бы повлекла порчу программы или потерю достоверности информации.
Сообщения
Программисту может выдавиться сообщение о невозможности отобразить станицу. Это может быть связанно с неправильным указанием адреса, на который ссылается страница, изображение.
Руководство технического обслуживания
Для обеспечения нормальной работы программы должна быть использована следующая конфигурация компьютера:
- центральный процессор класса Pentium III 433 МГц;
- объём оперативной памяти не менее 128 Mb (т.к. при меньшем объеме скорость загрузки страниц будет меньше);
- стандартный манипулятор «мышь»;
- стандартный SVGA монитор;
- программа Internet Explorer;
- операционная система типа Windows, 98, 2000, XP;
- модем.
Заключение
Сегодня, путешествуя по Internet, можно найти много очень хорошо выполненных сайтов, которые быстро загружаются, привлекательны на вид, имеют четко разграниченную по разделам информацию и удобные функции навигации. Такие сайты просто приглашают посетить их, расслабиться, задержаться на некоторое время, развлечься и узнать что-то новое.
Если кто-то задерживается на каком-либо сайте на длительное время и даже не осознает этого, то, по всей видимости, такой сайт очень хорошо продуман.
Многие Web-мастера не тратят время на то, чтобы продумать информационный поток, а ограничиваются только размещением текста и изображений на странице. Хотя на многих сайтах можно встретить хвастливые уверения, что у них гораздо больше посетителей, чем у конкурентов, однако это не самый лучший индикатор качества исполнения. Лучшим показателем является время: если пользователи остаются на сайте достаточно долго для того, чтобы пройти по разным его уровням и разделам, то можно вправе быть уверенными в хорошо выполненной работе. С таким инструментом в руках, как Ace Html Pro v6.2, имеются практически все возможности для создания самого посещаемого сайта.
Литература
1) Антипов Д.В. Соколов А.В. Internet как среда глобального общения - Москва 1996.
2) Клименко С. Уразметов В. INTERNET - среда обитания информационного общества. Москва 1996.
3) Хоникат Использование Internet 2-е изд. Издательство: К.: Диалектика
4) Рассохин Д. и Лебедев А. World Wide Web - всемирная информационная паутина в сети Internet - Москва 1997.
5) Перри Секреты World Wide Web Москва 1996.
6) Нольден. Знакомьтесь: World Wide Web Москва 1996. Издательство: К.: BHV
7) Ахметов Microsoft Internet Explorer 4.0 для всех Москва 1997. Издательство: М.: КомпьютерПресс
8) HTML 4.0 - Сергеев А.О.: БХВ - Санкт - Петербург, 1999.
9) Web-сайт своими руками - И. Шапошников: БХВ - Санкт-Петербург, 2000.
Размещено на Allbest.ru
Подобные документы
Разработка сайта в приложении FrontPage. Программные средства и технологии, используемые при разработке сайта. Основная структура сайта и размещение исходных файлов. Создание графических страниц, элементов и рисунков. Размещение сайта в сети Internet.
курсовая работа [1,6 M], добавлен 13.06.2013Работа с HTML-редактором Adobe Dreamweaver. Этапы и правила построения заглавной страницы сайта, форматирования HTML-страниц, создания гипертекстовых ссылок, создания и форматирования таблиц. Использование графических материалов при разработке сайта.
методичка [1,9 M], добавлен 06.07.2011Подходы к созданию сайтов. Обоснование необходимости наличия персонального сайта компании ИП Тимонина Е.Н.. Структура, интерфейс, этапы создания сайта. Описание кода страниц. Создание web-страниц и наполнение их информацией. Верстка сайтов с чистым кодом.
дипломная работа [1,5 M], добавлен 03.06.2015Выбор инструментальных и программных средств для создания сайта. Структура программного продукта. Создание сайта при помощи программы WordPress. Тестирование разработанной программы. Разработка структуры и дизайна сайта. Наполнение сайта контентом.
курсовая работа [1,0 M], добавлен 09.01.2014Использование функциональных возможностей GSM uCoz для разработки сайта. Сущность, значимость, типы и виды сайтов, способы их создания. Правила размещения сайта в сети Интернет. Основные возможности, понятия, преимущества и недостатки сервиса uCoz.
дипломная работа [1,7 M], добавлен 20.07.2014Языки написания сайта, принципы и обоснование их отбора. Программы создания web-страниц, их функциональные особенности и возможности. Технология и основные этапы разработки интернет-сайта, правила его составления, оформления, заполнения, программный код.
курсовая работа [3,1 M], добавлен 20.05.2015Изучение роли информационно-коммуникационных технологий в гостиничного индустрии. Виртуальные представительства реальных отелей в сети Интернет. Основные виды презентаций и сайтов, технологии и этапы их создания. Бриф на создание сайта и его элементов.
курсовая работа [7,3 M], добавлен 10.12.2013Создание основы интернет-сайта - набора таблиц, которые расположены в нужном порядке. Использованные теги и их атрибуты. Кодовое оформление сайта, наложение второго слоя. Стильный текст в HTML. Использование скриптов для большей информативности сайта.
методичка [813,6 K], добавлен 08.11.2013Основы функционирования глобальной компьютерной сети. Содержимое Web-сайта и зрительные образы. Основные требования к пректу. Сценарии пользователя, переход на страницу с рецептом "Блины манные" по результатом опроса пользователей. Структура сайта.
курсовая работа [208,6 K], добавлен 14.12.2010Понятие web-сайта и их типы. Программы для создания web-сайта. Описание структуры проекта. Алгоритм создания сайта. Описание конструктора Jimdo. Языки программирования серверного выполнения. Создание полнофункционального веб-сайта для ОАО "КУЛЗ".
курсовая работа [3,5 M], добавлен 05.06.2015
