Разработка сайта Шумилинского райпо

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

Рубрика Программирование, компьютеры и кибернетика
Вид дипломная работа
Язык русский
Дата добавления 19.05.2015
Размер файла 3,5 M

Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже

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

Размещено на http://www.allbest.ru/

Содержание

  • Введение
  • 1. Постановка задачи
  • 1.1 Назначение Web-приложения
  • 1.2 Цели создания Web-приложения
  • 2 Проектирование WEB-приложения
  • 2.1 Обоснование инструментов разработки
  • 2.2 Логическая структура Web-приложения
  • 3. Физическая реализация WEB-Приложения
  • 3.1 Описание структуры и формата страницы
  • 3.2 Описание навигации
  • 3.3 Карта Web-приложения
  • 4. Тестирование
  • 5. Приминение
  • 5.1 Назначение и область применения Web-приложения
  • 5.2 Требование к аппаратным ресурсам ПК
  • 5.3 Руководство пользователя
  • 6. Экономический раздел
  • 7. Охрана труда
  • Заключение
  • Список использованных источников
  • Приложения

Введение

Задачи, которые реализуются компаниями с помощью Интернета, условно можно разбить на несколько типов:

a) реклама и создание имиджа организации;

б) маркетинг товаров;

в) осуществление продаж с помощью Интернета;

г) оказание консультационной помощи потребителям;

д) организация канала вещания средства массовой информации (СМИ).

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

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

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

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

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

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

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

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

Успешное ведение бизнеса невозможно без наличия профессионально созданного сайта.

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

1. Постановка задачи

1.1 Назначение Web-приложения

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

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

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

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

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

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

Наличие собственного веб-ресурса позволит очень быстро проводить обновление данных об организации.

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

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

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

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

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

Целью дипломного проекта является создание интернет-приложения "РАЙПО Шумилинского района”.

Сайт нужен для решения следующих задач:

· Предоставлять своевременную и достоверную информацию о деятельности компании.

· Способствовать росту популярности среди потенциальных партнёров и клиентов.

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

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

сайт интернет коммерческий пользователь

· Установление связей с новыми и существующими партнерами компании.

· Информационное обслуживание и представительские цели.

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

· Установление связи с территориально распределенными офисами компании.

· Снятие временного ограничения по доступу к информации компании.

· Привлечение новых клиентов.

· Развитие клиентской базы компании.

1.2 Цели создания Web-приложения

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

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

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

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

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

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

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

2 Проектирование WEB-приложения

2.1 Обоснование инструментов разработки

Для создания сайта будут использованы следующие инструменты:

· HTML;

· CSS;

· Adobe Dreamweaver CS5.5

· Adobe Photoshop CS5

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

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

Основным понятием CSS является стиль - набор правил оформления и форматирования, который может быть применен к различным элементам страницы. В стандартном HTML для присвоения какому-либо элементу определенных свойств (таких, как цвет, размер, положение на странице) приходилось каждый раз описывать эти свойства, даже если на одной страничке должны располагаться 10 или 110 таких элементов, ничуть не отличающихся один от другого. Разработчик должен был много раз вставить один и тот же кусок HTML-кода в страничку, увеличивая размер файла и время загрузки на компьютер просматривающего ее пользователя.

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

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

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

Dreamweaver - HTML-редактор компании Adobe. Изначально разработан и поддерживался компанией Macromedia, вплоть до 8-й версии (2005 год). Следующие версии, начиная с Dreamweaver CS3 (2007), выпускает Adobe. Богатый инструментарий, открытость приложения для всевозможных настроек, удобный интерфейс и другие особенности сделали Dreamweaver одним из наиболее популярных HTML-редакторов в мире.

Dreamweaver использовался для непосредственного конструирования Web-приложения, проверки кода, для конструирования css и автоподстановка кода.

Adobe Photoshop - многофункциональный графический редактор, разработанный и распространяемый фирмой Adobe Systems. В основном работает с растровыми изображениями, однако имеет некоторые векторные инструменты. Первая версия появилась в 1987 году. Её создал студент Мичиганского университета Томас Нолл (Thomas Knoll) для платформы Macintosh. Он назвал её Display, но в 1988 году переименовал в ImagePro. В сентябре 1988 год Adobe Systems купила права на программу, оставив разработчиком Томаса Нолла (Thomas Knoll). В следующем (1989 году) году программу переименовали в Photoshop. В 1990 году появился Photoshop 1.0 Расширенная версия программы Adobe Photoshop Extended предназначена для более профессионального использования, а именно - при создании фильмов, видео, мультимедийных проектов, трехмерного графического дизайна и Web-дизайна, для работы в областях производства, медицины, архитектуры, при проведении научных исследований.

2.2 Логическая структура Web-приложения

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

Существуют следующие логические структуры сайтов: линейная структура, линейная структура с альтернативами и вариантами, линейная структура с ответвлениями, древовидная структура, решетчатая структура.

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

Рисунок 2.1 - Линейная структура сайта

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

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

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

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

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

Рисунок 2.4 - Древовидная структура сайта

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

Рисунок.2.5 - Решётчатая структура

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

3. Физическая реализация WEB-Приложения

3.1 Описание структуры и формата страницы

Пользовательская часть сайта состоит из трёх основных блоков:

· баннер

· блок навигации

· блок основного содержания.

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

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

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

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

Структура страниц сайта остаётся неизменной и схематически её можно представить в соответствии с рисунком 3.1.

Рисунок 3.1 - Структура страницы сайта

Структура описание документа.

1. <! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict. dtd">.html 4.01 Strict DTD - строгое соответствие стандарту. Это означает, что в исходный код веб-страницы входят только рекомендуемые стандартом элементы и атрибуты.

2. <! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose. dtd">.html 4.01 Transitional DTD - переходный тип, исходный код содержит и нерекомендуемые элементы и атрибуты.

3. <! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Frameset // EN" "http://www.w3.org/TR/html4/frameset. dtd">.html 4.01 Frameset DTD - исходный код содержит фреймы.

4. <! DOCTYPE html>.html 5.

Любая HTML-страница должна содержать следующие обязательные теги:

· Тег <HTML>. Самый первый тег, который встречается в документе, должен быть тегом <HTML>. Данный тег сообщает Web-браузеру, что документ написан на языке HTML. Минимальный HTML-документ мог бы выглядеть так: <html> … тело документа … </html>. Таким образов, теги <HTML> и </HTML> образуют для HTML-документа так называемый контейнер.

· Тег <HEAD>. Структурно документ распадается на две части: заголовочную и основную, или тело документа. Заголовочная часть размещается между тегами <HEAD> и </HEAD>, основная - между тегами <BODY> и </BODY>.

· Тег <TITLE>. Внутри контейнера <HEAD> и </HEAD> размещается единственный обязательный контейнер из тегов <TITLE> и </TITLE>, содержащий текст заголовка.

Тег заголовочной части документа должен быть указан сразу после тега <HTML> и более нигде в теле документа. Данный тег представляет собой обобщённое описание документа.

Большинство Web-браузеров отображают содержимое тега <TITLE> в заголовке окна, содержащего документ, и в файле закладок, если он поддерживается Web-браузером. Заголовок, ограниченный тегами <TITLE> и </TITLE>, размещается внутри тегов <HEAD>. Заголовок документа при отображении самого документа в окне браузера не виден.

· Тег <BODY>. Тело документа должно находиться между тегами <BODY> и </BODY>. Это та часть документа, которая отображает его текстовую и графическую информацию.

Тег <BODY> парный. Между открывающим тегом <BODY> и закрывающим тегом </BODY> размещаются все другие теги программы, составляющие основное содержание документа. Тег <BODY> предназначается для выделения той части документа, которая должна быть показана пользователю на экране.

Атрибуты тела документа:

· <body bgcolor=? > - Устанавливает цвет фона документа, используя значение цвета в виде RRGGBB - пример: FF0000 - красный цвет.

· <body text=? > - Устанавливает цвет текста документа, используя значение цвета в виде RRGGBB - пример: 000000 - черный цвет.

· <body link=? > - Устанавливает цвет гиперссылок, используя значение цвета в виде RRGGBB - пример: 00FF00 - зеленый цвет.

· <body vlink=? > - Устанавливает цвет гиперссылок на которых уже побывали, используя значение цвета в виде RRGGBB - пример: 333333 - серый цвет.

· <body alink=? > - Устанавливает цвет гиперссылок при нажатии.

Некоторые теги для форматирования текста:

· <pre></pre> - Обрамляет текст, который предварительно отформатирован;

· <h1></h1> - Создает самый большой заголовок;

· <h6></h6> - Создает самый маленький заголовок;

· <b></b> - Создает жирный текст;

· <i></i> - Создает наклонный текст;

· <tt></tt> - Создает текст - имитирующий стиль печатной машинки;

· <cite></cite> - Используется для цитат, обычно наклонный текст;

· <em></em> - Используется для выделения из текста слова (наклонный или жирный текст);

· <strong></strong> - Используется для выделения наиболее важных частей текста (наклонный или жирный текст);

· <font size=? ></font> - Устанавливает размер текста в пределах от 1 до 7;

· <font color=? ></font> - Устанавливает цвет текста, используя значение цвета в виде RRGGBB.

Гиперссылки:

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

· <a href="mailto: EMAIL"></a> - создает гиперссылку вызова почтовой программы для написания письма автору документа;

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

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

Форматирование:

· <p> - создает новый параграф;

· <p align=? > - выравнивает параграф относительно одной из сторон документа, значения: left, right, или center;

· <br> - вставляет перевод строки;

· <blockquote></blockquote> - создает отступы с обеих сторон текста;

· <dl></dl> - создает список определений;

· <dt> - определяет каждый из терминов списка;

· <dd> - описывает каждое определение;

· <ol></ol> - создает нумерованный список;

· <li> - определяет каждый элемент списка и присваивает номер;

· <ul></ul> - создает ненумерованный список;

· <li> - предваряет каждый элемент списка и добавляет кружок или квадратик;

· <div align=? > - важный тег, используемый для форматирования больших блоков текста HTML документа, также используется в таблицах стилей.

Некоторые графические элементы:

· <img src="name"> - добавляет изображение в HTML документ;

· <img src="name" align=? > - выравнивает изображение к одной из сторон документа, принимает значения: left, right, center; bottom, top, middle;

· <img src="name" border=? > - устанавливает толщину рамки вокруг изображения;

· <hr> - добавляет в HTML документ горизонтальную линию;

· <hr size=? > - устанавливает высоту (толщину) линии;

· <hr width=? > - устанавливает ширину линии, можно указать ширину в пикселах или процентах;

· <hr noshade> - создает линию без тени;

· <hr color=? > - задает линии определенный цвет. Значение RRGGBB.

Порядок следования тегов:

1. Задаётся описание типа документа [декларация];

2. Открывается контейнер HTML [<html>];

3. Начинается голова документа [<head>];

4. Задаётся название документа между соответствующими тегами [<title></title>];

5. Закрывается голова документа [</head>];

6. Начинается тело документа [<body>];

7. Вносится вся необходимая информация [текст, таблицы, изображения, видео и т.д.] - контент;

8. Закрывается тело документа [</body>];

9. Закрывается контейнер HTML [</html>].

3.2 Описание навигации

Навигация по сайту - это способы перемещения по нему посетителей.

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

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

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

Рисунок 3.2 - Навигация сайта

3.3 Карта Web-приложения

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

На рисунке 3.3 представлена карта сайта.

Рисунок 3.3 - Карта сайта

4. Тестирование

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

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

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

Подходы к тестированию Веб-приложений:

· Функциональное тестирование;

· Юзабилити тестирование;

· Тестирование безопасности;

· Нагрузочное тестирование;

· Тестирование документации;

· Анализ кода;

· Тестирование локализации;

· Тест-кейс.

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

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

Функциональные требования включают в себя:

1. Функциональная пригодность (англ. suitability).

2. Точность (англ. accuracy).

3. Способность к взаимодействию (англ. interoperability).

4. Соответствие стандартам и правилам (англ.compliance).

5. Защищённость (англ. security).

Юзабилити тестирование - исследование, выполняемое с целью определения, удобен ли некоторый объект (веб-страница, пользовательский интерфейс или устройство) для его предполагаемого применения. Таким образом, Юзабилити тестирование измеряет удобство пользования сайта или програмного обеспечения.

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

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

Тестирование безопасности проверяет фактическую реакцию защитных механизмов, встроенных в систему, на проникновение.

Базовый список работ в рамках тестирования безопасности:

1. Общая оценка безопасности.

2. Выявление, анализ и оценку уязвимостей.

3. Тест на проникновение в систему (получение полного/частичного доступа к системе).

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

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

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

Основные аспекты тестирования документации:

· Верность и полнота информации.

· Наличие дублирующейся информации.

· Удобство навигации.

· Соблюдение политик документации.

· Структурированность.

· Расшифровка терминов.

· Единообразие и непротиворечивость.

· Копирование текста.

· Понятность для целевой аудитории.

· Правильность языка.

· Разделение ролей.

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

Тестирование локализации - это процесс тестирования локализованной версии сайта или программного обеспечения.

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

Процесс локализации тестирования включает в себя:

1. Определение и изучение списка поддерживаемых языков.

2. Проверка правильности перевода согласно тематике данного сайта или программы.

3. Проверка правильности перевода элементов интерфейса пользователя.

4. Проверка правильности перевода системных сообщений и ошибок.

5. Проверка перевода раздела "Помощь" и сопроводительной документации.

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

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

Некоторые методологии (например, RUP) рекомендуют создавать по меньшей мере два тест-кейса для каждого требования. Один из них должен выполнять позитивное тестирование, другой - негативное.

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

В результате проведенных тестов были выявлены следующие ошибки:

· Не отражался логотип Белорусского общества потребительской кооперации;

· В одном из пунктов горизонтальной навигации не работала ссылка;

· В некоторых статьях встречались стилистические и грамматические ошибки;

· Не корректно отображалось web-приложение при просмотре его в браузере Internet Explorer.

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

5. Приминение

5.1 Назначение и область применения Web-приложения

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

1) Создание имиджа

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

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

2) Взаимодействие с потребителями

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

3) Взаимодействие с партнерами

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

4) Организация торговли

Сайт такой организации как потребкоопераци может увеличить товарооборот и значительно улучшить имидж компании.

5) Взаимодействие внутри компании

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

5.2 Требование к аппаратным ресурсам ПК

Для корректного работы сайта, на компьютере пользователя должен быть установлен любой современный браузер: Opera, Google Chrome, Safari, Fire Fox.

Минимальные системные требования:

· операционная система типа Windows XP,Windows 7,Windows 8;

· предоставлять не менее 50Мб, пространства на жестком диске;

· выделять не менее 32 Мб оперативной памяти;

· CPU не менее 100MHz;

· клавиатура;

· мышь.

В качестве операционной системы был выбран Windows по ряду причин:

· самая распространённая операционная система на сегодняшний день;

· большая часть программ идёт на Windows;

· стабильность работы;

5.3 Руководство пользователя

Сайт "РАЙПО Шумилинского района” работает со всеми веб-браузерами. Все элементы адоптированы к работе.

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

На всех страницах сайта имеется меню, изображённое на рисунке 5.1, которое позволяет в любое время перейти на вкладки "Домашняя", "Новости", "Услуги", "Контакты". Так же на каждой странице сайта имеется строка навигации, с помощью которой пользователь может увидеть, на какой странице он находится.

Рисунок 5.1 - Вертикальная навигация для перехода по страницам сайта

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

Рисунок 5.2 - Альтернативная навигация

Новости - страница, на которых расположена новостная лента.

Новости на этой странице отражают последние события в Шумилинском РАЙПО и районе. На рисунке 5.3 отображена страница "Новости".

Рисунок 5.3 - Страница "Новости"

Услуги - на данной странице располагается информация об услугах предоставляемых РАЙПО. На рисунке 5.4 отображена страница "Услуги"

Рисунок 5.4 - Страница "Услуги"

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

6. Экономический раздел

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

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

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

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

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

1) материалы и комплектующие (используемые в процессе разработки и производства программного обеспечения) (М);

2) электроэнергия (Э);

3) основная заработная плата разработчиков (Зо);

4) дополнительная заработная плата разработчиков (Зд);

5) отчисления в фонд социальной защиты населения и на обязательное страхование в Белгосстрах (Ссн);

6) амортизация оборудования и программного обеспечения (А);

7) спецоборудование для научных (экспериментальных) работ (Рс);

8) накладные расходы (Рн);

9) прочие прямые расходы (Пз).

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

1. Затраты по статье "Материалы и комплектующие" (М) учитывают расходы на разработку программного обеспечения (см. таблицу 6.1).

Таким образом затраты на материалы и комплектующие составляют М= 23500 рублей.

Таблица 6.1 - Расходы на разработку программного продукта:

Материал

Цена, руб.

Количество, шт.

Стоимость, руб.

Диск DVD-R с конвертом

9000

1

9000

Бумага формата А4

130

70

9100

Ручка

5400

1

5400

Всего:

х

х

х

2. Затраты на электроэнергию (Э) находятся исходя из продолжительности периода разработки ПО, количества кВт/ч, затраченных на проектирование ПО и тарифа за 1 кВт/ч. Базовый тариф для прочих потребителей с 01.04.2014 г. составляет 1705,2 руб. за 1 кВт/ч. Затраты на электроэнергию определяются по формуле:

, (6.1)

гдеКэ - стоимость одного кВт/ч,руб;

Тр - количество кВт/ч.

Время реализации проекта 2 месяца, среднее потребление энергии в месяц составило 60 кВт/ч, то есть было потреблено 120 кВт/ч. Исходя из вышеизложенного получаем, что на электроэнергию было затрачено

3. Основная заработная плата исполнителей (Зо) является основной статьёй затрат при разработке программного обеспечения и рассчитывается по формуле:

, (6.2)

гдеТСi - тарифная ставка специалиста i - го разряда, руб.

Кi - коэффициент премирования (устанавливается на предприятии);

n - количество исполнителей участвовавших в разработке программного обеспечения, чел;

t - количество времени, затраченное на разработку программного обеспечения, месяцев.

Тарифная ставка i - го разряда (ТСi) определяется путем умножения действующей тарифной ставки 1-го разряда (ТС1) на тарифный коэффициент (ТК), соответствующий установленному тарифному разряду согласно ЕТС Республики Беларусь.

Тарифная ставка (ТСi) определяется по формуле:

, (6.3)

где ТС1 - действующая в организации тарифная ставка первого разряда, руб;

ТК - тарифный коэффициент согласно ЕТС.

На момент разработки программного обеспечения (01.04.2014 г.) тарифная ставка первого разряда составляет 270 000 рублей. Разработчик данного программного обеспечения имеет 9-ый разряд, тарифный коэффициент согласно ЕТС для него равен 2,93. Следовательно, тарифная ставка работника равна:

Повышение тарифного оклада за сложность и ответственность выполняемых работ 20%

602100*20/100=120420 руб.

Повышение тарифного оклада за работу по контракту 30%

602100*30/100=180630 руб.

Следовательно, тарифный оклад работника:

602100+120420+180630=903150 руб.

Надбавка за сложность и напряженность труда 30%:

903150*30/100=270945 руб.

Основная заработная плата работника:

903150+270945=1174095 руб.

Общие затраты за два месяца на основную заработную плату исполнителя будут равны:

4. Статья "Дополнительная заработная плата" (Зд) на конкретное программное обеспечение включает выплаты, предусмотренные законодательством о труде (оплата отпусков, льготных часов, времени выполнения государственных обязанностей и других выплат, не связанных с основной деятельностью исполнителей), и определяется по нормативу в процентах к основной заработной плате:

, (6.4)

где Зд - дополнительная заработная плата исполнителей на конкретное программное обеспечение, руб.

Нд - норматив дополнительной заработной платы на предприятии, %.

На предприятии норматив дополнительной заработной платы принят в размере 20%. Затраты на дополнительную заработную плату составят:

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

- отчисления в Фонд социальной защиты населения;

- отчисления на обязательное страхование в Белгосстрах.

В 2014 году согласно законодательству норматив отчислений в Фонд социальной защиты населения (Нсз) 34%, а отчислений на обязательное страхование от несчастных случаев в Белгосстрах (Нб) установлен в размере 0,6%.

Сумма отчислений на социальные нужды рассчитывается по формуле:

(6.5)

Сумма отчислений на обязательное страхование в Белгосстрах рассчитывается по формуле:

(6.6)

Сумма отчислений на социальные нужды рассчитывается по формуле:

(6.7)

6. Рассчитаем статью "Амортизация основных средств и нематериальных активов" (А).

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

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

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

, (6.8)

Где Тс - срок службы оборудования, лет.

В данном случае норма амортизации составляет:

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

Годовую сумму амортизации определяем по формуле:

, (6.9)

гдеСпрев - первоначальная стоимость, руб.

На - норма амортизации

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

7. Статья "Спецоборудование для научных (экспериментальных) работ" (Рс) не предусмотрена.

8. Статья "Накладные расходы" (Pн) не предусмотрена.

9. Статья "Прочие прямые расходы" (Пз) не предусмотрена.

Общая сумма затрат по смете (плановая себестоимость) (С) на программное обеспечение рассчитывается по формуле:

(6.10)

Результаты расчетов представлены в таблице 6.2.

Таблица 6.2 - Расчет плановой себестоимости сайта Шумилинского 1

Статья затрат

Затраты, руб.

Материалы и комплектующие (используемые в процессе разработки и производства программного обеспечения) (М);

23500

Электроэнергия (Э);

Основная заработная плата разработчиков (Зо);

1580735

Дополнительная заработная плата разработчиков (Зд);

Отчисления в фонд социальной защиты населения и на обязательное страхование в Белгосстрах (Ссн);

Амортизация оборудования и программного обеспечения (А);

300000

Спецоборудование для научных (экспериментальных) работ (Рс);

-

Накладные расходы (Рн);

-

Прочие прямые расходы (Пз).

-

Общая сумма расходов по смете (плановая себестоимость С)

4246976

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

Рисунок 6.1 - Структура затрат на разработку сайта Шумилинского РАЙПО

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

С учетом действующих в республике нормативных документов отпускная цена на продукцию рассчитывается по формуле:

, (6.11)

гдеОЦбез НДС - отпускная цена разработчика, руб.;

С - плановая себестоимость, руб.;

П - прибыль, руб.

Прибыль рассчитывается по следующей формуле:

, (6.12)

гдеR - уровень рентабельности, %

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


Подобные документы

  • Обзор программного обеспечения электронного магазина, использование языка программирования VbScript. Модельная и физическая структура, разработка регистрационной формы Web-сайта, подключение его к базе данных. Особенности создания страницы пользователя.

    курсовая работа [2,2 M], добавлен 03.04.2013

  • Рассмотрение основных этапов создания сайта. Использование вайрфреймов как документации по проекту. Использование мокапа и структура навигации сайта. Правильный выбор цветов для проекта. Использование модульной сетки и разработка дизайна сайта.

    презентация [2,8 M], добавлен 01.09.2019

  • История развития Интернета и принципы его работы. Сквозные протоколы и шлюзы. Логическая и физическая структура сайта. Основы HTML и форматирование текста. Списки, таблицы, гиперссылки. Мультимедиа на web–странице. Формат задания фреймовой структуры.

    курсовая работа [1,2 M], добавлен 27.03.2009

  • Понятие web-сайта и его типы. Обзор программ для создание web-сайта. Описание конструктора Jimdo. Алгоритм создания сайта для ОАО "Каменск-Уральский литейный завод" с целью уведомления посетителей о выпускаемой продукции. Руководство пользователя.

    курсовая работа [3,8 M], добавлен 05.06.2015

  • Проектирование структуры и информационного содержания сайта. Анализ поисковой статистики и подбор синонимов. Целевая аудитория сайта. Реализация каркаса сайта. Разработка навигации и дизайна сайта с использованием css. Реализация интерактивности.

    курсовая работа [10,7 M], добавлен 01.09.2016

  • Разработка сайта, который предоставит клиентам возможность подробней ознакомиться с футбольным клубом "Арсенал". Основные этапы создания сайта, его архитектура, особенности навигации. Внешний вид главной страницы. Реализация маркетингового инструментария.

    курсовая работа [2,7 M], добавлен 26.02.2015

  • Методы и технологии создания виртуальных магазинов. Программные средства для создания сайта. Разработка php-модуля. Технические возможности СУБД MySQL. Приложения для создания графики и дизайна. Логическая структура сайта. Разработка базы данных.

    курсовая работа [248,1 K], добавлен 24.04.2012

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

    курсовая работа [1,9 M], добавлен 13.12.2014

  • Понятие web-сайта и их типы. Программы для создания web-сайта. Описание структуры проекта. Алгоритм создания сайта. Описание конструктора Jimdo. Языки программирования серверного выполнения. Создание полнофункционального веб-сайта для ОАО "КУЛЗ".

    курсовая работа [3,5 M], добавлен 05.06.2015

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

    дипломная работа [471,5 K], добавлен 23.04.2015

Работы в архивах красиво оформлены согласно требованиям ВУЗов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
Рекомендуем скачать работу.