Основная часть

1 Анализ теоретических аспектов разработки Web- сайта гпоу «ппэт»

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

Для этого необходимо решить следующие частные задачи:

• ознакомиться с современными Интернет-технологиями и, по возможности, использовать их в своей разработке;

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

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

• ознакомиться с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительно следовать им в своей практике;

• определиться со структурой Web-страниц;

• выбрать стратегию разработки и создания Web-сайта.

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

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

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

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

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

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

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

Также в данной работе будут рассмотрены основы языка программирования Web-страниц – HTML, который является общепринятым стандартом WWW. Это даст возможность ознакомиться со структурой Web-страницы и приемами ее правильного оформления.

Решение этих вопросов будет представлено на примере сайта ГПОУ «Печорский промышленно-экономический техникум», который входит в пятерку «Rambler топ 100» в теме «Образование. Техникумы».

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

• Федеральный закон от 29.12.2012 года №273 - ФЗ «Об образовании в Российской Федерации»

• Федеральный закон от 27.07.2006 года №152-ФЗ «О персональных данных»

• Постановление Правительства Российской Федерации от 10.07.2013 года №582 «Правила размещения на официальном сайте образовательной организации информационно-телекоммуникационной сети «интернет» и обновления информации об образовательной организации»

• Постановление Правительства Российской Федерации от 18.04.2012 г. N 343 «Об утверждении Правил размещения в сети Интернет и обновления информации об образовательном учреждении»

• Закон Республики Коми от 6.10.2006 г. N 92-РЗ (с изм. и доп.) «Об образовании»

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

Анализ современных средств разработки сайтов.

На сегодняшний день существуют разнообразные автоматизированные системы для создания сайтов, при этом участие пользователя сведено только к наполнению шаблона личными данными (Google сайты, Joomla и т.д.) Но для создания сайта образовательного учреждения эти системы не подходят, в связи со спецификой деятельности (разные направления, разные услуги), необходима конкретная разработка разделов сайта под потребности техникума. Наиболее доступным из средств разработки Web - сайтов является использование языка HTML и редактора офис Front Page.

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

HTML является приложением SGML.

SGML (англ. Standard Generalized Markup Language) - метаязык, на котором можно определять язык разметки для документов.

Для создания HTML документов используют текстовые редакторы (например, Блокнот), текстовые процессоры (Word), редакторы тегов HTML и визуальные HTML-редакторы. Можно создать HTML документ в простом Блокноте. Соблюдая определённый стандарт и записав в текстовом файле HTML код, сохранив на жёстком диске и изменив расширение на .html или .htm на выходе получится полноценная web страничку.

Для создания HTML документа используют теги. Теги - это инструменты разметки текста. Теги могут прописываться как строчными, так и прописными буквами. Теги бывают парными и не парными. Пример парного тега <html></html>, в любом HTML документе присутствует этот тег, так как он служит началом и концом кода. Вторая часть парного тега отличается от первой только наличием символа "/", однако первая часть тега может содержать и дополнительные параметры. Например, в теге <font size="4"></font>, параметр size="4"определяет размер текста. Примером непарного тега является<hr>- этот тег используется для вставки в HTML документ горизонтальной линии.

Любой HTML документ должен содержать следующие теги<html></html>, <head></head>, <body></body>, <title></title>. Порядок расположения тегов в HTML документе выглядит так:

<html>

<head>

<title>Название страницы</title>

</head>

<body>

Тело документа

</body>

</html>

Внутри тега<head></head>располагается название HTML документа (именно его можно увидеть в качестве ссылки в результатах поиска поисковыми системами), помимо этого тега внутри конструкции<head></head>могут располагаться так называемые Мета Теги.

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

К одному тегу можно добавить несколько атрибутов. Если атрибуты тега следуют после имени тега, они разделяются одним или несколькими пробелами. Порядок следования не важен. Большинство атрибутов имеют значения, которые следуют за знаком равенства (=), находящимся после имени атрибута. Длина значений ограничена 1024 символами. Значения могут быть чувствительны к регистру. Иногда значения должны находиться в кавычках (двойных или одинарных).

Пример кода HTML главной страницы сайта ГПОУ «ППЭТ»:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>ГПОУ ППЭТ :: Главная</title>

<base href="http://pechora-pet.ru/">

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

<link rel="stylesheet" type="text/css" href="/header/img-carousel/styles-carousel.css">

<script type="text/javascript" src="lib/jquery-1.7.1.min.js"></script>

<script type="text/javascript" src="/lib/jquery.easing.1.3.js"></script>

<script type="text/javascript" src="/javascript/menu-blob-animation.js"></script>

<script type="text/javascript" src="/header/img-carousel/carousel.js"></script>

<script type="text/javascript" src="/javascript/outaphorism.js"></script>

</head>

<body>

<?php

include("../header/header.php");

?>

<div class="wrapper" style="margin-top:50px;">

<!---->

<div style="float:right; width:300px;">

<?php

include("../sideright/photo.php");

include("../sideright/yandexbar.htm");

include("../sideright/slider.htm");

include("../sideright/edu-news.htm");

include("../sideright/more-news.htm");

include("../sideright/ombudsman.htm");

include("../sideright/gosuslugi.htm");

include("../sideright/profobrazovanie.htm");

//include("sideright/calend.htm");

?>

<div style="clear:both"></div>

</div>

<!--block content-->

<div id="content-box-s">

<div id="content">

<?php include("content.htm"); ?>

</div>

<div id="content-box-bottom"></div>

</div>

<!--block state_resources-->

<div style="margin-right:325px;">

<?php include("../footer/state_resources.htm");?>

</div>

<div style="clear:right"></div>

</div>

<?php

include("../footer/aphorism.txt");

include("../footer/footer.php");

?>

</body>

</html>

В качестве редактора HTML документа сайта ГПОУ «ППЭТ» использовался редактор FrontPage.

Программа FrontPage, которая входит в состав Microsoft Office XP, предназначена для создания Web-страниц и Web-узлов. Благодаря панели инструментов и команды меню, на странице можно размещать текстовую и графическую информацию. Панели навигации и ссылки предназначены для перехода от одной страницы к другой. Кроме того, для оформления Web-страницы можно использовать таблицы, фреймы, бегущие строки, анимацию и многое другое. Для того чтобы ускорить разработку Web-страниц и узлов, можно применять шаблоны и мастера. FrontPage позволяет использовать в Web-узле материал, подготовленный в других программных продуктах, входящих в Microsoft Office, таких как Word, Excel, Access и PowerPoint.

В настоящее время существует два типа редакторов, создающих Web-узлы:

• работающие непосредственно с кодом

• визуальные редакторы.

У них существуют свои плюсы и минусы. При создании Web-сайтов с помощью кодовых редакторов разработчику необходимо знать язык HTML. Работа в визуальном редакторе, таком как, например, FrontPage, достаточно проста и напоминает процесс создания документа в Microsoft Word. Для того чтобы посмотреть как будет выглядеть созданная страница не обязательно выходить из редактора.

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

• работать с интуитивно-понятным, унифицированным интерфейсом Microsoft Office;

• просматривать информацию о компонентах веб-сайта;

• использовать в одном сеансе различные режимы работы с веб-страницами: режим конструктора, режим HTML-кода и режим просмотра в броузере;

• применять при создании веб-сайта стилистические темы;

• управлять веб-сайтом;

• открывать и редактировать веб-сайт непосредственно на сервере;

• вносить изменения на страницы веб-сайта или создавать новые страницы;

• одновременно вносить изменения в совместный веб-сайт;

• форматировать веб-сайт при помощи каскадных таблиц стилей;

• добавлять на веб-страницу новые элементы и объекты;

• выполнять привычные текстовые операции: поверять орфографию, осуществлять поиск и замену текста.

Системные требования HTML-редакторов FrontPage.

Для HTML – редактора FrontPage необходим процессор Pentium 133 MГц или выше, рекомендуемый Pentium III. Оперативная память должна занимать 16 Мб, рекомендуется 32 Мб.

Свободное место на диске должно составлять 165 Mбайт и 115 Mбайт на диске, на котором установлена ОС.

Для работы в FrontPage необходим дисплей Super VGA (800Ѕ600) и выше, а также максимальное количество цветов – 256.

Операционная системы - Windows 98 SE, Windows 2000, Windows XP или Windows ServerTM 2003.

Учитывая все вышеизложенное можно сделать следующие выводы:

Для разработки Web-сайта ГПОУ «Печорский промышленно-экономический техникум» возможно использование языка HTML и редактора MS FrontPage.

Опираясь на нормативные документы и общепринятые правила написания сайтов предприятий, в выпускной квалификационной работе будет отражена разработка Web – сайта ГПОУ «ППЭТ».