Принципы разработки web-сайтов (на примере ЗАО "Кондитерская фабрика "Саратовская")

 

Принципы разработки web-сайтов (на примере ЗАО "Кондитерская фабрика "Саратовская")

Содержание

web сайт разработка контент

ВВЕДЕНИЕ

Глава 1. Современные тенденции разработки web-сайта

1.1 Интернет в современном обществе

.2 Сайт как средство развития бизнеса

.3 Классификация современных web-сайтов

.4 Виды структурной организации web-сайтов

.5 Юзабилити web-сайта

Глава 2. Технологии, применяемые при разработке web-сайтов

2.1 Модель "Клиент-сервер"

.2 Технологии, работающие на стороне клиента

.3 Технологии, работающие на стороне сервера

.4 Медиаресурсы. Платформа Flash

.5 Системы управления контентом (CMS)

Глава 3. Разработка web-сайта для ЗАО «Кондитерская фабрика «Саратовская»

.1 Общая информация о ЗАО «Кондитерская фабрика «Саратовская»

.2 Структура информации и навигации по сайту

.3 Разработка интерфейса и дизайна сайта

.4 Информационные технологии, использованные при создании сайта

.5 Разработка администраторской части web-сайта

ЗАКЛЮЧЕНИЕ

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

Введение

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

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

В связи с актуальностью проблематики, связанной с разработкой и созданием web-сайтов, и была выбрана тема дипломной работы. Целью данной работы стало изучение web-дизайна и web-технологий как мультидисциплинарной области деятельности и применение полученных знаний на практике, при разработке web-сайта для производственного предприятия ЗАО «Кондитерская фабрика «Саратовская».

Дипломная работа состоит из трех глав.

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

Во второй главе дипломной работы рассмотрено большинство современных технологий создания web - сайтов. Описываются технологии со стороны клиента, такие как: язык гипертекстовой разметки HTML, каскадные таблицы стилей CSS, динамический язык разметки гипертекста DHTML, JavaScript, ActiveX, язык программирования сценариев просмотра HTML/DHTML страниц VB Script. Языки программирования со стороны сервера такие как: скриптовый язык программирования PHP, созданный для генерации HTML-страниц на веб-сервере и работы с базами данных (MySQL), язык для практического извлечения данных и составления отчетов Perl, высокоуровневый язык программирования общего назначения с акцентом на производительность разработчика и читаемость кода - Python, язык программирования Ruby. Также рассматривается история создания перечисленных языков, сравниваются их достоинства и недостатки.

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

Глава 1. Современные тенденции разработки web-сайта

1.1Интернет в современном обществе

Интернет - это общедоступная глобальная компьютерная сеть, которая делится на множество подсетей связывающих между собой компьютеры, и, имеющая набор стандартных правил - протоколов, с помощью которых пользователь может передавать и получать различную информацию. Родоначальником сети интернет, была созданная в 1969 году в США компьютерная сеть ARPAnet, объединяющая компьютерные центры министерства обороны и ряда академических организаций.

В 2010 году было проведено исследование "Основные тенденции и изменения предпочтений по использованию средств информации в России". Основные задачи исследования - определить тенденции в использовании Интернет, а также выявить новые требования потребителей средств информации. Почти все опрошенные на первое место поставили использование Сети для поиска информации и чтения новостей. Значительное большинство пользователей, независимо от возрастной группы, обмениваются почтовыми сообщениями и общаются в чатах: многие используют эти возможности в работе. Результаты исследования показали, что чем больше времени проводит пользователь в Интернет, тем меньше он использует традиционные источники получения информации. Например, для пользователей, которые тратят еженедельно более 20 часов на Интернет, он является основным источником получения информационных ресурсов. А те, кто заходит в Сеть на час, предпочитают телевидение, радио и газеты.

1.2Сайт как средство развития бизнеса

Сложно переоценить значение сети Интернет для современного бизнеса. В условиях сложной экономической ситуации наличие должным образом организованного Интернет-ресурса (сайта фирмы, корпоративного портала, форума, Интернет-магазина и т.п.) может внести неоценимый вклад в конкурентной борьбе за рынок сбыта и продвижение своих товаров и услуг. С другой стороны, в Сети сейчас очень много сайтов, которые были ранее созданы как дань общей моде - "у всех есть - пусть и у меня будет!", при этом четкого понимания назначения данного бизнес-инструмента на момент создания сайта у владельцев этих ресурсов не было, поэтому они оказались в последствии забытыми и ненужными своим хозяевам, и, как правило, оказывали им скорее отрицательный эффект по причине своей запущенности.

К тому же все еще имеет место отрицательное отношение к сети Интернет у руководителей старшего поколения, которое было вызвано отчасти необходимостью переучиваться новым технологиям и нецелевым использованием сети более молодыми сотрудниками фирм - он-лайн игры, различные социальные порталы по интересам («Одноклассники», «В контакте» и т.п.), которые не только отбирали рабочее время сотрудников, но и потребляли трафик, за который эти фирмы платили. Еще одна из фундаментальных проблем - сложность администрирования сайта: чтобы сделать какие-либо изменения в материалах статичного HTML-сайта, нужно было обращаться к его разработчикам или нанимать соответствующего специалиста, что вело к дополнительным затратам.

Но все изменяется - появились надежные системы управления сайтами CMS, позволяющие легко управлять информационным содержимым ресурсов. В настоящее время телефонные и провайдер-компании начали обновлять свои линии и прокладывать новые (оптоволоконные), устанавливать новые цифровые АТС, что в свою очередь положительно влияет на предоставление Интернет-услуг. Их также подстегивает конкуренция со стороны мобильных операторов и фирм, которые предоставляют доступ к сети через мобильные телефоны и USB-модемы, стоимость и надежность таких каналов становиться все качественнее. Будущее в массовом доступе к ресурсам Интернет будет за беспроводным подключением. Смею предположить, что в скором будущем интернет станет настолько массовым, что без привлечения его возможностей невозможно будет реализовать решение каких-либо бизнес-проектов.

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

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

Собственный корпоративный ресурс - основное средство использование потенциала глобальной сети в интересах организаций. Представительство компании в сети Интернет, открывает перед бизнесом множество преимуществ, не доступных при его отсутствии. Основными из них являются: выход на новые рынки, расширение узнаваемости торговой марки, привлечение дополнительных и повышение качества обслуживания существующих клиентов, автоматизация бизнес-процессов компании. Не существует такой организации, для которой создание сайта не принесло бы пользы. Эффективность Интернет всегда высока и каждая компания, независимо от формы собственности, размеров, сферы деятельности, получит свою выгоду при правильном использовании web-сайта.

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

Разработка web-сайта открывает дополнительные возможности по организации рекламных компаний. Реклама в сети Интернет имеет свои особенности, благодаря чему набирает значительную популярность в мире бизнеса. Основные ее преимущества: возможность работы с любым доступным бюджетом, возможность моментального начала и приостановления показов рекламных объявлений и многое другое.

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

Автоматизация бизнес процессов предприятия. Возможность организации приема заказов через сеть Интернет, автоматической выгрузки актуального ассортимента товаров из учетной системы, формирование отчетности, выписка счет-фактур. Разработка сайтов и создание конкурентных преимуществ всегда идут рука об руку. Это и многое другое становится доступным через web-интерфейс хорошего сайта. Экономия времени персонала и упрощение бизнес процессов - гарантированный результат качественного подхода к разработке сайта компании.

Не стоит упускать из внимания разработку web-сайта, как качественного инструмента торговли. Как показывает опыт, возможно увеличение продаж до 40% при грамотном использовании сети Интернет в своих целях. Сайт может стать отличным ресурсом, привлекающим клиентов, активно распространяющим информацию о компании и обслуживающим посетителей.

1.3Классификация современных web-сайтов

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

Веб-сайт (англ. Website, от web - паутина и site - "место") - в компьютерной сети объединённая под одним адресом совокупность документов частного лица или организации. По умолчанию подразумевается, что веб-сайт располагается в сети Интернет.

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

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

·проектирование;

·дизайн;

·верстка;

·программирование;

·интеграция готовых компонентов;

·наполнение материалами;

·тестирование;

·и продвижение.

Интернет-проекты классифицируются по различным категориям: по степени сложности, наполнению, структуре, назначению и т.д.

Самая широкая классификация делит сайты на домашние, некоммерческие, коммерческие.

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

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

Коммерческие Интернет-проекты организуются с расчетом на получение финансовой прибыли, причем эта прибыль может быть как прямой, так и косвенной. Под косвенной прибылью подразумеваются те неоспоримые преимущества, которые дает грамотно подготовленный web-сайт его владельцам: реклама в Интернете практически бесплатна. Более того, компания-владелец web-ресурса получает в свое распоряжение именно целевую аудиторию, поскольку ее сайт будут посещать те пользователи, которые нашли его по набору ключевых слов, введенных в форму запроса поисковых машин.

Как правило, в зависимости от целей, поставленных перед сайтом, и сложности решаемых задач, коммерческие сайты относят к одной из семи групп: визитка, промо-сайт, корпоративное представительство, информационный сайт, портал, электронный магазин, каталог (сайт-витрина).

Сайт-визитка. Сайт-визитка - обычно состоит из нескольких страниц и имеет уникальный, но простой и функциональный дизайн; идеально подходит для компаний, которые хотят разместить информацию о себе и своих услугах в Интернете; основные разделы сайта: "О компании", "Продукция или услуги", "Прайс-листы", "Контактная информация"; сайт-визитка используется предприятиями, организациями и частными лицами.

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

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

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

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

Корпоративный сайт. Корпоративный сайт - сайт компании, знакомящий с предоставляемыми услугами и направлениями деятельности и включающий весь функционал интернет-представительства. Корпоративный информационный web-сайт - необходим для автоматизации внутреннего документооборота, учёта показателей компании, управления персоналом, может быть оснащён функциями обмена информацией между удалёнными филиалами; корпоративный сайт позитивно влияет на репутацию и имидж компании; дизайн должен соответствовать фирменному стилю компании; чаще всего, включает "администраторскую часть" для создания и изменения контента, позволяющую менеджеру или секретарю компании добавлять или менять новости, информационные статьи, справочную и прочую информацию на сайте; используется минимум графики, основной упор идет на текст.

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

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

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

Портал. Интернет-портал (с англ. Internet portal главный вход, ворота) - крупный сайт, предназначенный для предоставления интегрированной информации. Обычно содержат ссылки на другие сайты, содержание которых отвечает интересам посетителя портала.

Корпоративный портал - портал, созданный для решения задач компании и ориентированный на конкретных пользователей (сотрудники одной компании, партнеры, клиенты, агенты). Такой тип порталов интегрирован в корпоративную информационную систему компании. Портал сегодня является самой наисложнейшей виртуальной бизнес-системой и способен решать самые трудные коммерческие задачи. Он содержит свойства и включает в себя функции различных видов сайтов: визитки, промо-сайта, интернет-магазина, а также корпоративного онлайн-ресурса. По сути, это веб-сайт с многоуровневой структурой и внушительным объемом информации. Иными словами, портал - это ресурс, состоящий из нескольких интернет-представительств и имеющий огромную постоянную аудиторию.

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

Интернет-магазин. Интернет-магазин, он же Сетевой магазин, Электронный магазин, Internet shop, E-shop - интерактивный веб-сайт с каталогом продукции, с помощью которого клиент может оформить заказ нужных ему товаров. Используются различные системы расчётов: от пересылки товаров наложенным платежом или автоматической пересылки счета по факсу до расчётов с помощью пластиковых карт.

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

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

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

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

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

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

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

1.4Виды структурной организации web-сайтов

Зная тип сайта и другую информацию, можно начинать накладывать на него структуру. Существуют две структурные стороны каждого Web-сайта: логическая и физическая структура. Логическая структура описывает документы, которые связаны с другими документами. Она определяет связи между ними. Однако логическое расположение документов в пределах сайта может не иметь отношения к реальному физическому их размещению. Физическая структура описывает, где документ находится в действительности, отражая, например, путь к каталогу документа на Web-сервере или его расположение в базе данных.

Существуют четыре основные логические организационные формы, используемые Web-сайтами: линейная, решетка, иерархия и паутина. Вариации на тему некоторых из схем также являются обычными, как и их сочетания, лежащие в основе более крупных сайтов. Выбор правильной логической организации сайта является важным шагом на пути создания удобного для использования сайта. К примеру, для сайта, ориентированного на online-продажи, более практичной будет линейная форма, при которой слайд 2 следует за слайдом 1. В некотором смысле пользователь почти вынужден просматривать содержимое сайта в том порядке, в каком этого хочет дизайнер. Если представление материала было организовано в другой манере, такой как дерево, то это может подстрекать пользователей осуществлять доступ к слайдам не по порядку и возможно уменьшит влияние, подталкивающее посетителей сайта к осуществлению покупки. В то же время последовательный доступ мало подходит для представления другой информации, такой, к примеру, как вопросы технической поддержки, поэтому принуждая пользователя пробираться через страницы с бесполезной информацией, можно вызвать его крайнее раздражение. Цель выбора наиболее подходящей для содержимого организационной формы состоит в том, чтобы сделать сложное содержимое более понятным.

.4.1 Линейная организация

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

Рисунок 1.1 - Строго линейная организация

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

.4.2 Линейная форма с альтернативами

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

Рисунок 1.2 -Линейная форма с альтернативами

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

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

Рисунок 1.3 - Линейная форма со свободой выбора

.4.3 Линейная организация с боковыми ответвлениями

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

Рисунок 1.4 - Линейная форма с боковыми ответвлениями

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

.4.4 Решетка

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

Рисунок 1.5 - Решетка

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

1.4.5 Иерархия

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

Рисунок 1.6 - Узкая иерархия

Широкое дерево или широкая иерархия основывается на большом количестве вариантов выбора. Ее основной недостаток заключается в том, что она может предлагать слишком много вариантов в виде страниц, имеющих большое количество выходящих с них ссылок.

Рисунок 1.7 - Широкая иерархия

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

Структура стандартного дерева используется очень редко. В стандартном дереве нет перекрестных ссылок, и для достижения других частей дерева часто требуется вернуться назад. Хотя в Web для возврата можно задействовать кнопку "Назад" браузера, на страницы часто добавляются ссылки, чтобы те пользователи, кто попал на страницу не через основной путь, могли перемещаться по сайту.

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

Рисунок 1.8 Запутанные деревья

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

.4.6 Полное связываниесайт, каждая страница которого связана ссылкой с каждой другой страницей этого Web-сайта, может рассматриваться в качестве структуры, называемой полное связывание.

Рисунок 1.9 - Полное связывание

При полном связывании количество ссылок равно числу страниц, помноженному на число страниц минус один. Это означает, что для сайта из пяти страниц количество ссылок будет равно 20. Для сайта из 20 страниц количество ссылок составит 90. Для сайта из 100 страниц - число ссылок составит 9900 (100x99) и для 1000-страничного сайта их число будет в районе одного миллиона! В действительности с точки зрения практичности полное связывание не является хорошим выбором. Если в качестве максимального допустимого количества ссылок на странице принять число девять, то сайт в стиле полного связывания может состоять из десяти страниц. В действительности, большинство сайтов склонны использовать частичное связывание с перекрестными ссылками только на наиболее важные страницы.

.4.7 Смешанные формы

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

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

Рисунок 1.10 - Смешанная иерархия

.4.8 Стиль паутины

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

Рисунок 1.11 - Паутина

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

1.5Юзабилити web-сайта

Юзабилити сайта является всеобъемлющим термином, определяющим комплекс мер, результатом которого является создание удобного и понятного сайта. Термин "юзабилити" можно рассматривать как "конечную суммарную степень удобства, меру интеллектуального усилия, необходимого для получения полезных качеств вещи, и скорость достижения положительного результата при управлении ею".

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

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

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

Особенности поведения пользователей. В принципе, поведение пользователей на веб-сайте не особо отличаются от их поведения в, скажем, магазине. Пользователи мельком окидывают взглядом каждую новую страницу, просматривают отрывки текста и кликают на первую зацепившую их внимание ссылку, или хотя бы отдаленно похожую на ту, которую они искали. На самом деле, на большую часть страницы они даже не смотрят. Многие пользователи ищут что-нибудь интересное (или полезное) и "кликабельное"; как только на глаза попадается подходящий "кандидат", пользователь быстро кликает и переходит по ссылке. Если результат не оправдал его ожиданий, пользователь кликает "назад" и продолжает поиск.

Пользователи высоко ценят качество и правдивость информации. Если страница содержит высококачественный материал, пользователи готовы идти на компромисс с наличием рекламы на странице и её дизайном. Это одна из причин, почему сайты с не совсем хорошим дизайном, но с качественным содержанием получают большой трафик. Содержание намного важнее, чем обрамляющий его дизайн. Анализируя веб-страницу, пользователи ищут фиксированные точки, "якоря", которые будут направлять их по содержимому на странице. Очень простой принцип: если веб-сайт не может оправдать ожиданий пользователей, то дизайн не выполняет свою функцию, а компания теряет деньги. Чем навигация менее интуитивна, тем сильнее желание пользователя покинуть веб-сайт и найти альтернативу.

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

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

В данной главе дипломной работы была рассмотрена роль Интернет в современном обществе, особое внимание было уделено классификации web-сайтов, описаны преимущества создания сайта, роль web-сайта в развитии бизнеса.

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

Глава 2. Технологии, применяемые при разработке web-сайтов

2.1Модель "Клиент-сервер"

Модель «клиент-сервер» - это технология взаимодействия в информационной сети. Сервером сети Интернет называется компьютер, на котором установлена специальная программа (она тоже называется сервером, web-сервером или http-cepвером), которая отображает web-страницы по запросу клиентской машины, а так же выполняет множество других полезных функций. Владелец и администратор сервера могут гибко менять необходимые настройки, разрешать или запрещать доступ к его ресурсам, подключать, настраивать и запускать ряд дополнительных программ и функций, таких как скрипты CGI или приложения SSI, то есть полностью конфигурировать его работу по мере необходимости. Когда домашний компьютер связывается с сервером и получает от него все необходимые данные, например код web-страницы, он выступает в роли "клиента", а всю систему в этом случае принято называть связкой "клиент-сервер".

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

Клиенты - это компьютеры, подключенные к Сети через поставщика услуг Интернета (Internet Service Provider), используют ее, как правило, для поиска и получения информации, работы с электронной почтой.

Программное обеспечение клиентов может включать:

·Браузер или универсальный клиент. Это программа, которая обеспечивает загрузку и отображение Web-страниц. Кроме того, современные версии этого ПО позволяют выполнять небольшие клиентские приложения (скрипты и апплеты), расширяющие возможности обычных Web-страниц, а также осуществлять путешествия в виртуальных мирах.

·Почтовые приложения, работающие с электронной почтой.

·Другие мультимедийные средства, как, например, воспроизведение звуковых и видеороликов.

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

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

Термин клиент/сервер может описывать аппаратное обеспечение и в этом случае означает сетевые серверные и клиентские компьютеры или способ организации программного обеспечения и служб в сети. Вычисления клиент/сервер - мощный метод построения сетевых приложений. Существует две альтернативных модели вычислений:

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

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

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

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

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

·Функции ввода и отображения данных.

·Прикладные функции, характерные для данной предметной области (для банковской системы - открытие счета, перевод денег и т.д.).

·Функции хранения и управления информационно-вычислительными ресурсами (базами данных, файловыми системами и т.д.).

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

В соответствии с этим в любом приложении выделяются следующие логические компоненты: компонент представления (presentation), реализующий функции первой группы; прикладной компонент (business application), поддерживающий функции второй группы; компонент доступа к информационным ресурсам (resource manager), поддерживающий функции третьей группы, а также вводятся и уточняются соглашения о способах их взаимодействия (протокол взаимодействия).

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

На основе выше сказанного можно сделать вывод, что данная технология имеет как достоинства, так и недостатки.

К недостаткам можно отнести:

·дорогое техническое обеспечение;

·дорогие серверные операционные системы и клиентские лицензии; кроме того, часто требуется администратор сети

К достоинствам системы клиент/сервер следует отнести:

·сильную централизованную защиту;

·центральное хранилище файлов;

·возможность совместного использования серверами доступного технического и программного обеспечения;

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

2.2Технологии, работающие на стороне клиента

.2.1 HTML(от англ. Hypertext Markup Language - "язык разметки гипертекста") - это стандартный язык разметки документов во Всемирной паутине. Все веб-страницы создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузером и отображается в виде документа, удобном для человека. HTML является приложением SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879.

Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1991-1992 годах в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов (размечаемых "тегами"), служащих для создания относительно простых, но красиво оформленных документов. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.

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

Язык HTML позволяет размечать текст. В том числе вы можете: сделать текст жирным, курсивным или подчёркнутым; вставить специальные символы (выходящие за рамки ASCII символы пунктуации, математические символы, греческие и готические буквы, стрелки и т.п.); поменять цвет шрифта; выровнять текст по центру, левому/правому краю, по ширине; оформить текст как гиперссылку на другую страницу или файл; нарисовать таблицу.

Позже, когда появилась необходимость интерактивности веб-страниц, в HTML появились формы для введения пользователем данных, которые позднее подвергаются обработке. Формы и другую информацию можно обрабатывать с помощью специальных серверных программ (например, на языках PHP или Perl). Открытие мультимедийных файлов, выводимых как непосредственно браузером (например, изображения в форматах JPEG, GIF или PNG; аудиофайлы и др.), так и внешними приложениями, "встраиваевыми" в окно браузера (Flash-анимация, Java-апплеты и прочее).

.2.2 XHTML(EXtensible HyperText Markup Language, Расширенный язык разметки гипертекста) предназначен для замены HTML и считается его более строгой версией.[15]

Если рассуждать о некотором идеальном коде веб-страницы, то его можно сравнить с программой, которая не будет скомпилирована до тех пор, пока все ошибки не исправлены. Браузер выступает в роли компилятора и не отображает документ, если он не соответствует спецификации. XHTML, сохраняя все особенности HTML, вносит более строгие правила создания страниц, чтобы приблизиться к "идеальному" коду. Это позволяет делать сайты независимыми от устройства отображения и браузера. Иными словами, сайт будет корректно показываться во всех современных браузерах и платформах вроде компьютеров, смартфонов, наладонниках и т.д.

На деле все обстоит не так прозаично. Разработчики браузеров не могут позволить себе, чтобы их детище работало только с "правильным" кодом. А все из-за того, что большая часть сайтов в мире просто не будет отображаться в таком браузере. Виноваты в таком положении вещей и разработчики и пользователи. Первые не обеспечили должную поддержку спецификации в своих браузерах, а вторые не потрудились ей следовать.

2.2.3 DHTML

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

Для достижения перечисленных целей используются следующие методы:

·динамическое изменение атрибутов и стилей элементов, составляющих HTML-документ;

·динамическое извлечение данных из внешних источников и включение их в Веб-страницу;

·использование динамически загружаемых шрифтов;

·поддержка визуальных и мультимедийных эффектов при отображении страниц;

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

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

Преимущества DHTML:

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

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

·Уменьшение трафика. Одна из основных особенностей DHTML состоит в том, что он переносит основную тяжесть по формированию Веб-страниц с сервера на клиента. Платой за это является загрузка с сервера сценариев и программных компонентов, которые при правильном проектировании незначительны по объему.

Динамические страницы загружаются и отображаются намного быстрее статических, что особенно важно для отечественных каналов связи, не страдающих чрезмерно высоким качеством.

Минусы DHTML:

·Dynamic HTML не стандартизован, и под каждый из популярных Веб-обозревателей нужно писать свою версию HTML-документа.

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

.2.4 XML

XML (англ. Extensible Markup Language - расширяемый язык разметки) - рекомендованный Консорциумом Всемирной паутины язык разметки, фактически представляющий собой свод общих синтаксических правил. XML - текстовый формат, предназначенный для хранения структурированных данных (взамен существующих файлов баз данных), для обмена информацией между программами, а также для создания на его основе более специализированных языков разметки. XML является упрощённым подмножеством языка SGML (Standard Generalized Markup Language).

Целью создания XML было обеспечение совместимости при передаче структурированных данных между разными системами обработки информации, особенно при передаче таких данных через Интернет.

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

.2.5 CSS

Впервые идея форматирования HTML-документов с помощью CSS была рекомендована Консорциумом W3C в 1996 году. Эта рекомендация, которая была обновлена в 1998 году, используется web - разработчиками и по сей день. CSS (англ. Cascading Style Sheets - каскадные таблицы стилей) - технология описания внешнего вида документа, написанного языком разметки. Преимущественно используется как средство оформления веб-страниц в формате HTML и XHTML, но может применяться с любыми видами документов в формате XML, включая SVG и XUL.используется создателями веб-страниц для задания цветов, шрифтов, расположения и других аспектов представления документа. Основной целью разработки CSS являлось разделение содержимого (написанного на HTML или другом языке разметки) и представления документа (написанного на CSS). Это разделение может увеличить доступность документа, предоставить большую гибкость и возможность управления его представлением, а также уменьшить сложность и повторяемость в структурном содержимом. Кроме того, CSS позволяет представлять один и тот же документ в различных стилях или методах вывода, таких как экранное представление, печать, чтение голосом.

CSS при отображении страницы может быть взят из различных источников:

·Авторские стили (информация стилей, предоставляемая автором страницы) в виде:

• Внешних таблиц стилей, то есть отдельного файла .css, на который делается ссылка в документе.
• Встроенных стилей - блоков CSS внутри самого HTML-документа.
• Inline-стилей, когда в HTML-документе информация стиля для одного элемента указывается в его атрибуте style.

·Пользовательские стили

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

·Стиль браузера

• Стандартный стиль, используемый браузером по умолчанию для представления элементов.

Стандарт CSS определяет приоритеты, в порядке которых применяются правила стилей, если для какого-то элемента подходят несколько правил одновременно. Это называется "каскадом", в котором для правил рассчитываются приоритеты или "веса", что делает результаты предсказуемыми.

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

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

Преимущества CSS вёрстки:

·Несколько дизайнов страницы для разных устройств просмотра. Например, на экране дизайн будет рассчитан на большую ширину, во время печати меню не будет выводиться, а на КПК и сотовом телефоне меню будет следовать за содержимым.

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

·Простота последующего изменения дизайна. Не нужно править каждую страницу, а лишь изменить CSS-файл.

·Дополнительные возможности оформления. Например, с помощью CSS-вёрстки можно сделать блок текста, который остальной текст будет обтекать (например, для меню) или сделать так, чтобы меню было всегда видно при прокрутке страницы.

2.2.6 Java Script и JQuery- это язык управления сценариями просмотра гипертекстовых страниц Web на стороне клиента. Если быть более точным, то JavaScript - это не только язык программирования на стороне клиента. Liveware, прародитель JavaScript, является средством подстановок на стороне сервера Netscape. Однако, наибольшую популярность JavaScript обеспечило программирование на стороне клиента.

К возможностям JavaScript можно, например, отнести следующее:

·отображать изменяющиеся данные, такие как текущее время или дата;

·программировать переменное содержание в зависимости от даты, браузера пользователя или других условий;

·изменять внешний вид элементов страницы, если пользователь щелкнул мышью или провел курсор мыши над элементом.

Для языка высокого уровня JavaScript обладает довольно сильными возможностями. Он не позволяет работать на уровне машинных кодов, однако пользователь получает доступ ко многим возможностям браузеров, Web-страниц, а иногда и системы, в которой работает браузер. В отличие от Java™ или С, программы на JavaScript обходятся без компиляции, браузеру не нужно загружать виртуальную машину для выполнения программного кода.также работает в объектно-ориентированной архитектуре, напоминающей Java или C++. Такие возможности языка, как конструкторы или наследование на базе прототипов, добавляют в схему разработки новый уровень абстракции, что способствует многократному использованию программного кода.

Одна из главных причин, по которой Web-разработчики приняли JavaScript - возможность выполнения на стороне клиента многих функций, которые ранее выполнялись исключительно на стороне сервера. Кроме того, JavaScript позволяет читать и записывать cookie - ранее эта операция выполнялась исключительно средствами Web-сервера для работы с заголовками.- библиотека JavaScript, фокусирующаяся на взаимодействии JavaScript и HTML. Был опубликован на компьютерной конференции "BarCamp" в Нью-Йорке Джоном Ресигом в 2006 году.

На сайте разработчиков JQuery как лозунг: "JQuery is designed to change the way that you write JavaScript". Если переводить это буквально, то получится примерно следующее: "JQuery разработан, чтобы изменить путь, которым Вы пишете на JavaScript". После применения JQuery в работе, понимаешь - лозунг разработчиков - правда.

JQuery помогает легко получать доступ к любому элементу (набору элементов) объектной модели документа (DOM), обращаться к атрибутам и содержимому элементов DOM и конечно манипулировать ими. Причем благодаря своему интуитивно понятному синтаксису, схожему в чем-то с CSS1, CSS2 и XPath, эта работа становится не просто легкой, а даже приятной.

.2.7 VBScript, или Visual BASIC Script (Visual Beginners All-purpose SymbolicInstruction Code Script, визуальный символический универсальный командный код для начинающих) - очередная версия интерпретируемого языка, встраиваемого в html-документ с целью включения в состав web-страницы интерактивных элементов. Язык разработан фирмой Microsoft и является подмножеством достаточно распространенного в среде программистов языка Visual Basic разработки прикладных программ Windows-приложений. Как и его родитель, язык VBScript достаточно прост и лёгок в изучении. Если сравнить более распространенный стандарт JavaScript с VBScript, обнаружить серьезные различия очень трудно, поскольку синтаксис обоих языков во многом схож. С помощью VBScript можно реализовать практически весь спектр возможностей, характерных для JavaScript. Обе технологии не зависят от типа сервера, на котором планируется опубликовать включающую их web-страницу. Преимуществом его применения для создания сценариев является возможность использования, с небольшими корректировками, ранее написанных процедур на языках Visual Basic и Visual Basic for Application. Функциональные возможности сценариев, написанных на VBScript, ничем не отличаются от возможностей сценариев JavaScript: динамические создание документа или его частей, перехват и обработка событий и так далее.

2.2.8 Active X

Эта технология была разработана фирмой Microsoft в рамках стратегической программы по интеграции ОС Windows и сети Интернет. Точнее не самой системы, а технологий разработки ПО. Переработанные подходы к технологии OLE, получившие название ActiveX, позволяют создавать единообразно как настольные приложения, так и работающие в браузере, для среды клиент-сервер.

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

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

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

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

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

Апплет может быть внедрен в веб-страницу с помощью использования HTML тэга <applet>, или (что рекомендуется) тега <object>.

Можно назвать следующие преимущества Java-апплетов:

·работают практически на большинстве операционных платформ;

·поддерживаются большинством браузеров;

·кэшируются в большинстве браузеров, что существенно ускоряет их загрузку при возвращении на веб-страницу;

·после первого запуска апплета, когда Java-машина уже выполняется и быстро запускается, выполнение апплетов происходит существенно быстрее;

·загружаются со скоростью, сопоставимой с программами на других компилируемых языках, например C++, но во много раз быстрее, чем на JavaScript.

При этом у Java-апплетов имеются и недостатки:

·требуется установка Java-расширения, которые доступны по умолчанию не во всех браузерах;

·не могут запускаться до первой загрузки виртуальной Java-машины, что может занимать значительное время;

·разработка пользовательского интерфейса с использованием апплетов является более сложной задачей по сравнению с HTML;

·не имеют прямого доступа к локальным ресурсам клиентского компьютера.

2.3Технологии, работающие на стороне сервера

2.3.1CGI

Технология CGI (Common Gateway Interface) подразумевает использование в составе ресурса Интернет интерактивных элементов на базе приложений, обеспечивающих передачу потока данных от объекта к объекту. Именно так организовано во Всемирной сети большинство чатов, конференций, досок объявлений, гостевых книг, поисковых машин и систем подсчета рейтинга. В общем случае принцип работы CGI выглядит следующим образом: пользователь заполняет на web-страничке ту или иную форму и нажимает на кнопку, после чего встроенная в код HTML строка вызова CGI-скрипта запускает соответствующую программу CGI и передает ей управление процессом обработки информации. Введенные пользователем данные отсылаются этой программе, а она, в свою очередь, "встраивает" их в другую страницу, отправляет по почте или трансформирует каким-либо иным способом. Скрипты CGI размещаются на сервере в специально отведенной для этих целей директории, которой, как правило, назначается имя CGI-BIN. Следует помнить, что подключение, отладка и запуск таких программ требуют соответствующих прав доступа к http-серверу, а также определенных знаний и навыков.

Технология CGI обычно реализуется двумя методами: либо с использованием программ, написанных на языке PERL (Practical Extraction and ReportLanguage), - такие файлы имеют расширение .pi, либо с помощью приложений, созданных обычно с применением языка С и откомпилированных непосредственно на сервере, поскольку большинство UNIX-совместимых платформ включают в себя встроенный транслятор этого языка. Подобные программы имеют расширение .cgi. Необходимо отметить, что PERL, как и HTML, является интерпретируемым языком. Иными словами, для того чтобы запустить подобный скрипт на исполнение, не требуется дополнительной компиляции. Помимо упомянутых возможностей с помощью данной технологии можно организовать систему показа последовательности рекламных баннеров или автозагрузки файлов на сервер, создать форму отправки электронного письма непосредственно со страницы сайта или службу виртуальных открыток. Среди достоинств CGI следует отметить их независимость от клиентского программного обеспечения - эту технологию сможет применять каждый пользователь, просматривающий содержимое сервера при помощи браузера практически любой версии. Главный недостаток заключается в том, что для установки и настройки приложений CGI на сервере нужно обладать как минимум правами администратора, поскольку эти программы при запуске способны нарушить нормальное функционирование серверного компьютера и дестабилизировать работу сети.

2.3.2Perl

Perl (Practical Extraction and Report Language - практический язык извлечений и отчетов) - это интерпретируемый язык, оптимизированный для просмотра содержимого текстовых файлов, выделения из них информации и генерирования отчетов на основе этой информации, а также просто хороший язык для выполнения многих задач системного администрирования UNIX. Он обладает большим набором преимуществ как язык сценариев общего назначения, которые проявляются через его характерные черты и возможности.

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

Язык Perl был создан для повышения эффективности обработки текстовых документов. Он ориентирован на обработку строк. В настоящее время язык получил большое распространение как инструмент создания исполняемых модулей WWW-сервера. Существующие пакеты расширения обеспечивают доступ к SQL-серверам непосредственно из Perl-программы. Это позволяет использовать его для решения всех задач, возникающих при обеспечении WWW-доступа к базам данных. Perl эффективен также при обработке произвольных структур данных: существующих отчетов, списков, карточек в электронном виде.

Хотя CGI-приложения можно писать практически на любом языке, Perl и CGI-программирование стали синонимами для многих программистов.

Первым в цепочке достоинств языка Perl является его интерпретируемость. Perl позволяет легко и быстро получить требуемое решение задачи, сочетая в себе элементы компилируемых и интерпретируемых языков программирования.

Интерпретатор Рerl, отличается от традиционных интерпретаторов тем, что программа транслируется в промежуточный байт-код, и только после этого выполняется. В традиционных интерпретаторах каждый вводимый оператор интерпретируется и сразу же выполняется, что может приводить к синтаксическим ошибкам во время выполнения. Perl-программа свободна от этого "недостатка", так как все синтаксические ошибки обнаруживаются во время трансляции в байт-код.

Вторым преимуществом использования Perl является его доступность для большинства серверных платформ.

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

Одним из способов распространения свободно распространяемого программного обеспечения, а именно таков интерпретатор Perl, является использование Общей открытой лицензии GNU. По условиям этой лицензии файлы исходного текста программного продукта распространяются совершенно свободно и могут быть использованы любым лицом. Однако любые версии программы, созданные путем модификации этого кода, должны реализоваться также на условиях Общей открытой лицензии GNU, т. е. следует предоставлять файлы исходных текстов нового продукта любому, кто их захочет иметь. Этого зачастую вполне достаточно, чтобы защитить интересы автора первоначального программного продукта, однако может приводить к большому количеству производных версий исходного продукта, что приводит к "отчуждению" автора исходного продукта от процесса модификации его детища. Более того, в связи с большим количеством разнообразных версий, пользователям становится трудно определить, какая версия пакета является на текущий момент окончательной, будут ли написанные им сценарии, если речь идет о Perl, правильно работать с имеющейся у него версией, и т. п.

В связи с изложенными недостатками лицензии GNU, интерпретаторы языка Perl выпускаются на условиях лицензии Artistic License (Артистической лицензии), которая является некоторой вариацией лицензии GNU, и ее смысл заключается в том, что любой, кто выпускает пакет, полученный на основе Perl, должен ясно осознавать, что его пакет не является истинным пакетом Perl. Поэтому все изменения должны быть тщательно документированы и отмечены, выполнимые модули, в случае изменения, должны быть переименованы, а исходные модули должны распространяться вместе с модифицированной версией. Эффект от подобных условий заключается в том, что автор первоначального продукта всегда определяется как его владелец. При использовании Artistic License все условия Общей открытой лицензии GNU остаются в силе, т. е. она продолжает применяться.

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

·полнотой;

·простотой использования;

·эффективностью.

Под полнотой Perl понимается его способность решать все возникающие в системе UNIX в связи с ее администрированием задачи.

Возможности Perl не ограничиваются только задачами администрирования. Подключаемые пакеты и модули позволяют легко и быстро решать и другие задачи, для которых, возможно, пришлось бы использовать язык программирования С. Начиная с версии 5.0, язык Perl поддерживает технологию объектно-ориентированного программирования, причем пакеты и модули можно оформить в виде объектов и использовать без знания содержащегося в них кода (хотя придется изучить большое количество объектных моделей со своими свойствами и методами).- это язык, на котором программист может делать свою работу, причем для выполнения одной и той же задачи Perl предлагает несколько средств ее реализации. Одни из них более сложны, другие - менее. Разработчик может выбрать то, которое ему более понятно и которое ему проще применить, не тратя времени на изучение более сложных возможностей. В этом заключается простота использования Perl, которая позволяет применять его как для реализации одноразовых утилит, так и для создания сложных, часто используемых приложений.является прямолинейным языком, а это означает, что простые программы не надо оформлять в виде головных процедур main, как это принято в большинстве процедурных языков программирования, или в форме класса, как принято в объектно-ориентированных языках программирования, т. е. не надо тратить время на дополнительное форматирование исходного текста программы, а просто начинать писать операторы Perl, которые будут немедленно обрабатываться интерпретатором. Именно в этом заключена эффективность языка программирования Perl.

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

И здесь, в первую очередь, следует обратить внимание на простое включение в Perl-программу вызовов библиотечных процедур языка С, что позволяет использовать огромное количество кода, написанного для этого популярного языка. В поставку Perl входят утилиты, конвертирующие заголовки библиотек С в соответствующие эквиваленты языка Perl. Конвертирование осуществляется с помощью XS-интерфейса, который представляет собой простой программный интерфейс, преобразующий среду вызова функций С в среду вызова подпрограмм Perl. Последующий вызов функций С ничем не отличается от вызова подпрограмм самого Perl.

Для работы с базами данных можно самому написать соответствующее приложение на языке С, а можно воспользоваться свободно распространяемыми модулями дополнительных расширений возможностей Perl, включающих работу с многочисленными популярными системами управления базами данных. Способность Perl работать с сокетами TCP/IP сделала его популярным для реализации информационных систем взаимодействия с сетевыми серверами любых типов, использующих сокеты в качестве механизма обмена информацией. Именно эта возможность в сочетании с использованием Perl для создания CGI-сценариев послужила широкому распространению языка на других многочисленных платформах.

Пятое преимущество его использования: так как изначально этот язык являлся свободно распространяемым, то вся наработанная документация также доступна совершенно бесплатно, а так как Perl, как язык сценариев очень популярен, то в Интернет находится много документации по его применению для решения разнообразных задач.

2.3.3PHP

PHP - это широко используемый язык программирования общего назначения с открытым исходным кодом. PHP сконструирован специально для ведения web-разработок и может внедряться в HTML-код.лучше всего охарактеризовать как работающий на стороне сервера встроенный язык сценариев Web, позволяющий разработчикам быстро и эффективно строить динамические web-приложения. С позиций грамматики и синтаксиса PHP напоминает язык программирования С, хотя разработчики не постеснялись включить в него средства из других языков, в том числе из Perl, Java и C++. Среди ценных заимствованных возможностей - поддержка регулярных выражений, мощные средства работы с массивами, объектно-ориентированная методология и обширная поддержка работы с базами данных.

При написании приложений, выходящих за рамки традиционной, статической методологии разработки web-страниц (то есть HTML), PHP также может послужить ценным инструментом для создания и управления динамическим содержанием, который используется наряду с JavaScript и другими языками. Благодаря наличию сотен стандартных функций PHP в состоянии решить практически любую задачу, которая может придти в голову разработчику. В нем имеется обширная поддержка создания графики и операций с ней, математических вычислений, средств электронной коммерции и таких популярных технологий, как XML (Extensible Markup Language), ODBC (Open Database Connectivity) и Macromedia Shockwave. Широкий выбор возможностей избавляет от необходимости рутинной и непростой работы по подключению сторонних модулей, поэтому многие разработчики со всего мира останавливают свой выбор на PHP.

Одним из главных достоинств PHP является тот факт, что он внедряется прямо в HTML-код, поэтому программисту не приходится писать программу с множеством команд для простого вывода HTML. Код HTML и PHP можно чередовать по мере необходимости.

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

·традиционностью;

·простотой;

·эффективностью;

·безопасностью;

·гибкостью.

Существует еще одна "характеристика", которая делает PHP особенно привлекательным: он распространяется бесплатно!

Традиционность. Язык PHP кажется знакомым программистам, работающим в разных областях. Многие конструкции языка позаимствованы из Perl, а нередко код PHP практически неотличим от того, что встречается в типичных программах С или Pascal. Это заметно снижает начальные усилия при изучении PHP.

Простота. Сценарий PHP может состоять из 10 000 строк или из одной строки - все зависит от специфики задачи. Пользователю не придется подгружать библиотеки, указывать специальные параметры компиляции или что-нибудь в этом роде. Механизм PHP просто начинает выполнять код после первой экранирующей последовательности (<?) и продолжает выполнение до того момента, когда он встретит парную экранирующую последовательность (?>). Если код имеет правильный синтаксис, он исполняется в точности так, как указал программист.

Эффективность. Эффективность является исключительно важным фактором при программировании для многопользовательских сред, к числу которых относится и WWW. В PHP был реализован механизм выделения ресурсов и обеспечена улучшенная поддержка объектно-ориентированного программирования, а также средства управления сеансом. В последней версии появился и механизм подсчета ссылок (reference counting), предотвращающий выделение лишней памяти.

Безопасность. PHP предоставляет в распоряжение разработчиков и администраторов гибкие и эффективные средства безопасности, которые условно делятся на две категории: средства системного уровня и средства уровня приложения.

Средства безопасности системного уровня. В PHP реализованы механизмы безопасности, находящиеся под управлением администраторов; при правильной настройке PHP это обеспечивает максимальную свободу действий и безопасность. PHP может работать в так называемом безопасном режиме (safe mode), который ограничивает возможности применения PHP пользователями по ряду важных показателей. Например, можно ограничить максимальное время выполнения и использование памяти (неконтролируемый расход памяти отрицательно влияет на быстродействие сервера). По аналогии с cgi-bin администратор также может устанавливать ограничения на каталоги, в которых пользователь может просматривать и исполнять сценарии PHP, а также использовать сценарии PHP для просмотра конфиденциальной информации на сервере (например, файла passwd).

Средства безопасности уровня приложения. В стандартный набор функций PHP входит ряд надежных механизмов шифрования. PHP также совместим с многими приложениями независимых фирм, что позволяет легко интегрировать его с защищенными технологиями электронной коммерции (e-commerce). Другое преимущество заключается в том, что исходный текст сценариев PHP нельзя просмотреть в браузере, поскольку сценарий компилируется до его отправки по запросу пользователя. Реализация PHP на стороне сервера предотвращает похищение нетривиальных сценариев пользователями. Гибкость. Поскольку PHP является встраиваемым (embedded) языком, он отличается исключительной гибкостью по отношению к потребностям разработчика. Хотя PHP обычно рекомендуется использовать в сочетании с HTML, он с таким же успехом интегрируется и в JavaScript, XML и другие языки. Кроме того, хорошо структурированные приложения PHP легко расширяются по мере необходимости (впрочем, это относится ко всем основным языкам программирования).

2.3.4MySQL. Взаимодействие с PHP

MySQL - это одна из самых популярных и самых распространенных СУБД (система управления базами данных) в Интернете. Она не предназначена для работы с большими объемами информации, но ее применение идеально для веб - сайтов, как небольших, так и достаточно крупных.отличатся хорошей скоростью работы, надежностью, гибкостью. Работа с ней, как правило, не вызывает больших трудностей. Поддержка сервера MySQL автоматически включается в поставку PHP.

Немаловажным фактором является ее бесплатность. MySQL распространяется на условиях общей лицензии GNU (GPL, GNU Public License). Ранее для долговременного хранения информации применялась работа с файлами: в них помещали некоторое количество строчек, а затем извлекали их для последующей работы. Задача длительного хранения информации очень часто встречается в программировании Веб-приложений: подсчет посетителей в счетчике, хранение сообщений в форуме, удаленное управление содержанием информации на сайте и т.д.

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

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

Приложение на РНР, использующее для хранения информации базу данных (в частности MySQL) всегда работает быстрее приложения, построенного на файлах. Дело в том, что базы данных написаны на языке C++, и написать на PHP программу, которая работала бы с жестким диском эффективнее базы данных - задача неразрешимая по определению, поскольку программы на PHP работают медленнее, чем программы на C++, так как РНР - интерпретатор, а С++ - компилятор.

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

2.3.5Ruby

Ruby - интерпретируемый скриптовый язык высокого уровня для быстрого и удобного объектно-ориентированного программирования. Ruby имеет большое количество средств для обработки текстов, для решения системных задач. Ruby является полностью свободным языком программирования с возможностью копирования, модификации и распространения. Ruby перенесён на множество платформ. Он разрабатывался на Linux, но работает на многих версиях Unix, DOS, Windows 95/98/ NT/2000/XP, Mac OS, OS/2, и т.д. Целью создания Ruby был настоящий объектно-ориентированный интерпретируемый язык программирования. Название отсылает к языку Perl, наследником которого является Ruby (драгоценные камни: англ. pearl - жемчужина, англ. ruby - рубин).имеет простой и понятный синтаксис, позволяет обрабатывать исключения в стиле Java и Python, позволяет легко переопределять операторы, которые на самом деле являются методами. Ruby - полностью объектно-ориентированный язык программирования. Все данные в Ruby являются объектами. Также поддерживается добавление методов в класс и даже в конкретный экземпляр во время исполнения программы. Ruby сознательно не поддерживает множественное наследование, вместо которого существует концепция модулей. Ruby содержит автоматический сборщик мусора. Он работает для всех объектов Ruby, так что не надо заботиться о подсчёте ссылок даже во внешних библиотеках. Ruby не требует объявления переменных. Язык использует простые соглашения для обозначения области видимости. Ruby имеет независимую от ОС поддержку многопоточности.

2.3.6Python

Python - высокоуровневый язык программирования общего назначения с акцентом на производительность разработчика и читаемость кода. Синтаксис ядра Питона минималистичен. В то же время стандартная библиотека включает большой объём полезных функций.поддерживает несколько парадигм программирования, в том числе структурное, объектно-ориентированное, функциональное, императивное и аспектно-ориентированное. Основные архитектурные черты - динамическая типизация, автоматическое управление памятью, полная интроспекция, механизм обработки исключений, поддержка многопоточных вычислений и удобные высокоуровневые структуры данных. Код в Питоне организовывается в функции и классы, которые могут объединяться в модули (которые в свою очередь могут быть объединены в пакеты).

Эталонной реализацией Питона является интерпретатор CPython, поддерживающий большинство активно используемых платформ. Он распространяется свободно под очень либеральной лицензией, позволяющей использовать его без ограничений в любых приложениях. - активно развивающийся язык программирования, новые версии (с добавлением/изменением языковых свойств) выходят примерно раз в два с половиной года. Вследствие этого и некоторых других причин на Python отсутствуют ANSI, ISO или другие официальные стандарты, их роль выполняет Cpython.

2.4Медиаресурсы. Платформа Flash

Flash - инструмент создания анимации. Flash-ролики размещают на web-странице или используют в качестве web - страницы.

Многие особенности формата файлов Flash делают его идеальными для добавления в web-страницы контента с интерактивными возможностями.

Преимущества Flash:

·Небольшие размеры файлов. Flash позволяет повторно использовать графику, кнопки и объекты программного кода, когда каждый экземпляр не требует дополнительных байтов. Кроме того, ролики Flash используют векторную графику, которая основана на применении математических расчетов для вычерчивания линий и определения цвета в отличие от хранения цветов отдельных пикселов в растровой графике. Благодаря этому значительно уменьшается размер файлов.

·Простота изменения размеров. Изображения и анимация Flash могут изменять свои размеры без потерь каких-либо деталей изображения, легко можно заполнить все окно браузера интерфейсом flash без увеличения размера файла. Flash может использоваться для статических изображений, например для карт изображения, когда желательно иметь возможность получения крупного плана изображения, чтобы лучше рассмотреть его детали.

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

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

·Можно создавать скрипты. Используется язык написания скриптов Action Script, позволяющий управлять проигрыванием файлов Flash. Кроме того, в файле HTML можно использовать инструкции Java Script для управления flash-объектами, находящимися на странице.

·Наборы шрифтов перемещаемые. Любой шрифт, используемый в файле flash.swf может читаться в любой системе, независимо от того, есть он в системе или нет.

Недостатки:

·Требуется иметь плагин плеера. Для проигрывания файлов на машине пользователя необходимо регулярно устанавливать последнюю версию flash-плеера. У многих пользователей - это вызывает отрицательную реакцию.

·Проигрывание ролика всегда начинается с первой страницы. Другие web - сайты не могут сослаться на определенную страницу или сцену внутри ролика.

2.5Системы управления контентом (CMS)

Заказчик сайта должен решить, какую выбрать систему управления сайтом (CMS - Content Management System). Это очень важный вопрос, от правильного его решения существенно зависит успешность будущего сайта, стоимость его изготовления и последующей эксплуатации. Правильный функционал CMS обеспечивает легкое и быстрое развитие сайта - удобное наращивание и обновление материалов, быстрое изменение структуры сайта. Хорошая CMS делает возможным быстрое добавление заранее не включенных в проект функций (например, фото галерей, видео материалов, форумов и т.д.).

На основе данных, полученных при анализе примерно 1500 интернет-магазинов и интерент-витрин, входящих в Яндекс.Маркет в I квартале 2011 года был составлен рейтинг CMS для интернет-магазинов и интеренет-витрин.

Рисунок 2.1 - Рейтинг CMS для интернет-магазинов и интерент-витрин

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

Лидирует CMS Shop-script, за ней идет 1С-Bitrix, Joomls и PHPShop. Это самые распространенные движки для магазинов и витрин. На них и надо ориентироваться при выборе CMS. Остальные представлены слабо, это - OsCommerce, VaM Shop, Drupal, HostCMS, InSales. В число прочих на диаграмме попали WordPress, Amiro.CMS, S.Builder, uCoz, NetCat, MODx, UMI.CMS, DataLife Engine, ABO.CMS

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

В данной главе дипломной работы приведено описание модели "клиент-сервер", рассмотрены и описаны информационные технологии, применяемые на стороне клиента и на стороне сервера. Приведен рейтинг самых популярных CMS для создания интернет-витрин и интернет-магазинов.

Глава 3. Разработка web-сайта для ЗАО «Кондитерская фабрика «Саратовская»

.1 Общая информация о ЗАО «Кондитерская фабрика «Саратовская»

ОАО «Кондитерская фабрика «Саратовская» существует на рынке более 20 лет и является стабильной и ответственной компанией. ОАО «Кондитерская фабрика «Саратовская» является одним из самых динамичных производителей кондитерской продукции. Ассортимент выпускаемой продукции огромен и разнообразен - пралиновые, помадные, ассорти, укрупненные фруктовые конфеты; батончики; молочная, леденцовая, фруктовая, переслоенная карамель; вафли фигурные, джемовые, с натуральными орехами и фруктами, кремовые; вафельные рулетики; сдобное, затяжное, отсадное печенье; крекер и крекер-сэндвич; зефир в шоколаде и с начинками; ирис; лукум. Ярчайшими хитами компании по праву являются такие марки конфет, как «Шоколад-Бар», «Confashion Bar», «Конфэшн Ассорти», вафли «Влана», «Гламур». Для обеспечения хранения товара имеются склады достаточной площади, постоянно поддерживается температурный режим (+18°С).

В начале 2003 года был разработан и выведен на рынок бренд «Конфэшн» (от английского «Confectionary Fashion» - «Кондитерская мода»). Несмотря на высокий уровень насыщенности рынка, грамотный подход ко всем этапам появления новых продуктов позволил потеснить лидеров рынка в большинстве ключевых групп товаров. Немаловажную роль в этом сыграло и то, что управленческая команда создала структуру, позволяющую осуществлять запуск новых продуктов - от разработки идеи до начала отгрузок в фантастически короткие сроки.

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

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

Ярким событием в жизни предприятия стал запуск в 2008 году премиального бренда «Эйфория» - самого шикарного продукта на российском кондитерском рынке. Из вышесказанного можно сделать вывод, что ОАО «Кондитерская фабрика «Саратовская» является надежным партнером для своих клиентов. Компания имеет стабильную прибыль и активно развивается.

.2 Структура информации и навигации по сайту

ОАО «Кондитерская фабрика «Саратовская» является известным и надежным предприятием, в связи с этим появилась насущная необходимость в собственном web-сайте. Руководство ОАО «Кондитерская фабрика «Саратовская» выступило заказчиком данного сайта и выдвинуло ряд требований, которым должен удовлетворят данный проект:

• Сайт должен быть визуально привлекательным (эстетичность, грамотная композиционная организация, хорошее сочетание цветов).
• В области заголовка должен присутствовать фирменный логотип данной фирмы.
• На главной странице должна находиться информация о хитах продаж и новинках предприятия.
• Основная цветовая гамма сайта должна соответствовать фирменным цветам (основной фирменный цвет - синий).
• Сайт должен иметь раздел "продукция", содержащий весь перечень продукции, который производится предприятием.
• На сайте должен быть реализован поиск по товарам каталога.
• На каждой странице сайта должно присутствовать дублирующее меню.

Автор постарался максимально удовлетворить всем требования заказчика.

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

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

В корневой папке сайта находятся несколько подкаталогов:

·Images - для хранения файлов с изображениями ;

·JavaScript - содержит коды скриптов, используемые на сайте;

·CSS - содержит служебные файлы .css, отвечающие за дизайн сайта;

·Flash - содержит файлы в формате .swf;

·Lib - в этой папке хранятся функции, используемые на сайте

·Admin - содержит файлы необходимые для администрирования сайта.

Файл index.php находится в корневой папке сайта, так как является самым главным файлом сайта. Именно его содержимое выводится в браузере при наборе адреса сайта. Также в корневой папке содержатся другие файлы необходимые для отображения основных страниц сайта.

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

Сайт состоит из веб-страниц, которые сгруппированы в ряд разделов, объединенных гиперссылками:

·Главная

·История

·Продукция

·Проекты

·Дистрибьюторам

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

.3 Разработка интерфейса и дизайна сайта

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

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

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

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

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

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

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

Главная страница представлена ниже:

Рисунок 3.1 - Главная страница

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

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

Информация, представленная на страницах сайта, не является статичной, все представленные на них данные хранятся на сервере, что в свою очередь делает сайт динамичным.

Страница "О нас" содержит информацию о сертификатах организации. Данный раздел содержит текстовую и графическую информацию:

Рисунок 3.2 - Просмотр информации о сертификатах компании

Страница "Контакты" содержит информацию о местоположении организации (компания отмечена маркером на карте), а так же об адресе, телефонах, факсе, e-mail компании. Данный раздел содержит текстовую и графическую информацию:

Рисунок 3.3 - Страница "Контакты"

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

Рисунок 3.4 - Страница результатов поиска

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

Данный список разработан по принципу иерархии.

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

Рисунок 3.5 - Страница каталога, категория "ДЛЯ СУШИ"

К каждому товару прикреплено его подробное описание, содержащее такие пункты, как: описание товара, страна-производитель, фасовка, вес нетто, срок годности товара, цена. При переходе по гиперссылке "Подробнее…", расположенной под миниатюрой товара, открывается страница с полным описанием товара.

Рисунок 3.6 - Страница описания товара

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

Рисунок 3.7 - Прайс-лист

На сайте, существует возможность составления предварительного заказа с подсчетом стоимости. Данная возможность доступна только зарегистрированным пользователям. Для прохождения регистрации, необходимо пройти по ссылке, расположенной блоке "Регистрация" в левой части сайта. Уже зарегистрированным пользователям для получения возможности составления предварительного заказа, необходимо авторизоваться (вести свои логин и пароль в полях блока "Регистрация").

Рисунок 3.8 - Страница регистрации

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

Рисунок 3.9 - Отображение страницы каталога для авторизованных пользователей

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

Рисунок 3.10 - Отображение страницы предварительного заказа для пользователя us2

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

3.4 Информационные технологии, использованные при создании сайта

Верстка выполнена в соответствии с современными стандартами веб-разработки, языком разметки является XHTML версии 1.0, за описание внешнего вида отвечают каскадные таблицы стилей CSS. Серверная часть выполнена с использованием PHP и MySQL. Обзор этих технологий приведен во второй главе.

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

На сайт решено было добавить flash-баннер. Движение на сайте привлекает внимание и на подсознательном уровне откладывается в памяти пользователя. При разработке баннера использовался программный продукт Adobe Flash CS3. Так как это наиболее популярная программа для создания flash-приложений.

Сайт написан на языке программировании PHP т.к. используя обычный язык гиппертестовой разметки невозможно осуществить авторизацию доступа, а также редактирование содержимого страниц. Приложение на РНР, использующее для хранения информации базу данных (в частности MySQL) всегда работает быстрее приложения, построенного на файлах. Вследствие этого была применена система управления базами данных MySQL, используемая в процедуре хранения информации о товарах, компании, контактной информации. При помощи MySQL осуществляется администрирование сайта. MySQL отличается хорошей скоростью работы, надежностью, гибкостью. Работа с этой технологией, как правило, не вызывает больших трудностей.

.5 Разработка администраторской части web-сайта

Управление данными сайта скрыто от глаз посетителей во избежание несанкционированного доступа. Таким образом, система управления ресурсами состоит из двух частей: одна часть пользовательская, где можно просматривать данные; а другая часть администраторская, в которой происходит редактирование этих данных.

Доступ к администраторской части осуществляется через окно авторизации:

Рисунок 3.11 - Доступ к администрированию

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

Рисунок 3.12 - Страница редактирования каталога

Данная страница позволяет вносить изменения в каталог в раздел "ДЛЯ СУШИ". Нажав на пиктограммы напротив соответствующего товара, администратор может удалить, либо редактировать данный товар. Так же администратор имеет возможность добавить новый товар, кликну по ссылке "Добавить товар".

Добавление нового товара происходит при помощи приведенной ниже формы:

Рисунок 3.13 - Форма добавления товара

Таким образом, данный Web-сайт выполняет ряд следующих функций:

• Осуществляет снабжение информацией посетителей сайта о производственном предприятии ОАО «Кондитерская фабрика «Саратовская»;
• дает возможность посетителям сайта быть в курсе последних новостей, новинок выпускаемой продукции;
• позволяет администратору редактировать, добавлять и удалять информацию;
• позволяет осуществлять поиск по сайту.

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

Заключение

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

Во второй главе данной дипломной работы описаны современные Интернет - технологии, используемые при создании сайтов.

Третья глава дипломной работы посвящена описанию деятельности производственного предприятия ОАО «Кондитерская фабрика «Саратовская» и описанию разработанного сайта. Рассмотрены основные направления деятельности организации, обоснована необходимость создания сайта. В контексте описания разработанного сайта идет обоснование выбора использованных технологий. Детально описан интерфейс сайта, элементы дизайна, обоснован выбор цветовой гаммы web-страниц.

Тема дипломной работы была полностью раскрыта. Руководство торговой компании ОАО «Кондитерская фабрика «Саратовская» довольно созданным web-сайтом и в ближайшее время планирует его размещение в сети Интернет.

Список использованных источников

1.Ломов А.Ю. HTML, CSS, скрипты: практика создания сайтов / А.Ю. Ломов. - СПб. БХВ-Петербург, 2006. - 416 с.

2.Глушаков С.В. Программирование WEB-страниц / С.В. Глушаков, И.А. Жакин, Т.С. Хачиров. -М. : Феникс ; Харьков : Фолио, 2006. - 400 с.

.Днепров А.Г. JavaScript на 100 % / А.Г. Днепров. - М.; СПб.: Питер, 2008. - 299 с.

.Евсеев Д.А. Web-дизайн в примерах и задачах / Д.А. Евсеев, В.В. Трофимов. - М. : КНОРУС, 2009. - 263 c.

.Комолова Н.В. HTML : самоучитель / Н. В. Комолова. - СПб.: Питер , 2009. - 268 с.

.Прохоренок Н.А. HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера / Н.А. Прохоренок. - СПб.: БХВ-Петербург, 2010. - 890 с.

.Старыгин А.А. XML: разработка Web-приложений / А.А. Старыгин. - СПб. : БХВ-Петербург, 2003. - 585 с.

.Бенкен Е.С. PHP, MySQL, XML. Программирование для Интернета / Е.С. Бенкен. - СПб. : БХВ-Петербург, 2007. - 310 с.

.Яковлев А.А. Раскрутка сайтов. Основы, секреты, трюки / А.А. Яковлев, В.Г. Ткачев. - СПб. : БХВ-Петербург, 2010. - 344 с.

.Кузнецов М. Самоучитель PHP 5 / М. Кузнецов, И. Симдянов. - СПб. : БХВ-Петербург, 2005. - 560 с.

.Бердышев С.Н. Искусство оформления сайта / С.Н. Бердышев. - М.: Дашков и К°, 2009. - 145с.

.Мазуркевич А. PHP: настольная книга программиста / А. Мазуркевич, Д. Еловой. - М. : Новое знание, 2004. - 479 с.

.Фленов М.Е. PHP глазами хакера / М. Фленов. - СПб. : БХВ-Петербург, 2010. - 330 с.

.Ли Д. Использование Linux, Apache, MySQL и PHP для разработки Web-приложений / Д. Ли, Б. Уэр. - М. ; СПб.; Киев: Вильямс, 2004. - 432 с.

.Дунаев В.В. (X)HTML. Скрипты и стили. Самое необходимое / В.В. Дунаев. - СПб. : БХВ-Петербург, 2009. - 485, с.

.Фролов А.В. Практика применения PERL, PHP, APACHE и MySQL для активных Web-сайтов / А.В. Фролов, Г.В. Фролов. - М. : Русская Редакция, 2002. - 576 с.

.Кузин А.В. Базы данных / А.В. Кузин, С.В. Левонисова. - М. : Академия, 2008. - 320 с.

.Дронов В.А. PHP 5/6, MySQL 5/6 и Dreamweaver CS4. Разработка интерактивных Web-сайтов / В.А. Дронов. - СПб.: БХВ-Петербург, 2009. - 534 с.

.Котеров Д.В. PHP 5 / Д.В. Котеров, А.Ф. Костарев. - СПб. : БХВ-Петербург, 2010. - 1078 с.

.Будилов В.А. PHP 5 / В.А. Будилов. - СПб.: БХВ-Петербург, 2005. - 240 с.

.Флэнаган Д. JavaScript: подробное руководство / Д. Флэнаган. - СПб.; М.: Символ, 2004. - 960 с.

.Веллинг Л. MySQL / Л. Веллинг, Л. Томсон. - М.; СПб.; Киев: Вильямс, 2005. - 304 с.

Принципы разработки web-сайтов (на примере ЗАО "Кондитерская фабрика "Саратовская") Со

Больше работ по теме: