Разработка сайта для гостиничного комплекса ООО 'Бизон'

  • Вид работы:
    Дипломная (ВКР)
  • Предмет:
    Информационное обеспечение, программирование
  • Язык:
    Русский
    ,
    Формат файла:
    MS Word
    1,21 Мб
  • Опубликовано:
    2017-07-26
Вы можете узнать стоимость помощи в написании студенческой работы.
Помощь в написании работы, которую точно примут!

Разработка сайта для гостиничного комплекса ООО 'Бизон'

Введение

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

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

Цели дипломного проекта:

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

–       разработать сайт для гостиничного комплекса (далее гостиницы) ООО «Бизон»;

–       подтверждение квалификации выпускника.

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

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

–       рассмотреть предназначение сайта гостиницы;

–       проанализировать существующие языки для написания сайта;

–       создать сайт гостиницы;

–       рассчитать экономическую эффективность разработки.

Объект исследования: интернет-ресурс гостиницы.

Предмет - язык гипертекстовой разметки HTML как средство создания сайта.

При написании проекта использовались метод теоретического исследования (анализ).

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

1. Исследовательская часть

.1 История развития сети Интернет

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

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

К созданию Интернета человечество шло долгие годы, изобретая новые и новые средства связи: изобретение телеграфа (1836г.); первый атлантический кабель для связи между континентами (1858г.); изобретение телефона (1876 г.).

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

Первоначальная сеть была создана в конце 1960-х годов и называлась ARPANET. Ее цель состояла в том, чтобы дать возможность подрядчикам, университетам и сотрудникам Министерства обороны, участвующим в исследованиях и разработках оборонного характера, поддерживать связь по компьютерным сетям и совместно использовать вычислительные ресурсы тех немногих на то время мощных компьютеров, которые находились в разных географических точках. В сентябре 1969 года в Калифорнийском университете Лос-Анджелеса (UCLA) была создана пакетная сеть с одинарным маршрутизатором. А вскоре уже заработали четыре маршрутизатора. Система ARPANET быстро разрасталась. К 1977 году она включала в себя 111 систем хостинга. Поскольку многие университеты и исследовательские центры, входящие м ARPANET позднее подсоединили свои местные сети к APANET, в конечном счете она стала стержневой сетью ARPA Internet, система многих сетей, использующих в качестве языка Протокол управления передачей/Инернет-протокол (TCP/IP) как основу архитектуры. ARPANET сыграл важную роль в развитии Интернета. В свое время это была самая большая, наиболее быстро действующая и населенная часть Интернета,

В 1984 году ARPANET разделилась на две сети: ARPANET и Сеть оборонных данных (DDN). DDN продолжает оставаться одной из составляющих сетей Интернета. (Открытая часть DDN называется MILNET). В 1990 году ARPANET прекратила работу, поскольку более эффективную работу Интернет на коммерческой основе смогла обеспечить сеть Национального научного фонда (NSF) и различные сети среднего уровня, финансируемые Национальным фондом науки. Продолжает работать военная сеть в Министерстве обороны.

В 1985 году Национальный фонд науки финансировал создание нескольких национальных суперкомпьютерных центров, которые были предназначены для использования исследователями в университетах по всей стране. К тому времени многие университеты штатов и регионов создали свои местные и региональные сети, а некоторые использовали систему TCP/IP. NSF финансировал создание сетей мощностью в 56 килобайтов/сек, объединившую пять суперкомпьютерных центров и предложил любым региональным и университетским компьютерным центрам, находившимся в пределах физической досягаемости от этой сети подсоединиться к ней. Это был зароды сети Интернет в нынешнем ее виде. Первоначально смысл подключения к ней состоял в том, что это давало дистанционный доступ к суперкомпьютеру.

Целый ряд университетов подсоединились к сети NSF, чтобы получить доступ к суперкомпьютерам. Кроме исследовательских задач выяснилось, что сеть может с успехом быть использована для целей электронной почти, компьютерной передачи файлов и новостей. Объем трафика в сети быстро возрастал. В ноябре 1987 года NSF заключил контракт с Merit Network Inc., которая совместно с IBM, MCI и штатом Мичиган должны были заняться усовершенствованием и эксплуатацией опорной сети NSF, первого уровня доступа к Интернету.

К этому времени основная цель опорной сети NSF состояла в том, чтобы обеспечить связь между растущими региональными сетями, созданы различными университетскими системами. Термин "Интернет" начал употребляться с 1983 года для обозначения концепции взаимокоммутируемых сетей.

В мае 1993 года NSF радикальным образом изменил архитектуру Интернета, поскольку правительство не хотело больше иметь дела с системами опорной сети. Вместо нее NSF выделило ряд «точек доступа в сеть» (NAP), в которых могли бы взаимодействовать друг с другом частные коммерческие опорные сети. В 1994 году NSF объявил о строительстве четырех NAP в Сан-Франциско, Нью-Йорке, Чикаго и Вашингтоне, округ Колумбия. Заказ NSF на четыре точки доступа в сеть был выполнен Ameritech, PacBell, Sprint и MFS Datanet. Дополнительная точка доступа, известная под названием MAE-West, была создана MFS Dananet на Западном побережье.

апреля 1995 года опорная сеть NSF была практически закрыта, а архитектура NAP превратилась в Интернет.

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

Для того, чтобы различные компьютеры в Интернете могли сообщаться друг с другом, используются протоколы, т.е. правила или условия коммуникации. Язык Интернета называется TCP/IP, что означает протокол Управления передачей/Интернет-протокол. Любой компьютер для того, чтобы общаться в Интернете, должен уметь "говорить" на языке TCP/IP. Этот стандарт является "открытым", что означает, что он не является фирменным продуктом какой-либо одной компании. Основная операционная система называется UNIX, но стандарт Интернета приспособлен для использования на всех наиболее распространенных системах, таких как UNIX, PC и Macintosh.

.2 Анализ предметной области и обзор существующих решений

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

База данных должна выполнять следующие основные задачи:

–       хранить сведения обо всех номерах гостиницы;

–       хранить сведения о забронированных номерах клиентов;

–       обеспечивать оформление номера на нужного покупателя.

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

–       клиента и (или) номера (при въезде или отъезде клиента);

–       наличие и возможность предоставления услуг.

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

Обзор существующих решений.

Ресторанно-гостиничный комплекс «Охотник» resthunter.ru.

Рисунок 1. Сайт гостиницы «Охотник»

Достоинства:

–       вся информация (местоположение, режим работы краткое описание) легкодоступна на главной странице сайта;

–       достаточно простой интерфейс;

–       уместные ссылки на социальные сети;

–       адаптивный дизайн;

–       наличие формы для отзывов.

Недостатки:

–       фон сайта повторяется по горизонтали, не достигая нижней части web-страницы;

–       отсутствие формы бронирования и предварительного заказа;

–       нерациональное использование свободного места и распределение элементов на странице;

–       автоматически включающиеся музыкальные файлы на страницах;

–       отсутствие подвала.

Сеть отелей «Седьмое небо» 7or.ru

Рисунок 2. Сайт отеля «Седьмое небо»

Достоинства:

–       информативная главная страница, вся контактная информация аккуратно расположена в «шапке» сайта;

–       гармоничное расположение элементов;

–       удобная навигация;

–       стилистически вписывающийся в дизайн слайдер.

–       наличие формы для отзывов.

Недостатки:

–       отпугивающий рекламный баннер при попадании на сайт;

–       неаккуратное, выпадающее в виде списка, навигационное меню;

–       отсутствие формы бронирования и предварительного заказа;

–       неуместно всплывающие рекламные блоки собственных сервисов;

–       отсутствие адаптивности.

Отель "Привал" otel-prival.ru.

Рисунок 3. Сайт отеля «Привал»

Достоинства:

–       лаконичная главная страница оставляет хорошее первое впечатление;

–       информативность и удобство;

–       все услуги выставлены в «шапке» сайта;

–       наличие модуля для бронирования и отзывов;

Недостатки:

–       отсутствие адаптивности;

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

.3 Требования организации на разработку программного обеспечения

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

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

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

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

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

Наименование работы: разработка сайта гостиницы.

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

Требования к функциональным характеристикам.

Сайт гостиницы ООО «Бизон» должен обеспечивать выполнение функций:

–       предоставление информации о гостинице;

–       предоставление информации об услугах, доступных номерах;

–       предоставление контактной информации;

–       возможность бронирования услуг;

–       возможность обратной связи.

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

Требования к организации входных данных.

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

Файлы указанного формата должны размещаться (храниться) в базе данных сайта.

Требования к организации выходных данных.

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

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

Требования к надежности.

Разрабатываемый сайт должен иметь:

–       возможность самовосстановления после сбоев;

–       парольную защиту при запуске;

–       возможность резервного копирования базы данных;

–       исключение несанкционированного копирования персональных данных покупателей;

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

Требования к составу и параметрам технических средств.

Серверная часть:

–       Веб-сервер Apache 1.3.18 и выше

–       PHP 4.2.0 и выше (должен быть собран как модуль Apache)

–       СУБД MySQL 4.1.14 и выше (предпочтительно: поддержка формата InnoDB).

–       Компьютер с процессором Pentium IV 2 ГГц (рекомендуется от 3 ГГц)

–       Оперативная память 1 Гб (рекомендуется от 2 Гб).

–       Место на жестком диске от 1 Гб.

Клиентская часть:

–       Любой из перечисленный ниже браузеров (указана минимальная версия) с включенным интерпретатором JavaScript:

–       Internet Explorer 10 / Mozilla Firefox 50 / Opera 10.10.

–       Компьютер с процессором Pentium IV 1 ГГц (рекомендуется от 1.5 ГГц).

–       Оперативная память 256 Мб (рекомендуется от 512 Мб).

–       Требования к информационной и программной совместимости.

–       Программа должна работать на операционной системе Windows 7/8/8.1/10 и современных интернет-браузерах.

.4 UML диаграммы. Проектирование базы данных

Проектирование базы данных

Рисунок 4. Структура таблицы user

Рисунок 5. Структура таблицы room

Рисунок 6. Структура таблицы room_type

Рисунок 7. Структура таблицы message

Рисунок 8. Структура таблицы reserve

Рисунок 9. Структура таблицы review

Рисунок 10. Схема базы данных

Рисунок 11. UML диаграмма

Рисунок 12. ER-диаграмма

2. Технологическая часть

.1 Выбор языка программирования

Язык гипертекстовой разметки HTML.- это гипертекстовый язык разметки (HyperText Markup Language), который используется для создания документов в Интернет (веб-страниц). При помощи HTML создается веб-страница, содержащая все нужные элементы. На HTML странице можно разместить простой текст, выделить его жирным или курсивом, вставить ссылку, таблицу, нумерованный или ненумерованный список, картинки, разбить текст на абзацы и разделы, задавать разделам заголовки. Также на HTML страницу можно вставить форму с текстовыми полями, кнопками, выбором вариантов из списка, checkbox'ами и radio элементами. В HTML5 в страницу можно встраивать видео и аудио файлы, рисовать при помощи canvas, делать простые анимации при помощи новых тегов (marquee).

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

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

Сам по себе язык SGML был мало востребован пока сообществу ученных по всему миру не понадобился инструмент способный быстро и легко передавать информацию. В 1991 была разработана система Gopher. Но она не поддерживала графику и гипертекстовые ссылки. Именно тогда на арену вышел Европейский институт физики элементарных частиц (CERN) в лице Тима Бернерса-Ли с проектом «Всемирная паутина».

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

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

Тем временем Тим Бернерс-Ли не почивал на лаврах, а продолжал развитие сети. В 1994 была создана организация которая была призвана стандартизировать гипертекстовую разметку. Организация была названа World Wide Web Consortium (w3c.org) и началась работа над создание спецификации для HTML 2.0. Начиная с версии 3.0 была реализована поддержка СSS которая была создана для разделения элементов отвечающих за отображение и структуру документа.

В начале 1994 года группа разработчиков браузера Mosaic покинула NCSA и совместно с Джеймсом Кларком из Silicon Graphics основала корпорацию Netscape Communications. Через полгода состоялся дебют - вышла первая версия коммерческого браузера Netscape для трех основных платформ. Менеджеры компании прекрасно понимали, что горизонты совсем недолго останутся такими безоблачными, и постарались подстелить соломки где только возможно. Чтобы отхватить как можно больший кусок потенциальной аудитории, привлечь максимальное количество новых пользователей, Netscape вводила в HTML все новые и новые усовершенствования, поддерживавшиеся, естественно, только одноименным браузером. Практически все новые теги были направлены на улучшение внешнего вида документа и расширение возможностей его форматирования.

Выпущенная летом 1996г. версия Internet Explorer 3.0, поддерживавшая практически все расширения Netscape и обладавшая симпатичным и дружественным интерфейсом, очень быстро утвердилась в качестве «второго главного браузера».

Четверные версии обоих браузеров вышли практически одновременно и не отличались друг от друга особой скоростью работы или иными параметрами. Но если Netscape нужно было покупать то Internet Explorer начал поставляться бесплатно в операционной системе Windows и стал фактически стандартом отрасли.

Формальный язык CSS.(Cascading Style Sheets) с английского переводится как каскадные таблицы стилей, - это язык, который используется как средство оформления web-страниц, а именно для работы с шрифтами, цветами, полями, таблицам, картинками, расположением элементов.

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

В 1990-х возникла необходимость стандартизировать web-инструменты, создать общие правила, с помощью которых программисты и web-дизайнеры могли бы создавать сайты. Как результат этой необходимости, появились языки HTML 4.01 и XHTML, а также стандарт CSS.

Первое упоминание о CSS было в 1994 году, когда Хоком Виум Ли предложил использовать CSS (Каскадные таблицы стилей) для стилистического оформления web-страниц. У него не сразу получилось продвинуть свою технологию, - только через пару лет ему удалось привлечь внимание к CSS. Итак, 17 декабря 1996 года опубликована первая спецификация (CSS1) и она была рекомендована к использованию Консорциумом Всемирной паутины (W3C).

После небольшого успеха положение дел у технологии CSS пошли куда лучше и 12 мая 1998 года (через 2 года) была принята рекомендация W3C для CSS2. Следующим этапом была CSS 2.1 - версия W3C от 8 сентября 2009 года, она была построена на базе CSS2, и была работой над исправлением существующих ошибок.

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

Плюсы и минусы использования CSS.

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

Достоинства CSS:

–       Повышение совместимости с разными платформами за счет использования web-стандартов.

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

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

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

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

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

Недостатки CSS:

–       Различное отображение вёрстки в разных браузерах. Если браузеры устаревшие, то возможно, что одни и те же данные CSS по-разному ими интерпретируются.

–       Необходимость исправлять не только один CSS-файл, но и теги HTML. Часто встречается на практике необходимость исправлять не только один CSS-файл, но и теги HTML, которые связаны с селекторами CSS. Иногда это значительно увеличивает время редактирования, а также и тестирования.

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

Язык программирования PHP.- это широко используемый язык сценариев общего назначения с открытым исходным кодом. Говоря проще, PHP это язык программирования, специально разработанный для написания web-приложений (сценариев), исполняющихся на Web-сервере. Аббревиатура PHP означает “Hypertext Preprocessor (Препроцессор Гипертекста)". Синтаксис языка берет начало из C, Java и Perl. PHP достаточно прост для изучения.

Преимуществом PHP является предоставление web-разработчикам возможности быстрого создания динамически генерируемых web-страниц. Важным преимуществом языка PHP перед такими языками, как языков Perl и C заключается в возможности создания HTML документов с внедренными командами PHP. Значительным отличием PHP от какого-либо кода, выполняющегося на стороне клиента, например, JavaScript, является то, что PHP-скрипты выполняются на стороне сервера. Вы даже можете сконфигурировать свой сервер таким образом, чтобы HTML-файлы обрабатывались процессором PHP, так что клиенты даже не смогут узнать, получают ли они обычный HTML-файл или результат выполнения скрипта. PHP позволяет создавать качественные Web-приложения за очень короткие сроки, получая продукты, легко модифицируемые и поддерживаемые в будущем. PHP прост для освоения, и вместе с тем способен удовлетворить запросы профессиональных программистов. Язык PHP постоянно совершенствуется, и ему наверняка обеспечено долгое доминирование в области языков web -программирования, по крайней мере, в ближайшее время. PHP: самый популярный язык для Интернета.(Hypertext PreProcessor, препроцессор гипертекста) - язык программирования, исполняемый на стороне веб-сервера, спроектированный Расмусом Лердорфом (Rasmus Lerdorf) в качестве инструмента создания динамических и интерактивных веб-сайтов.

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

Достоинства PHP:

–       является свободным программным обеспечением, распространяемым под особой лицензией (PHP license);

–       легок в освоении на всех этапах;

–       поддерживается большим сообществом пользователей и разработчиков;

–       имеет развитую поддержку баз данных;

–       имеется огромное количество библиотек и расширений языка;

–       может использоваться в изолированной среде;

–       предлагает нативные средства организации веб-сессий, программный интерфейс расширений;

–       является довольно полной заменой проприетарной среды ASP (Active Server Pages) от Microsoft;

–       может быть развёрнут почти на любом сервере;

–       портирован под большое количество аппаратных платформ и операционных систем.

Недостатки PHP:

–       не подходит для создания десктопных приложений или системных компонентов;

–       имеет слабые средства для работы с исключениями;

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

–       объекты передаются по значению, что смущает многих программистов, привыкших к передаче объектов по ссылке, как это делается в большинстве других языков;

–       веб-приложения, написанные на PHP, зачастую имеют проблемы с безопасностью.

Язык программирования JavaScript.- это полноценный динамический язык программирования, который применяется к HTML документу, и может обеспечить динамическую интерактивность на веб-сайтах. JavaScript сам по себе довольно компактный, но очень гибкий, и разработчиками написано много инструментов поверх основного JavaScript языка, которые разблокируют огромное количество дополнительных функций с очень небольшим усилием. К ним относятся: Программные Интерфейсы приложения (API) встроенные в браузеры, обеспечивающие различные функциональные возможности, такие как динамическое создание HTML и установку CSS стилей, захват и манипуляция видеопотоком, работа с веб-камерой пользователя или генерация 3D графики и аудио сэмплов. Сторонние API позволяют разработчикам внедрять функциональность в свои сайты от других разработчиков, таких как Twitter или Facebook.

Достоинства JavaScript:

–       Ни один современный браузер не обходится без поддержки JavaScript.

–       С использованием написанных на JavaScript плагинов и скриптов справится даже не специалист.

–       Полезные функциональные настройки.

–       Постоянно совершенствующийся язык - сейчас разрабатывается бета-вариация проекта, JavaScript2.

–       Взаимодействие с приложением может осуществляется даже через текстовые редакторы - Microsoft Office и Open Office.

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

Недостатки JavaScript:

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

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

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

Язык программирования MySQL.- это одна из самых популярных и самых распространенных СУБД (система управления базами данных) в интернете. Она не предназначена для работы с большими объемами информации, но ее применение идеально для интернет сайтов, как небольших, так и достаточно крупных. MySQL отличатся хорошей скоростью работы, надежностью, гибкостью. Работа с ней, как правило, не вызывает больших трудностей. Поддержка сервера MySQL автоматически включается в поставку PHP. Немаловажным фактором является ее бесплатность.распространяется на условиях общей лицензии GNU (GPL, GNU Public License). Ранее для долговременного хранения информации мы работали с файлами: помещали в них некоторое количество строчек, а затем извлекали их для последующей работы. Задача длительного хранения информации очень часто встречается в программировании Web-приложений: подсчёт посетителей в счётчике, хранение сообщений в форуме, удалённое управление содержанием информации на сайте и т.д.

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

Достоинства MySQL:

–       Простота в работе - установить MySQL довольно просто. Дополнительные приложения, например GUI, позволяет довольно легко работать с БД.

–       Богатый функционал - MySQL поддерживает большинство функционала SQL.

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

–       Масштабируемость - MySQL легко работает с большими объемами данных и легко масштабируется.

–       Скорость - упрощение некоторых стандартов позволяет MySQL значительно увеличить производительность.

Недостатки MySQL:

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

–       Проблемы с надежностью - из-за некоторых способов обработки данных MySQL (связи, транзакции, аудиты) иногда уступает другим СУБД по надежности.

–       Медленная разработка - Хотя MySQL технически открытое ПО, существуют жалобы на процесс разработки. Стоит заметить, что существуют другие довольно успешные СУБД созданные на базе MySQL, например MariaDB.

.2 Описание и разработка приложения

Рисунок 13. Главная страница сайта

Первая страница, которую видит пользователь при заходе на сайт.

Рисунок 14. Логотип сайта

Рисунок 15. Страница «Номера и Цены»

На странице представлена информация о доступных номерах и их краткое описание.

Рисунок 16. Страница «О компании»

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

Рисунок 17. Страница «Обзоры»

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

Рисунок 18. Страница «Галерея»

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

Рисунок 19. Страница «Контакты»

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

Рисунок 20. Страница «Вход»

Форма для входа в панель администратора. Защищена паролем.

Рисунок 21. Страница «Панель администратора - Типы номеров»

Рисунок 22. Страница «Панель администратора - Заказы»

Рисунок 23. Страница «Панель администратора - Номера»

Рисунок 24. Страница «Панель администратора - Сообщения»

Рисунок 25. Страница «Панель администратора - Обзоры»

Рисунок 26. Страница «Панель администратора - Изменение номера»

Рисунок 27. Страница «Панель администратора - Редактирование заказа»

Рисунок 28. Страница «Панель администратора - Редактирование типа номеров»

Рисунок 29. Страница «Панель администратора - Редактирование обзора»

Рисунок 30. Страница «Галерея - Просмотр изображения»

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

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

Рисунок 31. Мобильная версия главной страницы сайта (1 из 2)

Рисунок 32. Мобильная версия главной страницы сайта (2 из 2)

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

3. Расчет экономической эффективности

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

Таблица 3.1. Трудоемкость разработки программы

Этап проведения

Вид работы

Трудоемкость выполнения (чел.- ч.)

Подготовительный

Изучение предметной области

16


Постановка задач

8


Анализ данных

24


Создание моделей процессов

32

Этап реализации

Разработка алгоритма

30


Разработка пользовательского интерфейса

48





Написание кода

30

Заключительный этап

Отладка

36

Итого трудоемкость разработки сайта:

224


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

Таблица 3.2. Затраты на электроэнергию

Наименование

Паспортная мощность, кВт.

Коэффициент использования мощности

Время работы оборудования

Цена электроэнергии, руб/кВт.ч

Сумма, руб.

Ноутбук HP

0,05

0,5

224

4,5

25,2


Сумма затрат на электроэнергию рассчитывается из следующей формулы (1):

 (1)

Где М - мощность (паспортная) ноутбука, кВт;

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

Ц - цена электроэнергии, руб./кВт.ч;

Т - время работы оборудования, ч.

Так же следует рассчитать сумму затрат на оплату труда разработчика.

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

Таблица 3.3. Затраты на оплату труда

Категория работника

Квалификация

Трудоемкость разработки в часах

Часовая ставка, руб./ч.

Сумма, руб.

Разработчик

программист (студент)

224

50

11200


Сумма затрат на оплату труда (Зтр) вычисляется по формуле (2).

 (2)

Где ЧС - часовая ставка разработчика;

Т - время, потраченное на разработку программы.

Общее время разработчика определяется из таблицы 3 и равно 224 часов. Затраты на оплату труда составляет 11200 рублей.

Среднечасовую заработную плату можно рассчитать по формуле (3).

 (3)

Где ЧС - часовая ставка разработчика, руб./ч.;

ЗП - среднемесячная заработная плата разработчика (а именно веб-разработчика), руб.;

ФРВ - среднемесячный фонд рабочего времени (примерно 180 часов).

Проанализировав требования работодателей и предлагаемых должностей, сделан вывод, что средняя заработная плата начинающих программистов и разработчиков около 20 000 рублей. Подставив нынешние значения в формулу (3) часовая ставка стала равна 50 руб./ч.

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

Таблица 3.4. Расчет амортизации оборудования

Наименование

Стоимость оборудования, руб.

Годовая норма амортизации, %

Время работы оборудования в период разработки программы, ч.

Сумма, руб.

Ноутбук

20000

14

2000

224

313,6


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

Норма амортизации получилась из данных, что за период обновления оборудования, как правило, берут 5 - 7 лет, далее оборудование признается устаревшим.

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

Таблица 3.5. Расчет амортизации программного обеспечения

Наименование

Стоимость оборудования, руб.

Годовая норма амортизации, %

Эффективный фонд времени работы ПО, ч./год

Время работы ПО в период разработки программы, ч.

Сумма, руб.

CA ERwin Process Modeler

57241

25

2000

12

85,86

Windows 7 Home Basic

4000

25

2000

224

336

Итого

421,86


Норма амортизации берется из расчета, что все программное обеспечение имеет период обновление 3 - 5 лет.

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

,6 + 421,86 = 735,46 руб.

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

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

Таблица 3.6. Затраты на разработку сайта гостиницы ООО «Бизон»

Статьи затрат

Сумма, руб.

Материальные затраты

25,2

Затраты на оплату труда

11200

Амортизационные отчисления

735,46

Прочие затраты

5600

Итого

17560,66


В итоге затраты на разработку сайта составляют 17560,66 рублей.

4. Инструкция по охране труда для программиста

.1 Общие требования безопасности

Настоящая инструкция по охране труда программиста, занятого эксплуатацией персональных электронно-вычислительных машин (ПЭВМ) и видеодисплейных терминалов ВДТ (далее программистов), разработана с учетом условий его работы в конкретной организации - ООО «Бизон».

На программиста могут воздействовать опасные и вредные производственные факторы:

Физические:

а) Повышенные уровни электромагнитного излучения.

б) Повышенные уровни рентгеновского излучения.

в) Повышенные уровни ультрафиолетового излучения.

г) Повышенный уровень инфракрасного излучения.

д) Повышенный уровень статического электричества.

е) Повышенные уровни запыленности воздуха рабочей зоны.

ж) Повышенное содержание положительных аэроионов в воздухе рабочей зоны.

з) Пониженное содержание отрицательных аэроионов в воздухе рабочей зоны.

и) Пониженная или повышенная влажность воздуха рабочей зоны.

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

л) Повышенный уровень шума.

м) Повышенный или пониженный уровень освещенности.

н) Повышенный уровень прямой блесткости.

о) Повышенный уровень отраженной блесткости.

п) Повышенный уровень ослепленности.

р) Неравномерность распределения яркости в поле зрения.

с) Повышенная яркость светового изображения;

т) Повышенный уровень пульсации светового потока;

у) Повышенное значение напряжения в электрической цепи, замыкание которой может произойти через тело человека;

Химические:

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

Биологические:

а) Повышенное содержание в воздухе рабочей зоны микроорганизмов.

Психофизиологические:

а) Напряжение зрения.

б) Напряжение внимания.

в) Интеллектуальные нагрузки.

г) Эмоциональные нагрузки.

д) Длительные статические нагрузки.

е) Монотонность труда.

ж) Большой объем информации, обрабатываемой в единицу времени.

з) Нерациональная организация рабочего места.

К работам программистом допускаются:

а) Лица не моложе 18 лет, прошедшие обязательный при приеме на работу и ежегодные медицинские освидетельствования на предмет пригодности для работы.

б) Прошедшие вводный инструктаж по охране труда.

в) Прошедшие обучение безопасным приемам и методам труда по программе, утвержденной руководителем предприятия (работодателем), разработанной на основе Типовой программы, и прошедшие проверку знаний, в том числе по электробезопасности.

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

д) Прошедшие инструктаж по охране труда на конкретном рабочем месте по данной инструкции.

Программист должен быть обеспечен, СИЗ в соответствии с Правилами обеспечения работников специальной одеждой, специальной обувью и другими средствами индивидуальной защиты, утвержденными Постановлением Минтруда России от 18 декабря 1998 г. № 51; выдаваемые работникам средства индивидуальной защиты должны соответствовать характеру и условиям работы и обеспечивать безопасность труда. Не допускается приобретение и выдача работникам средств индивидуальной защиты без сертификата соответствия.

Характеристика выданных СИЗ (номенклатура, срок выдачи и нормы соответствия) устанавливается из личных карточек работников, занятых на определенном рабочем месте.

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

.2 Требования безопасности перед началом работы

Перед началом работы программист обязан:

Осмотреть и привести в порядок рабочее место.

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

Проверить правильность подключения оборудования в электросеть.

Протереть специальной салфеткой поверхность экрана.

Убедиться в отсутствии дискет в дисководах процессора персонального компьютера.

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

При включении компьютера соблюдать правила электробезопасности.

Программисту запрещается приступать к работе при:

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

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

Отсутствие защитного экранного фильтра класса «полная защита».

Отключенном заземляющем проводнике защитного фильтра.

Обнаружение неисправности оборудования.

Отсутствие защитного заземления устройств ПЭВМ и ВДТ.

Отсутствие углекислотного или порошкового огнетушителя и аптечки первой помощи.

Нарушение гигиенических норм размещения ВДТ (при однорядном расположении менее 1 м от стен, при расположении рабочих мест в колонну на расстоянии менее 1,5 м, при размещении на площади менее 6 кв. м на одно рабочее место, при рядном размещении дисплеев экранами друг к другу).

.3 Требования безопасности во время работы

Программист во время работы обязан:

Выполнять только ту работу, которая ему была поручена, и по которой он был проинструктирован.

В течение всего рабочего дня содержать в порядке и чистоте рабочее место.

Держать открытыми все вентиляционные отверстия устройств.

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

Выполнять санитарные нормы и соблюдать режимы работы и отдыха.

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

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

Соблюдать расстояние от глаз до экрана в пределах 60 - 80 см.

Программисту во время работы запрещается:

Прикасаться к задней панели системного блока (процессора) при включенном питании.

Переключать разъемы интерфейсных кабелей периферийных устройств при включенном питании;

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

Производить отключение питания во время выполнения активной задачи; производить частые переключения питания;

Допускать попадание влаги на поверхность системного блока (процессора), монитора, рабочую поверхность клавиатуры, дисководов, принтеров и др. устройств;

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

Производить самостоятельно вскрытие и ремонт оборудования.

.4 Требования безопасности в аварийных ситуациях

Программист обязан:

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

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

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

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

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

.5 Требования безопасности по окончании работы

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

Произвести закрытие всех активных задач.

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

Убедиться, что в дисководах нет дискет.

Выключить питание системного блока (процессора).

Выключить питание всех периферийных устройств.

Отключить блок питания.

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

5. Листинг кода главной страницы сайта

<!DOCTYPE html>

<html lang="en">

<head>

<title>Гостиница Центральная</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

<!-- Google fonts -->

<link href='http://fonts.googleapis.com/css?family=Raleway:300,500,800|Old+Standard+TT' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/css?family=Raleway:300,500,800' rel='stylesheet' type='text/css'>

<!-- font awesome -->

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

<!-- bootstrap -->

<link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css" />

<!-- uniform -->

<link type="text/css" rel="stylesheet" href="/assets/uniform/css/uniform.default.min.css" />

<!-- animate.css -->

<link rel="stylesheet" href="/assets/wow/animate.css" />

<!-- gallery -->

<link rel="stylesheet" href="/assets/gallery/blueimp-gallery.min.css">

<!-- favicon -->

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">

<link rel="icon" href="/favicon.ico" type="image/x-icon">

<link rel="stylesheet" href="/assets/style.css">

</head>

<body id="home">

<!-- header -->

<nav>

<div>

<!-- Brand and toggle get grouped for better mobile display -->

<div>

<button type="button">

<span>

<span>

<span>

<span>

</button>

<a>

</div>

<!-- Collect the nav links, forms, and other content for toggling -->

<div>

<ul>

<li><a href="index.php">Главная </a></li>

<li><a href="rooms-tariff.php">Номера и Цены</a></li>

<li><a href="introduction.php">О Компании</a></li>

<li><a href="gallery.php">Галерея</a></li>

<li><a href="reviews.php">Обзоры</a></li>

<li><a href="contact.php">Контакты</a></li>

<li><a href="/admin">Вход</a></li>

</ul>

</div><!-- Wnavbar-collapse -->

</div><!-- container-fluid -->

</nav>

<!-- header -->

<!-- banner -->

<div>

<img src="images/photos/banner.jpg">

<div>

<div>

<div>

<h1>Лучшая гостиница в Орехово-Зуево</h1>

<p>, д.4

<p>Тел.: (496) 412-58-72 </p>

</div>

<a href="#information">

</div>

</div>

</div>

<!-- banner-->

<!-- reservation-information -->

<div id="information">

<div>

<div>

<div>

<div>

</div>

<div>

<h3>Бронирование</h3>

<form action="/reserve.php" role="form">

<div>

<input type="text">Имя">

</div>

<div>

<input type="email">

</div>

<div>

<input type="Phone">Телефон">

</div>

<div>

<div>

<div>

<select>Число комнат">

<option value="0">Число комнат</option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

</select>

</div>

<div>

<select>Число взрослых">

<option value="0">Число взрослых</option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

</select>

</div></div>

</div>

<div>

<div>

<div>

<select>

<option>День</option>

</select>

</div>

<div>

<select>

<option>Месяц</option>

</select>

</div>

<div>

<select>

</select>

</div>

</div>

</div>

<div>

<textarea>

</div>

<button>Отправить</button>

</form>

</div>

</div>

</div>

</div>

<!-- reservation-information -->

<!-- services -->

<div>

<div>

<div>

<div>

<!-- RoomCarousel -->

<div id="RoomCarousel">

<div>

<div>

<div>

<div>

</div>

<!-- Controls -->

<a>

<a>

</div>

<!-- RoomCarousel-->

<div>Номера<a href="rooms-tariff.php">

</div>

<div>

<!-- RoomCarousel -->

<div id="TourCarousel">

<div>

<div>

<div>

<div>

</div>

<!-- Controls -->

<a>

<a>

</div>

<!-- RoomCarousel-->

<div>Туры<a href="gallery.php">

</div>

<div>

<!-- RoomCarousel -->

<div id="FoodCarousel">

<div>

<div>

<div>

<div>

</div>

<!-- Controls -->

<a>

<a>

</div>

<!-- RoomCarousel-->

<div>Еда и напитки<a href="gallery.php">

</div>

</div>

</div>

</div>

<!-- services -->

<footer>

<div>

<div>

<div>

<h4>Гостиница "Центральная"</h4>

<p>Нельзя не отметить, что в прошлом заведение было известно как гостиница Советская Орехово-Зуево - под этим названием его и помнят те, кто давно не был в нашем городе. Комплекс расположился неподалеку от железнодорожного и автовокзалов, рядом с администрацией. Инфраструктура в районе гостиницы Центральной Орехово-Зуево вполне достойная: поблизости имеются кафе, рестораны, магазины, торговые центры, кинотеатр. Размеры комплекса впечатляющие: это сорок одноместных номеров, двадцать двухместных, а также десять люксов. То есть с проблемой отсутствия свободных номеров для заселения вам вряд ли придется столкнуться.</p>

</div>

<div>

<h4>Quick Links</h4>

<li><a href="rooms-tariff.php">Номера и Цены</a></li>

<li><a href="introduction.php">О Компании</a></li>

<li><a href="gallery.php">Галерея</a></li>

<li><a href="contact.php">Контакты</a></li>

</ul>

</div>

</div>

</div>

<!--/.row-->

</div>

<!--/.container-->

<!--/.footer-bottom-->

</footer>

<a href="#home">

<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->

<div id="blueimp-gallery">

<!-- The container for the modal slides -->

<div>

<!-- Controls for the borderless lightbox -->

<h3>

<a>

<a>

 <a>

 <!-- The modal dialog, which will be used to wrap the lightbox content -->

</div>

<script src="assets/jquery.js"></script>

<!-- wow script -->

<script src="assets/wow/wow.min.js"></script>

<!-- uniform -->

<script src="assets/uniform/js/jquery.uniform.js"></script>

<!-- boostrap -->

<script src="assets/bootstrap/js/bootstrap.js" type="text/javascript" ></script>

<!-- jquery mobile -->

<script src="assets/mobile/touchSwipe.min.js"></script>

<!-- jquery mobile -->

<script src="assets/respond/respond.js"></script>

<!-- gallery -->

<script src="assets/gallery/jquery.blueimp-gallery.min.js"></script>

<!-- custom script -->

<script src="assets/script.js"></script>

</body>

</html>

6. Листинг кода страницы Контакты с формой обратной связи

<!DOCTYPE html>

<html lang="en">

<head>

<title>Гостиница Центральная</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

<!-- Google fonts -->

<link href='http://fonts.googleapis.com/css?family=Raleway:300,500,800|Old+Standard+TT' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/css?family=Raleway:300,500,800' rel='stylesheet' type='text/css'>

<!-- font awesome -->

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

<!-- bootstrap -->

<link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css" />

<!-- uniform -->

<link type="text/css" rel="stylesheet" href="/assets/uniform/css/uniform.default.min.css" />

<!-- animate.css -->

<link rel="stylesheet" href="/assets/wow/animate.css" />

<!-- gallery -->

<link rel="stylesheet" href="/assets/gallery/blueimp-gallery.min.css">

<!-- favicon -->

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">

<link rel="icon" href="/favicon.ico" type="image/x-icon">

<link rel="stylesheet" href="/assets/style.css">

</head>

<body id="home">

<!-- header -->

<nav>

<div>

<!-- Brand and toggle get grouped for better mobile display -->

<div>

<button type="button">

<span>

<span>

<span>

<span>

</button>

<a>

</div>

<!-- Collect the nav links, forms, and other content for toggling -->

<div>

<ul>

<li><a href="index.php">Главная </a></li>

<li><a href="rooms-tariff.php">Номера и Цены</a></li>

<li><a href="introduction.php">О Компании</a></li>

<li><a href="gallery.php">Галерея</a></li>

<li><a href="reviews.php">Обзоры</a></li>

<li><a href="contact.php">Контакты</a></li>

<li><a href="/admin">Вход</a></li>

</ul>

</div><!-- Wnavbar-collapse -->

</div><!-- container-fluid -->

</nav>

<!-- header -->

<div>

<h1>Контакты</h1>

<p><strong>Телефон:</strong> (496) 412-58-72</p>

<p><strong>Адрес:</strong> Россия, Московская область, Орехово-Зуево, пл. Октябрьская, д.4</p>

<!-- form -->

<div>

<div>

<div>

<div>

<!--<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d9933.460884430251!2d-0.13301252240929382!3d51.50651527467666!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47d8a00baf21de75%3A0x52963a5addd52a99!2sLondon%2C+UK!5e0!3m2!1sen!2snp!4v1414314152341" width="100%" height="300" frameborder="0"></iframe>-->

<iframe width="100%" height="300" frameborder="0" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2666.5583056857563!2d38.97731093565738!3d55.80540381742315!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x414b1c6c6c6f0ec3%3A0xddb3dbe9877969d3!2z0KbQtdC90YLRgNCw0LvRjNC90YvQuSwg0JPQvtGB0YLQuNC90LjRh9C90YvQuSDQmtC-0LzQv9C70LXQutGB!5e0!3m2!1sru!2sru!4v1491348134576" allowfullscreen></iframe>

</div>

<div>

<div>

<h4>Напишите нам</h4>

<form role="form" action="/send-message.php" method="post">

<div>

<input name="name" type="text">Имя">

</div>

<div>

<input name="email" type="email">

</div>

<div>

<input type="tel" name="phone">Телефон">

</div>

<div>

<textarea name="message">Сообщение" rows="4"></textarea>

</div>

<button type="submit">Отправить</button>

</form>

</div>

</div>

</div>

</div>

</div>

<!-- form -->

</div>

<footer>

<div>

<div>

<div>

<h4>Гостиница "Центральная"</h4>

<p>

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

</p>

</div>

<div>

<h4>Навигация</h4>

<ul>

<li><a href="rooms-tariff.php">Номера и Цены</a></li>

<li><a href="introduction.php">О Компании</a></li>

<li><a href="gallery.php">Галерея</a></li>

</ul>

</div>

<div>

<h4>Контакты</h4>

<p>Телефон: (496) 412-58-72</p>

<p>Адрес: Орехово-Зуево, пл. Октябрьская, д.4</p>

</div>

</div>

</div>

<!--/.row-->

</div>

<!--/.container-->

<!--/.footer-bottom-->

</footer>

<a href="#home">

<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->

<div id="blueimp-gallery">

<!-- The container for the modal slides -->

<div>

<!-- Controls for the borderless lightbox -->

<h3>

<a>

<a>

 <a>

 <!-- The modal dialog, which will be used to wrap the lightbox content -->

</div>

<script src="assets/jquery.js"></script>

<!-- wow script -->

<script src="assets/wow/wow.min.js"></script>

<!-- uniform -->

<script src="assets/uniform/js/jquery.uniform.js"></script>

<!-- boostrap -->

<script src="assets/bootstrap/js/bootstrap.js" type="text/javascript" ></script>

<!-- jquery mobile -->

<script src="assets/mobile/touchSwipe.min.js"></script>

<!-- jquery mobile -->

<script src="assets/respond/respond.js"></script>

<!-- gallery -->

<script src="assets/gallery/jquery.blueimp-gallery.min.js"></script>

<!-- custom script -->

<script src="assets/script.js"></script>

</body>

</html>

Заключение

гипертекстовый сайт программный интерфейс

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

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

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

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

–       проанализированы сайты аналогичных компаний;

–       выбрана инструментальная среда для разработки сайта;

–       спроектированы макет сайта и базы данных;

–       реализованы разработанные схемы сайта и базы данных с помощью программного обеспечения;

–       изучены требования охраны труда и техники безопасности для лиц, работающих с ЭВМ и компьютерной техникой;

–       изучены языки программирования и технологии HTML, CSS, PHP, JavaScript, MySQL;

–       рассчитана экономическая эффективность разработки сайта, затраты составили 17560,66 рублей.

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

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

–       совершенствование системы бронирования;

–       добавление более актуального материала;

–       расширение таблиц базы данных;

–       автоматизация оповещения клиента при помощи дополнительного сервера электронной почты

–       установка более высокого уровня защиты для панели администратора.

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

Литература

1.      Гаевский А.Ю. 100% самоучитель. Создание Web-страниц и Web-сайтов. HTML и JavaScript / А.Ю. Гаевский, В.А. Романовский. - М.: Триумф, 2016. - 464c.

.        Гарнаев Андрей WEB-программирование на Java и JavaScript / Андрей Гарнаев, Сергей Гарнаев. - Москва: ИЛ, 2016. - 822c.

.        Глушаков С.В. Программирование Web-страниц. JavaScript. VBScript / С.В. Глушаков, И.А. Жакин, Т.С. Хачиров. - М.: Фолио, 2012. - 390c.

.        Дакетт Дж. HTML и CSS. Разработка и дизайн веб-сайтов (+ CD-ROM) / Джон Дакетт. - М.: Эксмо, 2013. - 480c.

.        Дакетт Дж. Основы веб-программирования с использованием HTML, XHTML и CSS / Джон Дакетт. - М.: Эксмо, 2016. - 768c.

.        Дебольт HTML и CSS. Совместное использование / Дебольт, Вирджиния. - М.: НТ Пресс, 2013. - 512c.

.        Дронов В. HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов / В. Дронов. - СПб. : БХВ-Петербург, 2014. - 904c.

.        Дронов В. JavaScript в Web-дизайне / В. Дронов. - М.: СПб: БХВ, 2015. - 880c.

.        Дронов Владимир HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов / Владимир Дронов. - СПб.: БХВ-Петербург, 2012. - 416c.

.        Дунаев Вадим Web-программирование для всех / Вадим Дунаев. - СПб.: БХВ-Петербург, 2015. - 560c.

.        Дунаев Вадим Сценарии для Web-сайта. PHP и JavaScript / Вадим Дунаев. - СПб.: БХВ-Петербург, 2014. - 576c.

.        Кузнецов PHP. Практика создания Web-сайтов / Кузнецов М.В. и. - СПб.: БХВ-Петербург, 2012. - 716c.

.        Кузнецов М.В. PHP. Практика создания Web-сайтов / М.В. Кузнецов. - СПб.: БХВ-Петербург, 2012. - 160c.

.        Лазаро Исси Коэн Полный справочник по HTML, CSS и JavaScript / Лазаро Исси Коэн, Джозеф Исси Коэн. - М.: ЭКОМ Паблишерз, 2013. - 667c.

.        Маркин А.В. Основы Web-программирования на PHP / А.В. Маркин, С.С. Шкарин. - Москва: ИЛ, 2012. - 256c.

Похожие работы на - Разработка сайта для гостиничного комплекса ООО 'Бизон'

 

Не нашли материал для своей работы?
Поможем написать уникальную работу
Без плагиата!