Разработка навигации по сайту

Курсовая работа

На тему: «Разработка сайта визитки для магазина»

По ПМ.01 «Эксплуатация и модификация информационных систем»

МДК.01.02 «Web - программирование»

Выполнил: Телешин Т.И.

студент 4 курса группы ИС-41

специальности 230401

«Информационные системы

(по отраслям)»

Руководитель: Середа Т.В.

Курск

Содержание

Введение

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

2. Изучение предметной области разработки персонального сайта

3. Реализация поставленной задачи

3.1. Разработка навигации по сайту

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

Заключение

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

Введение

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

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

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

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

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

Для разработки курсового проекта рассматривалась предметная область - информация

Адресс сайта: http://vashvibor.my1.ru/

Сайт будет иметь следующую структуру:

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

Обратная связь – эта страница содержит информацию о способах связи с продавцом магазина;

Режим работы - время работы, в которое магазин работает;

Фотоальбомы – фотографии, добавленные на сайт;

Блог - интернет дневник.

Реализация поставленной задачи

Разработка навигации по сайту

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

Рисунок 1. Навигация по сайту

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

Палитра цветов интерфейса состоит из белого, зелёного и розовых цветов. На белом фоне располагается чёрный текст.

Рисунок 2. Главная страница - информация, которую в большинстве случаев видят первой по переходу на сайт.

Рисунок 3. Обратная связь – эта страница содержит информацию о способах связи с продавцом магазина;

Рисунок 4. Режим работы - время работы, в которое магазин работает;

Рисунок 5. Фотоальбомы – фотографии, добавленные на сайт;

Рисунок 6. Блог - интернет дневник.

Заключение

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

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

Список использованной литературы

1. allbest.ru http://allbest.ru

2. yandex поиск https://www.yandex.ru

3. mobiro.org http://mobiro.org/kursovye_raboty

4. twirpx.com http://www.twirpx.com/file/49724/

5. studentbank.ru http://studentbank.ru/?type=11

Приложение

<!DOCTYPE html><html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Блог - Ваш выбор</title> <link href="/.s/src/css/782.css" rel="stylesheet" type="text/css" /> <link type="text/css" rel="stylesheet" href="/.s/src/base.css" /> <link type="text/css" rel="stylesheet" href="/.s/src/layer7.css" /> <script type="text/javascript" src="/.s/src/jquery-1.7.2.js"></script> <script type="text/javascript" src="/.s/src/uwnd.js?2"></script><script type="text/javascript" src="//s36.ucoz.net/cgi/uutils.fcg?a=uSD&ca=2&r=0.456284276253335"></script> <script type="text/javascript"> window.ulb = {photoPage: "Перейти на страницу с фотографией.",closeBtn: "Закрыть", error: "Запрошенный контент не может быть загружен. Пожалуйста, попробуйте позже.", next: "Вперед", prev: "Предыдущий", btnPlay: "Начать слайдшоу", btnToggle: "Изменить размер"} </script> <link type="text/css" rel="stylesheet" href="/.s/src/ulightbox/ulightbox.css" /> <script type="text/javascript" src="/.s/src/ulightbox/ulightbox.js"></script> <style type="text/css">.UhideBlock{display:none; }</style><script type="text/javascript">//</script>
<link type="text/css" rel="stylesheet" href="/.s/src/social.css" /><script src="//ucounter.ucoz.net/?src=ss2&data=Mjo5OjM4OjEwOTo1MzoyMjoyOTo5Mjo4NjoyNjo4ODo2MDoxNTowOjA6MTA6MTExOjIwOjUwOjI4OjMxOjIzOjQ3OjE2OjkzOjExNzo5OTo5NTo3MToxMTozMjoxMDk6NTM6MTA6ODA6ODA6Njg6Nzg6MDoxMjI6OTc6OTQ6ODA6ODk6MTAwOjIwOjUwOjE2OjI1OjYyOjM6MTM6ODg6NjA6MTA5OjE1OjE5OjEzOjU1OjIwOjUwOjE2OjI1OjYyOjIwOjIyOjg0OjExNzozNzoxMDoxNDoxODoxMTY6ODM6NDU6MjI6MTA6NjI6NDoxMDo0OjEyMToxMDA6OTQ6ODg6OTM6MTAyOjEwOjExODo3ODo5NTo3MTozOjE2Ojc3OjIzOjQ5OjEzOjEzOjI4OjExMToyMDo1MDoxNjoyNTo2MjoxODoyNDo4Nzo0NzoxMDk6Nzk6MTg6MTozODoxMDk6NTU6MTc6NDo1Ojc3Ojk1Ojc0OjMzOjM2OjU0OjU6MTA6Mzg6ODQ6MTI0Ojk1OjMwOjg6NDozODo4NTozODo1NTo4NDoxOToyOToxMTY6NjU6NDA6MTM6NTA6MzowOjIyOjc0OjExNw==&r64=aHR0cDovL3Zhc2h2aWJvci5teTEucnUvcGhvdG8v&cid=A1B100&cb=0.56572698453326" async></script><script>new Image().src = "//counter.yadro.ru/hit;ucoz_sscounter_1?r"+escape(document.referrer)+((typeof(screen)=="undefined")?"":";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";"+Math.random();</script><script type="text/javascript">(function (d, w, c) {(w[c] = w[c] || []).push(function() {try {w.yaCounter39883200 = new Ya.Metrika({id:39883200,clickmap:true,trackLinks:true,accurateTrackBounce:true,ut:"noindex"});} catch(e) { }});var n = d.getElementsByTagName("script")[0],s = d.createElement("script"),f = function () { n.parentNode.insertBefore(s, n); };s.type = "text/javascript";s.async = true;s.src = "https://mc.yandex.ru/metrika/watch.js";if (w.opera == "[object Opera]") {d.addEventListener("DOMContentLoaded", f, false);} else { f(); }})(document, window, "yandex_metrika_callbacks");</script> <script type="text/javascript">var _tmr = window._tmr || (window._tmr = []);_tmr.push({id: "2818815", type: "pageView", start: (new Date()).getTime()});(function (d, w, id) {if (d.getElementById(id)) return;var ts = d.createElement("script"); ts.type = "text/javascript"; ts.async = true; ts.id = id;ts.src = (d.location.protocol == "https:"? "https:": "http:") + "//top-fwz1.mail.ru/js/code.js";var f = function () {var s = d.getElementsByTagName("script")[0]; s.parentNode.insertBefore(ts, s);};if (w.opera == "[object Opera]") { d.addEventListener("DOMContentLoaded", f, false); } else { f(); }})(document, window, "topmailru-code");</script></head> <body> <div id="utbr8214" rel="s36"></div> <div id="wrap"> <div id="wrap2">  <div id="header"> <div id="date"> Суббота, 19.11.2016, 16:25 </div> <div id="logged-as"> Приветствую Вас, <i>Гость</i> </div> <div id="sitelogo"> Ваш выбор </div> <div id="usermenu"> |<a href="http://vashvibor.my1.ru/">Главная</a>|<a href="javascript://" rel="nofollow" onclick="new _uWnd('LF',' ',-250,-110,{autosize:1,closeonesc:1,resize:1},{url:'/index/40'});return false;">Вход</a>|<a href="/register">Регистрация</a>| </div> <div class="clear"></div> </div>  <div id="container"> <div id="leftcol"> <div class="sidebar"> 







<div class="block"> <div class="blocktitle"> Меню сайта </div> <div class="blockcontent"> <div id="uMenuDiv1" class="uMenuV" style="position:relative;"><ul class="uMenuRoot"><li><div class="umn-tl"><div class="umn-tr"><div class="umn-tc"></div></div></div><div class="umn-ml"><div class="umn-mr"><div class="umn-mc"><div class="uMenuItem"><a href="/"><span>Главная страница</span></a></div></div></div></div><div class="umn-bl"><div class="umn-br"><div class="umn-bc"><div class="umn-footer"></div></div></div></div></li><li><div class="umn-tl"><div class="umn-tr"><div class="umn-tc"></div></div></div><div class="umn-ml"><div class="umn-mr"><div class="umn-mc"><div class="uMenuItem"><a href="http://vashvibor.my1.ru/index/obratnaja_svjaz/0-4"><span>Обратная связь</span></a></div></div></div></div><div class="umn-bl"><div class="umn-br"><div class="umn-bc"><div class="umn-footer"></div></div></div></div></li><li><div class="umn-tl"><div class="umn-tr"><div class="umn-tc"></div></div></div><div class="umn-ml"><div class="umn-mr"><div class="umn-mc"><div class="uMenuItem"><a href="http://vashvibor.my1.ru/index/rezhim_raboty/0-5"><span>Режим работы</span></a></div></div></div></div><div class="umn-bl"><div class="umn-br"><div class="umn-bc"><div class="umn-footer"></div></div></div></div></li><li><div class="umn-tl"><div class="umn-tr"><div class="umn-tc"></div></div></div><div class="umn-ml"><div class="umn-mr"><div class="umn-mc"><div class="uMenuItem"><a href="/photo/"><span>Фотоальбомы</span></a></div></div></div></div><div class="umn-bl"><div class="umn-br"><div class="umn-bc"><div class="umn-footer"></div></div></div></div></li><li><div class="umn-tl"><div class="umn-tr"><div class="umn-tc"></div></div></div><div class="umn-ml"><div class="umn-mr"><div class="umn-mc"><div class="uMenuItem"><a href="/blog/"><span>Блог</span></a></div></div></div></div><div class="umn-bl"><div class="umn-br"><div class="umn-bc"><div class="umn-footer"></div></div></div></div></li></ul></div><script type="text/javascript">$(function(){_uBuildMenu('#uMenuDiv1',0,document.location.href+'/','uMenuItemA','uMenuArrow',2500);})</script> </div> </div>




<div class="block"> <div class="blocktitle"> Вход на сайт </div> <div class="blockcontent"> <div id="uidLogForm" align="center"><a href="javascript://" onclick="window.open('http://login.uid.me/?site=5vashvibor&ref='+escape(location.protocol + '//' + ('vashvibor.my1.ru' || location.hostname) + location.pathname + ((location.hash? (location.search? location.search + '&': '?') + 'rnd=' + Date.now() + location.hash: (location.search || '')))),'unetLoginWnd','width=580,height=450,resizable=yes,titlebar=yes');return false;" class="login-with uid" title="Войти через uID" rel="nofollow"><i></i></a><a href="javascript://" onclick="return uSocialLogin('vkontakte');" class="login-with vkontakte" title="Войти через ВКонтакте" rel="nofollow"><i></i></a><a href="javascript://" onclick="return uSocialLogin('ok');" class="login-with ok" title="Войти через Однокласcники" rel="nofollow"><i></i></a><a href="javascript://" onclick="return uSocialLogin('facebook');" class="login-with facebook" title="Войти через Facebook" rel="nofollow"><i></i></a><a href="javascript://" onclick="return uSocialLogin('yandex');" class="login-with yandex" title="Войти через Яндекс" rel="nofollow"><i></i></a><a href="javascript://" onclick="return uSocialLogin('google');" class="login-with google" title="Войти через Google+" rel="nofollow"><i></i></a><a href="javascript://" onclick="return uSocialLogin('twitter');" class="login-with twitter" title="Войти через Twitter" rel="nofollow"><i></i></a></div> </div> </div>




<div class="block"> <div class="blocktitle"> Календарь </div> <div class="blockcontent"> <div align="center"><table border="0" cellspacing="1" cellpadding="2" class="calTable"><tr><td align="center" class="calMonth" colspan="7"><a title="Октябрь 2016" class="calMonthLink" href="javascript://" rel="nofollow" onclick="window.location.href='/blog/2016-10';return false;">«</a>  <a class="calMonthLink" href="javascript://" rel="nofollow" onclick="window.location.href='/blog/2016-11';return false;">Ноябрь 2016</a>  <a title="Декабрь 2016" class="calMonthLink" href="javascript://" rel="nofollow" onclick="window.location.href='/blog/2016-12';return false;">»</a></td></tr><tr><td align="center" class="calWday">Пн</td><td align="center" class="calWday">Вт</td><td align="center" class="calWday">Ср</td><td align="center" class="calWday">Чт</td><td align="center" class="calWday">Пт</td><td align="center" class="calWdaySe">Сб</td><td align="center" class="calWdaySu">Вс</td></tr><tr><td> </td><td align="center" class="calMday">1</td><td align="center" class="calMday">2</td><td align="center" class="calMday">3</td><td align="center" class="calMday">4</td><td align="center" class="calMday">5</td><td align="center" class="calMday">6</td></tr><tr><td align="center" class="calMday">7</td><td align="center" class="calMday">8</td><td align="center" class="calMday">9</td><td align="center" class="calMday">10</td><td align="center" class="calMday">11</td><td align="center" class="calMday">12</td><td align="center" class="calMday">13</td></tr><tr><td align="center" class="calMday">14</td><td align="center" class="calMday">15</td><td align="center" class="calMday">16</td><td align="center" class="calMday">17</td><td align="center" class="calMday">18</td><td align="center" class="calMdayIsA"><a class="calMdayLink" href="/blog/2016-11-19" title="1 Сообщений">19</a></td><td align="center" class="calMday">20</td></tr><tr><td align="center" class="calMday">21</td><td align="center" class="calMday">22</td><td align="center" class="calMday">23</td><td align="center" class="calMday">24</td><td align="center" class="calMday">25</td><td align="center" class="calMday">26</td><td align="center" class="calMday">27</td></tr><tr><td align="center" class="calMday">28</td><td align="center" class="calMday">29</td><td align="center" class="calMday">30</td></tr></table></div> </div> </div>


<div class="block"> <div class="blocktitle"> Архив записей </div> <div class="blockcontent"> <ul class="archUl"><li class="archLi"><a class="archLink" href="/blog/2016-11">2016 Ноябрь</a></li></ul> </div> </div>






<div class="block"> <div class="blocktitle"> Статистика </div> <div class="blockcontent"> <div align="center"><hr /><div class="tOnline" id="onl1">Онлайн всего: <b>1</b></div> <div class="gOnline" id="onl2">Гостей: <b>1</b></div> <div class="uOnline" id="onl3">Пользователей: <b>0</b></div></div> </div> </div>

<div class="block"> <div class="blocktitle"> Друзья сайта </div> <div class="blockcontent"> <li><a href="http://blog.ucoz.ru/" target="_blank" rel="noopener nofollow">Официальный блог</a></li><li><a href="http://forum.ucoz.ru/" target="_blank" rel="noopener nofollow">Сообщество uCoz</a></li><li><a href="http://faq.ucoz.ru/" target="_blank" rel="noopener nofollow">FAQ по системе</a></li><li><a href="http://www.ucoz.ru/help/" target="_blank" rel="noopener nofollow">База знаний uCoz</a></li> </div> </div>
 </div> </div> <div id="maincol"> <div id="maincol-border"></div> <div id="search"> <form action="/search/" style="margin: 0pt;" method="get" onSubmit="this.sfSbm.disabled=true"> <div class="schQuery"> <input type="text" class="queryField" size="20" maxlength="30" name="q" onfocus="$('#search form').css('background-position', '0px -27px')" onblur="$('#search form').css('background-position', 'top left')" /> </div> <div class="schBtn"> <input type="submit" value="" name="sfSbm" class="searchSbmFl" /> </div> </form> </div> <div id="maincol-inside">  <div id="nativeroll_video_cont" style="display:none;"></div><script type="text/javascript" src="//static.criteo.net/js/px.js?ch=1"></script><script type="text/javascript" src="//static.criteo.net/js/px.js?ch=2"></script><script>if(typeof(abp)!='undefined' && abp) {window.ucoz_rndid = '11438';window.site_type = 'ucoz';document.write('<script type="text/javascript" src="/.s/src/criteo_adblock.js"></scr'+'ipt>');}</script><div id="myGrid" style="display:none;"><div style="position:fixed;width:100%;text-align:center;padding-top:250px;"><img alt="" src="/.s/img/ma/m/i3.gif" border="0" width="220" height="19" /></div></div><script type="text/javascript">function spages(p,link){if (1){document.location.href=link.href; return;}try{document.getElementById('myGrid').style.cssText = 'position:absolute; z-index:8; top:0;left:0; display:normal; background: url(\'/.s/img/fr/g.gif\'); text-align:center; width:'+document.body.scrollWidth+'px; height:'+document.body.scrollHeight+'px;';}catch(e){}_uPostForm('',{url:'/blog/'+p+'-0-0-0-0-0-'+Math.floor(Math.random()*1e8)});}</script><div id="allEntries"><div id="entryID1"><table border="0" cellpadding="0" cellspacing="0" width="100%" class="eBlock"><tr><td style="padding:3px;">
<div class="eTitle" style="text-align:left;"><a href="/blog/originalnost/2016-11-19-1">Оригинальность.</a></div><div class="eMessage" style="text-align:left;clear:both;padding-top:2px;padding-bottom:2px;"><p>У нас запчасти приходят не из Китая, а из Турции и т.д.</p></div><div class="eDetails" style="clear:both;"><div style="float:right"> <style type="text/css">.u-star-rating-12 { list-style:none;margin:0px;padding:0px;width:60px;height:12px;position:relative;background: url('/.s/img/stars/3/12.png') top left repeat-x }.u-star-rating-12 li{ padding:0px;margin:0px;float:left }.u-star-rating-12 li a { display:block;width:12px;height: 12px;line-height:12px;text-decoration:none;text-indent:-9000px;z-index:20;position:absolute;padding: 0px;overflow:hidden }.u-star-rating-12 li a:hover { background: url('/.s/img/stars/3/12.png') left center;z-index:2;left:0px;border:none }.u-star-rating-12 a.u-one-star { left:0px }.u-star-rating-12 a.u-one-star:hover { width:12px }.u-star-rating-12 a.u-two-stars { left:12px }.u-star-rating-12 a.u-two-stars:hover { width:24px }.u-star-rating-12 a.u-three-stars { left:24px }.u-star-rating-12 a.u-three-stars:hover { width:36px }.u-star-rating-12 a.u-four-stars { left:36px }.u-star-rating-12 a.u-four-stars:hover { width:48px }.u-star-rating-12 a.u-five-stars { left:48px }.u-star-rating-12 a.u-five-stars:hover { width:60px }.u-star-rating-12 li.u-current-rating { top:0!important; left:0!important;margin:0!important;padding:0!important;outline:none;background: url('/.s/img/stars/3/12.png') left bottom;position: absolute;height:12px!important;line-height:12px!important;display:block;text-indent:-9000px;z-index:1 } </style><script type="text/javascript">var usrarids = {};function ustarrating(id, mark) { if (!usrarids[id]) { usrarids[id] = 1; $(".u-star-li-"+id).hide(); _uPostForm('', {type:'POST', url:'/blog/', data:{'a':'65','id':id,'mark':mark,'mod':'blog','ajax':'2'}}); }}</script><ul id="uStarRating1" class="uStarRating1 u-star-rating-12" title="Рейтинг: 0.0/0"><li class="u-current-rating uCurStarRating1" id="uCurStarRating1" style="width:0%;"></li></ul></div>
<span class="e-reads"><span class="ed-title">Просмотров:</span> <span class="ed-value">1</span></span><span class="ed-sep"> | </span><span class="e-author"><span class="ed-title">Добавил:</span> <span class="ed-value"><a href="javascript://" rel="nofollow" onclick="window.open('/index/8-1','up1','scrollbars=1,top=0,left=0,resizable=1,width=680,height=350');return false;">madjong2016</a></span></span><span class="ed-sep"> | </span><span class="e-date"><span class="ed-title">Дата:</span> <span class="ed-value" title="14:30">Сегодня</span></span><span class="ed-sep"> | </span><a class="e-comments" href="/blog/originalnost/2016-11-19-1#comments">Комментарии (0)</a></div></td></tr></table><br /></div><div class="catPages1" align="center" id="pagesBlock1" style="clear:both;"></div></div>  </div> <div class="clear"></div> </div> <div class="clear"></div>  <div id="footer"> <div id="copyright"> Ваш выбор© </div> <div id="powered-by"> <span class="pbct1ZLI"><a href="http://www.ucoz.ru/" title="Используются технологии uCoz" target="_blank" rel="nofollow">uCoz</a></span> </div> </div>  </div> </div> </div> </body> </html>