Файл: Разработка сайта спортивной школы.pdf

ВУЗ: Не указан

Категория: Курсовая работа

Дисциплина: Не указана

Добавлен: 23.05.2023

Просмотров: 882

Скачиваний: 14

ВНИМАНИЕ! Если данный файл нарушает Ваши авторские права, то обязательно сообщите нам.

App Market – магазин приложений. Вы можете выбирать дополнительные виджеты, которые не нашли перейдя по кнопке «Добавить».

Мои загрузки – загружайте свои фото, видео, музыку и шрифты!

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

И последняя кнопка «Мой магазин» позволяет на любой странице сайта создать свой интернет-магазин с перечнем товаров.

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

Верхнее меню, пожалуй, самое развернутое. Разберем сначала его правую часть.

Рис. 8. Верхнее меню

Лупа – уменьшает масштаб страницы для наглядности. Стрелками вперед-назад можно быстро отменить или вернуть выполненное действие. Иконка с телефоном – переход к мобильной версии и обратно. Напомню, что все шаблоны сайтов на Wix адаптивные. Кнопка с дискетой – одним щелчком сохраняет внесенные на сайте изменения. Предпосмотр – возможность посмотреть на проделанную работу перед сохранением. При нажатии кнопки «Опубликовать» — публикуем свой сайт в сети. Однако, если у вас бесплатный набор функций, то доменное имя вашего сайта будет длинным, следующего вида: https://название вашей почты.wixsite.com/mysite-1.

Редактирование элемента в Панели Настроек

Для редактирования элемента в Панели Настроек

. Нажмите на элемент.

. Из “Панели Настроек“, которая появляется в правой части окна Редактора, нажмите на “Свойство”.

. В открывшемся окне вы можете редактировать настройки этого Свойства.

. Нажмите кнопку OK (при наличии) или X, чтобы применить изменения.

Чтобы изменить размер элемента:

. Нажмите на элемент.

. Потяните за квадратную рамку изменения размера, этим самым меняя размер элемента.

Изменение размера Элемента

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

Добавление меню на Главные Страницы

Ваше меню будет состоять из кнопок - по одной для Главной Страницы и остальных страниц. Меню позволит перемещаться по страницам.


Имена страниц появятся на кнопках меню.

. С левой стороны Редактора, перейдите на “Добавить”, а затем перейдите к Навигации.

. Из Навигации нажмите кнопку “Меню”.

. Откроется Галерея Меню, нажмите на Меню, чтобы добавить его на сайт.

Рис. 9. Меню на Главной Странице!

После добавления Страницы, можно добавить и изменить Фон.

Чтобы добавить Фон:

. Нажмите на Страницу.

. Справа от панели свойств Группы Страниц выберите “Стили”.

. Из окна “Стили”, нажмите на любой стиль оформления.

Чтобы добавить Фон для Главной страницы:

. В левой части окна Редактора, перейдите на “Фон”, нажмите на “Главная страница”.

. Вы можете посмотреть Фон в Галерее Фонов.

. Выберите Фон.

Рис. 10. Фон Главной Страницы

Аналогично меняем фон остальных страниц.

Добавление текста

Добавление Названия

Как добавить Название для сайта:

. С левой стороны Редактора, перейдите на Добавить, а затем перейдите на Текст, нажмите Заголовки.

. Из галереи выберите стиль Названия.

Рис. 11. Выбор стиля заголовка

3. Для редактирования текста, нажмите дважды на Название, которoe появится в Редакторе.

4. Удалите выделенный текст и введите собственный.

Чем больше шрифт Заголовка, тем лучше это для SEO.

Добавление Картинок и Фотографий

Можно легко добавить фотографии на сайт и добавить отдельные фотографии или фотографии в Картинную Галерею.

Чтобы добавить Индивидуальные картинки:

С левой стороны Редактора, перейдите на Добавить, выберите Фото.

Из Галереи Фото, выберите Wix, Сообщества, или Мои Картинки, где Вы можете найти, вас интересующую, фотографию.

Нажмите на картинку.

Ваша картинка откроется в Редакторе Wix.

Сделанный сайт является функцией пакета eCommerce Premium Package. Можно попробовать его бесплатно в Pедакторе Wix (Wix Editor) но, чтобы начать реализовать его необходимо перейти на пакет Wix eCommerce Premium Package.

Публикация сайта

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


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

Рис. 12. Публикация сайта на хостинге

Теперь Сайт Онлайн и его адрес <https://rastoropov93.wixsite.com/hockey>.

1.3.1. Дизайн сайта

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

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

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

Создавалась страница с помощью visual studio.

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

Рис. 14. Страница «О нас»

Следующая страница - "Контакты" (рисунок 14). Её цель - возможность для клиентов спортивной школы связаться с тренером или с администратором, оставить отзыв, предложение, пожелание или жалобу. Данная страница (приложение В), выполняет удаленный диалог между пользователем и администратором сайта.

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

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


Рис. 15. Страница «Тренеры»

На странице «Расписание» (рисунок 16), находится информация об тренировках, их программах и целях (приложение Д).

Рис. 16. Страница «Расписание»

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

Рис. 17. Страница «Новости»

ЗАКЛЮЧЕНИЕ

В соответствии с заданием на проектирование сайта был создан сайт спортивной школы по хоккею ООО «Хоккей - Наше все». Были созданы Главная страница и страницы: Главная, О нас, Контакты, Тренеры, Расписание, Новости с соответствующим контентом.

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

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

Для реализации сайта был использован visual studio.

Было создано подробное описание деятельности спортивной школы, дизайн сайта, форма обратной связи.

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

СПИСОК ЛИТЕРАТУРЫ

ПРИЛОЖЕНИЕ А

<!doctype html public "-//w3c//dtd html 5 //en" "http://www.w3.org/tr/html5/strict.dtd">

<html>

<head>

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

<title>Хоккей - Наше все</title>

<meta name="keywords" content="" />

<meta name="description" content="" />

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

</head>

<body alink="#000000" link=@"000000" vlink="#000000">

<body onload="getname()">

<!--<div class="share"></div>-->

<div class="wrapper">

<strong><p><font style="font-size: 66px;">"СПОРТИВНАЯ ШКОЛА"</font></p></strong><br /><font style="color:#8B0000;font-size: 30px;"> Хоккей - Наше все.</font><br><br>

</div><!-- .header-->

<div class="middle">

<div class="container">

<div class="content">


<table>

<tr>

<th><a href="glavnaya.html">главная</a></th>

<th><a href="o nas.html">о нас</a></th>

<th><a href="kontakt.html">контакты</a></th>

<th><a href="trener.html">тренеры</a></th>

<th><a href="raspisanie.html">расписание</a></th>

<th><a href="novosti.html">новости и события</a></th>

</tr>

</table>

<font style="font-size: 17px;">

<br><strong><font style="color:#8B0000;font-size: 30px;">ДОБРО ПОЖАЛОВАТЬ </br></strong>

</font><br><br>

<p><br><strong>Хоккей с шайбой</strong> – самый интересный и захватывающий вид командного спорта. Скрестить клюшки, молниеносно пронестись по льду, ювелирно попасть в ворота противника – разве это не вызывает бурю эмоций? Овечкин, Малкин, Фетисов, Ларионов – имена хоккейных кумиров навсегда выгравированы в истории спорта.</br></p>

<p><br>Наша школа приглашает вас влиться в ряды поклонников хоккея. У нас работают тренеры с высшим образованием и опытом игры в НХЛ, КХЛ, ВХЛ. Наша школа проводит индивидуальные тренировки (подкатки) и групповые занятия хоккеем. Вы сможете получить неоценимые знания и навыки.</br></p>

<p><br>Мы регулярно проводим зимние и летние сборы для спорт-школьников и любителей, а также приглашаем звезд российского хоккея на наши тренировки. Вам наверняка будет чему у них поучиться. Кроме того, наша школа устраивает просмотровые кемпы для ребят, желающих уехать в Америку для игры и учебы. Это открывает перед молодыми спортсменами огромные перспективы.</br></p>

<br><strong><font style="color:#8B0000;font-size: 30px;">НОВОСТИ КЛУБА</br></strong></font><br><br>

</font>

</div><!-- .content-->

</div><!-- .container-->

<div class="left-sidebar">

<font style="font-size: 22px;"><br><br><br><p><a href="novosti.html">Наш дневник ЧМ-2018. Разгромное начало</a></p><br><br><p><a href="novosti.html">Уступаем, но не сдаемся!</a></p><br><br><p><a href="novosti.html">Дежавю</a></p><br><br><p><a href="novosti.html">Сезон окончен. Спасибо за все!</a></p></font><br><br><br>

</div><!-- .left-sidebar -->

<div class="right-sidebar">

<!--<p><img src="images/ar.jpg" width="165" height="120"></p><p><img src="images/as.jpg" width="165" height="117"></p><img src="images/ad.jpg" width="165" height="115">-->

<center class='menus'>

<marquee style=width: 88px; height: 130px scrollamount='1' direction='up' width='170' height='360' onmouseout='this.scrollamount=1' onmouseover='this.scrollamount=0'>

<div class='menus' align='center'>

<a href='http://images/_1ywoqwv4ag.jpg'><img src='http://images/_1ywoqwv4ag.jpg' width='165' height='117'></a><br>

<a href='http://images/npz1lpx1bgu.jpg'><img src='http://images/npz1lpx1bgu.jpg' width='165' height='117'></a><br>

<a href='http://images/6g2hjmcxss8.jpg'><img src='http://images/6g2hjmcxss8.jpg' width='165' height='117'></a><br>