Министерствообразования республики Беларусь
Учреждениеобразования
Гомельскийгосударственный технический университет имени П. О. Сухого
Факультетавтоматизированных и информационных систем
Кафедра «Информатика»
Пояснительнаязаписка
к курсовойработе
по дисциплине«Информатика»
на тему: «Интернет-аукционы»
Исполнитель:
слушатель гр. ЗВД-11
Романенко О. С.
Руководитель: Горский С.М.
Гомель 2010
Содержание
Введение
1. Схема сайта
2. Технические характеристики сайта
3. Контент
Заключение
Список использованных источников
Введение
В данной курсовой работерассматривается разработка сайта с помощью HTML – кода. В качестве тематики данной работы мною былавыбрана тема Интернет-аукцион.
Современный мир уже немыслим без сетиИнтернет. В последнее время в повседневной жизни человека все большее значениепринимает покупка товаров и услуг через Всемирную сеть, хотя бы потому, чтоданный товар элементарно объективно дешевле. Желание людей приобрести товар ещедешевле или приобрести эксклюзивный привела к созданию Интернет — аукционов.
С распространением электронныхплатежных систем и международных пластиковых карт приобрести товар несоставляет большого труда.
К сожалению, в Р.Б. еще достаточномало людей пользуются Интернет — аукционами, поэтому одной из целей даннойработы было подробное освещение истории создания и функционирования такихаукционов, а также привлечь внимание людей к возможностям Интернет — аукционов.
Разработка сайта проводится втабличном стиле что полностью соответствует выданному заданию.
Так как данный стиль используеттаблицы, то в основной акцент будет сделан на теги:
Таблицы
Создает таблицу.
Определяетстроку в таблице.
Определяетотдельную ячейку в таблице.
Определяетзаголовок таблицы (нормальная ячейка с отцентрованным жирным текстом)
Атрибуты таблицы
Задает толщинурамки таблицы.
Задаетрасстояние между ячейками таблицы.
Задаетрасстояние между содержимым ячейки и ее рамкой.
Устанавливаетширину таблицы в пикселах или процентах от ширины документа.
или Устанавливает выравнивание ячеек в таблице, принимаетзначения: left, center, или right.
или Устанавливает вертикальное выравнивание дляячеек таблицы, принимает значения: top, middle, или bottom.
Указывает кол-востолбцев которое объединено в одной ячейке.
(по умолчанию=1)
Указывает кол-вострок которое объединено в одной ячейке. (по умолчанию=1)
Не позволяетпрограмме просмотра делать перевод строки в ячейке таблицы.
Также будут использованы гиперссылки:
Гиперссылки
Создает гиперссылку на другие документы иличасть текущего документа.
Создает гиперссылку вызовапочтовой программы для написания письма автору документа.
Отмечает часть текста как цель длягипперссылок в документе.
Создает гиперссылку на часть текущегодокумента.
1. Схема сайта
/>
Что касается схемы сайта, то мой сайтсостоит из 8 основных и 4 дополнительных Html документов. Также для работы сайта 3 документа word и 1 pdf документ.
При загрузке сайта мы находимся наглавной странице, а в дальнейшем по ссылкам переходим на семь дополнительныхстраниц и на две страницы анонса. Семь страниц содержания сайта в дальнейшемвсегда будут оставаться без изменения на них только можно будет изменятьинформацию, а две дополнительные страницы анонса в дальнейшем могут меняться.Что позволяет помещать на главные страницы сайта новый анонс об открытии новыхсайтов Интернет — аукционов, о новых возможностях и т.д.
Все основные ссылки являются нетолько прямыми но и обратными таким образом с любой из основных страниц мыможем вернуться назад на главную просто нажав на ссылку в содержании сайта.
На всех без исключения страницах естьссылка на электронную почту разработчика и дизайнера сайта. В идеале это разныелюди, но в данный момент это один человек и здесь находится рабочая ссылка принажатии появляется стандартная почтовая форма где автоматически прописываетсяваш адрес и адрес разработчика, ну а в дальнейшем можно написать письморазработчику или задать какой-нибудь вопрос.
На основных страницах сайтарассматриваются разнообразные вопросы касающиеся Интернет аукционов.
На вкладке история рассмотрен вопрособ образовании в сети Интернет – аукционов, данные сведения были взяты изэнциклопедий.
На вкладке типы и разновидностирассматриваются разнообразные типы и разновидности аукционов, рассматриваютсяработа этих аукционов. Так как данная информация очень объемная, то на даннойстранице были помещены ссылки на файлы tip1.html иtip2.html в которых находится продолжение темы. Внизу страницыразмещены ссылки 1|2|3 которые также являются не только прямыми но иобратными.
На вкладке оплата вы можете найтиразнообразную информацию о возможностях оплаты товаров на Интернет – аукционах.Возможно информации не очень много однако на ней есть ссылки на такие разделыкак возможности оплаты, процедура покупки на Интернет – аукционах, о службедоставки. Данные ссылки даны на документы word в которых дана наиболее полная информация по каждойиз этих тем.
На вкладке редкости вы можете найтиинформацию об наиболее интересных лотах Интернет – аукционах, нестандартныелоты и т.д.
Например нестандартное предложениебывшей сотрудницы нью-йоркской фирмы электронной торговли Карен ди Гесу,которая решила… выставить себя «на продажу» в виртуальном аукционеe-Bay. «Неутомимый работник с опытом деятельности в области Интернет — бизнеса может оказать неоценимую помощь любой высокотехнологичной компании, –говорилось в описании этого, мягко скажем, необычного „живого лота“.— Прекрасный послужной список и необходимые рекомендации прилагаются» .
На вкладке полезные ссылки вы можетенайти информацию о наиболее известных Интернет – аукционах зарубежных ироссийских, а так же информацию о направлении работы этих аукционов.
На вкладке литература указаныисточники из которых бралась информация книги, электронные книги и Интернетсайты.
На вкладке связь есть обратная связьс фирмой разработчиком.
2. Техническиехарактеристики сайта
При создании данногосайта была разработана структура
/>
Рисунок1 – Пример табличного оформления сайта
Из данной схемы видно чтов данной таблице 3 столбца и примерно 12 строк, некоторые из которыхобъединены. Это позволяет поместить рисунки и рекламные баннеры разной формы.
При разработке сайта вкачестве логотипа было взято изображение, т.е. была взята стандартнаяфотография соответствующая тематике сайта. Это изображение впоследствии былообработано с помощью фотошоп. То есть на уже готовое изображение была помещенанадпись oldis.by. Данная надпись была непросто вставлена в изображение.Надпись была помещена вдоль выбранной линии которая настраивалась вручную. Атакже надпись была немного состарена посредством спецэффектов фотошоп.
А в дальнейшемизображение вставлено в ячейку и используется без каких либо дополнительныхнастроек
Для создание заголовкабыло использовано простое изображение цветка которое повторяется на всю ширинуячейки и надпись, однако в данной ситуации надпись и изображение необрабатывались средствами фотошоп.
Здесь была использованапростая вставка изображения, а также простая вставка текста. В данной ситуациибыл подобран шрифт наиболее гармонирующий с изображением. Но для более привлекательногорасположения текст был разряжен вручную. Что позволило расположить буквы междуцветками на изображении. При этом текст надписи стал более читабельным.
А
у
к
ц
и
о
н
На данном сайте былоотведено место под рекламные баннеры. Пр разработке сайта было решеноиспользовать два вида рекламных баннеров:
Первый баннер было решеносделать анимационным т.е. изображение изменяется через некоторые промежуткивремени. Анимационное изображение было выбрано в соответствии с тематикой сайта.
/>
Рисунок2 – анимационное изображение
Второй баннер сайтаиспользует коллаж с надписью, обработанный средствами фотошоп. Этот баннерстатичный. В данном случае с помощью программы фотошоп был выбран размербаннера который соответствовал высоте ячейки в которую в последствии он былпомещен. В данной обработке так же были использованы спецэффекты, и так же надписьбыла размещена вдоль некоторой кривой, расположение которой настраивалосьвручную.
/>
Рисунок3 – статичное изображение
Цветовая схема сайтаподбиралась в соответствии с заданными уже цветовыми моделями логотипа изаголовка.
Поэтому в качествеосновного фона страницы сайта использовались цвета наиболее близкие к ужезаявленной цветовой гамме логотипа и заголовка
/>
Рисунок4 – цветовое оформление сайта
т.е.
Поэтому верхняя частьсайта была оформлена в данных тонах.
Однако для нижней частибыли подобраны желтые оттенки наиболее близкие к цветовой гамме ужеиспользующейся в логотипе.
Для оформления текстабыли использованы три вида шрифтов и стилей.
Первый был использован взаголовке
Заголовок был оформлен ввиде заголовка первого уровня т.е. тэг …с атрибутом align — расположение текста.
Данный шрифт был выбранкак наиболее близкий по стилю к изображению цветка на рисунке заголовка.
Второй шрифт былиспользован при оформлении бегущей строки текста.
Здесь были использованытэги
…
…
Приветствуем вас на нашем сайте!
Третий шрифт былиспользован при оформлении основного текста.
Это стандартный шрифт Times New Roman.
При разработке сайтацелесообразно было использовать один и тот же шрифт, но в разных вариациях.
Например для выделениягиперссылок был использован шрифт Times New Roman, но размер шрифта был взят font-size: 12pt.
Для выделения основноготекста также был взят шрифт Times New Roman, и размер шрифта также font-size: 12pt.
Это дало возможностьподчеркнуть тематику данной страницы.
Для раздела анонс, тамгде информация дана в рекламном варианте использовался шрифт Times New Roman, но размер шрифта был взят 10pt.
Что позволило вместитьбольше рекламной информации на небольшое пространство.
Так же были использованытакие атрибуты как толщина границы.
При разработке таблицыбыла использована толщина и цвет границы. А также были заданы высота в пунктахи ширина в процентах. Эти данные были прописаны сss таблицах что дало возможность не изменять ни ширину нивысоту таблицы сайта.
Цветовая гамма выбраннаядля таблицы позволила сочетать уже заданные цвета заливки ячеек и изображений.
При вставке изображенийчто бы не нарушать уже существующий рисунок границы изображения были равнынулю. Что позволило зрительно не разъединять картинку и общий фон.
3. Контент
Так как данный стиль используеттаблицы, то в основной акцент будет сделан на теги:
Таблицы
Создаеттаблицу.
Определяетстроку в таблице.
Определяетотдельную ячейку в таблице.
Определяетзаголовок таблицы (нормальная ячейка с отцентрованным жирным текстом)
Атрибуты таблицы
Задает толщинурамки таблицы.
Задаетрасстояние между ячейками таблицы.
Задаетрасстояние между содержимым ячейки и ее рамкой.
Устанавливаетширину таблицы в пикселах или процентах от ширины документа.
или Устанавливает выравнивание ячеек в таблице, принимаетзначения: left, center, или right.
или Устанавливает вертикальное выравнивание дляячеек таблицы, принимает значения: top, middle, или bottom.
Указывает кол-востолбцев которое объединено в одной ячейке.
(по умолчанию=1)
Указывает кол-вострок которое объединено в одной ячейке. (по умолчанию=1)
Не позволяетпрограмме просмотра делать перевод строки в ячейке таблицы.
Также будут использованы гиперссылки:
Гиперссылки
Создает гиперссылку на другие документы иличасть текущего документа.
Создает гиперссылку вызовапочтовой программы для написания письма автору документа.
Отмечает часть текста как цель длягипперссылок в документе.
Создает гиперссылку на часть текущегодокумента.
Тег и необязательный парный ему
Тег создает новый параграф. Два или более тега , идущих подряд, заменяютсяодним
Параметры
align
Выравнивает параграфотносительно одной из сторон документа, значения:
left — выравнивание полевому краю. По умолчанию,
right — выравнивание поправому краю,
center выравнивание поцентру,
justify — выравнивание поширине.
title всплывающаяподсказкаТеги ,, , , ,
Тег служит для создания заголовка. Всего существует 6 видов заголовков — от H1 доH6. Тегу H1 соответствует самый большой заголовок, тегу H6 — самый маленький.Закрывающий тег требуется
Атрибуты
align
Выравнивает заголовок в соответствиисо следующими значениями:
left — выравнивание полевому краю. По умолчанию,
right — выравнивание поправому краю,
center выравнивание поцентру,
title всплывающаяподсказка
Внутри заголовка размещаются всенеобходимые для конкретного документа Метаданные содержат сведения о самомдокументе. В этой секции, как правило, располагается информация об авторе, датесоздания документа, данные об авторском праве и другие дополнительные детали, обычныедля книг и журналов.
Тэг meta имеет два основных атрибута:name (имя) и content (содержание):
Значением атрибута name может бытьлюбая символьная строка без пробелов. Выполнение последнего условияобязательно. Следовательно, является корректной записью, а name" ошибочна.
В отличие от первогоатрибута на содержимое content ограничения не накладываются. Таким образом,применение фраз типа «my name» (мое имя), списка значений, в которомэлементы отделяются друг от друга запятой, других информационных компонентов вкачестве величины, переданной атрибуту, вполне допустимо.
А у
к
Заключение
В заключении можносказать что в настоящее время дизайнерская разработка сайтов является оченьвостребованной в мире.
При разработке сайтовневозможно обойтись только знанием одного языка программирования, даже знаниенескольких языков не дает гарантии что вы сможете написать действительнокачественный сайт.
Еще недавно разработкойсайтов занималась целая группа программистов в которой каждому участникудавалось задание на разработку определенного участка в определенной программе.
Сейчас способы разработкисайтов не изменились. Просто увеличилась скорость обработки информации чтопозволило значительно сократить время на разработку определенного участка ипоявились более наглядные программы, а так же программы с русифицированныминтерфейсом которые намного упростили работу программиста или сделали ее болеенаглядной.
Поэтому разработать сайтстало не проще, а более наглядно. В данный момент появились такие проблемы какновые и нестандартные дизайнерские решения. В этой ситуации необходимыми сталинавыки художника и оформителя. То есть на этом этапе разработки необходимымистали навыки художника который мог бы привнести в разработку некоторые свежиерешения.
Таким образом, разработчикамистали не только программисты, но и художники. Сейчас именно для этого во всеххудожественных учреждениях были введены предметы компьютерной графики которые позволяют художникамперенести свои художественные идеи с бумаги в электронный вариант, а в дальнейшемиспользовать для разработки графических приложений, блогов, сайтов и т.д.
Поэтому художникам и web-дизайнерам необходимы знания неодной программы для написания HTML-кода,а дополнительных программ для разработки индивидуальных проектов. Знание графическихпакетов и огромного количества анимационных и видеопрограмм.
В данной работе длясоздания логотипов и баннеров были использованы графические редакторы AdobePhotoshop CS4, GIMP. Чтопозволило осветить только один вид баннеров.
Для основной работы (т.е.написание HTML-кода) были использованы Блокнот.
Данный вид написания Html кода не является наглядным однако онсоставляет основу программирования.
А также для тестированияи проверки работоспособности полученных web-страниц использовались браузеры Internet Explorer,Opera.
Список использованныхисточников
1. Электронныйучебник web-design.pdf – 160 с.
2. Интернет – сайтhttp://meshok.ru.
3. Березовская Е.М. HTML. -Гомель: ГГУ им. Ф.Скорины,2007.-184 с.
4. Создание web-сайтов. Самоучитель/ Авт.-сост. В.Н.Петров. – Киев: УМК ВО, 2006. -404с.
5. Создание web-страниц. Самоучитель/ Авт.-сост.В.Н. Печников. – Мн.: «Триумф», 2006. -464с.
6. Интернет – сайтhttp://molotok.ru.