Создание сайта

Рекламно-информационные ресурсы, объединенные общей идеей и общим дизайном. Язык гипертекстовой разметки, используемый для кодирования документов. Характеристика выбранного языка программирования. Макет разрабатываемого сайта. Создание Web-страницы.

Рубрика Программирование, компьютеры и кибернетика
Вид отчет по практике
Язык русский
Дата добавления 02.02.2014
Размер файла 270,0 K

Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже

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

Размещено на http://www.allbest.ru/

Федеральное агентство по образованию

ГОУ ВПО «Магнитогорский государственный университет»

Кафедра прикладной математики и вычислительной техники

Отчет

по Вычислительной практике

Создание сайта

Выполнила:

студент ФМФ 37 группы,

Римша А.С.

Проверила:

канд. физ.-мат. наук,

доцент Торшина О.А.

Магнитогорск, 2013 г.

Оглавление

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

Введение

1. Сайт - это просто

1.1 Что такое сайт?

1.2 Как обычно создаются сайты

2. Практическая часть

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

2.2 Цель разработки

2.3 Характеристика выбранного языка программирования

2.4 Макет разрабатываемого сайта

Заключение

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

Введение

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

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

На сегодняшний день World Wide Web - глобальная компьютерная сеть. Она содержит миллионы сайтов, на которых размещена всевозможная информация. Люди получают доступ к этой информации посредством использования технологии Internet.

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

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

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

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

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

1. Сайт - это просто

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

1.1 Что такое сайт?

Интернет-сайт - место в Интернете, которое имеет свой уникальный адрес (доменное имя). Интернет-сайт (далее - просто «сайт») состоит из одной или нескольких Интернет - страниц и имеет дизайн, помогающий восприятию размещенной на сайте информации.

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

1.2 Как обычно создаются сайты

Обычно человек, решивший создать сайт, должен решить ряд задач: кроме подготовки содержимого сайта (описаний, прайс-листов, изображений товаров и других содержательных элементов), ему нужно:

* Выбрать и зарегистрировать доменное имя сайта;

* Найти и оплатить надежный хостинг (сайт должен быть размещен на надежном компьютере, постоянно подключенном к Интернету по быстрому каналу;

* Разыскать хороших специалистов для разработки дизайна, структуры сайта и его внутреннего механизма («движок» сайта);

* Объяснить разработчикам, что же все-таки хочется увидеть в итоге. Как правило, донести это с первого раза не получается.

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

2. Практическая часть

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

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

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

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

Существуют следующие виды структур:

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

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

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

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

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

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

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

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

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

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

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

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

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

На этапе постановки задачи были решены следующие вопросы:

* Определена целевая аудитория, на которую рассчитывается создание данного проекта;

* Определены основные цели и задачи проекта;

* Создана структура сайта.

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

2.2 Цель разработки

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

Целью моего проекта является разработка сайта, который я посветил спорту, и сделал его для спорткомплекса МаГУ.

Задачи сайта:

* Привлечь студентов к спорту

* Стать инструментом распространения информации о работе спорткомплекса. Предоставить: последние новости спорта в Вузе расписание тренировок, таблицу результатов спартакиады МаГУ, фото, видео необходимые для формирования правильного представления спорта в Вузе, всем желающим.

* Найти новых спортсменов.

* Реализовать демонстрацию спорта. На Интернет-сайте может быть представлена развернутая информация о спорте.

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

* Рассмотреть этапы разработки WEB-сайта.

* Описать язык HTML и JavaScript для создания сайта.

* Изучить теоретический материал и структуру HTML.

* Рассмотреть основные области использования языка JavaScript при создании HTML страниц.

Сайт «ВузSport МаГУ» отвечает всем функциональным требованиям и эксплуатационным характеристикам, содержит всю необходимую информацию, позволяет ознакомиться с тренировками и турнирной таблицей, узнать последние новости о спорте не выходя из дома.

2.3 Характеристика выбранного языка программирования

Обычно HTML-документ - это файл с расширением .html или .htm, в котором текст размечен HTML-тегами (англ. tag - специальные встроенные указания).

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

Документ в целом должен быть отмечен как документ в формате HTML. Для этого он должен начинаться командой <HTML> и заканчиваться командой </HTML>.

Документ состоит из 2 частей: заголовка (Head) и собственно документа (Body).

Для выделения заголовка следует ввести: <HEAD>

Заголовок документа <HEAD>

Каждый WWW - документ имеет название, которое вводится в титульной строке браузера.

Для ввода титульной строки в заголовок документа следует воспользоваться следующими командами: <HEAD> <TITLE> TITLE List </TITLE> </HEAD>.

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

Для записи основного текста следует ввести: <BODY> Основной текст </BODY>

Таким образом, общая схема документа в формате HTML выглядит следующим образом:

<HTML>

<HEAD> < TITLE> Титульная строка документа < /TITLE> </HEAD>

<BODY> Основной текст документа </BODY>

</HTML>

При написании команд HTML не имеет значение, какими буквами - строчными или прописными Вы пишете команды.

Под термином CSS мы понимаем фразу "Каскадные Таблицы Стилей". Они внедряются в HTML-код и не требуют никаких специальных редакторов и компиляторов, ведь интерпретируются обычным браузером.

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

Возьмем типичную таблицу HTML и поставим атрибут border="1". После интерпретации данного кода браузером, мы получим самый обыкновенный результат. Вот тут и приходят на помощь CSS, по средствам которых можно оформить любую таблицу на свой вкус.

Рассмотрим небольшой пример:

<STYLE TYPE=”text/css”>

Описание стилей форматирования

</STYLE>

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

Следует помнить, что конструкция указания пути к внешнему CSS-файлу должна находиться в пределах раздела head HTML-документа;

внедрение в документ. Под внедрением в документ подразумевается задание стилевой конструкции внутри самой HTML-страницы, например:

<STYLE TYPE="text/CS3">

<! --

BODY {font-family: Arial, Helvetica;}

INPUT {background-color: ICECECE;}

-- >

</STYLE>

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

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

<Р ALIGN="justify" STYLE="color: 1000000; font-family: Verdana;"> Текст параграфа...

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

<TABLE>

<TR>

<TD CLASS="header"X/TD>

<TD CLASS="text"X/TD>

</TR>

</TABLE>

Описание классов должно строиться следующим способом (на примере внедрения стилевого шаблона в документ):

<STYLE TYPE="text/css">

<! --

header {font-weight: bold; color: gray;}

text {color: black; font-size: llpx;}

-->

</STYLE>

импортирование. Импортирование стилевого шаблона CSS, по сути, аналогично указанию ссылки на внешний файл:

<STYLE TYPE-"text/css">

<! --

@import: url(style.ess);

-->

</STYLE>

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

Так же в разработке сайта использовались отдельные скрипты.

JavaScript - это язык управления сценариями просмотра гипертекстовых страниц Web на стороне клиента.

К возможностям JavaScript можно относят следующее:

отображать изменяющиеся данные, такие как текущее время или дата;

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

изменять внешний вид элементов страницы, если пользователь щелкнул мышью или провел курсор мыши над элементом. JavaScript работает в объектно-ориентированной архитектуре, напоминающей Java или C++.

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

Тэг <SCRIPT> сообщает браузеру, что внутри HTML размещен код JavaScript.

Тэг </SCRIPT> отменяет действие.

<!-- и --> тэги сообщают браузерам, которые не могут интерпретировать <SCRIPT> и </SCRIPT>, что строки кода следует рассматривать как комментарии.

Двойная косая черта (//) перед тэгом --> - знак комментария в языке JavaScript; без него JavaScript интерпретирует --> как ошибочный оператор.

Document.write - метод, который прописывает HTML в Web-страницу как при программировании вручную.

Каждый JavaScript - оператор должен заканчиваться точкой с запятой. Отсутствие точки с запятой JavaScript считает ошибкой. Логические выражения должны быть заключены в круглые скобки, а блоки операторов -- в фигурные скобки.

JavaScript использует знак == как логический оператор эквивалентности и знак = в качестве оператора присваивания. Попытка сравнения с использованием знака равенства (=) - вторая причина ошибок в JavaScript.

2.4 Макет разрабатываемого сайта

«Главная страница»

<table class="header-table">

<tr>

<td class="data-block">

<!--<s5212>-->

Приветствую Вас

<!--</s>-->

<b>Гость</b>

</td></tr>

<tr><td class="logo-block">

<h1><!-- <logo> -->ВузSport МаГУ

<!-- </logo> --></h1></td></tr>

<tr><td class="nav-block">

<a href="http://caramba007.ucoz.ru/">

<!--<s5176>-->Главная<!--</s>-->

</a> | <a href="http://caramba007.ucoz.ru/index/3">

<!--<s3089>-->Регистрация<!--</s>-->

</a> | <a href="javascript://"

rel="nofollow" onclick="new _

uWnd('LF','',-250,110,

{autosize:0,closeonesc:1,resize:1},

{url:'/index/40'});

return false;">

<!--<s3087>-->Вход<!--</s>--></a> |

< a href="http://caramba007.ucoz.ru/news/rss/">RSS</a>

</td></tr>

</table>

<table class="main-table">

<tr>

<td class="content-block">

<!-- <body> -->

<a href="http://caramba007.ucoz.ru/">

<!--<s5176>-->Главная

<!--</s>-->

</a> &raquo; Архив материалов

<hr />

<div id="myGrid" style="display:none;">

<div style="position:fixed;

width:100%;text-align:center;padding-top:250px;">

<img alt=""

src="http://s82.ucoz.net/img/ma/m/i3.gif"

border="0" width="220" height="19" />

</div></div><script

type="text/javascript">

function spages(p){if (1)

{document.location.href='http'+':

//caramba007.ucoz.ru/news/'+p; return;}

try{document.getElementById('myGrid').style.cssText

= 'position:absolute; z-index:8;

top:0;left:0;

display:normal;

background:

url(\'http://s82.ucoz.net/img/fr/g.gif\');

text-align:center;

width:'+document.body.scrollWidth+'px;

height:'+document.body.scrollHeight+'px;';}

catch(e){}_

uPostForm( '',{url:'http'+'://caramba007.ucoz.ru/news/'+p+'-0-0-0-0-0-

'+Math.floor(Math.random()*1e8)});}

</script>

<div id="allEntries">

<div id="entryID5">

<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="http://caramba007.ucoz.ru/news/

pozdravljaem_pobeditelej_i_uchastnikov_tradicionnogo_vnutrivuzovskogo_turistskogo_sljota_magu_sodruzhestvo_2013/2013-05-17-5>

Поздравляем победителей и участников традиционного внутривузовского туристского слёта МаГУ «Содружество 2013»!

</a></div>

<div class="eMessage"

style="text-align:left;clear:both;padding-top:2px;padding-bottom:2px;">

<ul style="font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;

font-size: 12px; ">

<li style="vertical-align: middle;

text-align: justify;

margin-left: 10px;

line-height: 20px; ">

<font color="#cc0000"><b>

I место</b></font>&nbsp;

в общем зачете Слёта - команда социального факультета;

</li><li style="vertical-align: middle;

text-align: justify;

margin-left: 10px;

line-height: 20px; ">

<font color="#cc0000"><b>

II место</b></font>&nbsp;

в общем зачете Слёта - команда физико-математического факультета;

</li><li style="vertical-align:

middle;

text-align: justify;

margin-left:

10px;

line-height: 20px; ">

<font color="#cc0000"><b>

III место</b></font>&nbsp;

в общем зачете Слёта - команда факультета изобразительного искусства и дизайна.

</li></ul><h6 style="color: rgb(11, 64, 104);

font-family: Arial, Helvetica, sans-serif;

font-size: 17px; margin: 0px;

padding-top: 5px;

text-indent: 20px;

">Победители на дистанции «Туртехника»

</h6><ul style="font-family: Tahoma, Verdana, Arial, Helvetica, sans-s

<!--"--><span

class="entDots">...

</span>

<span class="entryReadAll">

<a class="entryReadAllLink"

href=http://caramba007.ucoz.ru/news/pozdravljaem_pobeditelej_i_uchastnikov_tradicionnogo_vnutrivuzovskogo_turistskogo_sljota_magu_sodruzhestvo_

2013/2013-05-17-5>

Читать дальше &raquo;

</a></span></div>

<a href="javascript://"

rel="nofollow"

onclick="window.open

('http://caramba007.ucoz.ru/index/8-2', 'up2', 'scrollbars=1,

top=0,left=0,resizable=1,width=680,height=350');

return false;">Alexander777</a>

Дата: <span title="20:10">17.05.2013

</span>|<a href="

http://caramba007.ucoz.ru/news/pozdravljaem_pobeditelej_i_uchastnikov_tradicionnogo_vnutrivuzovskogo_turistskogo_sljota_magu_sodruzhestvo_

2013/2013-05-17-5#comments\">

Комментарии (0)

</a></div>

</td></tr>

</table><br />

</div><div id="entryID4">

<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="http://caramba007.ucoz.ru/news/tennis/2013-05-16-4">

Теннис

</a></div>

<div class="eMessage"

style="text-align:left;clear:both;padding-top:2px;padding-bottom:2px;">

<span style="font-family: tahoma, arial, verdana, sans-serif, 'Lucida

Sans'; font-size: 10.909090995788574px;

line-height: 13.63636302947998px;

background-color: rgb(255, 255, 255); ">

23 мая в 14.30 соревнования по настольному теннису среди юношей!!!

</span></div>

<div class="eDetails" style="clear:both;">

<div style="float:right">

<ul id="uStarRating4" class="u-star-rating-12" title="Рейтинг: 0.0/0">

<li class="u-current-rating" id="uCurStarRating4" style="width:0%;">

</li></ul></div>

<div class="eTitle" style="text-align:left;">

<a href="

http://caramba007.ucoz.ru/news/zavershena_ocherednaja_znakovaja_ehstafeta_posvjashhennaja_dnju_pobedy_absoljutnym_pobeditelem_ehstafety_snova_stanovitsja_komanda_magu/2013-05-13-3">

Завершена очередная, знаковая эстафета, посвященная Дню Победы. Абсолютным победителем эстафеты снова становится команда МаГУ.

</a></div>

<div class="eMessage" style="text-align:left;clear:both;padding-top:2px;

padding-bottom:2px;">

<pre>

<img src="http://www.mr-info.ru/uploads/fotos/mr130508.jpg" alt="">

<span style="background-color: rgb(219, 219, 219); color: rgb(51, 51, 51);

font-family: Tahoma; font-size: 14px; text-align: justify; text-indent: 10px;">

Легкоатлетическая эстафета на призы газеты «Магнитогорский рабочий» открыла спортивный летний сезон.

</span></pre>

<div id="news-id-7019" style="color: rgb(51, 51, 51);

font-family: Tahoma; font-size: 14px; text-align: justify; text-indent: 10px; background-color: rgb(219, 219, 219); display: inline; ">

<div style="text-align: left;">

Самые спортивные, быстрые, амбициозные - вот такие они, участники легкоатлетической эстафеты, которая традиционно проводится в канун Дня Победы и посвящена ему.&nbsp;

<span style="letter-spacing: 0px; line-height: 1.5em; word-spa

<!--"--><span class="entDots">...</span>

<span class="entryReadAll">

<a class="entryReadAllLink"

href="http://caramba007.ucoz.ru/news/zavershena_ocherednaja_znakovaja_ehstafeta_posvjashhennaja_dnju_pobedy_absoljutnym_pobeditelem_ehstafety_snova_stanovitsja_komanda_magu/2013-05-13-3">

Читать дальше &raquo;

</a></span></div>

<div class="eDetails" style="clear:both;">

<div style="float:right"><ul id="uStarRating3"

class="u-star-rating-12" title="Рейтинг: 0.0/0">

<li class="u-current-rating" id="uCurStarRating3" style="width:0%;">

</li></ul></div>

«Разделы»

<table class="boxTable">

<tr><td class="boxContent">

<!-- <bc> -->

<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

<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="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="/index/0-3"><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="/index/pleer/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="/video"><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>

<table class="boxTable">

<tr><th><!-- <bt> -->

<!--<s5195>-->

Статистика

<!--</s>--><!-- </bt> -->

</th></tr><tr>

<td class="boxContent">

<div align="center">

<!-- <bc> --><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><!-- </bc> -->

</div></td></tr></table>

<table class="boxTable">

<tr><th><!-- <bt> -->

<!--<s3163>-->

Поиск

<!--</s>--><!-- </bt> -->

</th></tr><tr>

<td class="boxContent">

<div align="center">

<!-- <bc> -->

<div class="searchForm">

<form onsubmit="this.sfSbm.disabled=true" method="get" style="margin:0" action="/search/">

<div align="center" class="schQuery">

<input type="text" name="q" maxlength="30" size="20" class="queryField" />

</div><div align="center" class="schBtn">

<input type="submit" class="searchSbmFl" name="sfSbm"

value="Найти" />

</div></form></div><!-- </bc> -->

</div></td></tr></table>

<table class="boxTable">

<tr><th><!-- <bt> -->

Инфо о спорте

<!-- </bt> --></th></tr><tr>

<td class="boxContent"><!-- <bc> -->

<table border="0" cellspacing="1"

cellpadding="0" width="100%" class="catsTable">

<tr><td style="width:100%" class="catsTd" valign="top">

<a href="http://caramba007.ucoz.ru/news/video/1-0-1"

class="catName">видео</a>

<span class="catNumData" style="unicode-bidi:embed;">[0]</span>

</td></tr></table><!-- </bc> -->

</td></tr></table>

<script type="text/javascript">

fid=10; v_width=210; v_height=900

</script><script type="text/javascript" src="

http://allsport-news.com/news_modul/news_panel_mini.js">

</script>

</td></tr>

<td colspan="2" class="footer">

<!-- <copy> -->

Ленина 95 спорткомплекс МаГУ ©

<!-- </copy> --><br><!-- "' -->

<span class="pbq8TOpq">

</a></span>

</td></tr>

</table>

</div>

</body>

</html>

Заключение

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

В результате выполнения проекта на тему «Разработка сайта «ВузSport МаГУ», был разработан сайт на основе HTML с использованием JavaScript.

Язык HTML существует в нескольких вариантах и продолжает развиваться, но конструкции HTML вероятнее всего будут использоваться в и дальнейшем. Изучая HTML и познавая его глубже, создавая документ в начале изучения HTML и расширяя его насколько это возможно, Вы сможете создавать документы, которые могут быть просмотрены многими браузерами Web, как сейчас, так и в будущем. Это не исключает возможности использования других методов, например, метод расширенных возможностей, представляемый Netcape Navigator, Internet Explorer или некоторыми другими программами. Работа с HTML - это способ усвоить особенности создания документов в стандартизированном языке, используя расширения, только тогда это действительно необходимо.

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

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

1. Печников, В.Н. Создание Web-страниц и Web-сайтов / В.Н. Печников. - 2006. - 463 c.

2. Пирамидин, A. Спецификация языка HTML4.0 / А. Пирамидин. - 2006. - 318 c.

3. Смирнова, И.Е. Начала веб - дизайна / И.Е. Смирнова // БХВ - Петербург. - 2005. - 256 с.

4. Матросов , A. HTML 4.0 / А. Матросов. - 2003. - 674 c.

5. http://www.sitem.ru/book.html.

6. http://1popov.ru/bonuscourse/htmlform/.

Размещено на Allbest.ru


Подобные документы

  • Принципы информатизации высших учебных заведений и образовательные информационные технологии. Язык разметки гипертекстовой информации. Php и javaScript при разработке сайта учебного заведения. Создание меню для навигации по сайту и счётчика посещений.

    дипломная работа [464,8 K], добавлен 03.09.2012

  • Создание тематического Web-сайта с использованием гипертекстового языка разметки HTML, каскадных листов стилей CSS и языка программирования Java Script. Описание используемых тегов при его создании. Особенности разработки навигации и интерфейса сайта.

    контрольная работа [2,8 M], добавлен 02.12.2009

  • Создание индивидуального сайта с использованием языка гипертекстовой разметки HTML и языка скриптов JavaScript. Программные средства, используемые при выполнении работы. Основные средства для создания сайта. Разработка CSS-файла (таблица стилей).

    лабораторная работа [31,0 K], добавлен 28.10.2010

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

    курсовая работа [2,2 M], добавлен 16.04.2017

  • Основы Web-программирования. Сервер баз данных MySQL. Язык сценариев PHP. Язык гипертекстовой разметки HTML. Назначение и цели разработки сайта. Форма входа и регистрации, обратная связь интернет–магазина. Требования к структуре сайта, описание контента.

    курсовая работа [754,5 K], добавлен 02.06.2014

  • Сравнение языка Php с другими языками программирования web-приложений. Язык разметки гипертекстовых страниц Html. Технология Macromedia Flash, её преимущества и недостатки. Этапы создания флеш-сайта, руководство пользователя и листинг программы.

    дипломная работа [2,3 M], добавлен 04.10.2013

  • Назначение информационно-новостного сайта. Структура пользовательской и административной частей. Эмулятор Web–сервера Denwer 3. Типы данных, используемые в PHP. MySQL база данных. Каскадная таблица стилей CSS. Язык гипертекстовой разметки документов HTML.

    дипломная работа [2,0 M], добавлен 05.02.2013

  • Практическая значимость создания сайта. Язык программирования JavaScript. Основные области использования языка JavaScript при создании интерактивных HTML-страниц. Язык программирования PHP. Программная основа сайта. Создание оформления дизайна сайта.

    дипломная работа [1,1 M], добавлен 05.03.2013

  • Создание тематического Web-сайта с использованием гипертекстового языка разметки HTML, каскадных листов стилей CSS и языка программирования JavaScript. Проблема высокого уровня нагрузки на хостинг и создания уникального контента. Выбор средств CMS.

    курсовая работа [3,6 M], добавлен 25.05.2014

  • Создание сайта при помощи HTML и CSS. Язык гипертекстовой разметки HTML и таблица стилей CSS. Основные понятия об этих языках, этапы и алгоритмы программного обеспечения. Добавление стилей в документ. Свойства элементов, принцип построения Web-страницы.

    курсовая работа [2,9 M], добавлен 12.01.2016

Работы в архивах красиво оформлены согласно требованиям ВУЗов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
Рекомендуем скачать работу.