Добавлен: 03.07.2023
Просмотров: 123
Скачиваний: 4
СОДЕРЖАНИЕ
1. Эффективность web-сайта в развитии компании
2.1 Разработка концепции сайта
2.3 Этап программирования сайта
3. Средства создания web-сайтов
3.3 CMS (Content Management System)
4 Создание web-сайта агентства по организации праздников "Fiesta" с помощью языка html
4.1 Определение структуры web-сайта
4.2 Представление текста на Web-страницах
4.3. Представление графики на Web-страницах
Два комплекта шрифтов. При разработке Web-страницы средствами базового HTML есть два комплекта шрифтов; пропорциональный и шрифт фиксированной ширины. Проблема заключается лишь в том, что неизвестно, какой из них и какого размера будет использован при отображении.
Пропорциональный шрифт – иначе "шрифт переменной ширины" для каждого символа выделяет разное количество места в зависимости от его начертания. Например, в пропорциональном шрифте заглавная "W" занимает больше места в строке по горизонтали, чем прописная "I". Такие гаринитуры, как: Times, Helvetica и Arial являются примерами пропорциональных шрифтов.
Web-браузеры для большинства текстов на Web-странице, включая основной текст, заголовки, списки, цитаты и т. д., используют пропорциональные шрифты. Как правило, большие отрывки основного текста удобнее читать, когда они напечатаны пропорциональными шрифтами. Поскольку большинство пользователей не имеют времени заменить шрифты, установленные по умолчанию, с большой вероятностью можно предположить, что текст на вашей странице будет отображен шрифтом Times размером 10 или 12 пунктов (по умолчанию в Netscape) или Helvetica (по умолчанию в Microsoft Internet Explorer). Но это всего лишь общее правило.
Шрифт с фиксированной шириной предоставляет одинаковое место для всех символов шрифта. Заглавная "W" занимает не больше места, чем прописная "I". Примерами шрифтов фиксированной ширины являются гарнитуры Courier и Monaco. В Web-браузерах шрифты фиксированной ширины используются для отображения любого текста внутри следующих HTML-тегов: <рге>, <tt>, <code>, <kbd>,<samp>, <хтр>.
Поскольку многие люди не меняют настройку шрифтов, установленную по умолчанию, текст, находящийся в указанных тегах, будет выведен одним из шрифтов типа Courier.
Размер шрифта. Обычно размер шрифта определяется в пунктах (72 пункта (пт) = 1 дюйм высоты шрифта) но, к сожалению, эти размеры не достаточно точно переводятся между платформами. Отчасти это происходит потому, что их операционные системы управляют дисплеями с различными разрешениями.
4.3. Представление графики на Web-страницах
На данный момент почти все изображения в Web, представлены в двух форматах: GIF и JPEG. Третий соперник, заслуживающий упоминания, формат PNG, борется за поддержку и внимание браузеров. Далее – краткий обзор "большой тройки" онлайновых графических форматов. Более подробная информация представлена в главах, посвященных каждому из форматов.
GIF. GIF – Grafic Interchange Format можно назвать традиционным форматом файлов Web. Он был первым форматом файлов, который поддерживался Web-браузерами, и по сей день продолжает оставаться основным графическим форматом Web.
Его свойства состоят в следующем:
– поддерживает не более 256 цветов (меньше можно и часто нужно);
– использует палитру цветов;
– использует сжатие без потери информации по методу LZW (который подобен применяемому в архиваторе PKZIP, и, следовательно, GIF-файлы в дальнейшем практически не сжимаются);
– поддерживает чересстрочную развертку;
– является поточным форматом, т.е. показ картинки начинается во время перекачки;
– позволяет назначить одному из цветов в палитре атрибут прозрачный, что применяется при создании так называемых прозрачных GIFов;
– имеет возможность сохранения в одном файле нескольких изображений, что находит свое применение при изготовлении анимированных GIFов;
– поддерживает возможность вставки в файл управляющих блоков, которые позволяют вставлять комментарии в файл (например, об авторских правах), осуществлять задержку между показами изображений и т.д.
А теперь немножко разъяснений – к чему эти свойства могут привести. Как мы написали, GIF поддерживает не больше 256 цветов, а это значит, что все изображения, которые мы сохраняем в GIF-формате, явно или неявно уменьшают количество цветов, чтобы уложиться в этот лимит (разные программы с разным успехом). А отсюда вывод – если у взять красивую фотографию с плавными переходами и едва уловимыми оттенками цвета, то после преобразования все будет гораздо хуже – оттенки перестанут быть неуловимыми, и вся фотография приобретет неестественный, нереалистичный вид. Поэтому, если надо все-таки сохранить фотографию в формате GIF и передать все оттенки, то приходится идти на хитрости. Например, к фотографии можно применить какой-нибудь художественный фильтр и превратить ее в рисунок или применить тонирование. Зато нет никаких проблем с сохранением рисунков и чертежей в этом формате, они, как правило, хорошо сжимаются и не содержат много цветов.
JPEG. Вторым наиболее популярным графическим форматом в Web является JPEG – Joint Photographic Experts Group. Он содержит 24-разрядную информацию о цвете. Это 16,77 млн цветов в отличие от 256 цветов формата GIF. В JPEG используется так называемое сжатие с потерями. Это означает, что некоторая информация об изображениях в процессе сжатия отбрасывается, но в большинстве случаев ухудшение качества изображения не наносит вреда и часто даже не заметно.
Фотографии или любые изображения с плавными градациями цветов лучше всего сохранять в JPEG-формате, потому что он предлагает более высокое качество изображений, умещающихся в файл меньшего объема. Тем не менее, JPEG не является лучшим решением для графических изображений с одноцветными областями, поскольку этот формат имеет тенденцию испещрять цвета крапинками и конечный файл, как правило, будет несколько больше, чем GIF-файл для того же изображения.
PNG. Есть еще третий графический формат, конкурирующий за постоянное использование в Web. Это формат PNG – Portable Network Graphic, который, несмотря на некоторые достоинства, с 1994 г. находится более или менее в тени. Только недавно браузеры начали поддерживать PNG как встроенную графику, но PNG имеет все шансы стать очень популярным форматом в Web. Именно поэтому он включен здесь в "большую тройку". PNG может поддерживать 8-разрядные индексированные цвета, 16-разрядные полутона или 24-разрядные полноцветные изображения, используя схему сжатия без потерь. Это обеспечивает более высокое качество изображений, а иногда и меньший объем файлов по сравнению с форматом GIF. Кроме того, файлы PNG имеют некоторые замечательные функции, например, встроенное управление коэффициентом гамма, и изменяемые уровни прозрачности (это позволяет показывать рисунок фона сквозь отбрасываемые мягкие тени).
Размер файла. Без сомнения, именно графика сделала Web таким, каким мы его видим сегодня, но как дизайнер вы должны знать, что многие пользователи испытывают к графике в Web чувство на грани любви и ненависти. Не стоит забывать, что графика увеличивает время, необходимое Web-странице для передачи по сети; большой объем графики означает существенное время загрузки, которое испытывает терпение читателя, особенно если он дозванивается с использованием стандартного модемного соединения.
В этом отношении для Web-дизайнера существует единственное наиболее важное правило: размер файла графического изображения должен быть минимально возможным! Создание изображений, предназначенных для передачи по сети, возлагает ответственность на разработчиков серьезно относиться к проблеме времени загрузки.
4.3. Создание и заполение сайта
Многие Web-мастера не тратят время на то, чтобы продумать информационный поток, а ограничиваются только размещением текста и изображений на странице. Хотя на многих сайтах вы можете встретить хвастливые уверения, что у них гораздо больше посетителей, чем у конкурентов, однако это не самый лучший индикатор качества исполнения. Лучшим показателем является время: если пользователи остаются на вашем сайте достаточно долго для того, чтобы пройти по разным его уровням и разделам, то вы вправе быть уверенными в хорошо выполненной работе. Согласно задания был разработан сайт,программный код страниц сайта представлено в Приложении 1. Разработанные страницы ресурса представлены ниже на рисунках.
Страница « О нас»
Рисунок 1- Страница " О нас"
Страница «Услуги»
Рисунок 2-Страница "Услуги"
Страница «Организация праздников»
Рисунок 3- Страница "Организация праздников"
Страница «Наши партнеры»
Рисунок 4-Страница "Наши партнеры"
Страница «Сотрудники агентства»
Рисунок 5-Страница "Сотрудники агентства"
Заключение
В результате выполнения курсовой работы был создан web-сайт для праздничного агентства "Fiesta".
Выполнены все поставленные задачи, а именно:
- Рассмотрена эффективность web-сайта в развитии компании;
- выявлены основные этапы проектирования web - сайта;
- сайт разработан с помощью языка HTML;
Созданный сайта позволит расширить базу потенциальных клиентов и партнеров, увеличить объем продаж, повысить узнаваемость компании.
Web - сайт - это прежде всего информационное представительство компании в сети. Интернет работает 24 часа в сутки. В течение этого времени с вашим бизнесом могут ознакомиться десятки потенциальных клиентов, причем без вашего непосредственного участия.
Страница «Сотрудники»
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Праздничное агенство</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<style type="text/css">
<!--
.style1 {
font-weight: bold;
font-style: italic;
}
.style2 {font-family:"Courier New", Courier, monospace; color:#339937;}
.style7 {
color: #FFFF00;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.style10 {color: #FFFF00;}
.style18 {color: #6633FF;}
-->
</style>
<link rel="stylesheet" type="text/css" href="stil.css"/></HEAD>
<BODY leftMargin=0 topMargin=0>
<DIV align=center><span class="style18"></span>
<TABLE class=border cellSpacing=0 cellPadding=0 width=100% border=0>
<DIV align=center class="style1">
<p class="style2"><marquee behavior="scroll">
FIESTA
Праздничное агенство</marquee></span></h1></DIV></TD></TR></TBODY></TABLE>
<TABLE cellSpacing=0 cellPadding=0 width=100% border=2>
<TBODY><TR><TD width="15%" height="517" vAlign=top >
<TABLE width="100%" height="320" border=0 cellPadding=2 cellSpacing=0>
<TBODY><TR align=middle>
<TD width="100%" height=15><h2>Меню сайта</h2></TD>
</TR>
<TR align=middle>
<TD width="100%" bgColor=#A7B1EF class=style7 onMouseOver="bgColor='#ffffff'" onMouseOut="bgColor='#A7B1EF'"><a href="index.html" class="style10">На главную</a></TD>
</TR>
<TR align=middle>
<TD width="100%" bgColor=#A7B1EF class=style10 onMouseOver="bgColor='#ffffff'" onMouseOut="bgColor='#A7B1EF'"><strong><a href="whatis.html" class="style10">О нас</a></strong></TD>
</TR>
<TR align=middle>
<TD width="100%" bgColor=#A7B1EF class=style10 onMouseOver="bgColor='#ffffff'"onmouseout="bgColor='#A7B1EF'" style5><strong><a href="typesofsniffs.html" class="style10">Услуги</a></strong></TD>
</TR>
<TR align=middle>
<TD width="100%" bgColor=#A7B1EF class=style10 onMouseOver="bgColor='#ffffff'"
onmouseout="bgColor='#A7B1EF'"><strong><a href="structure.html" class="style10"><strong>Организация праздников</a></strong></a></strong></TD>
</TR>
<TR align=middle>
<TD bgColor=#A7B1EF class=style10 onMouseOver="bgColor='#ffffff'"
onmouseout="bgColor='#A7B1EF'"><strong><a href="pr.html" class="style10">Наши партнеры</a></strong></TD>
</TR>
<TR align=middle>
<TD bgColor=#A7B1EF class=style10 onMouseOver="bgColor='#ffffff'"
onmouseout="bgColor='#A7B1EF'"><strong><a href="soft.html" class="style10">Сотрудники агенства</a></strong></TD>
</TR>
</TBODY></TABLE>
<TABLE cellSpacing=0 cellPadding=2 width="100%" border=0>
<TBODY>
<TR align=middle>
<TD width="100%"
bgColor=#A7B1EF height=23><img src="64558.gif" width="150" height="124"></TD>
</TR> <TR align=middle>
<TD class=style7
width="100%" bgColor=#A7B1EF>Полезные ссылки:</TD>
</TR>
<TR align=middle>
<TD class=style7 onMouseOver="bgColor='#ffffff'"
onmouseout="bgColor='#A7B1EF'" width="100%" bgColor=#A7B1EF><strong><a href="https://www.mos.ru/" class="style7">Новости города</a> </strong></TD>
</TR>
<TR align=middle>
<TD class=style7 onMouseOver="bgColor='#ffffff'"
onmouseout="bgColor='#A7B1EF'" width="100%" bgColor=#A7B1EF><strong><a href="https://www.tripadvisor.ru/Restaurants-g298484-Moscow_Central_Russia.html/" class="style7">Рестораны и кафе</a></strong></TD>
</TR>
<TR align=middle>
<TD class=style7 width="100%" bgColor=#A7B1EF><p><embed src="sound/1.mid" width="100%" height="15" autostart="true"></embed></p></TD></TR>
</TR>
</TBODY></TABLE>
<TABLE cellSpacing=0 cellPadding=2 width="100%" border=0>
</TABLE>
<TABLE cellSpacing=0 cellPadding=2 width="100%" border=0>
</TABLE></TD>
<TD width="71%" align=middle vAlign=top>
<TABLE cellSpacing=0 cellPadding=0 width="97%" border=0>
<TBODY>
<TR valign="top">
<TD height="45" align=left ><div align="center" class="style10" style="font-size:24px"> <a > <blink>
Сотрудники </blink> </a> </div>
</TD></TR>
<TR>
<TD height="242" align=left valign="top" ><div align="center" class="style10" style="font-size:14px">
<p style="text-align:center"><a ><img src="HttpAnalyzerFullV2.gif" width="320"></a> </p>