Содержание:

введение

В 2017 году уже нельзя сказать, что веб-сайтом можно кого-то удивить. Для того, чтобы развить себя как бренд, недостаточно написать просто веб-сайт для того, чтобы Вас заметили. Интернет по своей сути уже давным-давно нельзя назвать просто местом для получения информации. Если вернуться в начало 2000-х годов, то интернет была местной тусовкой для научных руководителей, для правительств и для крупных вузов в России. Мобильный интернет или мобильный сайт тогда было на грани фантастики.

К примеру, Web 1.0 был создан 1991 году вместе со всемирной паутиной. Web 2.0 был создан в январе 1999 году. С тех пор достаточно многое изменилось в плане обмена информацией, в плане скорости получения и отправления данных, в плане этики и культуры пользования информацией. К примеру, если к 1991 году в августе был создан первый сайт, то 2001 году 29 254 370 сайтов было по статистике веб-сайта.^[1] Если для какой-то крупной организации сайт является не только неотъемлемой частью, но и без нее компания без нее может потерять существенный поток клиентов. Если раньше наличие сайта раньше являло за собой нечто престижное, то в 2017 году это очень серьезная работа для определенных организаций, так как возможности веб-ресурса безграничны, если мы смотрим интернет-магазин, то он должен быть обязательно защищенным с точки зрения информационной безопасности и тут не помогут стандартные или уязвимые простые пароли, так как существуют очень большое количество ботов и утилит, которые могут подбирать до миллиона паролей в минуту. С другой стороны, это плюс, это дает очень существенное развитие информационных технологий, конференций, таких как Positive Hack Days или целых университетов по информационной безопасности, к примеру международный дистанционный университет EC-Council. Мобильная адаптация очень важна в наше сегодняшнее время в связи с тем, что по статистике в интернет выходят днем именно по мобильным устройствам. Это существенно упрощает процесс получения информации, которая имеет свои преимущества и недостатки. Единственным существенным недостатком отмечу, что дети до 6 лет могут получить к любой информации, а это без специального ограничения родителей чревато познанием негативной информации (под негативным подразумеваю, что контент 18+), а это дает существенную психологическую травму ребенку, что приведет к психологу для лечения последствий этого.

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

Глава 1. Аналитическая часть.

Цели и концепция Web-ресурса.

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

К примеру, на сегодняшний день по данным опроса фонда «Общественное мнение» на 2016 год 87% Россиян считают, что изобретение интернета принесло намного больше пользы, чем вреда. Немного статистики в рисунке 1, который показывает кто в нашей стране и для чего использует Интернет.

Рисунок 1. Результаты опроса фонда «Общественное мнение» на 2016 год.

Что включает в себя использование интернета в 2017 году:

• Просмотр погоды
• Оплата услуг всех видов: коммунальные, мобильная связь и интернет.
• Покупка техники, мебели, очков, рюкзаков, бытовой техники
• Удаленная работа как преподавание, разработка и системное администрирование, программирование
• Доступ к Dark Net
• Поиск единомышленников, любовного партнера.
• Дистанционное обучение, повышение квалификации, получение высшего образования
• Поиск информации о том, как приготовить ту или иную еду
• VoIP звонки, вебинары, обмен зашифрованными сообщениями
• Отправка отчета о температуре, о влажности и состояния дома
• Отправка метеорологического отчета централизованным серверам
• Отправка данных в облако, облачные вычисления
• Использование криптовалютой, ее обмен, добыча
• Контейнеризация систем
• Выполнение той или иной работы, как настройка серверов, настройка маршрутизаторов
• Обмен фотографиями посредством мессенджеров, Instagram

Так же фонд «Общественное мнение» утверждает, что наши регионы

в России достаточно интенсивно используют средства интернета. Статистика на 2016 год приведена на рисунке 2.

Рисунок 2. Результаты исследования фонда «Общественное мнение» на 2016 год.

Рассмотрим на примере интернет вещей (англ. Internet of Things, IoT), которые получили не только среди обычных пользователей, но и среди крупных компаний, связь которых осуществляется посредством интернета.

Холодильники, лампочки, термометры, обувь, одежда, очки, система садового полива, будильник, кондиционер, принтер, датчики движения и освещенности, стиральные машины, автомобили и т.п. работает уже посредством интернета. Крупные компании как IBM, Apple, LG, Samsung, Tesla, SpaceX, Google, Mikrotik, Cisco, Nike, HP – все они развивают интернет вещи, так как система привнесла очень много удобства при работе с ней. Конечно, были неоднократные взломы и атаки на интернет вещей и это большой минус. Самый большой существенный плюс, они все передают информацию через интернет, работают посредством технологии клиент-серверной технологии, что как раз затрагивает нашу тему использования веб-ресурсов.

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

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

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

 Обоснование необходимости создания Web-ресурса.

Expand the definition of 'reading' to include non-fiction, humor, graphic novels, magazines, action adventure, and, yes, even websites. It's the pleasure of reading that counts; the focus will naturally broaden. A boy won't read shark books forever.
Jon Scieszka, American writer

Самая главная цель веб-ресурса – обмен информацией. Но в 2017 году намного проще заявить о себе через социальные сети, через Instagram, Telegram группу или YouTube канал. Зачем именно веб-ресурс? К примеру, для компании Apple или Microsoft если бы в 2017 году заявили о себе, но при без веб-ресурса, то это как минимум было бы странно, и они не имели бы такой колоссальный успех. Nvidia, который может под каждого пользователя подобрать индивидуальную видеокарту или другую вычислительную мощность, то мы бы, возможно, не знали бы до сих пор о преимуществах виртуальной реальности или не смогли бы так же быстро и качественно сделать объекты для 3D печати или не было бы международных кибер-соревнований. Не имея веб-ресурсы, мы бы не смогли получить мгновенный доступ ко всей информации, обновить свои технические, гуманитарные, философские, религиозные знания. Возможно, даже стоит углубиться в тему и почему есть необходимость создания веб-ресурса под мобильные телефоны. Если рассмотреть на примере университета МФПУ Университет, то станет отчётливо понятно, что мобильно-ориентированный веб-ресурс имеет намного большую посещаемость чем не ориентированный. К примеру, университеты Лиги Плюща не всегда идут в ногу со временем, хотя Массачусетский технологический институт уже 2000-х имел онлайн курсы на своём сайте, что нельзя сказать по поводу наших российских государственных вузов. Можно и сейчас сказать, что они далеко не продвинулись по сравнению с коммерческими вузами, которые всегда стараются обновлять информацию и улучшать качество аудитории посредством созывов знаменитых людей. На сегодняшний 2017 год нельзя сказать, что один лишь веб-сайт является хорошим ресурсом для получения знаний. Отнюдь, имея группу ВКонтакте, канал в YouTube можно повысить эффективность получения знаний.

Если рассмотреть на сегодняшний день обычный магазин техники или одежды не может существовать без интернет-магазина. Они могут работать, но, когда склад находится в Балтасинском районе республики Татарстан, а заказ сделают из Москвы в связи с тем, что цена и перевозка намного дешевле, чем в самой Москве. Так же следует подчеркнуть, что метеостанции, IP телефония, облачное хранилище данных – все это работает через веб-ресурсы. Поражает воображение весь этот масштаб, который с одной стороны вызывает восхищение и чувство комфорта, потому что вы сможете, не вставая из кровати заказать себе завтрак, успеть поговорить с родными, если они находятся в другой стране или городе, поднять свой уровень английского, оплатить все онлайн банковским сервисом и технологией Android pay. Всего лишь за один час веб-ресурсы успеть многое сделать. А все это возможно благодаря веб-ресурсам, которые доступны на сегодняшний день.

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

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

Если смотреть создание веб-ресурса для того, чтобы вытащить компанию из дна, то это не является решением проблемы, поэтому нужна правильная обоснованность и компетентность ИТ- менеджера. Или простому кафе предложить сайт с калькулятором приготовления пиццы или шавермы, где обо не будет никогда, то действительно не стоит даже начинать этот проект. К примеру, бывший глава Apple Стив Джобс упомянул об облачных вычислениях так: “I don’t need a hard disk in my computer if I can get to the server faster… carrying around these non-connected computers is byzantine by comparison.” Как он был прав, что сетевые сервисы работают намного быстрее, чем один компьютер, мощность и скорость повышается в несколько раз.

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

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

 Описание свойств Web-ресурса, требуемых для решения выбранной задачи.

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

К примеру, голосовые сервис Google, который имеет возможность не только открытия камеры, приложений, но и выделяется умением читать статьи, новостные ленты, открывать видео и отправить сообщения. Чем помогает голосовой сервис и кому? Имея такие свойства, облегчает жизнь не только водителям, но и незрячим пользователям.

Какими же общими свойствами характеристиками должен обладать тот или иной веб-ресурс?

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

Компания Google в новых версиях Android показывает какие новые функции и возможности появились, то же самое касается Adobe Design Creative Cloud, при обновлении новой версии программы показывает новые возможности программы, что обеспечивает более быструю адаптацию под пользователя. В представлении CS50 Harvard профессор компьютерных наук David J. Malan тоже использовал облачную платформу для редактирования и написания IDE Atom. Конечно же, пользоваться программой не составляло особого труда, так как интерфейс пользователя максимально доступный. Поэтому очень важно сделать его максимально доступным, что позволит пользователю быстро и эффективно решить поставленную перед ним задачу, и вернуться на тот или иной веб-ресурс снова и снова.

Второй и не наименее важной характеристикой является минимализм. Keep it short, simple (KISS) принцип в США появилось 1960 году, потому что сложное невозможно было реализовать или сделать хотя бы реализуемой. Поэтому разбивая задачи на подзадачи, убирая лишнее и оставляя самое важное в центре внимания, разработчики, изобретатели таким образом улучшают качество продукта. К примеру, компания Apple всегда придерживалась принципу минимализма

(Рисунок 3), сам бывший создатель Стив Джобс всегда говорил, что продукт должен быть таким, что хочется его лизнуть. Google исследует возможности своих сервисов, отправляя статистику использования и формы обратной связи. Они знают, где чаще всего задерживается взгляд пользователя, как используется приложение и для чего используется, результатом этого является ежегодный обновляемый и удобный Material Design, которую начали придерживаться и другие компании.

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

Рисунок 3. Новые часы Apple Watch Series 2

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

Отзывчивый веб-ресурс можно построить следующими способами: AJAX-технология загрузки веб-страниц, возможность комфортного открытия на любом устройстве, простота изображений и наличие всех разрешений, правильные настройки CSS для каждого девайса, открытость для сенсорных устройств (работа с жестами, возможность вызова при нажатии на номер телефона), использование JavaScript методов, удобная навигация, жесты. Компания Google специально для отзывчивости веб-ресурса создала отдельный источник информации.^[2]

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

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

Характеристика целевой аудитории.

Целевая аудитория (с англ.  target audience, target group) – это потенциальные и существующие потребители, которые приобретают и употребляют Ваш продукт. На сегодняшний день очень важно изучить рынок потребителей для увеличения прибыли и оборота компании. Если это молодежь, то веб-ресурс должен быть максимально динамичным, приукрашен инфографикой, привлекательным, простым для усвоения. Для старшей аудитории не важна динамичность, больше важна информативность и точность получаемой информации. К примеру, на сайте если будет только текст, но не будет ни одной картинки, когда для пользователя важна максимальная точность, он может засесть надолго ради усвоения качественного материала. Так же стоит включить в группу старших группу ученых, так как между качеством и привлекательностью они тоже выберут качество материала. Если мы вернемся к Рисунку 1, то мы увидим статистику аудитории, которая использует материал для усвоения. Как мы видим, и мужчины, и женщины.

Рисунок 4. Статистика использования языков в интернете

на 5 окт. 17 г.^[3]

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

И так, основными социально-демографическими параметрами целевой аудитории является:

• Пол
• Возраст
• Образование
• Уровень дохода
• Социальный и семейный статус
• Профессия, место работы, род деятельности
• Национальность или расовая принадлежность
• Географию проживания

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

Рисунок 5. Статистика использования социальных веб-ресурсов на декабрь 2015 года.^[4]

По рисунку 5 видно, что пользователи чаще всего используют Facebook в США, потом Instagram, Snapchat. Как мы видим на рисунке, нам в первую очередь нужно заявить о себе в Facebook, создавая и продвигая страницу интересными видеороликами и короткими статусами в виде акций. В Instagram мы можем выложить каждодневное блюдо с интересными фото или короткие динамичные и смешные видео для молодой аудитории. Так же нам поможет продвижению посещение конференций и выигрыши среди самых полезных блюд в Америке, так как здоровье, как и в то время, как и в наш 2017 год является трендом. Так же поможет продвижению частые розыгрыши в виде скидок или акций.

Рисунок 6. Данные по посещаемости веб-ресурсов в России на Август 2017 г. ^[5]

Как мы видим, в России ситуация кардинально отличается по сравнению с Америкой. Интерес у пользователей абсолютно разный, не исключение, что на это влияет разность в годах. Следует учитывать, что внедрение интернет-ресурсов так же происходит по-разному в зависимости от геолокации, поэтому не стоит это принимать как максимально точные данные, в обеих странах есть возможность смены местоположения с помощью VPN и TOR. В России по наблюдениям заметно, что стоит сделать страницу на сайте ВКонтакте, YouTube, Одноклассники. Лучше всего продвигать свой веб-ресурс через поисковые системы Яндекс и Mail.ru, нежели в Google.

Рисунок 7. Статистика использования устройствами по континентам на январь 2017 г.^[6]

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

Характеристика и анализ Web-ресурсов по аналогичной тематике.

Если отчетливо рассмотреть статистику использования услугами в США на рисунке 8, то очевидно, что рестораны быстрого питания пользуются большим успехом, в следствии чего это ударяет по весу человека, по состоянию здоровья и по карману.

Рисунок 8. Статистика пользования услугами Соединенных Штат Америки.^[7]

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

Рисунок 9. Рестораны быстрого питания поблизости.

Около 15 штук, как мы видим, находится поблизости ресторанов питания, то наблюдается большое наседание со стороны Burger King. Burger Yum^[8] среди других ресторанов выглядит очень маленькой забегаловкой, поэтому будет сравнение с наиболее похожей из них по тематике Arooga's Draft House & Sports Bar^[9], которая так же ориентирована на активную молодежь. Сайт активно продвигается через другие ресурсы как Facebook, Instagram, YouTube, Twitter, которой так активно пользуется Американская молодежь. Есть нюансы, к примеру страница «About US»^[10], где могли бы подачу информации сделать в виде инфографики, что позволило бы сайту выглядеть еще более динамичным. Плюсом можно отметить, что у них есть карты для скидок, что позволит увеличить потоку клиентов, так же они имеют доставку и заказ онлайн, мобильно-ориентированный веб-сайт, что позволяет быстро и удобно заказать все необходимое.

Обоснование выбора имени и названия Web-ресурса.

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

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

Название веб-сайта было под заказ и тут почему выбрали именно из-за кричащего и вкусного, а также простого названия «BurgerYum» (БургерНям). Американская активная молодежь любит простые, но кричащие названия издалека, и тут долго выбирать не приходится. Тот же Burger King (Король Бургера), Arooga's Draft House & Sports Bar (Дом Арога и Спортивный Бар), все они только о себе и кричат, поэтому было выбрано вкусное и приятное название.

Обоснование лингвистического обеспечения Web-ресурса.

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

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

Обоснование выбора графического режима Web-ресурса.

В 2017 году есть следующие режимы отображения веб-ресурсов: мобильный, десктопный, планшетный. Разницей между ними является не только разрешение дисплея, так как есть мобильные устройства с разрешением экрана в 4k (3840x2160px), но и от диагонали дисплея.

Рисунок 10. Статистика выхода в интернет через мобильные устройства.

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

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

 Обоснование принятых решений по цветовой схеме Web-ресурса.

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

Обоснование принятых решений по размеру и виду шрифта.

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

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

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

• Helvetica 14 основной текст
• заголовки Alfa-slab-one 24, жирный

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

  Обоснование принятых решений по формированию фирменного стиля.

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

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

В крупных компаниях обязательно присутствует все эти качества, это и товарный знак, логотип, фирменный лозунг, которые запоминаются мгновенно, например, Nike (Just do it) и Adidas узнают все практически. Если смотреть фирменные цвета, то Связной и Google имеют схожие яркие цвета, что подчеркивает образ компании. Постоянными коммуникантами в Apple и ФБК (Фонд борьбы с коррупцией) являются Тим Кук и Алексей Навальный соответственно, благодаря которым компании придается особая харизма и красота. Народ следит за этими людьми более тщательно, наверное, даже больше чем за самой компанией. BurgerYum будучи стартапом в штате Пенсильвании, пока нуждается в хорошем сервисе и логотипе.

Логотипом компании мы сделали следующие варианты на рисунке 11 и на рисунке 12.

Рисунок 11. Вариант логотипа №1.

Рисунок 12. Вариант логотипа №2.

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

Обоснование технологии получения и размещения информационного наполнения Web-ресурса.

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

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

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

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

Рисунок 13. Статистика использования веб-браузеров на сентябрь, 2017 г^[13].

Как же проверить веб-ресурс на кроссбраузерность? Первый хороший вариант - это установить веб сервер и проверять различными браузерами. Второй хороший вариант – это онлайн утилиты, которые позволяют сразу проверить совместимость на все браузеры. Третий, более быстрый, но болезненный вариант – это написать веб-ресурс для самого популярного браузера, чем активно пользуются веб-разработчики. Но есть нюанс: движок браузера Google Chrome для операционной системы Windows отличается от браузера Chromium для операционной системы Linux или MacOS. Поэтому важно при работе это тоже учитывать.

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

Обоснование выбора программного обеспечения для создания Web-ресурса.

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

• Vim
• Emacs
• Eclipse
• Aptana Studio
• Netbeans
• Dreamweaver
• Visual Studio
• Xcode
• Coda 2
• TextMate
• Sublime Text
• Notepad ++

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

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

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

• • Ability Photopaint
  • ACD Canvas X (formerly Deneba Canvas)
  • ACDSee
  • Acorn Image Editor
  • Adobe Photoshop
  • Adobe Photoshop Lightroom
  • Adobe Photoshop Elements
  • Affinity Photo
  • ArcSoft PhotoImpression
  • Artipic
  • ArtRage
  • Autodesk SketchBook Pro

Для проекта был выбран Adobe Photoshop Creative Cloud для быстрого и удобного редактирования, в следствии чего результат был достигнут. Далее будет анализ и сравнение программных продуктов для редактирования сайта и для редактирования логотипов и изображений.

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

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

Список некоторого количества программ для создания 3D-анимации:

• • Shade 3D
  • Autodesk 3ds Max
  • Autodesk Maya
  • Autodesk MotionBuilder
  • Adobe After Effects
  • Blender
  • Cinema 4D
  • ZBrush

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

Обоснование выбора СУБД.

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

Список:

• Oracle RDBMS
• IBM DB2
• Microsoft SQL Server
• SAP Sybase ASE
• Teradata
• ADABAS
• MySQL
• FileMaker

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

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

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

Популярностью пользуются Javascript. Список движков для создания игр^[14]:

• ImpactJS
• Phaser
• Crafty
• Panda.js
• Kiwi.js

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

HTML 5 и CSS 3 не являются языками программирования, чаще всего они наводят марафет для веб-ресурса. Веб-проект был написан на HTML 5, CSS3 и jQuery (один из библиотек Javasript). Далее будет анализ способа размещения веб-ресурса в Интернет.

Обоснование выбора способа размещения Web-ресурса в Интернет.

Есть несколько способов размещения веб-ресурса в Интернет. Каждый из них имеет свои достоинства и недостатки.

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

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

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

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

Глава 2. Проектная часть.

Структура и содержание сайта.

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

• Home
• Product
• Sidebar

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

Разделы сайта и система навигации.

Разделы сайта приведены в параграфе 2.1. Отдельным моментом хочется отметить, что сайт специально сделан в черном цвете. Мобильные телефоны нового поколения оснащены экранами AMOLED или SuperAMOLED, которые не отображают черный цвет и экономят этим заряд аккумулятора. К примеру многие веб-ресурсы в 2017 году, то есть приложения и операционные системы имеют возможность переключиться в черную тему.

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

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

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

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

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

• Скорость сайта
• Минимализм
• Больше темной темы
• Простота
• Минимальные денежные вложения

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

Эскиз сайта.

Эскиз сайта (Рисунок 14) был приблизительно нарисован заказчиками, где и как должны размещаться бургеры. Заранее ими было уведомлено о том, что текст сайта и эскиз сайта нельзя было использовать, поэтому общий вид есть, а текст сайта сделан одинаковым. Далее будет рассмотрена процедура тестирования веб-ресурса.

Рисунок 14. Эскиз сайта BurgerYum!

 Описание процедуры тестирования созданного Web-ресурса.

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

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

Описание программных модулей.

Веб-ресурс был написан на HTML 5, CSS3, jQuery, благодаря которому веб-сайт работает полноценно и без ошибок. Вот часть кода:

.version.index{color:#0000FC;background-color:#3F905E;}#muse_css_mq{background-color:#FFFFFF;}#page{z-index:1;width:960px;min-height:3000px;background-image:none;border-style:solid;border-color:#000000;background-color:transparent;margin-left:auto;margin-right:auto;border-width:0px 0px 1px;}#ppu82{z-index:0;width:0.01px;padding-bottom:0px;margin-right:-10000px;margin-top:7px;}#pu82{z-index:4;width:0.01px;}#u82{z-index:4;width:405px;position:relative;margin-right:-10000px;margin-top:67px;}#u434-4{z-index:6;width:395px;min-height:61px;position:relative;margin-right:-10000px;margin-top:58px;left:8px;}#u435{z-index:29;width:229px;position:relative;margin-right:-10000px;margin-top:32px;}#u438{z-index:31;width:229px;position:relative;margin-right:-10000px;left:232px;}#menuu124{z-index:223;width:418px;height:34px;position:relative;margin-right:-10000px;margin-top:81px;left:542px;}#u146{width:139px;min-height:34px;position:relative;margin-right:-10000px;}#u149{width:139px;padding-bottom:17px;position:relative;}#u149:hover{width:139px;min-height:0px;margin:0px;}#u149:active{width:139px;min-height:0px;margin:0px;}#u151-4{width:139px;min-height:17px;position:relative;margin-right:-10000px;top:8px;}#u149:hover #u151-4{padding-top:0px;padding-bottom:0px;min-height:17px;width:139px;margin:0px -10000px 0px 0px;}#u149:active #u151-4{padding-top:0px;padding-bottom:0px;

Далее будет анализ рекламной компании по продвижению веб-ресурса в интернет.

Разработка рекламной кампании по продвижению Web-ресурса в Интернет.

Самый выгодный и эффективный способ продвижения веб-ресурса в интернет – это Google maps и Facebook. По эффективности и скорости распространения — это самый наилучший вариант.

Рисунок 15. Распространенность компании BurgerYum.

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

Формирование массива ключевых слов для поиска Web-ресурса в поисковых системах.

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

Список ключевых запросов.

1. Burger King
2. Chili Burger
3. Pennsylvania burger
4. Burger Yum
5. Cheap food
6. Good food
7. USA Burger
8. Harrisburg burger

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

заключение

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

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

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

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

список литературы

1. Learning Web Design. Book by Jennifer Niederst Robbins
2. JavaScript and JQuery: Interactive Front-End Web Development. Book by Jon Duckett
3. Создание лендинга от А до Я. Подробнейшее руководство с примерами
4. Дженис Линдси: всё о цвете
5. UNIX and Linux System Administration Handbook (5th Edition) by Eva (Author), Garth Snyder (Author), Trent R. Hein (Author), Ben Whaley (Author), Dan Mackin (Author)
6. The Book of CSS3: A Developer's Guide to the Future of Web Design. Book by Peter Gasston
7. Steve Jobs. Book by Walter Isaacson
8. Adobe Dreamweaver CC Classroom in a Book (2017 Release). Book by James J. Maivald
9. Основы разработки веб-приложений / Сэмми Пьюривал (2015)
10. Отзывчивый веб-дизайн – И. Маркот
11. Джон Дакетт | HTML и CSS. Разработка и дизайн веб-сайтов.

приложение

Рисунок 16. Титульный лист. Масштабирование 100%.

Рисунок 17. Страница «Home» сайта burgeryum.com.

Рисунок 18. Страница «Product». Масштабирование 100%.

Рисунок 19. Полная страница «Product» сайта burgeryum.com

Рисунок 20. Страница «Sidebar». Масштабирование 100%.

Рисунок 21. Страница полностью сайта burgeryum.com

1. http://www.internetlivestats.com/total-number-of-websites/ ↑

2. https://developers.google.com/web/fundamentals/design-and-ux/responsive/ ↑

3. https://w3techs.com/technologies/overview/content_language/all ↑

4. http://www.smartinsights.com/social-media-marketing/social-media-strategy/new-global-social-media-research/attachment/screen-shot-2016-06-14-at-14-49-54/ ↑

5. http://mediascope.net/services/media/media-audience/internet/information/ ↑

6. https://wearesocial.com/special-reports/digital-in-2017-global-overview ↑

7. http://www.foodbusinessnews.net/articles/news_home/Food-Service-Retail/2017/04/Burger_boom_Trends_driving_a_c.aspx?ID=%7BAC42DE02-2BBD-4705-B263-9C901CCC69BD%7D&cck=1 ↑

8. http://www.burgeryum.com/ ↑

9. http://www.aroogas.com/ ↑

10. http://www.aroogas.com/Scratch_Off_Promo ↑

11. https://color.adobe.com/explore/?filter=most-popular&time=month ↑

12. https://colorscheme.ru/ ↑

13. https://www.w3counter.com/globalstats.php ↑

14. https://html5gameengine.com/ ↑