close

Вход

Забыли?

вход по аккаунту

?

Kursovaya rabota(35)

код для вставкиСкачать
Федеральное государственное бюджетное образовательное учреждение высшего
профессионального образования
"РОССИЙСКАЯ АКАДЕМИЯ НАРОДНОГО ХОЗЯЙСТВА
И ГОСУДАРСТВЕННОЙ СЛУЖБЫ при ПРЕЗДЕНТЕ РОССИЙСКОЙ ФЕДЕРАЦИИ"
Брянский филиал РАНХ и ГС
Факультет (институт) ____________________________________________________
Специальность/направление подготовки __230700.62 - Прикладная информатика________
Специализация/профиль/программа ______________________________________________
Кафедра _____Математики и информационных технологий___________________________ КУРСОВАЯ РАБОТА (ПРОЕКТ)
на тему:
"Использование интернет- ресурсов для создания
сайта администрации района"
Автор работы:
студент 1 курса
очно - заочной формы обучения
Ф.И.О. Бровкин Д.В.
подпись__________
Руководитель работы:
Должность, звание канд. техн. наук, доцент
Ф.И.О. Казаков Ю.М.
Оценка ____________
Подпись ___________
"_____"___________2013г.
Брянск 2013г.
Содержание
С.
Введение ............................................................................................................... 3 Глава 1. Структура Web-сайтов и Web-документов .............................. 4
1.1. Общие сведения .......................................................................................... 4
1.2. Структура Web-сайта ................................................................................. 5
1.3. Классификация Web-сайтов ...................................................................... 9
1.4. Этапы создания Web-сайта ........................................................................ 14
1.5. Структура Web-документов ...................................................................... 15
Глава 2. Программы создания Web-документов .......................................... 24
2.1. HTML-редакторы......................................................................................... 24
2.2. Системы управления сайтом (CMS) .......................................................... 26
Заключение ........................................................................................................... 34
Библиографический список .............................................................................. 35
Приложения ................................................................................................................. 36
ВВЕДЕНИЕ
Влияние глобальной компьютерной сети Интернет на современный мир не имеет исторических аналогов. Его сегодняшний день - это начало эпохи электронного проникновения во все сферы человеческой жизни, это нечто большее, чем просто маркетинговая кампания, это основа новой философии и новой деловой стратегии.
Интернет и WWW прочно вошли в нашу жизнь, и нам уже трудно представить свою деятельность без них. WWW - это огромный набор гипертекстовых документов, которые благодаря Интернет доступны в любой точке мира.
Актуальность данной работы заключается в том, что сейчас Интернет становятся столь же привычными, как телефон. Практически каждый человек с различной частотой прибегает к его услугам, так как Всемирная сеть обладает такими неоспоримыми достоинствами как доступность, оперативность и информативность. Поэтому в настоящее время актуально создавать различные сайты.
Существует множество средств для создания Web-сайтов, но лишь некоторые из них способны предоставить разработчикам инструменты для решения подавляющего большинства стоящих перед ним задач. Бесчисленное множество новых технологий, вызванных бурным ростом информатизации общества, делает нашу жизнь невозможной без быстрого доступа к информации. В наше время очень легко получить информацию, одним из способов быстрого доступа к ней является сайт. Пользователю приятно посещать те Web-страницы, которые имеют стильное оформление, не отягощены чрезмерно графикой и анимацией, быстро загружаются и правильно отображаются в окне Web-браузера.
Объект исследования: Web - сайт, Web - страница.
Предмет нашего исследования - Web-сайт, его структура и классификация.
Цель: Изучить структуру и классификацию Web - сайтов, применение HTML языка, произвести обзор программного обеспечения для создания Web- сайта.
Задачи:
- получить представление о структуре Web - страницы;
- рассмотреть классификацию Web-сайтов;
- ознакомиться с этапами создания сайта;
- ознакомиться с гипертекстовым языком HTML;
- ознакомиться с программами для создания Web- документов.
Глава 1. СТРУКТУРА WEB-САЙТОВ И WEB-ДОКУМЕНТОВ 1.1. Общие сведения
Информация, доступная пользователям Internet, располагается на компьютерах (Web-серверах), на которых установлено специальное программное обеспечение, в виде отдельных документов. В основе каждого такого документа лежит текст, который может быть оформлен различными шрифтами, стилями и т. п. В тексте могут быть помещены иллюстрации, таблицы, видео-клипы, также возможно добавление фоновой звуковой дорожки. Основное свойство документов во Всемирной Паутине - наличие ссылок на другие документы, находящиеся в Сети. Такие ссылки называются гиперссылками (hyperlink), они позволяют при просмотре быстро переходить от одного документа к другому, и тем самым связывают все документы в единое целое. Документы, о которых идёт речь, называются web-страницами. Содержимое web-страниц часто называют гипертекстом. Набор страниц, объединённых общей тематикой, называется Web-сайтом (web site) (Рисунок 1).
page1.htm page2.htm page3.htm
Графика Аудио Видео Графика Аудио Видео Графика Аудио Видео
Рис 1. Типичная схема Web-сайта
Создание Web-сайтов является одной из важнейших технологий разработки ресурсов Интернет. Хороший сайт, вбирая в себя всю полезную информацию, является лучшей визитной карточкой и коммерческой фирмы и образовательного учреждения, работая на них в любое время суток. Обычно весь сайт целиком хранится на одном компьютере сети, называемом web-сервером. Довольно часто серверы содержат несколько сайтов.
В настоящее время во всемирной паутине размещено несколько миллионов Web-сайтов и их число постоянно растет. Вы можете не только просмотреть любой из них и извлечь полезную для себя информацию, но и принять активное участие в их создании.
У каждого объекта, к которому можно получить доступ через Internet (в частности, у сайтов и отдельных web-страниц) имеется свой адрес в сети, который называется иначе унифицированным адресом ресурса (Uniform Resource Locator, URL).
Для просмотра Web-сайтов на компьютере пользователя используются специальные программы, которые называются браузерами. Наиболее распространенными браузерами в настоящее время являются Internet Explorer, Netscape Navigator, Opera, Mozilla Firefox и т.д. В зависимости от того, какое имя (адрес) сайта мы зададим в строке "Адрес", браузер будет загружать в свое окно соответствующую информацию.
1.2. Структура Web-сайта
Структура отражает взаиморасположение и взаимосвязь составных "частей" сайта, его строение. Наиболее чётко она видна в карте сайта и системе навигации.
Из определения "структура сайта" - древовидное иерархическое представление всех элементов сайта, включая информационные разделы и их подразделы. Иными словами - это база веб-ресурса, которая впоследствии наполняется текстовой и графической информацией. При этом важное значение для посетителя имеет простота структуры сайта. Веб-ресурс построен по блочному принципу. Все просто - наверху шапка, слева - меню, справа - блок рекламы, посередине - информация, а внизу написано - "Копирайт - все права защищены".
Структура сайта может быть усложнена - добавлено дополнительное меню под шапкой и продублировано над копирайтом. Также навигационные ссылки размещают и справа вместо рекламы - это кому как нравится и зависит от предназначения данного ресурса.
Хорошая и прозрачная структура, легкая навигация - является признаком хорошего тона. Нужно придумать названия разделам и подразделам, кратко охарактеризовать их (указать какая информации будет в них размещена). Причем подобные мероприятия проводятся для формирования сайта любого типа: визитки, интернет-магазина или крупного развлекательно-информационного портала. Необходимо учитывать, что глубина вложенности страниц не должна превышать правила - "3 клика от главной страницы", но также не стоит перегружать главную страницу несколькими десятками ссылок, ведущими непонятно куда, иначе сайт будет выглядеть пестро и непрезентабельно.
Заголовки для разделов и подразделов необходимо выбирать короткие, простые, с применением ключевых слов, по которым будет продвигаться интернет-ресурс. Идеальная структура сайта имеет один вход и один выход. Как это сделать, если сайт имеет множество страниц? В данном случае сайт будет иметь много входов и всего один выход. Посетитель заходя, на главную страницу сайта, находит интересующую его информацию, под которой находится ссылка на страницу сайта, где ее можно найти. Таким образом посетитель продвигается от главной страницы к внутренним, что позволяет ему не пропустить ту информацию, которая будет ему интересна и полезна. Еще один важный момент при создании сайта - меню сайта должно полностью дублироваться на главной странице полным его описанием. Меню - это важный элемент навигации по сайту. Если посетитель зашел на сайт впервые, то первое, что бросается ему в глаза это информация, выложенная на главной странице. Не найдя интересующей информации, он вряд ли начнем ознакамливаться с меню и уйдет на другой ресурс. Если же для каждого раздела меню создается описание, в этом случае посетитель ознакомится с описанием и пройдет по ссылке на нужную страницу сайта. Таким образом, единственный выход с сайта у посетителя лежит через посещение как минимум двух страниц сайта, что увеличивает значение счетчика посещений. Данная структура сайта строится по принципу "воронки". Особенно эффективна структура сайта, построенная по принципу "воронки", при создании интернет-магазина, корпоративного сайта и бизнес-сайта, где выходом является страница заказа товара. Кроме принципа простоты структуры сайта необходимо также помнить о принципе целевой сегментации.
Этот принцип основан на том, что выделяются основные группы целевой аудитории, и на основании потребностей каждой группы создается структура сайта. При создании сайта важно помнить о том, что красивая картинка - это еще не весь секрет успеха Web-сайта в сети Интернет. Необходимо уделить внимание не только тому, приятно ли будет клиенту находиться на сайте, но и насколько легко и быстро он найдет нужную ему информацию.
Структура сайта бывает внутренней и внешней. Благодаря продуманной внутренней структуре сайта вся необходимая информация будет расположена самым удобным и доступным образом в разделах и подразделах меню. Даже если сайт будет содержать большой объем информации, необходимо разработать такую внутреннюю структуру, в которой можно будет легко сориентироваться потенциальным клиентам.
Существует несколько видов структурирования информационного материала на Web-сайте:
Линейная структура сайта
Материал весь располагается последовательно и выстраивается в логическую цепочку (Рисунок 2) - как главы одной книги или шаги оформления заказа в Интернет-магазине - образуется линейная структура. Линейная цепочка обязана иметь начало и конец, причем начинать просмотр сайта с середины лишено смысла, так как будет трудно уловить суть изложенного материала.
Рис 2. Линейная структура сайта
Древовидная структура сайта
Предполагается, что содержимое каждой страницы кроме первой входит в виде подраздела в страницу более высокого уровня. Такая структура имеет начало - первую страницу, корень дерева, но конец просмотра сайта связан лишь с исчерпанием всего содержимого сайта (Рисунок 3) .
Такая структура лучше всего подходит для коллекций разнородного и сложно устроенного материала - каталогов, сборников статей или ссылок.
Рис 3. Древовидная структура сайта
Гибридная структура сайта
На практике, почти неизбежно использовать и древовидную и последовательную структуру. Например, оглавление электронной книги или каталога статей начинается с иерархически расположенных страниц, но каждую отдельную главу или статью зачастую имеет смысл разбить на несколько следующих друг за другом кусочков. Обратная конфигурация, когда ветки древовидной структуры вырастают их узлов линейной структуры, встречается реже (Рисунок 4).
Рис 4. Гибридная структура сайта
Иерархическая структура
Чаще всего структура Web-сайта представляет собой иерархию. При этом сначала создают категории высшего уровня, а затем материал в логическом порядке размещают в категории, которые находятся ниже. Иерархические структуры бывают двух видов: узкая глубокая и широкая неглубокая.
Узкая глубокая иерархия (Рисунок 5) Характеризуется тем, что на верхнем уровне она имеет мало категорий. Для получения нужной информации пользователь вынужден переходить на несколько уровней вниз.
Рис 5. Узкая глубокая иерархия
Из приведенного примера видно, что для перехода к странице N пользователь должен произвести 4 щелчков мышью.
Широкая неглубокая иерархия (Рисунок 6)
Рис 6. Широкая неглубокая иерархия
Решетчатая структура сайта (Рисунок 7)
Основана на построении системы навигации сайта, когда между вертикальными и горизонтальными элементами (страницами) имеется взаимная связь и возможность быстрого перехода с одной страницы на другую без необходимости посещения промежуточных страниц. Подобная структура приводит к излишнему увеличению гиперссылок и применение её ограничено для больших сайтов, т.е. сайтов с большим количеством страниц. Рис 7. Решетчатая структура сайта
Нелинейная структура (Рисунок 8)
При нелинейной структуре сайта любая страница может содержать ссылки на различные другие страницы, каким-то образом связанные с данной. Такая структура удобна, если сайт содержит большое число независимых страниц или групп страниц, каждая из которых интересна сама по себе и вызывает у читателя разные ассоциации. Аналогичная структура требуется и в том случае, когда тесная связь между страницами приводит к тому, что разные читатели выбирают разные последовательности просмотра страниц сайта.
При такой структуре с каждой страницы читатель может перейти на несколько других страниц, посвященных смежным темам. Порядок просмотра определяется им самим. Нумерация страниц не имеет смысла.
Рис 8. Нелинейная структура
Смешанная структура
Существуют ситуации, когда применяют несколько схем одновременно. Такой подход имеет недостаток - он требует от пользователя концентрации внимания и дополнительных усилий. Чтобы помочь пользователю составляют карту Web-сайта (site-map). На данной карте схематически представляют структуру размещения информации на Web-сайте.
1.3. Классификация Web-сайтов
В настоящее время в глобальной сети интернет существует бесчисленное множество сайтов. Все сайты очень разноплановые и отличаются друг от друга по большому количеству параметров. Классифицировать все это многообразие сайтов достаточно сложно. Можно лишь выделить несколько направлений классификации по разным признакам.
По используемым технологиям:
- Статические сайты
Изначально все сайты были статическими. Они созданы по классической технологии HTML.
Статические сайты представляют собой набор HTML-страниц, связанных друг с другом гиперссылками и загруженных на web-сервер. После набора адреса, соответствующего статическому сайту, пользователь видит в браузере одно и то же содержание, так как страницы этих сайтов располагаются на web-сервере в неизменном виде. Страницы таких сайтов пользователь может скачать себе на компьютер и просматривать локально. Когда необходимо изменить содержимое страниц статических сайтов, автор при помощи специальной программы (HTML-редактор) или обычного текстового редактора модифицирует станицы на своем рабочем компьютере и заново выкладывает на web-сервер. Это достаточно трудоемкий процесс с риском испортить общий дизайн при публикации изменений на одной из страниц.
Однако это не означает, что статические сайты устарели. Они просты в создании и нетребовательны к ресурсам, могут быть расположены на любом хостинге, при эксплуатации не создают нагрузки на web-сервер и не выдают сбоев при большом количестве посетителей.
- Динамические сайты
Состоят из скриптов, шаблонов, информации и т.п. объектов в виде отдельных файлов. Содержимое такого сайта изменяется средствами самого сайта без применения пользователем дополнительного программирования.
Страница динамического сайта с одним и тем же адресом может выглядеть по-разному в зависимости от введенного запроса, прав доступа пользователя и других условий. Это обусловлено тем, что в динамических сайтах при запросе информация извлекается из базы данных, вставляется в шаблон, формируя новую web-страницу, которая отображается в браузере пользователя. Обновление контента динамических сайтов осуществляется гораздо легче - достаточно просто добавить информацию на новую страницу, которая попадает в базу данных с помощью определенного механизма и сайт как бы самостоятельно себя обновляет. Несмотря на интерактивность, широкие функциональные возможности и простоту обновления, динамические сайты не совершенны. Они создают повышенную нагрузку на web-сервер, требуют большее количество ресурсов, увеличивают расход при их создании.
- Флэш-сайты
Технология флэш позволяет создавать эффектные интерактивные сайты со звуком и анимацией. Флэш сайты в общем понимании представляют собой совокупность сменяющих друг друга кадров в определенный промежуток времени. Основной задачей флэш-сайта является произвести сильное впечатление на пользователя, поразить яркой "живой" анимацией, привлечь максимальной интерактивностью, возможностью менять элементы оформления. Один из серьезных недостатков флэш-сайта - это долгая загрузка из-за значительного "веса". Кроме того, флэш-анимация достаточно сложная и дорогая в изготовлении, испытывает сложности взаимодействия с поисковыми системами, практически отсутствует индексация. Хотя флэш-анимация и способна лучше других реализовывать самые яркие и нестандартные интернет-проекты, тем не менее, в настоящее время от нее все чаще отказываются в пользу других технологий. Мобильные устройства, которые приобретают все большую популярность, в ближайшее время полностью откажутся от использования флэша.
По видам доступа:
- Открытые сайты
Все сервисы сайта полностью доступны для всех посетителей. Чтобы воспользоваться всеми возможностями сайта достаточно просто на него зайти.
- Полуоткрытые
Для доступа к сервисам необходимо пройти процедуру регистрации на сайте. Процесс регистрации на разных сайтах может отличаться. Как правило, он заключается в заполнении анкеты с информационными полями: обязательными, такими как "имя пользователя", "пароль", "электронный адрес", и необязательными, такими как "пол", "возраст", "город" и т.п.
Далее предлагается ознакомиться с пользовательским соглашением. Последним шагом регистрации обычно является ее подтверждение по средствам кода или через указанный электронный адрес. Код подтверждения служит защитным механизмом с целью определения, робот регистрируется или человек. Теперь при входе на сайт необходимо ввести логин и пароль, чтобы получить доступ к дополнительным возможностям (скачать файлы, разместить комментарии, прочесть скрытый текст и т.д.). На некоторых сайтах регистрация платная.
- Закрытые
Сайты с закрытым доступом. Это могут быть служебные корпоративные сайты, личные сайты частных лиц или группы лиц. Такие сайты доступны для узкого круга пользователей. Доступ новым пользователям обычно предоставляется через специальные приглашения - инвайты. Инвайт - это код доступа (набор символов) или ссылка, содержащая в себе код, для регистрации в закрытом сервисе, форуме или партнерской программе. Приглашение обычно можно получить у уже зарегистрированного участника, либо у службы поддержки, либо выполнив определенные условия, установленные администрацией закрытого интернет-проекта. Инвайт используют для ограничения доступа к сервису сайта от посторонних пользователей. Закрытыми также могут быть проекты на стадии начального тестирования их сервисов.
По типам предоставляемых сервисов(Рисунок 9):
- Сайт визитка
Сайт визитка - самый простой вид сайта. Сайт такого типа можно сделать даже на простом HTML, без использования системы управления сайтом. Обычно сайт-визитка содержит от 1 до 5 страниц. Сайты этого вида как правило включают в себя только общую информацию о владельце сайта и его контактные данные.
Простота разработки такого вида сайта делает стоимость его создания сравнительно дешевой, что является очевидным преимуществом для заказчика.
Рис 9. Сайта по типам предоставляемых сервисов
- Корпоративные сайты
Корпоративные сайты - это полнофункциональные представительства компаний в интернете. Этот тип сайта лучше всего подходит для серьёзных средних и крупных фирм. Корпоративные сайты содержат полную информацию о компании и её деятельности. Такой тип сайта иногда называют виртуальным офисом, так как посещение такого сайта сравнимо с общением с менеджером по работе с клиентами. Корпоративные сайты нужны, в первую очередь, для формирования имиджа компании и предоставления посетителям и клиентам наиболее полной информации.
-Интернет-витрины
Интернет-витрина или интернет-каталог товаров - это вид сайтов, основная задача которых - продавать. На таких сайтах размещается информация о товарах и контакты, обычно телефоны, по которым следует звонить желающим приобрести предлагаемый товар. На таких сайтах размещаются технические характеристики товаров, отзывы, рекомендации экспертов и т.д.
- Интернет-магазины
Этот вид сайтов аналогичен интернет-витринам, но имеет дополнительный функционал: возможность заказать предлагаемый товар прямо через сайт.
- Промо-сайты
Сайты этого типа предназначены для раскрутки и продвижения какого-либо товара или бренда
- Тематические сайты
Данный тип интернет сайтов характеризуется тем, что содержит информацию по какой-либо конкретной тематике. Сюда же можно отнести интернет-энциклопедии.
- Интернет-порталы
Порталы - это тип сайтов, содержащих большое количество разнообразной информации. Как правило, порталы схожи по структуре с тематическими сайтами, но имеют более развитый функционал и большее количество сервисов и разделов. Также на порталах часто бывают разделы для общения пользователей: чаты, блоги и форумы.
- Блоги
Блог - это тип сайтов, на которых владелец или редактор блога пишет посты со своими новостями, идеями или другой постоянно поступающей информацией. Отличительной особенностью блогов является актуальность публикуемой информации.
- Каталоги сайтов
Это вид сайтов, основным содержимым которых являются структурированные ссылки на другие сайты, а также их краткие описания.
- Поисковые системы
Вид сайтов, предназначенных для поиска страниц в интернете по определённым запросам.
- Почтовые сервисы
Этот тип сайтов предоставляет интерфейс для работы с электронной почтой.
- Интернет-форумы
На сайтах этого вида пользователи могут создавать темы, а также комментировать их. Как правило, форумы ограничены одной специфической тематикой, хотя встречаются и форумы "обо всём".
- Сайты-хостинги
На сайтах этого типа реализована функция хранения каких-либо файлов. Также часто встречаются сайты-хостинги с возможностью просмотра загруженных файлов прямо через браузер.
- Доски объявлений
На таких сайтах пользователи могут размещать или искать информацию в виде каких-либо объявлений, например - о покупке-продаже.
- Социальные сети
Тип сайтов, созданных для общения пользователей между собой. Как правило, на таких сайтах есть рейтинги, страницы пользователей, группы и множество других сервисов.
1.4. Этапы создания Web-сайта
1. Предварительный этап
Цель предварительного этапа разработки - выявить все требования к дизайну и технологической основе проекта, а также определить цели и задачи ресурса и составить подробный план разработки проекта.
2. Разработка дизайна и архитектуры проекта
На данном этапе необходимо ответить на ряд вопросов: * Какова целевая аудитория будущего сайта (пол, возраст, образование, профессия...), т.е. для кого вы делаете сайт; * Каковы предпочтения вашей целевой аудитории. Чтобы ресурс был успешным, он должен соответствовать тому, чего от него ожидают ваши посетители. Так выясните, чего ждет ваша целевая аудитория (какую информацию ищет, как глубоко ее изучает, наклонности, привычки...). Это поможет вам определить нужный контент (содержание) вашего ресурса. * Определение технических ограничений. Если вы определили вашу целевую аудиторию, то можете предположить и ее технические возможности. Если ваш посетитель - обычный среднестатистический пользователь, то и рассчитывать вы можете только на среднее подключение к сети и программное обеспечение. Flash-сайты в таком случае лучше не использовать. * Определение технологий, которые вы будете использовать. Это зависит от ответов на предыдущие вопросы. Если ваш сайт будет посвящен музыке, то без использования мультимедиа явно не обойтись. Главное знать меру и не использовать то, без чего можно обойтись.
3. Создание технологической основы
На основании технического задания и утвержденной концепции дизайна разрабатывается оптимальная структура базы данных, создаются действующие шаблоны всех разделов сайта.
На данном этапе создается рабочая версия сайта, готовая к наполнению текстовыми и графическими материалами.
4. Наполнение контентом
На этом этапе происходит наполнение контентом баз данных сайта. При необходимости создаются и обработаются дополнительные графические материалы для наполнения разделов сайта. 5. Тестирование готового решения
Данный этап включает в себя следующие работы : проверка контента сайта на наличие орфографических ошибок и их исправление, тестирование сайта на правильное отображение в различных браузерах (Internet Explorer, Mozilla, Maxton, Opera и т.д.).
6. Размещение сайта в Интернете
Для размещения сайта в сети необходимо выбрать доменное имя и хостинг. Далее производится перенос на хостинговую платформу.
1.5. Структура Web-документов
Любой Web-сайт состоит из связанных между собой Web-страниц. Web-страница или Web-документ представляет собой текстовый файл с расширением *.htm, который содержит текстовую информацию и специальные команды - HTML-коды, определяющие в каком виде эта информация будет отображаться в окне браузера. В HTML-коде страницы содержатся указания на информацию, которую необходимо отобразить (текст и графика) или воспроизвести (звуковое сопровождение) в окне браузера, инструкции о том, как эта информация должна отображаться или воспроизводиться, а также ссылки на другие страницы.
Язык разметки гипертекстовых страниц (HTML - Hypertext Markup Language) представляет собой язык, разработанный специально для создания Web-документов. Он определяет синтаксис и размещение специальных инструкций (тегов), которые не выводятся на экран, но указывают браузеру, как отображать содержимое документа. Он также используется для создания ссылок на другие документы, локальные или сетевые, например, находящиеся в сети Интернет.
HTML (от англ. HyperText Markup Language - "язык разметки гипертекста") - стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузером и отображается в виде документа, в удобной для человека форме.
HTML является приложением ("частным случаем") SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879. XHTML же является приложением XML.
Стандарт HTML и другие стандарты для Web разработаны под руководством консорциума W3C (World Wide Web Consortium)
На практике на стандарт HTML большое влияние оказывает наличие тегов. Эти теги в данный момент могут как входить, так и не входить в состав действующей спецификации HTML.
Инструментарий редактирования HTML. Документы HTML являются обычными текстовыми ASCII-файлами. Это означает, что для их создания можно использовать любой текстовый редактор, даже с минимальными возможностями. Существуют средства редактирования, разработанные специально для написания HTML. Они позволяют экономить время, так как содержат клавиши быстрого доступа для выполнения повторяющихся операций, например, задания начальных установок документов, таблиц или просто применения стилей к тексту. HomeSite, мощный и недорогой редактор HTML компании Allaire Corporation. В нем имеются средства для выделения цветами синтаксических конструкций HTML, функция FTP, контроль синтаксиса и правописания, многофайловый поиск и замещение. Кроме того, он содержит специальные команды и шаблоны для создания более сложных элементов (фреймов, сценариев JavaScript и DHTML). Авторский инструментарий WYSIWYG. HTML-редакторы класса WYSIWYG (What You See Is What You Get - что видишь, то и получишь) имеют графические интерфейсы, которые делают написание HTML больше похожим на программу редактирования текстов или разметки страницы. Первоначальной целью этих программ было освобождение пользователей от тегов HTML, наподобие того, как программы разметки страниц защищают разработчика от набора команд языка PostScript. Сегодня их значимость возросла, так как они повышают эффективность и уровень автоматизации производства документов, обеспечивая в то же время доступ к исходному тексту HTML.
Наиболее популярными в настоящее время WYSIWYG-редакторами являются: Adobe Flash Player, Macromedia Dreamweaver, Golive CyberStudio (только для компьютеров Macintosh), Microsoft FrontPage, FileMaker Claris, Home Page, Adobe PageMill.
Теги HTML (Таблица 1). Документ HTML содержит текст (содержимое страницы) и встроенные теги - инструкциями о структуре, внешнем виде и функции содержимого. Документ HTML разделяется на две основные части: заголовок - head и тело - body. Заголовок содержит такие сведения о документе, как его название и методическая информация, описывающая содержимое. В теле находится само содержим документа (то, что выводится в окне браузера).
Таблица 1. Структура типичного Web-документа
Название тегаОписание12<!DOCTYPE html>Первой строкой в веб-документе обычно является определитель типа документа, задаваемый в виде дескриптора !DOCTYPE с некоторыми параметрами и заключаемый вместе с ними в угловые скобки, которые используются в языке HTML для выделения тегов. Видимо, по этому признаку, некоторые авторы материалов по HTML относят его к тегам. Однако это не так. Определитель типа документа - это не тег, а директива (для браузера), предваряющая текст веб-документа, а его вид только схож с записью мета-тегов.
Хотя проставление определителя типа документа не является обязательным, его явное указание в веб-документе представляется чрезвычайно важным, поскольку говорит браузерам, валидаторам и некоторым другим программам, по спецификации какой версии языка HTML следует трактовать весь последующий код.
Если определитель !DOCTYPE не указан, и браузер, и валидатор пытаются определить тип документа автоматически. И точно им этого сделать не удается, если в документе идет мешанина кода, соответствующая спецификациям разных версий языка HTML. И следует заметить, что такая мешанина - это одна из типичных ошибок, которую допускают многие авторы веб-документов. Хотя такой код и может интерпретироваться браузерами в соответствии с задумками этих авторов, валидным он не будет. Валидатор обязательно выдаст по нему кучу сообщений об ошибках.
Еще раз подчеркнем, что определитель типа документа лишь предваряет текст HTML-документа, заключаемый между тегами html. Таблица 1 (продолжение)
Название тегаОписание12<HTML>логический ограничитель текста всего веб-документа
Этот тег указывает на начало HTML-документа
Под веб-документом понимается весь текст расположенный между открывающим и закрывающим тегами html. Тег html имеет ряд атрибутов. Обязательных атрибутов у тега html нет. Но важные атрибуты есть. Одним из таких атрибутов (важным для русскоязычных авторов) является атрибут lang со значением ru. Элемент html является самым глобальным. Он содержит в себе два других глобальных элемента, определяющих макроструктуру веб-документа: его головную часть (тег head) и тело документа (body). Все другие языковые конструкции должны находиться в какой-либо из этих двух глобальных секций в зависимости от их ролевого назначения.<HEAD>Головная секция.
К головной секции веб-документа относится все то, что заключается между начальным и конечным тегами head. Основное наполнение этой секции - мета-теги, несущие информацию для браузеров и поисковых систем. Оно не выводится непосредственно на экран в виде того, что принято называть веб-страницей. Имеется только одно исключение: отображение в служебной области браузера титульного названия страницы, которое в веб-документе заключается между начальным и конечным мета-тегами title. Кроме того, через головную часть подключаются внешние файлы со списками стилей CSS. Либо с помощью мета-тега style такие списки стилей включаются непосредственно в сам документ. Содержимое списков стилей оказывает сильное влияние на вид Таблица 1 (продолжение)
Название тегаОписание12представления контента, который задается через основную часть веб-документа - его дело (body).
Этот тег указывает на начало области заголовка Web-страницы. Служит для формирования общей структуры документа.
<TITLE>Структура Web-страницы</title>Элемент для размещения заголовка Web-страницы. Строка отображается в заголовке окна браузера.<META http-equiv="Content-Type" content="text/html; charset=windows-1251">Этот тег несет служебную информацию и не отображается в экране броузера. В данном случае идет речь о кодировке Web-странички. Вам достаточно лишь каждый раз вставлять этот тег в таком виде на свою страничку. Тогда ваша страничка будет использовать кодировку windows-1251, наиболее распространенную на сегодняшний день.<META name="Author" content="Brovkin Denis"> Имя автора Web-страницы.<META name="Keywords" content="WWW, HTML, docoment, страничка, структура">Набор ключевых слов для поиска. Раньше этими словами пользовались поисковые машины, для отбора сайтов по тематике запроса. Сегодня эти слова поисковыми машинами практически не используются, однако полезно вставить этот тег на свою страничку и указать в нем ключевые слова, отражающие содержание вашего сайта.</head>Конец области заголовка Web-страницы.<BODY>Тело веб-документа содержит основной контент в виде выводимых на экран текста и изображений (и информации иного вида, выводимой на другие устройства). Все это смысловое наполнение структурируется и подготавливается к выводу с помощью соответствующих конструкций языка HTML (и, конечно, с CSS-поддержкой), которые содержатся вперемешку с составляющими этого смыслового наполнения. Таблица 1 (продолжение)
Название тегаОписание12Основной вид конструкций в теле веб-документа - это так называемые элементы, которые представляют собой основные языковые единицы - теги, употребляемые вместе с сопутствующими им уточнениями в виде атрибутов и значений этих атрибутов. Разумеется, все эти языковые единицы (дескрипторы) разделяются или ограничиваются соответствующим синтаксисом.
Начало собственно содержимого Web-страницы. Тег <BODY включает в себя атрибут bgcolor, который задает цвет вашей страницы. В данном случае голубой. Если не использовать этот атрибут, то по умолчанию, цвет страницы будет белым.<H2> Здесь расположен заголовок вашей странички </h2><H2> </h2> Элемент заголовка<P> Здесь расположен текст первого абзаца вашей странички</p><P> </p> Элемент абзаца.<P> Здесь расположен текст второго абзаца вашей странички</p></body>Конец содержимого Web-страницы.</html>Конец HTML-документа. Каждый тег состоит из имени, за которым может следовать список необязательных атрибутов, все они находятся внутри угловых скобок < >. Содержимое скобок никогда не выводится в окне браузера. Имя тега, как правило, представляет собой аббревиатуру его функции, что облегчает его запоминание. Атрибуты являются свойствами, которые расширяют или уточняют функцию тега. Как правило, имя и атрибуты внутри тега не чувствительны к регистру. Тег <BODY BGCOLOR=white> будет работать так же, как <body bgcolor=white>. Однако значения определенных атрибутов могут быть чувствительны к регистру. Это относится, в частности, к именам файлов и URL.
Контейнеры. Большинство тегов являются контейнерами. Это означает, что у них имеется начальный (открывающий или стартовый) и конечный (закрывающий) теги. Текст, находящийся между тегами, будет выполнять содержащиеся в них инструкции. Конечный тег имеет то же имя, что и начальный, но перед ним стоит слэш (/). Его можно рассматривать как "выключатель" тега. Конечный тег никогда не содержит атрибутов.
В некоторых случаях конечный тег не обязателен, и браузер определяет конец тега из контекста. Чаще всего опускают конечный тег <р> (абзац). Браузеры раньше поддерживали этот тег без соответствующего завершения, поэтому многие авторы Web привыкли использовать краткую форму. Это разрешено не всем тегам, и не все браузеры прощают их отсутствие. Поэтому, если есть сомнения, включите в текст закрывающий тег. Это особенно важно, когда в документе вы используете каскадные таблицы стилей.
Автономные теги. Некоторые теги не имеет завершающих тегов, потому что они используются для размещения отдельных (автономных) элементов на странице. Одним из них является тег изображения <img>, он просто помещает графику в поток страницы. Другие автономные теги - это разрыв строки (<br>), горизонтальная линия (<hr>) и теги, содержащие информацию о документе и не влияющие на содержимое, выводимое на экран, такие как <meta> и <base>.
Атрибуты. Атрибуты добавляются в тег для расширения или модификации его действий. К одному тегу можно добавить несколько атрибутов. Если атрибуты тега следуют после имени тега, они разделяются одним или несколькими пробелами. Порядок следования не важен. Большинство атрибутов имеют значения, которые следуют за знаком равенства (=), находящимся после имени атрибута. Длина значений ограничена 1024 символами. Значения могут быть чувствительны к регистру. Иногда значения должны находиться в кавычках (двойных или одинарных). Правила записи значения следующие:
- если значение представляет собой одно слово или число и состоит только из букв (a-z), цифр (0-9) и специальных символов (точка <.> или дефис <->), то можно поместить его после знака равенства без кавычек;
- если значение содержит несколько слов, разделенных запятыми или пробелами, или содержит специальные символы, отличные от точки или дефиса, тогда его необходимо поместить в кавычки. Например, URL требуют кавычек, потому что они содержат символы "://". Также кавычки необходимы при задании значений цветов с использованием формата "#rrggbb".
В теги HTML могут помещаться другие HTML-теги для осуществления воздействия нескольких тегов на один элемент. Это называется вложением, и, что бы правильно его осуществить, начальный и конечный теги вложенного тега должны обязательно находиться между начальным наконечным тегами внешнего тега.
Часто встречающейся ошибкой является перекрытие тегов. Хотя часть браузеров отображают содержимое, отмеченное таким образом, многие не разрешают нарушать правило, поэтому важно размещать теги правильно. Пример неверного вложение тегов (тег <В> закрывается перед закрытием <I>):
The weather is <B><I>gorgeous</B></I>today - данная информация, игнорируемая браузерами.
Информация, игнорируемая браузерами. Ниже приводится информация, содержащаяся в документе HTML, включая определенные теги, которая будет игнорироваться при просмотре браузерами. В ее состав входят:
- разрывы строк. Символы конца строк в документе HTML игнорируются. Текст и элементы будут переноситься до тех пор, пока в потоке текста документа не встретится тег <р> или <br>. Разрывы строк выводятся, если текст обозначен как текст с заданным форматом (<рrе>);
- символы табуляции и множественные пробелы. Когда браузер встречает в документе HTML символ табуляции и несколько последовательных символов пробела, он выводит только один пробел. Таким образом, если документ содержит: "far, far away", браузер выведет "far, far away". Дополнительные пробелы можно добавить в текстовый поток, используя символ неразрывного пробела (Snbsp;). Кроме того, все пробелы выводятся, если текст является форматированным (находится в тегах <рrе>);
- множественные <р>-теги. Последовательность тегов <р>, не прерываемых текстом, всеми браузерами интерпретируется как избыточная. Содержимое будет выводиться так, как если бы был только один тег <р>. Большинство браузеров выведет несколько тегов <Br> в виде нескольких переходов на новую строку;
- нераспознаваемые теги. Если браузер не понимает тег или тот был неверно задан, то браузер его просто игнорирует. В зависимости от тега и браузера это может привести к различным результатам. Либо браузер ничего не выведет, или он может отобразить содержимое тега как обычный текст;
- текст в комментариях. Браузеры не выводят текст между специальными элементами <! и ->, которые используются для обозначения комментариев. После символов начала комментария и перед символами окончания обязательно должен находиться пробел. В сам комментарий можно помещать практически все. Комментарии нельзя вкладывать. В Microsoft Internet Explorer имеется фирменный тег, обозначающий комментарии <com-ment>...</comment>. Однако, он не поддерживается другими браузерами.
Правила синтаксиса
1. Взаимное расположение элементов HTML, HEAD, TITLE, BODY должно быть стандартным на любой странице.
<HTML>
<HEAD>
<TITLE>.....</title>
</head>
<BODY>
..................
</body>
</html>
2. Всегда использовать конечные теги (не забывать </p>, </h1>, </table> и др.).
3. Не нарушать правила вложения тегов.
Правильно: <H1>Заголовок крупный <H2> Заголовок поменьше </h2> </h1>
Не правильно:<H1>Заголовок крупный <H2> Заголовок поменьше </h1> </h2>
4. Любая полезная информация должна находится между начальным и конечным тегами, указывающими ее формат.
5. Все атрибуты располагаются в начальном теге.
6. Принято начальные теги писать ЗАГЛАВНЫМИ буквами (<H1>), а конечные строчными буквами (</h1>).
Пример HTML- страницы (откройте блокнот и скопируйте в него этот код, нажмите "сохранить как", в поле тип файла выберите "все файлы", а в названии напишите index.html):
<html>
<head>
<title>Моя первая страница</title>
</head>
<body>
<center><h1>Заголовок моей первой страницы</h1></center>
Мне очень нравится мой первый сайт, ведь я его создаю без помощи сторонних программ. Мои эмоции радости можете посмотреть на картинке ниже:
<br/><br/>
<center><img alt="Эмоции радости" src="http://img-fotki.yandex.ru/get/3417
/koziuck-vladimir.1f/0_33a42_9dfed6e1_L"></center>
<br/><br/>
<font style="color:green">Вау, этот текст зеленый</font>
<br/><br/>
<b>А этот текст выделен жирным</b>
<br/><br/>
Как же мне нравится этот html!
<br/><br/>
Теперь мне осталось изучить теги html, и я смогу уже создавать страницы такими, какими я хочу.
<hr>
Этот материал был написан благодаря сайту <a href=http://zarabotat-na-sajte.ru/>
http://zarabotat-na-sajte.ru/</a> <br/><br/>
До новых встреч!
</body>
</html>
2. ПРОГРАММЫ СОЗДАНИЯ WEB-ДОКУМЕНТОВ
2.1. HTML- редакторы
Существует множество различных языков программирования, с помощью
которых можно выполнить данную программу : HTML, Java Script, CGI Script и
т.д.
HTML - Язык разметки гипертекста, выполняется разметка текстового
документа точно так же, как это делает редактор при помощи красного
карндаша. Эти пометки служат для указания формы представления информации, содержащейся в документе.
Java Skript - небольшие программы (скрипты или сценарии)
пишуться на Java Skript и особым образом внедряются в HTML - код Web
страниц.
CGI - Common Gateway Interface является стандартом интерфейса
(связи) внешней прикладной программы с информационным сервером типа HTTP, Web сервер.
Обычно гипертекстовые документы, извлекаемые из WWW серверов, содержат статические данные. С помощью CGI можно создавать CGI-программы, называемые шлюзами, которые во взаимодействии с такими прикладными системами, как система управления базой данных, электронная таблица, деловая графика и др., смогут выдать на экран пользователя динамическую информацию.
В настоящее время существует огромное множество разнообразных HTML- редакторов, систем управления сайтом, называемых иногда "движками".
Каждый выбирает свой инструмент для создания Web-страниц. Это может быть MS FrontPage или Macromedia DreamWeaver, Allaire HomeSite или 1st Page 2000, а также системы управления сайтом (движки), такие как, Joomla, SiteEdit, uCoz, WordPress и т.д. А кто-то пользуется простым текстовым редактором, например Блокнотом (Notepad).
Текстовые редакторы возможно использовать только для создания небольших страниц, так как у них есть много минусов: не поддерживаются проекты, отсутствует "подсветка" текста..., в общем, работать крайне неудобно.
Рассмотрим некоторые HTML-редакторы.
Начнем мы с популярного Macromedia DreamWeaver (Рисунок 10). Компания Macromedia считается лидером по производсту программ для создания веб-сайтов, а также законодателем моды в этой области. Последния версия HTML-редактора этой компании - DreamWeaver 3, который относится к категории WYSIWYG-редакторов, и этот пакет имеет очень много достоинств: удобный интерфейс, настройка функций, поддержка больших проектов и ShockWave технологий, возможность закачки файлов через FTP, поддержка SSI и многое другое. Для работы в этой программе не нужно досконально знать HTML (в этом и заключается преимущество технологии WYSIWYG - что вижу, то и получаем.
Рис 10. Главное окно HTML-редактора Macromedia DreamWeaver
Но DreamWeaver на несколько шагов опережает другие редакторы, использующие технологию WYSIWYG, в первую очередь тем, что генерирует очень чистый HTML-код. DreamWeaver позволяет вам избавиться от однотипной работы при создании страниц (например, верстка текста) при помощи использования опции "запись последовательности команд" вы записываете последовательность производимых вами команд, потом нажимаете, например, CTRL+P, и DreamWeaver воспроизводит все в той же последовательности.
Следующий редактор - HomeSite 4 (Рисунок 11) - для создания страниц вручную, т. е. для знатоков HTML. Вы получаете полный контроль над HTML-кодом.
Рис 11. Главное окно HTML-редактора HomeSite 4
HomeSite содержит два основных режима: Edit и Design. Режим Design - это подобие WYSIWYG-редактора, выдающее HTML-код, причем, если вы загрузите чужой HTML-код, то HomeSite все перепишет по-своему. Режим Edit
позволяет получить полный контроль над страничкой. Здесь вы можете настроить практически все, сможете прописать функции каждого тега (тогда ваша страничка в любом браузере будет смотреться одинаково.
Еще одна отличительная особенность HomeSite - это его "склейка" с Dreamweaver. HomeSite обладает кнопкой "Dreamweaver", а также входит в его стандартный пакет поставки. Впрочем, и DreamWeaver имеет возможность подключения HomeSite, как редактора для коректировки HTML-кода.
Одним из последних HTML-редакторов является EVR Soft 1st Page 2000.
Его лозунг - "Создавайте первоклассные веб-сайты!". Редактор содержит несколько режимов - Normal, Easy, Advanced/Expert и Hardcore, то есть вы можете выбрать свой уровень, а со временем перейти на более высокий. Еще одна особенность - довольно большая коллекция скриптов на JavaScript и DHTML. Все это довольно удобно разбито по категориям.
2.2. Системы управления сайтами (CMS)
CMS - это компьютерное программное обеспечение, предназначенное для упрощения и систематизации совместного создания документов и контента. Чаще всего, CMS - это веб-приложение, служащее для управления веб-сайтами и их содержимым.
CMS действительно разделяют сайты на две составляющие: дизайн (внешний вид сайта в целом, отдельных страниц, конкретных блоков информации) и содержимое (контент). Таким образом, системы управления контентом решают две основные задачи. С точки зрения пользователей - это инструмент, который позволяет публиковать новости, размещать новые страницы на сайте и производить другие операции над содержимым через удобный интерфейс. При этом пользователь может не владеть технологиями интернет-разработки, но он обязательно должен понимать, как устроен сайт.
С точки зрения тех, кто делает сайты - это инструмент, который ускоряет разработку сложных сайтов, позволяя компоновать решения из готовых блоков, изменяя в определенных пределах логику работы и оформление.
Как правило, система управления это отдельный интерфейс, предназначенный для управления сайтом. Он может быть реализован как веб-приложение, когда пользователь входит в админзону своего сайта через обычный браузер по определенному адресу, или как отдельное Windows-приложение, требующее инсталляции. Разные подходы имеют различные преимущества и недостатки.
На сегодняшний день существует огромное количество CMS для управления сайтами. При этом стоит знать, что разработка сайтов может проводиться как на платной, так и одной из множества бесплатных свободно распространяемых CMS. Вопреки расхожему мнению непосвященных людей, бесплатные CMS являются достаточно функциональными и надежными системами
Рассмотрим некоторые системы управления сайтом и первой на очереди у нас будет Joomla! (Рисунок 12), т.к. на данном "движке" мною был разработан сайт администрации Севского муниципального района (приложение 1). Рис 12. Административная панель системы управления сайтом Joomla!
"Joomla!" - это система управления контентом, написанная на языке PHP и использующая в качестве хранилища содержания базу данных MySQL[13]. Joomla! является свободным программным обеспечением, защищённым лицензией GPL. Одной из главных особенностей "Joomla!" является относительная простота управления при практически безграничных возможностях и гибкости при изготовлении сайтов.
Одна из наиболее мощных Систем Управления Содержимым с Открытым Кодом (Open Source CMS) на планете. Она используется по всему миру для всего, от простых сайтов до комплексных корпоративных приложений. Joomla! лёгко устанавливается, проста в управлении, надёжна. Название Joomla фонетически идентично слову Jumla, которое в переводе с суахили означает "все вместе" или "в целом", что отражает подход разработчиков и сообщества к развитию системы.
Название системы пишется как Joomla! (именно так, с восклицательным знаком).
Joomla является ответвлением и дальнейшим развитием широко известной Mambo CMS. Команда независимых разработчиков отделилась от проекта Mambo по причине несогласия в экономической политике. И 16 сентября 2005 года в свет вышла первая версия Joomla, являющаяся по сути переименованной Mambo 4.5.2.3 и включающая в себя исправления найденных на тот момент ошибок и уязвимостей. На данный момент существует две линейки Joomla! 1.0.х и 1.5.х
1.0.х - явлется основательно переработанной и дополненой Mambo CMS. Существует ровно 3000 расширений для CMS которые позволяют создать сайт любого уровня.
1.5.х - это новая волна в развитии Joomla! предоставляющая большую свободу разработчикам расширений. Большая часть расширений для Joomla! 1.0.x совместимы с 1.5.x (об этом разработчики позаботились отдельно).
Joomla включает в себя различные инструменты для изготовления Вебсайта и управления сайтом. Важной особенностью Joomla является минимальный набор инструментов при начальной установке, который обогащается по мере необходимости. Это снижает загромождение административной панели ненужными элементами, а также снижает нагрузку на сервер и экономит место на хостинге.
Для Joomla не имеет значения, являетесь ли вы любителем или профессионалом. И те, и другие могут работать с Joomla. Зачастую, любители становятся профессионалами, а профессионалы становятся более заинтересованными в том, чтобы сделать Joomla CMS и Framework еще лучше. Характеристики Joomla!:
* Полностью основанный на БД движок с использованием PHP/MySQL. * Модуль безопасности для многоуровневой аутентификации пользователей/администраторов. * Секции новостей, продукции или услуг легко редактируемы и управляемы. * Разделы тем могут быть добавлены авторами. * Полностью настраиваемые схемы расположения элементов, включая левый, правый и центральный блоки меню. * Закачка изображений при помощи браузера в вашу собственную библиотеку - для последующего использования с любого места сайта. * Форум/Опросы/Голосования для эффективной обратной связи. * Работа под Linux, FreeBSD, MacOSX, Solaris, AIX, SCO, WinNT, Win2K.
Возможности администрирования:
* Возможность создавать неограниченное количество страниц * Четкая организация структуры сайта * Для каждой динамической страницы можно создать свое описание и ключевые слова в целях повышения рейтинга в поисковых системах * Начало и окончание публикации любых материалов можно запрограммировать по календарю * Возможность ограничить доступ к определенным разделам сайта только для зарегистрированных пользователей * Секции новостей, продукции или услуг легко редактируемы и управляемы * Полностью настраиваемые схемы расположения элементов по 5 областям, что позволяет сделать оригинальный дизайн * Закачка изображений при помощи браузера в вашу собственную библиотеку - для последующего использования с любого места сайта * Опросы и голосования для эффективной обратной связи * Различные модули - такие как последние новости, счетчик посещений, подробная статистика посещений, гостевая книга, форум и т.д. * Причем Вы сами выбираете, будут ли показаны эти модули и на каких страницах * Возможность создания не одной, а нескольких форм обратной связи для каждого контакта. * Изменение порядка объектов, включая новости, вопросы, статьи и т.д. * Генератор показа случайной новости. * Модуль приёма от удалённых авторов новостей, статей и ссылок. * Иерархия объектов - количество секций, разделов, подразделов и страниц, зависит от вашего желания. * Библиотека изображений позволит Вам хранить все Ваши GIF- и JPEG-файлы под рукой для лёгкого доступа. * Менеджер рассылки новостей. Выбирайте из более чем 360 служб рассылки новостей по всему миру. * Менеджер архива. Помещайте Ваши старые статьи в архив, чем просто удалять их. * Возможность распечатать или отправить другу на e-mail любую статью с сайта. * Выбор из 3 визуальных редакторов, что упрощает редактирование материалов до уровня редактирования текста в программе Word. * Предварительный просмотр перед окончательным размещением. * Возможность легкой смены дизайна. * Экономное использование места на сервере за счет использование базы данных MYSQL. * Возможность использования адресов страниц адаптированных для лучшей индексации всеми поисковыми системами.
На сегодня можно найти более 3000 модулей и компонентов, которые удовлетворят требования любого автора сайта. Система подходит как для небольшого, так и для крупного корпоративного сайта или информационного проекта. Таким образом, установив эту систему на свой веб-сайт, Вы получаете полный контроль над обновлением информации и развитием Вашего веб-сайта. И для этого совсем не нужно иметь никаких специальных знаний.
SiteEdit -это система создания и управления сайтом (Рисунок 13). Использование CMS SiteEdit открывает все возможности создания сайтов, значительно расширит бизнес и сократит расходы на содержание интернет-ресурса.
Рис 13. Главное окно "движка" SiteEdit
Помимо основных функций имеет возможность создания интернет-магазина, форума, доски объявлений и включает систему продвижения сайта в поисковых системах. SiteEdit - это профессиональная система создания и управления сайтом со встроенным графическим редактором. Наглядный и интуитивно понятный интерфейс не требует специальных знаний для создания и управления собственным сайтом. Система использует технологию клиент-сервер. Весь процесс проектирования и создания сайта происходит в режиме off-line, доступ к интернету требуется только для выгрузки готового проекта и изменений на веб-сервер.
Характеристики:
Системные требования:
* База данных: MySQL, Postgres SQL
* Операционная система: Windows, UNIX
* Веб-сервер: Apache
* Языки программирования: PHP
Безопасность и производительность:
* Фиксация действий пользователей (ведение лога)
* Защита от автоматического заполнения форм (CAPTCHA)
* Многоуровневое утверждение изменений (модерация публикуемых материалов)
* Разграничение доступа (распределение прав)
* Кэширование страниц
* Поддержка безопасного протокола при работе с системой (SSL)
Встроенные модули:
* Опросы и голосования
* Текст
* Фотоальбомы
* Гостевая книга
* Ссылки
* Контакты
* Карта сайта
* Новости * RSS
Следующая система CMS, WordPress (Рисунок 14) - CMS с открытым исходным кодом, распространяемая под GNU GPL. Написан на PHP, в качестве базы данных использует MySQL. Сфера применения - от блогов до достаточно сложных новостных ресурсов и даже интернет-магазинов. Встроенная система "тем" и "плагинов" вместе с удачной архитектурой позволяет конструировать практически любые проекты.
Рис 14. Главное окно "Wordpress"
Одной из главных особенностей "Wordpress" является структура организации базы данных.
Гибкость и функциональность связей позволяют создавать и выводить на страницу материал любого вида с любыми параметрами.
Встроенная система "тегирования" создает дополнительные связи для материалов сайта, что при необходимости, позволяет оперировать всеми записями, соответствующими определенным условиям.
В системе управления контентом "Wordpress" предлагается гибкая схема организации структуры сайта на основе таксономии. Таксономия - механизм, позволяющий создавать произвольное количество связей между объектами содержимого сайта и ассоциировать их с "Ключами записей", "Категориями записей" или "Категориями ссылок".
"Категории", "Ключевые слова" и "Ссылки" могут представлять плоские или иерархические списки, либо сложные структуры, где элемент может иметь несколько "родителей" и несколько дочерних элементов. С помощью подобной схемы одними и теми же компонентами системы управления контентом возможна организация различных вариантов структуризации, обработки, редактирования и вывода содержимого.
Даталогическая модель базы данных представлена в (Приложении 2).
Кроме "Таксономии" и "Ключевых слов" система управления контентом Wordpress имеет:
* открытый исходный код;
* возможности развернутого контроля политик учетных записей;
* гибкие возможности контроля публикации информационных материалов;
* возможности ввода ограничений на публикацию для каждой группы пользователей;
* удобный, настраиваемый административный интерфейс;
* систему контроля ревизий информационного материала, позволяющую в любой момент времени изменить, восстановить, дополнить или сравнить текущую версию публикации с предшествующими, измененными в определенный момент времени версиями;
* удобный, функциональный, создающий чистый HTML-код, графический редактор текста, с привычным, похожим на Microsoft Word интерфейсом, облегчающий жизнь пользователям, не знакомым с языком разметки;
* систему автосохранения набираемого в редакторе текста, для предотвращения потери информации из-за программного или аппаратного сбоя на стороне клиента;
* возможность сохранения недописанного материала в качестве "черновика";
* встроенную систему оповещений о выходе новых версий самой CMS и установленных компонентов;
* возможности экспорта и импорта информационных материалов по средством технологий "RSS", "Atom", "XML";
* технологию "виджетов", позволяющую не только отображать любой динамический материал (ссылки, заголовки, RSS, меню, текст, графический контент) в удобном для администратора месте, но и создавать классы и указывать очередность вывода;
* встроенный редактор ЧПУ, делающий ссылки на записи сайта более привлекательными для роботов поисковых систем;
* шаблонный дизайн графического оформления страниц, создающий гибкость, простоту редактирования, дающий возможность установить стандарт выполнения любых шаблонов для данной системы управления;
* встроенные возможности резервного копирования базы данных по расписанию и отправки архива на email администратора;
* систему комментирования записей пользователями и гостями проекта, возможности назначения прав на комментирование, антиспам модуль;
* инструмент автоматического обновления до более свежей версии;
* систему контроля безопасности, позволяющую в реальном времени осуществлять мониторинг уязвимостей и изменений в потенциально-опасных файлах;
* возможность встроенными средствами защитить определенные папки веб-сервера, от посещения пользователями, путем полного запрета доступа конкретным подсетям или установки режима авторизации;
* веб-интерфейс редактирования шаблонов с подсветкой HTML-кода;
* систему контроля версий шаблонов, позволяющую восстанавливать состояние файлов шаблона графического дизайна и показывать различия в коде;
* возможность ограничения доступа к интерфейсу администратора по спискам разрешенных IP-адресов;
* более 1000 страниц документации, с полным описанием всех функций и переменных исходного когда проекта, на английском языке;
* более 4000 бесплатных компонентов, добавляющих дополнительный функционал;
* более 1000 бесплатных графических шаблонов, распространяемых бесплатно на сайте проекта;
* 5608765 загрузок дистрибутива, по данным официального сайта на начало мая 2009 года.
ЗАКЛЮЧЕНИЕ
Web-сайт - это лицо той фирмы, того учреждения, человека, который разместил её в WWW. Именно поэтому сегодня Web-разработке уделяется такое огромное внимание, ибо от этого на прямую зависит популярность того или иного информационного ресурса Сети. Недаром сейчас профессия Web-разработчика является одной из самых высокооплачиваемых.
Таким образом, мы получили представление о структуре Web - сайта, рассмотрели их классификацию и ознакомились с этапами создания сайта. Ознакомились с гипертекстовым языком HTML для создания Web - сайта. Узнали, какие HTML - и графические редакторы можно использовать в Web-дизайне.
Человек, создающий Web-страницу, соединяет свои знания и навыки со своим творческим потенциалом. Умение творить - вот что отличает настоящего Web-дизайнера. Для того чтобы создать Web-страницу, которая бы радовала глаз, нужно сочетать в себе качества художника и программиста.
Дата окончания работы: Подпись:
"___"________2013г___________Д.В. Бровкин БИЛИОГРАФИЧЕСКИЙ СПИСОК
1. Е. Ястребцева, Я. Быховский. Моя провинция - центр Вселенной. Развитие телекоммуникационной образовательной деятельности в регионах, 2-е изд., перераб. И доп. - М.: Федерация Интернет-Образования, 2001. - 216 с.
2. Д. Кроудер, Р. Кроудер. Разработка Web-узлов для "чайников". - Диалектика: Москва, С.-Петербург, Киев, 2001.
3. Учебное пособие "Создание Web-сайтов". Ч.5. Тамбов: Изд-во ТГТУ, 2002. 40 с. 4. Гвоздева, В. А. Информатика, автоматизированные информационные технологии и системы: учебник / В. А. Гвоздева. - Москва: Форум: Инфра-М, 2011. - 541 с.
5. Денисов А., Вихарев И., Белов А.. Самоучитель Интернет. - Спб: Питер, 2001. - 461 с.
6. Фролов А.В., Фролов Г.В. Глобальные сети компьютеров. Практическое введение в Internet, E-Mail, FTP, WWW и HTML. М.: Диалог-МИФИ, 2002.
7. Гончаров А. HTML в примерах. СПб.: Питер, 2001.
8. Информатика. Базовый курс. Учебник для Вузов/под ред. С.В. Симоновича, - СПб.: Питер, 2000.
9. Галкин В.А., Григорьев Ю.А. Телекоммуникации и сети. Учебник для вузов, 2003 год. 506 стр.
10. Романова Ю.Д. редактор. Информатика и информационные технологии. 2008 год. 592 стр.
11. Степанов А.Н. Информатика. 2006 год. 684 стр.
12. Рervyiurok. Как создать Web-сайт самому[электронный ресурс]. http://www.pervyiurok.ru/Info/DreamweaverMX/Chapter%201/1.htm
13. Угринович Н.Д., Босова Л.Л., Михайлова Н.И., "Практикум по информатике и информационным технологиям. Учебное пособие для общеобразовательных учреждений" - М: Лаборатория Базовых Знаний, 2001.
14. Якушина Е. В. "Изучаем Интернет, создаем веб - страничку" 2 - е издание, серия "КомпАс" - СПБ.: Питер, 2003.
15. Евгений Попов. Видеоуроки "Профессиональный сайт за один день".
16. В. В. Лысенко, Л. А. Малинина, М. А. Беляев. Основы информатики: Учебник для вузов.
17. Узнай больше. Проектирование и создание современного Web - сайта [электронный ресурс]. - Режим доступа: http://know.su/link_3598_18.html.
18. Кураков Л.П., Лебедев Е.К. Информатика. - М.: Вуз и школа, 2009. Приложение 1. "Сайт администрации Севского муниципального района"
Исходный HTML- код страницы "Главная"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru-ru" lang="ru-ru">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content="Севск, Официальный сайт администрации Севского муниципального района" />
<meta name="description" content="Официальный сайт администрации Севского муниципального района" />
<title>Официальный сайт администрации Севского муниципального района</title>
<link href="/index.php?format=feed&amp;type=rss" rel="alternate" type="application/rss+xml" title="RSS 2.0" />
<link href="/index.php?format=feed&amp;type=atom" rel="alternate" type="application/atom+xml" title="Atom 1.0" />
<link rel="stylesheet" href="http://www.sevskadm.ru/plugins/content/attachments.css" type="text/css" />
<script type="text/javascript" src="/media/system/js/mootools.js"></script>
<script type="text/javascript" src="/media/system/js/caption.js"></script>
<!-- JoomlaWorks "Frontpage Slideshow" v2.0.0 starts here -->
<style type="text/css" media="all">
<!--
@import "http://www.sevskadm.ru/modules/mod_fpss/mod_fpss/templates/Sleek/template_css.php?w=660&h=169&sw=200";
//-->
</style>
<style type="text/css" media="all">#navi-outer {display:none;}</style>
<script type="text/javascript" src="http://www.sevskadm.ru/modules/mod_fpss/mod_fpss/engines/mootools-comp.js"></script>
<script type="text/javascript" src="http://www.sevskadm.ru/modules/mod_fpss/mod_fpss/engines/mootools-fpss-comp.js"></script>
<script type="text/javascript">
<!--
var fpssPlayText = "Play";
var fpssPauseText = "Pause";
var crossFadeDelay = 6000;
var crossFadeSpeed = 1000;
var fpssLoaderDelay = 800;
var navTrigger = "click";
var autoslide = true;
var CTRtransitionText = 1000;
var CTRtext_effect = false;
//-->
</script>
<!-- JoomlaWorks "Frontpage Slideshow" v2.0.0 ends here -->
<link rel="stylesheet" href="/templates/sevskadm/css/template.css" type="text/css" />
<link rel="stylesheet" href="/templates/sevskadm/css/menu.css" type="text/css" />
<link rel="stylesheet" href="/templates/sevskadm/css/style.css" type="text/css" />
<link rel="stylesheet" href="/templates/sevskadm/css/slideshow.css" type="text/css" />
<script language="javascript" type="text/javascript" src="/templates/sevskadm/js/vns.script.js"></script>
<script language="javascript" type="text/javascript" src="/templates/sevskadm/js/mootools.js"></script>
<script language="javascript" type="text/javascript" src="/templates/sevskadm/js/toptool.js"></script>
<!--[if lte IE 6]>
<script type="text/javascript">
var siteurl = '/templates/sevskadm/';
window.addEvent ('load', makeTransBG);
function makeTransBG() {
fixIEPNG ($$('#toptools ul li a'), '', 'crop', 0, 0);
fixIEPNG ($$('#nav_all ul.menu li ul'), '', 'scale', 0, 0);
fixIEPNG($$('img'));
}
</script>
<style type="text/css">
#hd p.buttonheading {
margin:8px 0;
}
#nav_all ul.menu ul a {
width: 14.8em!important;
}
</style>
<![endif]-->
<style type="text/css">
body{
font-size: 13px;
}
</style>
<style type="text/css">
#cpr{
display:block;
}
</style>
<style type="text/css">
#component{
display:block;
}
</style>
<link rel="stylesheet" href="/templates/sevskadm/css/sosdmenu.css" type="text/css" />
<script language="javascript" type="text/javascript" src="/templates/sevskadm/js/vns.cssmenu.js"></script>
<style type="text/css">
#ccenter {
width:734px;
}
</style>
</head>
<body>
<div id="header_all">
<div class="center">
<div id="logo">
<img src="/templates/sevskadm/images/logo.png" width="638" height="54" />
</div>
<div class="htoola">
<div id="toptools">
</div>
</div>
<div class="htool">
<div id="search">
<form action="index.php" method="post">
<div class="search">
<input name="searchword" id="mod_search_searchword" maxlength="20" alt="Поиск" class="inputbox" type="text" size="20" value="поиск..." onblur="if(this.value=='') this.value='поиск...';" onfocus="if(this.value=='поиск...') this.value='';" /><input type="submit" value="Поиск" class="button" onclick="this.form.searchword.focus();"/></div>
<input type="hidden" name="task" value="search" />
<input type="hidden" name="option" value="com_search" />
</form>
</div>
</div>
</div>
</div>
<div id="banner_all">
<div class="center bn_center">
<div id="banner">
<div id="slide_lat">
<div id="slide">
<!-- JoomlaWorks "Frontpage Slideshow" v2.0.0 starts here -->
<div id="fpss-outer-container">
<div id="fpss-container">
<div id="fpss-slider">
<div id="slide-loading"></div>
<div id="slide-wrapper">
<div id="slide-outer">
<div class="slide">
<div class="slide-inner">
<a target="_blank" href="http://sevskadm.ru" class="fpss_img">
..................
</body>
</html>
Приложение 2. Даталогическая модель базы данных "Wordpress"
2
Документ
Категория
Рефераты
Просмотров
1 598
Размер файла
1 961 Кб
Теги
kursovaya, rabota
1/--страниц
Пожаловаться на содержимое документа