Автор: Пользователь скрыл имя, 19 Декабря 2011 в 08:27, курсовая работа
Цель данной курсовой работы – создание интуитивно понятного сайта на языке программирования HTML с доступными характеристиками компьютерной техники, обращенными к обычному пользователю персональным компьютером.
2. Практическая часть
HTML (Hyper Text Markup Language — язык гипертекстовой разметки) является компьютерным языком программирования, предназначенным для разработки Web-страниц, документов HTML. Язык HTML – это совокупность управляющих символов – тэгов, с помощью которых добавляются и форматируются элементы документа. Для настройки внешнего вида и функционирования элемента страницы устанавливаются его атрибуты.
Обозреватели распознают тэги языка HTML и преобразуют в Web-страницу, отображаемую в окне обозревателя. Приложения обозревателей разрабатываются с учетом мировых стандартов языка HTML, благодаря которым Web-страницы выглядят одинаково, независимо от того, в каком обозревателе открыли данный документ.
Стандартизацией языка HTML занимается организация World Wide Web Consortium (W3C). Работа над языком программирования продолжается. Появляются новые версии HTML, предоставляющие дополнительные возможности для разработчиков Web-страниц.
На данный момент существует множество специализированных HTML-редакторов, которые возможно разделить на два типа:
Визуальные редакторы HTML, (например, Microsoft FrontPage, Macromedia Dreamveawer.). При работе в данных программах пользователь работает с графическими образами элементов HTML, а не с самим кодом документа.
Редакторы HTML-текстов, дающие возможность автоматизировать набор и непосредственно редактировать код (например, HomeSite, Ken Nesbitt Web Editor и многие другие). Эти программы делают возможным пользователю быстро и без особых затруднений вставлять в документы элементы HTML кода, проверять синтаксис команд, производить запуск и отладку страницы.
Кроме выше перечисленных категории, существуют программы, позволяющие объединяющие в себе черты текстовых и визуальных HTML-редакторов к таким программам относится HotMetal .
Функциональная возможность современных HTML-редакторов очень разнообразна: некоторые из них, позволяют формирование только отдельно взятые страницы документа, иные, наоборот, применяются для проектирования целых Web-узлов с дальнейшей загрузкой на удаленные серверы в Internet. В наше время трудно провести границу между профессиональными HTML-редакторами и теми, что предназначены для любительского Web-творчества.
Все тэги HTML начинаются с "<" (левой угловой скобки) и заканчиваются символом ">" (правой угловой скобки). Соответственно, существует стартовый тэг и завершающий тэг. Для примера приведем тэги заголовка, определяющие текст, находящийся внутри стартового и завершающего тэга и описывающий заголовок документа:
<TITLE> Заголовок документа </TITLE>
Завершающий тэг выглядит также, как стартовый, и отличается от него, только лишь прямым слэшем перед текстом внутри угловых скобок. В данном примере тэг <TITLE> говорит WEB-броузеру об использовании формата заголовка, а тэг </TITLE> - о завершении текста заголовка.
А такие тэги, такие, как <P> (тэг, определяющий абзац), не требуют завершающего тэга, но его использование придает начальному тексту документа улучшенную читаемость. HTML не реагирует на регистр символов, описывающих тэг, и приведенный выше пример может выглядеть иначе.
WEB-броузер получая документ, первым делом определяет, как данный документ должен быть истолкован. Первый тэг, набранный в документе, должен быть тэгом <HTML>. Данный тэг сообщает WEB-броузеру, что документ создан с использованием HTML. Минимальный HTML-документ выглядит следующим образом:
<HTML> ...тело документа... </HTML>
Заголовочная часть документа <HEAD>
Тэг заголовочной части документа используеться сразу после тэга <HTML> и больше не встречается в документе. Данный тэг, представляет общее описание документа. Следует так же избегать употребления какого-либо текст внутри тэга <HEAD>. Стартовый тэг <HEAD> помещается непосредственно перед тэгом <TITLE> и другими тэгами, описывающими документ, а завершающий тэг </HEAD> располагается после окончания описания документа. Например:
<HTML>
<HEAD>
<TITLE>Список сотрудников</TITLE>
</HEAD>
Заголовок документа <TITLE>
Большинство
WEB-броузеров отображают содержимое
тэга <TITLE> в заголовке окна, содержащего
документ и в файле закладок, если
он поддерживается WEB-броузером. Заголовок,
ограниченный тэгами <TITLE> и </TITLE>,
размещается внутри <HEAD>-тэгов, как
показано выше на примере. Заголовок документа
не появляется при отображении самого
документа в окне.
2.1. Технология разработки сайта
После использования HTML конструкций получается следующая структура сайта, показанная на рисунке 1.
Рисунок 1 – Структура.
На рисунке представлена главная страница «Компьютерного диагностического сервисного центра «Фиргус». С представленной рекламой, брэндовым лозунгом. Так же, на главной странице имеют место гиперссылки, служащие для перехода на различные страницы сайта.
Рисунок 2 – Главная страница
На следующей странице представлена
информация о компании: контактные
номера, адрес, банковские реквизиты фирмы,
история возникновения и брэнд.
Рисунок 3 – О компании
Следующая страница представляет прайс
фирмы: перечень товара, его количество
и внешний вид, специальные предложения.
Удобный, простой в обращении интерфейс
с красочными пояснениями является «изюминкой»
данной страницы.
Рисунок 4 – Наш прайс
Страница «Выбор Мониторов» посвящена обзору различных моделей дисплеев, технологий их создания и характеристикам, инструкциям по выбору наиболее подходящей модели конкретному пользователю, фотографии наилучших представителей этого сегмента рынка.
Рисунок 5 – Выбор Мониторов
Пятая страница представляет собой
характеристики материнских плат. Рассказывается
об их основных функциональных возможностях.
Рисунок 6 – Выбор Материнских плат
На странице «Выбор HDD» представлены
жесткие диски, являющимися основным хранителем
информации. Скорость передачи информации,
потребление питания и надежность основных
механизмов важная информация необходимая
пользователю. Грамотно обработанная
техническая спецификация представлена
на этой странице.
Рисунок 7 – Выбор HDD
На этой странице представлен выбор
DVD-ROM. Оптические приводы, отличаются по
скорости записи, чтения дисков. Множество
различных функций свойственно определенным
моделям. Данный перечень представлен
на седьмой странице сайта.
Рисунок 8.- DVD-ROM
Выбор видеокарт, представленный на этой
странице, является одним из основных
составляющих компьютера. Много процессов
нашло отражение в этой схеме. Здесь так
же представлен обзор наиболее востребованных
моделей.
Рисунок 9. – Видеокарта
Десятая страница сайта посвящена
ноутбукам, это самый востребованный товар
на современном компьютерном рынке. Взять
ли с собой, обустроить рабочее место,
какой мощности необходим, много вопросов
возникает касательно этого продукта.
Эргономика товара, различные особенности,
характеристики комплектующих, это и многое
другое нашло отражение на этой странице.
Рисунок 10 –Ноутбуки
Данная страница сделана с помощью фреймов и располагает на одной странице сразу 2 страницы. Карманный Персональный Компьютер, его возможности и перечень свойств, представленный на этой странице может более полно рассказать о этом устройстве.
Второй
фрейм располагает информацией о электронной
книге. Как правильно выбрать и что это
за устройство. Два похожих по свойству
устройств можно сравнить по степени их
надобности.
Рисунок 11 – Фрейм КПК и Электронная книга
На этой странице показано, как правильно
выбрать современный автомобильный навигатор,
соответствующий вашим потребностям,
и обладающий необходимыми функциями
и характеристиками? Безусловно, для выбора
GPS навигатора необходима справочная информация,
которая бы внесла ясность относительно
возможностей интересующих моделей. В
разделе выбор навигатора собраны краткие
сведения, характеризующие основные свойства
навигаторов Garmin Nuvi, чтобы вы могли иметь
представление о технических особенностях
богатого модельного ряда Garmin и сделать
определённые выводы для удачного выбора
автомобильного gps навигатора. Это представлено
на 12 странице сайта.
Рисунок 12. – GPS
Заключение
В данной работе мной были рассмотрены актуальные вопросы разработки и создания современного Web-сайта, а так же были изложены теоретические основы сайтостроения. Тема была выбрана по нескольким причинам. Одна из самых существенных причин заключается в том, что за всемирной компьютерной сетью Internet будущее, и выбор компьютерной техники является неотъемлемой частью данного роста. Но к сожалению должного теоретического охвата в сети Internet эти вопросы не получили.
На сегодняшний день существует огромное количество фирм, компаний занявших свою нишу в мире техники. Каждая из них является уникальной по ряду вопросов, но в тоже время их похожесть и однотипность не ведет к полноценному овладению ни рынком прогрессивной техники, ни усиленным внимание пользователей. Похожесть в выборе комплектующих и недостаток, а иной раз и отсутствие индивидуального подхода к каждому желанному клиенту является основной ошибкой таковых компаний. В ходе курсовой работы я постарался решить эти вопросы. Предельная простота и понятность интерфейса, доступность технических обзоров с качественной иллюстрацией решили поставленные цели.
Цель работы состояла в создании сайта посвященному уникальным обзорам и характеристикам современной техники в помощь пользователю. Работа была создана на языке программирования HTML для помощи пользователю в возникших вопросах в сфере выбора комплектующих и отдельных технических новинок.
В работу вошел материал, основанный на обзорных материалах ведущих сервисных центров и непосредственно учебного материала по программированию на языке разметки гипертекста HTML.
Список использованной литературы.
ПРИЛОЖЕНИЯ
Приложение № 1. Главная страница «Фиргус»
<html>
<head>
<title>Фиргус</title>
</head>
<body background="photo05.jpg" link="black" alink="red" vlink="red">
<p align="center"><font size="6" color="black" face="Arial"><i>КОМПЬЮТОРНЫЙ ДИАГНОСТИЧЕСКО-СЕРВИСНЫЙ МАГАЗИН </i></font></p>
<p align="center"><font
size="7" color="black" face="Arial"><i>Фиргус</i></
<table align="left">
<tr>
<td><a href="О компании.html">О компании</a></td>
</tr>
<tr>
<td><a href="Наш прайс.html">Наш Прайс</a></td>
</tr>
<tr>
<td><a href="Наш
выбор Мониторов.html">Выбор
</tr>
<tr>
<td><a href="Выбор
Мат.плат.html">Выбор Мат.
Информация о работе Проектирование html сайта диагностического центра