Создание web-страницы для центра предшкольной подготовки "Академия детства", для поддержки образовательного процесса

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

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

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

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

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

1. Теоретические основы разработки и использования web-страницы

1.1 Понятие web-страницы, классификация

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

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

Web-сайт - это информация, представленная в определенном виде, которая располагается на Web-сервере и имеет свое имя (адрес). Для просмотра Web-сайтов на компьютере пользователя используются специальные программы, называемые браузерами. В зависимости от того, какое имя (адрес) Web-сайта мы зададим в строке «Адрес», браузер загружает в свое окно соответствующую информацию.

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

На сегодняшний день практически каждая организация имеет собственный Web-сайт. Более того каждый из нас уже сейчас может сделать свой вклад в развитие Internet. Для этого достаточно создать свой Web-сайт и разместить его в сети.

На данный момент существует огромное количество классификаций Web-сайтов. Далее рассмотрим классификацию по нескольким критериям [№3].

По доступности сервисов:

· Открытые - все сервисы полностью доступны для любых посетителей и пользователей.

· Полуоткрытые-для доступа необходимо зарегистрироваться (обычно бесплатно).

· Закрытые - полностью закрытые служебные Web-сайты организаций (в том числе корпоративные Web-сайты), личные Web-сайты частных лиц. Такие Web-сайты доступны для узкого круга пользователей. Доступ новым пользователям обычно даётся через т. н. инвайты (приглашения).

По физическому расположению:

1. Общедоступные Web-сайты сети Internet.

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

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

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

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

2. Тематический Web-сайт-Web-сайт, предоставляющий специфическую узкотематическую информацию по какой-либо теме.

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

3. Internet-представительства владельцев бизнеса (торговля и услуги, не всегда связанные напрямую с сетью Internet):

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

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

6. Корпоративный Web-сайт - содержит полную информацию о компании-владельце, услугах / продукции, событиях в жизни компании. Отличается от сайта-визитки и представительского Web-сайта полнотой представленной информации, зачастую содержит различные функциональные инструменты для работы с контентом (поиск и фильтры, календари событий, фотогалереи, корпоративные блоги, форумы). Может быть интегрирован с внутренними информационными системами компании-владельца (КИС, CRM, бухгалтерскими системами). Может содержать закрытые разделы для тех или иных групп пользователей - сотрудников, дилеров, контрагентов и пр.

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

8. Web-сервис - Web-сайт, созданный для выполнения каких либо задач либо предоставления услуг в рамках сети WWW.

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

10. Комбинированные Web-сервисы (Социальные сети) - например, Facebook, Twitter. Комбинированные Web-сервисы (Специализированные социальные сети) - например, MySpace, Flickr.

1.2 Язык HTML

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

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

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

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

HTML был ратифицирован World Wide Web Consortium. Он поддерживается несколькими широко распространенными браузерами, и, возможно, станет основанием почти всего программного обеспечения, которое имеет отношение к Web.

1.3 Принципы создания web-страницы, основные элементы web-страницы

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

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

На практике на стандарт HTML большое влияние оказывает наличие тегов, предложенных и поддерживаемых наиболее известными браузерами, такими как Microsoft Internet Explorer и Google Chrom. Эти теги в данный момент могут, как входить, так и не входить в состав действующей спецификации HTML.

Существуют средства редактирования, разработанные специально для написания HTML. Они позволяют экономить время, так как содержат клавиши быстрого доступа для выполнения повторяющихся операций, например, задания начальных установок документов, таблиц или просто применения стилей к тексту. Редакторы HTML отличаются от авторского WYSIWYG-инструментария тем, что требуют знания правил составления HTML вручную, редакторы лишь упрощают и ускоряют этот процесс. Наряду с тегами HTML, стандартизированными WWWC (стандартные теги), Web-обозреватели поддерживают множество нестандартных тегов. Эти теги были введены разработчиками той или иной программы Web-обозревателя, чтобы получить преимущество перед конкурентами. Они надеялись, что эти фирменные расширения впоследствии войдут в стандарт HTML, но этим надеждам так и не суждено было сбыться. Однако теги остались, и они все так же поддерживаются.

Для создания Web-страниц понадобится любой браузер - Internet Explorer или Google Chrome \ Mozilla Firefox, а лучше оба, так как многие элементы HTML по-разному отображаются в разных программах просмотра и весьма желательно контролировать эту разницу.

Кроме того, нужен любой текстовой редактор, например для подготовки HTML - файлов, а браузер - для просмотра и контроля сделанного.

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

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

Есть несколько простых правил, позволяющих интерфейсу сайта быть понятым посетителю [№10].

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

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

3. Посетитель сайта должен без труда находить интересующую его информацию и иметь возможность получить исчерпывающую информацию (описание в виде текста плюс несколько фотографий).

4. Информация должна быть распределена по группам. Возможно, обеспечить возможность поиска товаров по части названия и описания.

5. На Web-сайте обязательно должны быть информационные разделы:

с данными о компании (сфера деятельности, адрес, контактные телефоны и т.д.);

Основные элементы Web-страниц:

1. Заголовок / Логотип (Шапка)

2. Поиск

3. Контент /Содержание (Текстовое поле)

4. Элементы навигации

5. Информация о разработчиках сайта

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

Первым элементом Web-страницы, который нам предстоит рассмотреть, является ее заголовок. Логотип или название сайта выполняет для него ту же роль, что и вывеска на входе в какое-либо учреждение. Другое дело Интернет: здесь основной способ перемещения - это телепортация, и поэтому мне нужно видеть эту «вывеску» на каждой странице.

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

Перечисленные элементы еще называют «Контент» (от англ, content - Содержание). Расположение текстового поля зависит в первую очередь от того, каким образом Web-дизайнер разместит остальные элементы документа.

Рисунок 1. Пример контента сайта

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

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

Рисунок 2. Контактная информация

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

В итоге последовательность действий по разработке Web-сайта сводится к следующему несложному алгоритму:

1. Постановка целей и определение основных задач.

2. Создание списка будущих тематических разделов.

3. Разработка логической и физической структуры ресурса.

4. Подготовка эскиза дизайна, компоновки сайта, невидимой верстальной таблицы.

5. Подготовка текстовых материалов.

6. Подготовка графических материалов в векторной форме.

7. Экспорт векторных рисунков в растровый формат.

8. Оптимизация всех изображений.

9. Создание шаблонов Web-страниц.

10. Сборка Web-страниц и отладка кода.

11. Проверка идентичности отображения Web-страниц с различным экранным разрешением и цветовой палитрой и различных браузерах.

1.4 Стандарты разработки и дизайна для сайтов дошкольных учреждений

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

Дошкольное образование осуществляется, как правило, в учреждениях дошкольного образования, учреждениях общего образования (предшкола), учреждениях дополнительного образования детей (центры и объединения раннего развития ребёнка.

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

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

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

ДОУ имеющее свое представительство в сети, выгодно отличается от других детских садов. Это прекрасная возможность продемонстрировать всем свои достижения, разместить актуальную информацию для заинтересованных лиц (родителей). Это способ рассказать о своих успехах, поблагодарить спонсоров и т.д. Закон РФ «Об образовании» образовательное учреждение обеспечивает открытость и доступность следующей информации:

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

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

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

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

Дошкольный сайт должен оцениваться по трем характеристикам:

· Организация и функциональность;

· Содержание;

· Дизайн.

Это относится, прежде всего, к структуре сайта и удобству его использования.

В среднем, хороший дошкольный сайт:

· содержит справочную информацию, интересующую родителей (в том числе, об учителях, учебных программах, традициях);

· отражает происходящие в дошкольном образовании события (праздники, конкурсы);

· отражает в развитии постоянно действующие направления в работе школы (участие в проектах, и т.д.);

· является местом, где воспитанники могут представить свои творческие работы;

Требования к представлению материала:

· текст внутри одной страницы должен разбиваться на смысловые фрагменты (абзацы);

· в тексте следует выделять главное: слово или несколько слов, это помогает воспринять и остальной текст.

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

· графическую информацию следует оптимизировать по размеру, количеству цветов и т.д. с целью ускорения процесса загрузки;

· не следует перенасыщать страницы яркими анимированными флэш-роликами, не несущими информационной нагрузки;

· при компоновке страниц необходим учёт ограничений, связанных с объёмом графики на страницах;

· оптимизация страниц сайта создаёт благоприятные условия для нахождения вашей страницы поисковыми системами.

Использование графики

Конечно, именно графика придает веб-страницам основной шарм, но она же может стать и фактором раздражения.

Форматы графических файлов

Форматы графических файлов, используемых в веб-страницах:

· GIF (Graphic Interchange Format): осуществляет сжатие без потерь и сохраняет изображение в 256-цветной палитре. Применяется для хранения изображений, в которых участвуют плоскости ровного цвета, четкие линии и границы. Обычно это - искусственные изображения, созданные с помощью компьютера: логотипы, надписи, заголовки.

· JPEG (от названия организации Joint Photographic Experts Group): сохраняет изображение с 16 миллионами цветов (true color), достигает высокого уровня сжатия за счет потери качества изображения. Используется для хранения фотографических изображений с плавными полутонами, где снижение качества практически незаметно.

· PNG (Portable Network Graphics, читается «пинг») - был задуман как альтернатива формату GIF: также осуществляет сжатие без потерь, но при этом может хранить изображение как в 256-цветной палитре, так и true color с 16 миллионами цветов. Несмотря на преимущества, этот формат пока мало популярен, - в частности потому, что его поддерживают только самые последние версии основных браузеров.

Интерактивность:

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

Сайт в идеале может стать «пространством диалога» между родителями и воспитателями. На некоторых сайтах дошкольных учреждений есть такая форма: «Задайте нам вопрос «Либо создают вкладку «Контактная информация», размещают на данной странице почтовый ящик руководителя данного дошкольного учреждения, это удобно тем, что любой пользователь может задать свой вопрос, а так же получить ответ на него.

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

Навигация

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

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

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

2. Проектирование и разработка web-сайта для центра предшкольной подготовки «Академия детства»

2.1 Составление структуры и дизайна главной страницы

Проектирование и разработка Web-сайтов включает:

1. Изучение необходимого материала для создания Web-сайта.

2. Определение структурной схемы Web-cайта - расположение разделов, контента и навигации.

3. Web-дизайн - создание графических элементов макета с Web-cайта, стилей и элементов навигации.

4. Разработка программного кода, модулей, базы данных и других элементов Web-сайта необходимых в проекте.

5. Размещение Web-сайта в сети Internet

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

Исходя из структуры сайта, а так же его тематики, был выбран шаблон Web-сайта (рис. 3):

Рис. 3. Шаблон Веб-страницы

Шаблон сайта был скачан с unishablon.com. Данный шаблон удовлетворяет критерии сайта данной тематики: яркие цвета, приятный интерфейс. Баннер на странице шаблона подходит концепции центра предшкольной подготовки «Академия детства». Логотипом сайта является названия название центра предшкольной подготовки. На шаблоне сайта он преобладает в ярко - белом цвете.

При создании сайта использовались цвета: красный, синий, белый, оранжевый. Это очень яркие, гармоничные краски, которые идеально подходят к созданию Web-сайта центра предшкольной подготовки «Академия детства».

· Красный цвет символизирует радость, красоту, счастье и полноту жизни.

· Белый цвет символизирует чистоту, незапятнанность, невинность, доброту, радость.

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

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

Перечисленные цвета были использованны для создания сайта предшкольной подготовки «Академия детства»

Тематика данного Web-сайта - центр предшкольной подготовки «Академия детства», что подразумевает что-то яркое и доброе. Веб страница этой тематики, позволяет использовать для разработки различные красочные изображения, цитаты.

Изучив полную информацию для создания сайта, а так же определив дизайн страницы, была создана главная страница сайта. (рис. 4)

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

· возрастной состав детей, занимающихся в группах;

· количество воспитанников в группах;

· основные направления деятельности воспитанников;

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

· место расположения центра предшкольной подготовки «Академия детства».

Рис. 4. Шаблон главной страницы

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

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

Рисунок 5. «Панель навигации»

Эта панель призвана обеспечить навигацию внутри текущего раздела веб страницы и содержит следующие ссылки:

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

2. «Наши занятия»

3. «Галерея»

4. «Расписание занятий»

5. «Наши новости»

6. «Контактная информация».

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

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

2.2. Программный инструментарий по разработке веб страницы

Ниже представлено краткое описание программного инструментария, который был использован при проектировании и разработки веб страницы центра предшкольной подготовки «Академия детства».

HTML (Hyper Text Markuj Language - «Язык разметки гипертекстов»). HTML был разработан для того, чтобы, создавая документ, можно было не думать о различии в программном и аппаратном обеспечении компьютеров, на которых этот документ будет просматриваться. При создании документа в HTML делается акцент на его структуре. Для сравнения: любой текстовый редактор концентрирует внимание на внешнем виде документа. Возможность создания документа, который может быть просмотрен на любом компьютере, большой шаг вперед по сравнению с использованием таких текстовых редакторов, как, например, Microsoft Word.

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

Редактирование и создание кодов производилось исключительно с помощью стандартной программы Блокнот.

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

При разработке веб страницы для обработки графических объектов был использован графический редактор стандартная программа Paint, Adobe Photoshop.

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

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

В конечном итоге была спроектирована и разработана web-страница для центра предшкольной подготовки «Академия детства», содержащая в себе 6 html документов, в которых содержится теоретический материал.

Заключение

Сеть Internet является сегодня одним из основных средств работы большинство организаций. Неотъемлемой частью он стал для повседневной жизни: новости, общение, развлечение - все возможно благодаря всемирной сети.

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

В ходе выполнения курсовой работы нами было изучено проектирование и разработка Web-страницы при помощи языка html, а также был создан Web-сайт для центра предшкольной подготовки «Академия детства» г. Канска.

Web-сайт был написан в сроки и отвечает всем требованиям научного руководителя. При выполнении работы были решены такие задачи:

1. Был изучен весь необходимый материал по созданию web - страниц для дошкольных учреждений, в связи с этим сайт соответствует большинству нормативов сайтов дошкольных учреждений;

2. Систематизирован, оцифрован, и структурирован собранный материал, что позволило полноценно наполнить контент сайта;

3. Был выбран подходящий дизайн страницы и так же структурирована навигация удобная для пользователя;

4. Наполнена содержанием структура данной web-страницы, данной тематики;

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

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

Цель работы достигнута. Web-страница для центра предшкольной подготовки «Академия детства» была спроектирована и разработана с учетом всех требований к данной web-странице.

Список источников

страница дизайн дошкольный сайт

1. Анищенко Ю. WWW-редактор: больше, чем просто HTML. // Подводная лодка. 2002. №4. C.84-90.

2. Ефимова, О.В. Курс компьютерной технологии / О.В. Ефимова - М.: 2003 г. - 113-149 с.

3. Зольников Д.С. PHP 5. Как самостоятельно создать сайт любой сложности. - М.: НТ Пресс, 2005. - 109 с.

4. Кирсанов Д.В. Краткая история HTML. http://www.kirsanov.com/

5. Мержевич В. Справочник по CSS. [электронный ресурс] http://www.htmlbook.ru

6. Могилев А.В., Н.И. Пак, Е.К. Хеннер; - М.: Изд.центр «Академия», 2001. - 816 с.

7. Пак Н.И. Нелинейные технологии обучения в условиях информатизации: Учебное пособие. Красноярск: РИО КГПУ, 2004.

8. Роберт И.В. Информационные технологии в науке и образовании. Учебно-методическое пособие. // М.: Школа педагогического мастерства, - 1999.

9. Роберт И.В. Современные информационные технологии в обучении: дидактические проблемы; перспективы использования. // М.: ШколаПресс, - 1994.

10. Сборник информационно-методических материалов о проекте Информатизация системы образования. / - М:, 2005.

11. Шкрыль А.А. PHP - это просто. Программируем для Web-сайта. - СПб.: BHV-Санкт-Петербург, 2006. - 161 с.

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


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

  • История появления первого в мире сайта info.cern.ch в 1991 году. Страницы сайтов как набор текстовых файлов, размеченных на языке HTML. Использование конструктора при разработке сайтов. Создание сайта "с нуля", разработка дизайна, верстка, оформление.

    реферат [21,5 K], добавлен 26.05.2015

  • Физическая структура сайта. Шаблон оформления страницы. Исходный текст шаблона главной HTML-страницы (верстка с использованием фреймов). Фрагмент кода, содержащий карту сайта. Каскадные таблицы стилей. Программное обеспечение, использованное при работе.

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

  • Особенности разработки Web-страницы, с использованием Microsoft Word. Алгоритм работы: сохранение документа Word, как веб-страницы; просмотр веб-страницы, создание гиперссылок. Настройка и проверка Web-страницы с помощью программы Internet Explorer.

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

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

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

  • Правила создания Web-сайта по вопросам медицинского страхования: разработка главной страницы (фреймовая структура), разделов, посвященных вопросам обязательного и добровольного страхования, активной asp-страницы, содержащей опрос для посетителей.

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

  • Установка программной оболочки Denver и системы управления контентом "Joomla". Составление технического задания и схемы главной страницы. Разработка дизайна и системы навигации Web-сайта, запуск в Internet. Проектирование услуги регистрации пользователей.

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

  • Преимущества языка PHP и структура базы данных. Схема алгоритма и внешний вид главной страницы и страниц сайта, страницы с независимым рейтингом. Анализ типичных ошибок в программах. Расчёт себестоимости и трудоёмкости решаемой задачи, листинг программы.

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

  • Рассмотрение понятия и классификации Web-технологий. Основные требования к созданию главной страницы сайта, раздела "О нас", контента, привязанности. Определение направлений использования языков программирования HTML, PHP, JavaScript, VBScript, Perl.

    курсовая работа [49,3 K], добавлен 13.07.2010

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

    курсовая работа [741,0 K], добавлен 08.10.2013

  • Технические характеристики компьютерных систем. Анализ интернет-сайта филиала предприятия и выявление основных проблем. Обновление структуры и подгонка сайта под современные стандарты с помощью программы WebSite X5. Создание дизайна веб-страницы.

    отчет по практике [410,2 K], добавлен 14.01.2015

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