Сайт свадебного салона "Елена"
Структура сайта, выполненного при помощи HTML-кода и CSS-таблиц. Создание базы данных. Описание главной страницы. Форма для оформления заказа. Скрипт, выводящий дату и день недели. Проектирование CSS-документа (файла) для оформления страниц сайта.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | курсовая работа |
| Язык | русский |
| Дата добавления | 30.12.2013 |
| Размер файла | 570,7 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Размещено на http://www.allbest.ru
Размещено на http://www.allbest.ru
Содержание
Введение
Описание сайта
Структура сайта
Карта сайта
Структура базы данных
Описание главной страницы
Формы
Скрипт
CSS-документ
Заключение
Список литературы
Введение
В данной курсовой работе был разработан сайт свадебного салона «Елена».
Сайт представляет посетителям исчерпывающую информацию о подготовке, организации свадьбы, о свадебных услугах.
При разработке сайта были использованы такие языки программирования, как HTML, PHP, JAVASCRIPT, а база данных связана посредством MySQL.
Описание сайта
Главной целью данного сайта, является помощь женихам и невестам в проведении и организации свадеб и торжеств.
На этом сайте все желающие могут просматривать имеющуюся информацию и заказать себе каталог услуг.
Невеста может выбрать платье, аксессуары, прическу, макияж, маникюр, жених - костюм и прочее необходимое. А также, молодые могут выбрать для себя церемонию проведения свадьбы, просмотрев для этого информацию о предоставляемых услугах по организации бракосочетания.
Структура сайта
Сайт выполнен при помощи HTML-кода и CSS-таблицы.
Структура сайта основана на таблицах, что позволяет создавать такие эффекты, как верстка в несколько колонок, применение эффектов состыковки картинки и фона, тонкие линии на всю ширину или высоту странички.
Основные разделы данного сайта:
Платья
Прически
Макияж
Маникюр
Прокат лимузинов
Фото и видеосъёмка
Организация праздника
Оформление заказа
Контакты
Пользователь может любой момент вернуться или перейти на нужную ему страницу.
На первых 4 страницах, пользователи могут просмотреть фотографии и ознакомиться с ценами салона.
На 5 странице можно заказать свадебный кортеж для разного количества приглашенных гостей.
На следующей странице, пользователи могут ознакомиться с информации о предоставлении фото и видеосъёмки.
На странице по организации праздника, можно просмотреть перечень всех предоставляемых услуг.
Следующая страница позволяет пользователям сделать свой заказ на выбранные им услуги, оставив свои личные данные.
А также, получив дополнительную информацию можно на странице «Контакты».
Данный сайт включает в себя 32 страницы, 29 графических изображений, 1 база данных, 1 форма, 1 обработчик форм, 1 скрипт,1 css.
Карта сайта
Платья
Прически
Макияж
Маникюр
Прокат лимузинов
Стоимость проката
Фото и видеосъёмка
Фотосъёмка
Видеосъёмка
Организация праздника
Оформление заказа
Контакты
Структура базы данных
Для регистрации занесённых данных, была создана база данных «zakaz», которая включает в себя одну таблицу «zakaz».
В таблице находятся:
Фамилия
Имя
Отчество
Контактный телефон
Электронная почта
Адрес
Перечень услуг
Дата заказа
Полями таблицы являются: “familaja”,”imja”,”otchestvo”,”telefon”,”poshta”,”adress”,”uslugi”,”data”.
Данные поля служат для внесения и регистрации данных пользователей.
Поля имеют символьный тип - VARCHAR и ограничения в символах разной длины.
|
Название |
Тип |
Длина |
|
|
familija |
varchar |
20 |
|
|
imja |
varchar |
15 |
|
|
otchestvo |
varchar |
20 |
|
|
telefon |
varchar |
15 |
|
|
poshta |
varchar |
20 |
|
|
adress |
varchar |
50 |
|
|
uslugi |
varchar |
100 |
|
|
data |
varchar |
10 |
Таб.1 база данных “zakaz”
Описание главной страницы
<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/REC-html4/loose.dtd">
<html>
<head>
<meta http-equive="Content-Type" content="text/html"; Charset=windows-1251">
<title>Свадебный салон "Елена"</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body >
<table border="1px" cellpadding="25px" cellspacing="0px" width="50%" align="center">
<tr>
<td colspan="3" bgcolor="#FF3E96"><img src="images/sdaybagtn23.gif" align="center">
<p class="h1">Свадебный салон "Елена"</p>
</td>
</tr>
<tr>
<td valign="top"bgcolor="#651b5a"><img src="images/uslugi.png">
<p class="h7"><img src="images/menu.gif" align="left">
<a href="1.html">Платья</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="2.html">Прически</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="3.html">Макияж</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="4.html">Маникюр</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="5.html">Прокат лимузинов</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="6.html">Фото и видеосъёмка</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="7.html">Организация праздника</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="9.html">Оформить заказ</p>
<p class="h7"><img src="images/menu.gif" align="left">
<a href="8.html">Контакты</p>
</td>
<td align="center"><img src="images/xcvh.jpg" width=350 height=500 >
</td>
<td valign="top" bgcolor="#651b5a"><img src="images/onas.png"> <p class="h2" align="center">Дорогие невесты!!!</p>
<p class="h2">Свадебный салон «Елена» рад приветствовать Вас и от всей души поздравляет с наступлением самого замечательного периода в Вашей жизни - началом Свадебного переполоха!</p>
<p class="h2">Свадьба - это один из самых ярких и запоминающихся моментов в жизни, поэтому внешний вид ее непосредственных участников
должен соответствовать масштабу этого грандиозного события.</p>
<p class="h2">Будьте уверены, что у нас Вы сможете найти именно то, что так давно искали: шикарные и сногсшибательные свадебные модели очень высокого качества от самых разных производителей европейского масштаба, а также аксессуары для окончательного завершения Вашего неотразимого образа.</p>
</td>
</tr>
<tr>
<td colspan="3" bgcolor="#FF3E96"><marquee><font color="#FFFAFA" size="6px" wight="25%" ><i><b>Спасибо, что воспользовались нашими услугами!!!
</i></b></font></marquee>
<p class="h2">Адрес:Новосибирск, ул.Ленина,55
</p>
<p class="h2">Телефон: +7(383) 45-23-00, +7-923-177-00-55</p>
<p class="h2">Электронная почта:salon_elena@yandex.ru</p>
<script language="JavaScript" type="text/javascript">
var d = new Date();
var day=new Array("Понедельник","Вторник",
"Среда","Четверг","Пятница","Суббота","Воскресенье");
var month=new Array("Января","Февраля","Марта","Апреля","Мая","Июня",
"Июля","Августа","Сентября","Октября","Ноября","Декабря");
document.write(day[d.getDay()]+" " +d.getDate()+" " +month[d.getMonth()]
+" " +d.getFullYear()+"г.");
</script>
</td>
</tr>
</table>
</body>
</html>
Формы и обработчики форм
Для ввода данных пользователя, используется форма, которая расположена на странице “Оформление заказа”. Данная форма предназначена для занесения данных в базу.
Рис.2 форма для оформления заказа
В форме 8 основных полей и кнопка для регистрации.
Код формы:
<form action="zakaz.php" method="post" align="Center">//вызов обработчика форм для её обработки
<p class="h2">Данные контактного лица<br>
</p>
<p class="h9">
Фамилия:<br>
<input type="text" size="30" name="fam"><br>
Имя:<br>
<input type="text" size="30" name="im"><br>
Отчество:<br>
<input type="text" size="30" name="otch"><br>
Контактный телефон:<br>
<input type="text" size="30" name="tel"><br>
Электронная почта:<br>
<input type="text" size="30" name="posh"><br>
Адрес:<br>
<input type="text" size="50" name="adr"><br>
Перечень услуг:<br>
<input type="text" size="50" name="usl"><br>
Дата заказа:<br>
<input type="text" size="10" name="dat"><br>
</p>
<input type="submit" name="nam" value="Зарегистрировать">
</form>
Код обработчика:
<?
$link = mysql_connect("localhost", "root","")
or die("Could not connect: " . mysql_error());
print ("Ваша заявка принята");//Выбираем базу данных для работы
mysql_select_db('zakaz');// устанавливает текущую активную БД на сервере
$table_name="zakaz";
$fam=$_POST['fam'];
$im=$_POST['im'];
$adr=$_POST['adr'];
$tel=$_POST['tel'];
$otch=$_POST['otch'];
$posh=$_POST['posh'];
$usl=$_POST['usl'];
$dat=$_POST['dat'];
$sql = "INSERT into zakaz (familija,imja,otchestvo,telefon,poshta,adress,uslugi,data) values
('$fam','$im','$otch','$tel','$posh','$adr','$usl','$dat')"; // создаем SQL запрос
$q = mysql_query($sql); // отправляем запрос на сервер
?>
Скрипт
При создании сайта был написан скрипт, с помощью JavaScript, выводящий дату и день недели.
<script language="JavaScript" type="text/javascript"> //определяет язык программирования и тип содержимого текста
var d = new Date();// узнаем день недели
var day=new Array("Понедельник","Вторник",
"Среда","Четверг","Пятница","Суббота","Воскресенье");// массив названий дней недели
var month=new Array("Января","Февраля","Марта","Апреля","Мая","Июня",
"Июля","Августа","Сентября","Октября","Ноября","Декабря");
document.write(day[d.getDay()]+" " +d.getDate()+" " +month[d.getMonth()]
+" " +d.getFullYear()+"г.");// печать даты, определённой последовательности вывода
</script>
CSS-документ
сайт таблица скрипт
CSS-файл предназначен для оформления страниц сайта. Ссылки на css-файл содержаться на всех страницах сайта.
Код:
BODY{
background:url("images/uuuu.jpeg");}
// Отображение для тела всех страниц
.h1 {
font-size:72px;
text-align:center;
color:#FFFAFA;
font-family:Monotype Corsiva;
}
.h2 {
font-size:20px;
text-align:center;
color:#FFFAFA;
font-family:Monotype Corsiva;
}
.h4 {
font-size:24px;
text-align:left;
color:#008B00;
font-family:Monotype Corsiva;
}
.h7 {
font-size:24px;
text-align:left;
color:#FF3E96;
font-family:Monotype Corsiva;
}
.h8 {
font-size:20px;
text-align:left;
color:#FFFAFA;
font-family:Monotype Corsiva;
}
.h9 {
font-size:24px;
color:#651b5a;
font-family:Monotype Corsiva;
} a:link{
color:#FF3E96;
text-decoration:none;} // Ссылки на страницах
a:visited{
color:#FF3E96;
text-decoration:none;}// Посещенные ссылки
a:active{
color:#FF3E96;
text-decoration:none;}// Активные ссылки
a:hover{
color:#FF3E96;
text-decoration:none;}// Ссылки при наведении курсора
Заключение
В процессе выполнения работы был разработан сайт свадебного салона “Елена”.
При создании были изучены такие языки программирования, как PHP и JAVASCRIPT. А также, главным инструментом для написания - язык HTML и CSS.
Список литературы
Жаров А. В. Лекционный материал.
Ломов А. HTML, CSS, скрипты: практика создания сайтов. - М.: Москва, 2006. - 204с.
Э. Кастро HTML и CSS для создания Web-страниц. - М.: Центр, 2008. - 326с.
Размещено на Allbest.ru
Подобные документы
Физическая структура сайта. Шаблон оформления страницы. Исходный текст шаблона главной HTML-страницы (верстка с использованием фреймов). Фрагмент кода, содержащий карту сайта. Каскадные таблицы стилей. Программное обеспечение, использованное при работе.
курсовая работа [1,3 M], добавлен 02.07.2014Концептуальное проектирование сайта по онлайн-продаже кофе, его древовидная логическая структура страниц. Описание языка гипертекстовой разметки сайта HTML, особенности отображения HTML-тегов в браузерах. Создание формы заказа для онлайн-торговли.
курсовая работа [2,2 M], добавлен 16.04.2017Работа с HTML-редактором Adobe Dreamweaver. Этапы и правила построения заглавной страницы сайта, форматирования HTML-страниц, создания гипертекстовых ссылок, создания и форматирования таблиц. Использование графических материалов при разработке сайта.
методичка [1,9 M], добавлен 06.07.2011Понятие интеллектуального пространства, объекты изучения в онтологии. Разработка Web-сайта на тему "Онтологии в информатике". Описание логической и физической структуры сайта, шаблон дизайна его страниц, тестирование. Исходный текст шаблона html-страницы.
курсовая работа [4,7 M], добавлен 14.07.2012Технологии создания web-страниц. Появление Active Server Pages. Разработка динамического web-сайта на asp.net. Создание дизайна и каркаса сайта с использованием стандартных HTML таблиц. Проектирование базы данных на основе ado.net и подключение к ней.
контрольная работа [2,4 M], добавлен 24.05.2019Преимущества языка PHP и структура базы данных. Схема алгоритма и внешний вид главной страницы и страниц сайта, страницы с независимым рейтингом. Анализ типичных ошибок в программах. Расчёт себестоимости и трудоёмкости решаемой задачи, листинг программы.
дипломная работа [4,1 M], добавлен 22.07.2015Создание основы интернет-сайта - набора таблиц, которые расположены в нужном порядке. Использованные теги и их атрибуты. Кодовое оформление сайта, наложение второго слоя. Стильный текст в HTML. Использование скриптов для большей информативности сайта.
методичка [813,6 K], добавлен 08.11.2013Язык разметки гипертекстовых страниц HTML. Обеспечение доступности Web-страницы, представление текста и графики. Основные правила и этапы создания сайта, выбор структуры страницы. Оценка экономической целесообразности использования HTML-редакторов.
дипломная работа [86,7 K], добавлен 25.03.2013Практическая значимость создания сайта. Язык программирования JavaScript. Основные области использования языка JavaScript при создании интерактивных HTML-страниц. Язык программирования PHP. Программная основа сайта. Создание оформления дизайна сайта.
дипломная работа [1,1 M], добавлен 05.03.2013Рассмотрение визуального HTML-редактор Dreamweaver. Определение структуры сайта ООО "Фаст Студия". Содержание страниц "Главная", "Портфолио", "Контакты". Теги форматирования текста и способы его оформления с использованием подключаемых таблиц CSS.
курсовая работа [1,4 M], добавлен 18.08.2013
