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

ЛИЧНЫЙ КАБИНЕТ 

 

Здравствуйте гость!

 

Логин:

Пароль:

 

Запомнить

 

 

Забыли пароль? Регистрация

Повышение уникальности

Предлагаем нашим посетителям воспользоваться бесплатным программным обеспечением «StudentHelp», которое позволит вам всего за несколько минут, выполнить повышение уникальности любого файла в формате MS Word. После такого повышения уникальности, ваша работа легко пройдете проверку в системах антиплагиат вуз, antiplagiat.ru, etxt.ru или advego.ru. Программа «StudentHelp» работает по уникальной технологии и при повышении уникальности не вставляет в текст скрытых символов, и даже если препод скопирует текст в блокнот – не увидит ни каких отличий от текста в Word файле.

Работа № 85427


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


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

Информация:

Тип работы: Курсовик. Добавлен: 6.3.2015. Сдан: 2013. Страниц: 49. Уникальность по antiplagiat.ru: 73,35.

Описание (план):


Оглавление

Введение 2
1. Планирование Web-сайта 3
2. Схема сайта 5
2.1 Описание основных разделов 5
2.2 Модель сайта 6
2.3 Разработка модульной сетки 6
3. Технологии реализации 7
3.1 Теговая модель 8
3.2 Парные и одиночные теги, контейнеры 8
4. Подробное рассмотрение кода на страницах 11
4.1 HTML-код главной странички сайта 11
4.2 Каскадная таблица стилей 21
5. Руководство пользователя 30
5.1 Рекомендации по установке 30
5.2 Инструкция пользователя 30
Заключение 36
Список литературы 38
Приложение 1 39


Введение

Internet развивается довольно стремительно. Быстро растет количество изданий, посвященных Сети, что предвещает широкое ее распространение даже в далеких от техники областях. Internet превращается из большой игрушки для интеллектуалов в полноценный источник разнообразной полезной информации для любой категории пользователей.
Через десять лет, по прогнозам специалистов, около 50 процентов семей (безусловно, пока лишь в развитых странах) будут использовать его ежедневно. Телевидение и радиоприемники не будут заменены компьютерами, но будут иметь мощный процессор, большую память и фактически сами станут в некотором отношении компьютерами.
Это будет время, когда любой человек, владеющий компьютером, сможет "скачать" с его помощью статьи, иллюстрации, видео- или аудиоинформацию по любой интересующей его теме. Он сможет получить эту информацию тогда, когда он этого пожелает. Через какое-то время системы искусственного интеллекта - параллельный машинный перевод, а также идентификация и распознавание голоса сломают последние национальные и языковые барьеры и сделают возможным свободный транснациональный обмен информацией.
Актуальность. В вопросе разработки и создания Web-страниц в сети Интернет накоплен огромный багаж различных методов, способов и технологий, многие из которых, к сожалению, сейчас уже являются условно применимыми. Дело в том, что обновление аппаратного оборудования год от года только прогрессирует, причем с нарастающими темпами (до сих пор пока еще действуют эмпирические законы американского специалиста в области компьютерной техники Мура - каждые полтора года мощность микропроцессоров удваивается, и каждый год стоимость компонентов персонального компьютера снижается вдвое). Поэтому представляется актуальным и практически важным рассмотреть проблему проектирования Web-сайта в современных условиях с использованием всего спектра достижений, накопленных в данной области.
Целью работы является изучение методической и прикладной литературы по проблемам проектирования и создания Web-страниц, обобщение опыта работы опытных разработчиков, программистов и Web-дизайнеров, а также выбор оптимальной стратегии, методов и приемов создания личного или корпоративного Web-сайта, воплощающего все известные на сегодняшний день передовые идеи и технологии.

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

1. Планирование Web-сайта

В зависимости от стиля жизни, социального статуса, ресурсов (как финансовых, так и информационных), потребитель может задаться целью создания собственного интернет-сайта. Это может быть как сайт о компании, о самом потребителе, так и вплоть до любимого домашнего животного и т.д.
На этапе информационного поиска потребитель может двигаться в поиске бесплатного хостинга, где можно самостоятельно при помощи базового инструментария составить страницу.
Сайт ориентирован на ту часть целевой аудитории, которой нужна информация. В первую очередь на начинающих пользователей Интернета, заинтересованных в изучении фундаментальных технологических основ робототехники. Предполагается, что пользователь владеет основными навыками работы в Интернете, взаимодействия с приложениями Microsoft Windows, настройки операционных систем, включая изменения конфигурации системных установок. Может выполнить установку и удаление программного обеспечения. Первоначальных знаний в области Web-дизайна и программирования не требуется. Весь спектр информации по созда­нию сайтов, включая дизайн, разработку стиля и графики, помогут разработать стиль сайта, создать графические изображения и качественно оформить его внешний вид.
Сведения такого рода могут быть весьма полезными при проектировании Web-сайтов и планировании рекламных кампаний в Internet.
Каждый прогрессивный пользователь старается как можно скорее самостоятельно соорудить такую страницу, чтобы оставить информацию или просто заметку о своем пребывании в сети. Особенно это может быть интересно тем пользователям, которые обычно пользуются шаблонами для создания своих персональных страниц, и могут понятия не иметь о том, как всё-таки нужно их писать.
Кто знает, насколько полезной такая информация окажется для кого-либо.
Структура сайта должна быть в первую очередь удобна. Психологи утверждают, что человек, впервые попавший на заглавную страницу сайта, принимает решение около 8 се­кунд.
Основная функция сайта - удовлетворять информационные запросы клиента или развлекать его, поэтому если пришедший по рекламе (ссылке) посетитель не находит ничего необхо­димого или интересного за первые 8 секунд, то он покидает этот сайт навсегда.
Все раз­делы сайта и информация должны быть легко доступны, а навигация эргономична. По­звольте зашедшему самостоятельно регулировать глубину просмотра - не вываливайте всю информацию сразу.
Кроме того, очень важно, чтобы сайт имел удобное название. Существует несколько неписаных правил присвоения доменного имени. Во-первых, по возможности оно должно ассоциироваться со всей деятельностью отрасли (например, автомобили - www.avto.ru). Во- вторых, доменное имя должно быть обязательно куплено. В-третьих, следует избегать длинных и сложных назва­ний. Доменное имя должно легко читаться и произноситься. В-четвертых, признаком хо­рошего тона считаются имена второго уровня (например, www.имя.ru, www.имя.com).
Размещение полезной информации на своем сайте может решить сразу несколько за­дач: увеличение частоты посещений; создание положительного имиджа; привлечение посетителей через по­исковые системы.
При разработке Web-страница должна быть доступна (и правильно отображаться) для максимально возможного числа пользователей. Идея проста: необходимо определить наиболее часто используемое разрешение дисплея и разработать страницу таким образом, чтобы страница гарантированно заполняла все рабочее пространство.
Большинство дизайнеров рекомендуют разрабатывать страницы в формате 640x480, чтобы при просмотре пользователям не пришлось применять горизонтальную прокрутку. Сайт должен корректно отображаться при разрешении 640x480 и цветовой гамме 256 цветов.
Все большее число разработчиков считает стандартным разрешение 800x600. И совсем единицы разрабатывают страницы для еще более высоких разрешений. Конечно, ваше решение будет, в первую очередь, зависеть от аудитории. Например, если сайт ресурсов для дизайнеров графики, то считаем, что они имеют дисплеи, по крайней мере, с разрешением 800x600 или выше, в соответствии с чем и разрабатывается страница. Если сайт предназначен специально для WebTV или какого-то другого устройства отображения, следует ориентироваться на это конкретное устройство.
Размер файла графического изображения должен быть минимально возможным! Нужно максимально уменьшить объёмы строк и оптимизировать всё изображение для более быстрой загрузки. Создание изображений, предназначенных для передачи по сети, возлагает ответственность на разработчиков серьезно относиться к проблеме времени загрузки.
Все страницы должны быть оформлены в одном стиле: использовать не более трёх основных шрифтов, включая шрифты, применяемые при создании графических объектов. Использовать три основных цвета, можно использовать оттенки. Текст не должен напрягать зрение, глаза не должны уставать.


2. Схема сайта


2.1 Описание основных разделов

1.Главная.
1.1.Научные роботы.
1.2.Роботы-игрушки.
1.3.Боевые роботы.
1.4.Робогаджеты.
1.5.Андроиды.
2.Правила.
3.Сотрудничество.
4.Обратная связь.



2.2 Модель сайта

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


2.3 Разработка модульной сетки


Меню
Заголовок
Контент Меню по области информации
Ссылки на доп. материал
Облако тегов
Контактная информация Галерея

3. Технологии реализации

Сайт создан на основе технологии HTML. Выбор пал именно на эту технологию по причине его относительной простоты. Дополнением к языку разметки я выбрал каскадные таблицы стилей CSS.
Идея решения проблемы обмена документами между различными компьютерами и приложениями через Интернет основана на языке разметки гипертекста HTML. этот язык был принят подавляющим большинством пользователей Интернета, а главное, - всеми производителями программного обеспечения и оборудования для Web. Документы размеченные согласно HTML, могут читаться на любом компьютере, на котором установлена всего лишь одна программа просмотра таких документов - браузер.
Благодаря языку разметки HTML, клиент Web может на экране своего компьютера просмотреть документ в том виде, в каком его задумал разработчик: с определенными размерами шрифта и разбивкой на абзацы, с определенным расположением рисунков, гиперссылок и проч. Текстовый документ, составленный на HTML, имеет размер в байтах в несколько раз меньший, чем размер аналогичного документа, подготовленного в текстовом процессоре (например, Word).
Разметка документа - это описание различных фрагментов документа и их взаимного расположения. Выполняется разметка с помощью символов ASCII, а точнее арабских цифр, символов латинского алфавита и некоторых знаков препинания. Из этих символов набираются команды языка HTML - теги, или, иначе говоря, дескрипторы.
Поскольку документ Web представляет собой текстовый файл, для его редактирования можно использовать не только Блокнот, но и любой текстовый редактор, например, из состава MS-DOS, Norton Commander или FAR. Кстати, многие пользователи так и делают, набирая вручную HTML-код в этих простейших редакторах.
В настоящее время существуют также более серьезные программы для подготовки Web-страниц, которые можно условно разделить на два типа:

? Визуальные редакторы HTML, то есть редакторы типа WYSIWIG (например, Microsoft FrontPage, Macromedia Dreamweaver, Netscape Navigator Gold и др.) при работе в этих программах пользователь имеет дело с графическими образами элементов HTML, а не с кодом документа. Кстати, существуют конверторы текстовых документов, подготовленных в Word и Word Perfect, в формат HTML-файлов (такой конвертор имеется, например, в самом процессоре Word 97/2000).
? Редакторы собственно HTML-текстов, позволяющие автоматизировать набор и редактирование кода (например, HomeSite, HotDog, Ken Nesbit Web Editor и многие другие). Эти программы дают возможность пользователю быстро и легко вставлять в документ элементы HTML, проверять синтаксис команд, выполнять запуск и отладку страницы, не покидая окна редактора. Вообще работа в таких редакторах напоминает работу в интерактивной среде программирования типа Delphi или Visual Basic.

Кроме перечисленных двух категорий, существуют программы, объединяющие в себе черты текстовых и визуальных HTML-редакторов. К таким программам относятся Hot-Metal разработки компании SoftQuad Software.

3.1 Теговая модель

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

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

Теги HTML являются подмножеством тегов языка SGML. Если какие-либо из тегов не понятны браузеру, они при анализе документа просто игнорируются.

3.2 Парные и одиночные теги, контейнеры

Все теги начинаются с открывающейся угловой скобки <, за которой следует текст, определяющий содержание тега, например, title или body. Оканчивается тег закрывающейся угловой скобкой >. Содержанием тега может быть просто имя тега либо имя и набор атрибутов тега.
Большинство тегов являются парными, то есть для каждого начального тега <Имя> есть конечный тег , в котором к имени тега добавляется косая черта «/» (слэш), например,




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

формируется новый абзац. При наличии тегов


, или производится вставка горизонтальной линии, изображения или звукового файла соответственно.
Имена всех тегов в стандартизированы и удобны для запоминания. Например, имя тега (в переводе «тело») обозначает основную часть документа, а тег (сокращение от italic - курсив) задает начертание курсивом.
Имена в парных тега должны быть одинаковыми. Отклонение от этого правила, например, … , будет считаться ошибкой. Однако в некоторых случаях можно опускать закрывающие теги.
Пара тегов, состоящая из начального и конечного тегов, называется контейнером. Контейнеры обозначаются по имени начального тега и записываются в угловых скобках. Два выражения «пара тегов » и «контейнер » обозначают одно и то же. <br/>Документ HTML включает в себя элементы, которые представляют абзацы, заголовки, гиперссылки, списки, таблицы, рисунки и проч. Вообще весь документ можно рассматривать состоящим из определенных документов.<br/>Элемент - это пара тегов и символьные данные (текст или код), заключенные между ними. То есть элемент состоит из трех компонент: начального тега, содержимого и конечного тега. В некоторых элементах конечный тег может быть опущен (в случае одиночных тегов).<br/>Некоторые элементы могут не иметь содержимого, например, элемент разрыва строки BR. В таких элементах отсутствует конечный тег.<br/>Описывая синтаксис элементов HTML, необходимо указать что они не чувствительны к регистру символов, то есть браузер одинаково воспринимает теги <TITLE>, <Title> или <title>.<br/>Следует различать термины «элемент» и «тег». Элемент обязательно включает в себя хотя бы один тег и, возможно, содержимое, в то время как у тега содержимое отсутствует. Например, HTML-код <TITLE> Пример Web-документа представляет собой элемент TITLE, а - тег.<br/>Все элементы, предусмотренные в HTML, можно условно разбить на несколько категорий:<br/>? Структурные - это элементы, которые обязательны для документа, соответствующего стандарту HTML (например, элементы HTML, HEAD, BODY и TITLE);<br/>? Блоковые - элементы, которые предназначены для форматирования целых текстовых блоков (например, элементы BLOCKQUOTE, DIV, H1, H2, H3, H4, H5, H6, P, PRE); часто блоковые элементы отделяются переводом строки от остального содержания документа;<br/>? Текстовые - элементы, которые задают разметку текста (ЕМ, STRONG, DFN, CODE, SA........<br/></br></br></br></TD> </TR> <TR> <TD></TD> <TD></TD></TR> <TR align="middle"> <TD colspan="2" align="center"><span class="style1"><h1><A href="https://www.webkursovik.ru/kartgotrab2.asp?id=85427"><b>Перейти к полному тексту работы</A></h1> <br><A href="gotrab.asp?id=85427"><b>Смотреть похожие работы</b></A></span><br><span>* Примечание. Уникальность работы указана на дату публикации, текущее значение может отличаться от указанного.</span><br><br></TD> </TR> <!--<TR align="middle" valign="bottom"> <TD colspan="2"><FONT size=4 style="font-size: small">Можно заказать просмотр фрагмента работы или получить скидку на данную работу. Для этого заполните <A href="contacts.asp">форму обратной связи</A></FONT>. </TD> </TR> <TR align="middle" valign="bottom"> <TD colspan="2"><b>Примечание:</b>Скидка предоставляется, если вы покажите, где продаётся эта работа по меньшей цене (на платном хостинге). Размер скидки - 20% от цены конкурента. </TD> </TR>--> <TR align="center" valign="bottom"> <TD colspan="2"> <P align=right> </P> <!--<INPUT value=" Скачать работу " type=button id=d onclick = "return d_onclick()">--> </TD> <tr> <td colspan="2" align="center"> </center> </td> </tr> </TABLE> <table class="obzor_objects"> <tr> <td> </td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> </td></tr></table> </td></tr> <tr><td class="bottom_ob"></td></tr> </table> <div class="padding10"></div> <table class="footer_bg"><tr><td class="padd"> <table class="footer"> <tr> <td class="copy">© 2009<br> <span class="bold_black">WEBKURSOVIK.RU – ЭФФЕКТИВНАЯ ПОМОЩЬ СТУДЕНТУ</span><br > <A href="mailto:info@webkursovik.ru"><b>info@webkursovik.ru</b></A></td> <td class="adress"> <!--90088--> <td> <!-- Yandex.Metrika counter --> <script type="text/javascript"> (function (d, w, c) { (w[c] = w[c] || []).push(function() { try { w.yaCounter229008 = new Ya.Metrika({id:229008, clickmap:true, accurateTrackBounce:true}); } 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 = (d.location.protocol == "https:" ? "https:" : "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> <noscript><div><img src="//mc.yandex.ru/watch/229008" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter --> </td> </tr></table> </td></tr></table> </td> </tr> </table> </div> </body> <SCRIPT LANGUAGE=javascript> function Vihod() { //alert('Очистка') document.cookie = "lg=; expires=Thu, 01-Jan-10 00:00:01 GMT" document.cookie = "lj=; expires=Thu, 01-Jan-10 00:00:01 GMT" document.cookie = "pw=; expires=Thu, 01-Jan-10 00:00:01 GMT" window.location.href = "https://" + window.location.host } function ZakazRab() { window.location.href = "h" + "tt" + "p:/" + "/www.zao" + "chnik.com/order/?a_aid=50c9c512c0307&a_bid=896c2dab" //window.location.href = "h" + "tt" + "p:" + "//www." + "mref" + "erat.ru/webkursovik/" } function ZakazRabR() { window.location.href = "h" + "tt" + "p:/" + "/www.zao" + "chnik.com/?a_aid=50c9c512c0307&a_bid=3bab96f0" } function d_onclick() { cmd = 'https://' + window.location.host + '/salegotrab.asp?id=85427' window.location.href = cmd } function redakt_onclick() { cmd = 'https://' + window.location.host + '/addgotrab.asp?id=85427' window.location.href = cmd } function del_onclick() { cmd = 'https://' + window.location.host + '/resaddr.asp?id=85427' window.location.href = cmd } function AddPred_onclick() { if (-1 != -1){ cmd = "https://" + window.location.host + "/kartgotrab.asp?addzad=1" //cmd = "kartgotrab.asp?addzad=1" if (document.getElementById('Budget').value != ""){ cmd = cmd + "&budget=" + document.getElementById('Budget').value cmd = cmd + "&id=85427" window.location.href = cmd //alert(cmd) } else { alert("Не указана цена покупки") } } else { alert("Не выполнен вход в персональный раздел, или не зарегистрированный пользователь.") } } function scach_onclick(){ window.location.href = "" } function Vhod_onclick() { document.cookie = "lg=" + document.getElementById('loginbox').value + "; expires=Thu, 01-Jan-10 00:00:01 GMT" document.cookie = "lj=" + document.getElementById('loginbox').value + "; expires=Thu, 01-Jan-10 00:00:01 GMT" document.cookie = "pw=" + document.getElementById('passwordbox').value + "; expires=Thu, 01-Jan-10 00:00:01 GMT" cmd = "https://" + window.location.host + "/index.asp" if (document.getElementById('loginbox').value != ""){ cmd = cmd + "?nl=" + document.getElementById('loginbox').value if (document.getElementById('passwordbox').value != ""){cmd = cmd + "&pw=" + document.getElementById('passwordbox').value} //alert(document.cookie) if (document.getElementById('Zapomnit').checked == true) { //var d1 = new Date() //var d2 = d1.getTime() + (365*24*60*60*1000) //d1.setTime(d2) document.cookie = "lj=" + document.getElementById('loginbox').value + "; expires=Thu, 01-Jan-20 00:00:01 GMT" //document.cookie = "pw=" + passwordbox.value + "; expires=" + d1.toGHTString() document.cookie = "pw=" + document.getElementById('passwordbox').value + "; expires=Thu, 01-Jan-20 00:00:01 GMT" window.location.href = "https://" + window.location.host + "/kabinet.asp" } else { //window.location.href = cmd document.cookie = "lj=" + document.getElementById('loginbox').value document.cookie = "pw=" + document.getElementById('passwordbox').value window.location.href = "https://" + window.location.host + "/kartgotrab.asp?id=85427" } } } function Naiti_onclick() { if (document.getElementById('zayvfnd').checked == true) { //в заявках cmd = "https://" + window.location.host + "/zayv.asp?vid=" + document.getElementById('vid').value + "&predmet=" + document.getElementById('predmet').value if (isNaN(document.getElementById('maxcena').value) == false) { //if (document.getElementById('maxcena').value != "") {cmd = cmd + "&cenaot=" + document.getElementById('maxcena').value} window.location.href = cmd } else {alert("Указанное значение цены не является числом")} } else { //в работах cmd = "https://" + window.location.host + "/gotrab.asp?vid=" + document.getElementById('vid').value + "&predmet=" + document.getElementById('predmet').value if (isNaN(document.getElementById('maxcena').value) == false) { if (document.getElementById('maxcena').value != "") {cmd = cmd + "&cenaot=" + document.getElementById('maxcena').value} if (document.getElementById('namerab').value != "") {cmd = cmd + "&namerab=" + document.getElementById('namerab').value} window.location.href = cmd } else {alert("Указанное значение цены не является числом")} } } </SCRIPT> </html>