Разработка сайта магазина продуктов питания с интерактивной витриной, прайсом и возможностью выбора товара

Курсовой проект - Компьютеры, программирование

Другие курсовые по предмету Компьютеры, программирование

ов без необходимости выхода в интернете.

В своей работе я использовал:

1.HTML- язык разметки гипертекстов, предназначенный для создания форматированного текста, насыщенного изображениями, звуком, анимацией, видеоклипами и гипертекстовыми ссылками на другие документы;

2.PHP- скриптовый язык программирования общего назначения, интенсивно применяемый для разработки веб-приложений. В настоящее время является одним из лидеров среди языков программирования, применяющихся для создания динамических веб-сайтов;

3.CSS - формальный язык описания внешнего вида документа, написанного с использованием языка разметки.;

SQL - универсальный компьютерный язык, применяемый для создания, модификации и управления данными в реляционных базах данных.

 

2.2 Дизайн сайта

 

Веб-дизайн - вид графического дизайна, направленный на разработку и оформление объектов информационной среды интернета, призванный обеспечить им высокие потребительские свойства и эстетические качества.

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

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

HTML (HyperText Markup Language - язык разметки гипертекста) - это стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML Язык HTML интерпретируется браузерами и отображается в виде документа, в удобной для человека форме.(Cascading Style Sheets - каскадные таблицы стилей) - формальный язык описания внешнего вида документа, написанного с использованием языка разметки.

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

Более того, можно сохранить описание стиля не в тексте вашей странички, а в отдельном файле - это позволит использовать описание стиля на любом количестве Web-страниц.

Вот часть кода, относящася к оформлению сайта.

body {: #fff url(images/bg.jpg) repeat-x;family: Verdana, Arial, Helvetica, sans-serif;size: 11px;height: 18px;: #333333;;

}{ border: none; }{ color: #26478A; text-decoration: none; }:hover { text-decoration: underline; color : #000; }

#wrap {: 0 auto;: 800px;

}

#header {: 60px;: #26478A url(images/header.jpg) no-repeat;

}

#header h1 {size: 26px;weight: 100;spacing: -3px;: 12px 0 5px 10px;

}

#header h1 a {: #fff;decoration: none;

}

#header h1 a:hover {: #eee;-decoration: none;

}

Вот пример того,что получилось

 

 

Рис. 1. Пример

 

2.3 Структуры сайта

 

Структура сайта - совокупность электронных документов (файлов) в компьютерной сети, объединённых под одним адресом.

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

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

Созданный мною сайт состоит из следующих разделов:

)Главная страница (Рис. 2)

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

 

Рис.2. Главная страница

 

Вот часть кода главной страницы:

">

">

">

За обедом ешь мало, а за ужином еще меньше, ибо здоровье всего тела куется в кузнице нашего желудка.

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

)Продукты (Рис. 3)

Здесь посетителям предоставляется полный список продукции, находящейся в данный момент в магазине.

 

 

 

Рис.3. Продукты

 

Из этого же раздела, если посетитель сайта пожелает, можно, щёлкнув по заинтересовавшему продукту, перейти на следующую страницу, где будет предоставлена полная информация о товаре (Рис. 4)

 

Рис.4. Выбор из списка продуктов

 

Если посетитель решил заказать товар, то прямо отсюда он попадает на страницу заказа (Рис.5)

 

 

Рис.5. Страница заказа

 

)Доставка (Рис. 6)

Если вы решили заказать продукт на дом, то этот раздел для Вас.

Здесь отображены условия доставки товара и условия оплаты, с которыми необходимо ознакомиться.

 

Рис.6. Доставка

 

 

4)Контакты (Рис. 7)

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

 

Рис.7. Контак