Интернет-аукционы (стр. 2 из 2)

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

Рисунок 4 – цветовое оформление сайта

т.е. <bodybgcolor="#5E0000">

Поэтому верхняя часть сайта была оформлена в данных тонах.

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

Для оформления текста были использованы три вида шрифтов и стилей.

Первый был использован в заголовке

Заголовок был оформлен в виде заголовка первого уровня т.е. тэг <h1> …</h1> с атрибутом align - расположение текста.

Данный шрифт был выбран как наиболее близкий по стилю к изображению цветка на рисунке заголовка.

Второй шрифт был использован при оформлении бегущей строки текста.

Здесь были использованы тэги

<marquee behavior="alternate" scrolldelay="59" style="font-style: italic; margin-left: 5; margin-right: 5">Приветствуемваснанашемсайте!</marquee></font></span><p style="text-align: center">

Третий шрифт был использован при оформлении основного текста.

Это стандартный шрифт TimesNewRoman.

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

Например для выделения гиперссылок был использован шрифт TimesNewRoman, но размер шрифта был взят font-size: 12pt.

Для выделения основного текста также был взят шрифт TimesNewRoman, и размер шрифта также font-size: 12pt.

Это дало возможность подчеркнуть тематику данной страницы.

Для раздела анонс, там где информация дана в рекламном варианте использовался шрифт TimesNewRoman, но размер шрифта был взят 10pt.

Что позволило вместить больше рекламной информации на небольшое пространство.

Так же были использованы такие атрибуты как толщина границы.

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

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

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

3. Контент

Так как данный стиль использует таблицы, то в основной акцент будет сделан на теги:

Таблицы

<table></table>Создает таблицу.

<tr></tr>Определяет строку в таблице.

<td></td>Определяет отдельную ячейку в таблице.

<th></th>Определяет заголовок таблицы (нормальная ячейка с отцентрованным жирным текстом)

Атрибуты таблицы

<table border=#>Задает толщину рамки таблицы.

<table cellspacing=#> Задает расстояние между ячейками таблицы.

<table cellpadding=#>Задает расстояние между содержимым ячейки и ее рамкой.

<table width=#>Устанавливает ширину таблицы в пикселах или процентах от ширины документа.

<tralign=?> или <tdalign=?>Устанавливает выравнивание ячеек в таблице, принимает значения: left, center, или right.

<trvalign=?> или <tdvalign=?>Устанавливает вертикальное выравнивание для ячеек таблицы, принимает значения : top, middle, или bottom.

<td colspan=#>Указывает кол-во столбцев которое объединено в одной ячейке.

(по умолчанию=1)

<td rowspan=#>Указывает кол-во строк которое объединено в одной ячейке. (по умолчанию=1)

<td nowrap>Не позволяет программе просмотра делать перевод строки в ячейке таблицы.

Также будут использованы гиперссылки:

Гиперссылки

<a href="URL"></a>Создает гиперссылку на другие документы или часть текущего документа.

<ahref="mailto:EMAIL">

</a>Создает гиперссылку вызова почтовой программы для написания письма автору документа.

<a name="NAME"></a>Отмечает часть текста как цель для гипперссылок в документе.

<a href="#NAME"></a>Создает гиперссылку на часть текущего документа.

Тег <P> и необязательный парный ему </P>

Тег <P> создает новый параграф. Два или более тега <P>, идущих подряд, заменяются одним

Параметры

align

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

left - выравнивание по левому краю. По умолчанию,

right - выравнивание по правому краю,

center выравнивание по центру,

justify - выравнивание по ширине.

title всплывающая подсказка

Теги <H1>, <H2>, <H3>, <H4>, <H5>, <H6>

Тег <Hx> служит для создания заголовка. Всего существует 6 видов заголовков - от H1 до H6. Тегу H1 соответствует самый большой заголовок, тегу H6 - самый маленький. Закрывающий тег требуется

Атрибуты

align

Выравнивает заголовок в соответствии со следующими значениями:

left - выравнивание по левому краю. По умолчанию,

right - выравнивание по правому краю,

center выравнивание по центру,

title всплывающая подсказка

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

Тэг meta имеет два основных атрибута: name (имя) и content (содержание):

<meta

Значением атрибута name может быть любая символьная строка без пробелов. Выполнение последнего условия обязательно. Следовательно, является корректной записью, а name" ошибочна.

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

<head>

<title>А           у            

к</title>

</head>

Заключение

В заключении можно сказать что в настоящее время дизайнерская разработка сайтов является очень востребованной в мире.

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

Еще недавно разработкой сайтов занималась целая группа программистов в которой каждому участнику давалось задание на разработку определенного участка в определенной программе.

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

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

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

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

В данной работе для создания логотипов и баннеров были использованы графические редакторы Adobe Photoshop 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.