Классный сайт

 

Содержание

1.  Введение..................................................................................................................2

Конструируем сайт..............................................................................................3

2.1.  Содержание сайта...................................................................................3

2.2.  Дизайн сайта............................................................................................4

2.3.  Структура и удобство навигации сайта..............................................5

2.4.  Графика на страницах сайта.................................................................8

2.5.  Анимация на страницах сайта.............................................................10

2.6.  Интерактивность..................................................................................11

2.7.  Авторские права.....................................................................................12

Заключение..........................................................................................................13 Использованная литература............................................................................14 Приложение 1. Основные понятия FRONT PAGE Приложение 2. Практические советы работы в Adobe Photoshop Приложение3. Введение в технологию Flash

1. Введение

Актуальность проблемы

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

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

Тогда я решила изучить программы для создания web-страниц более высокого уровня. К таким программам относятся Microsoft Front Page, Adobe Photoshop и Macromedia Flash. Почему я выбрала именно эти программы среди огромного множества программных продуктов? Во-первых, эти программы имеют средний уровень сложности, что позволило мне изучить их самостоятельно, во-вторых, эти продукты имелись в коллекции программного обеспечения школы.

Цель работы

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

Задачи

В ходе достижения поставленной цели передо мною встали следующие задачи:

1.  Изучить технологию работы в среде Microsoft Front Page.

2.  Изучить технологию работы с графической информацией в среде Adobe Photoshop.

3.  Изучить технологию создания анимационных рисунков в среде Macromedia Flash.

4.  Изучить основные правила создания хорошего веб-сайта.

5.  Сконструировать веб-страницу своего класса и разместить его на страницах школьного сайта.

Обзор литературы

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

2. Конструируем сайт

2.1. Содержание сайта

Сайт должен содержать информацию. Именно из-за неё пользователи стремятся в Интернет. Чем интереснее информация, тем легче собрать большую аудиторию его посетителей.

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

2.2. Дизайн сайта

Хотя, есть поговорка, что по одёжке встречают, я сделала этот пункт вторым после информации. Но это совсем не значит, что дизайн сайта менее важен. Первое, с чего начинают оценку сайта, это его внешний вид. Сайт – это первый контакт внешнего мира с нашим классом, и качество оформления сайта прямо показывает уровень уважения ко всем пользователям Интернет, открывающим наш сайт. Кроме аккуратного исполнения, существует ещё множество правил, которые необходимо учитывать. Есть технические тонкости, например – вес графических файлов, режимы загрузки страниц. А есть более скрытые: эстетическая ценность, креатив, правильность и совместимость цветового баланса, грамотность пропорций и перспектив по объему и освещению. Плюс немного психологии – правильное ассоциативное восприятие графического оформления, в соответствии с тематикой сайта и его задачами. Часто этот вопрос имеет большее значение, чем кажется на первый взгляд.

Все эти тонкости я старалась учесть при конструировании своего сайта.

Тематика моего сайта – жизнь 10 «А» класса.

2.3. Структура и удобство навигации

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

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

Пользователь должен легко понимать структуру сайта.

В своей работе я выделила следующие части:

обложка сайта

информационный обозреватель

творческие работы учеников 10 «А»

копилка старой информации

фотографии класса

ссылка на школьный сайт

общение с пользователями

ссылка на личные странички учеников

Структура ученического самоуправления школы и класса

Показатели успеваемости класса

Праздники, которые мы отмечаем

Страничка о нашей классной классной

Переход на страничку отдыха

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

Главная страничка

Личные странички учеников нашего класса

Страничка – копилка «Накопленное»

2.4. Графика на страницах сайта

Использование графики должно быть оправданным, графика должна чётко соответствовать содержанию сайта. Переизбыток графики и анимации отвлекает от основного содержания, переключая внимание посетителей сайта, затрудняет загрузку страницы. Графика занимает основной объём трафика веб-страниц. Одна фотография в килобайтах занимает место в десятки раз больше, чем лист текста формата А4. Графика обязательно должна быть оптимизирована.

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

Под редактированием изображения понимаются:

·  Обрезка части изображения

·  Регулировка контрастности и яркости

·  Регулировка цветового баланса

·  Изменение размера изображения

·  Регулировка объёма изображения

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

Все эти возможности я нашла в графическом редакторе Adobe Photoshop. Хочется отметить все преимущества этой великолепной программы:

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

·  Быстрое ретуширование — позволяет с легкостью выделять любой элемент вашего снимка и применять к нему ряд улучшений — как к отдельному объекту, так и к определенной области.

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

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

·  Добавление текста и графики — прекрасная возможность сопроводить фотографии дополнительными оригинальными пояснениями и картинками.

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

Страничка «Галерея»

2.5. Анимация на страницах сайта

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

Одним из хороших решений оказалась Технология Macromedia Flash. Я выбрала её в качестве основной программы как одну из самых предприимчивых и надёжных средств.

Технология Macromedia Flash может справиться с заданиями любых размеров и сложности. Flash можно использовать для создания полноценного мультимедийного Web - сайта, насыщенного красивой графикой, с формами и интерактивностью. Файлы получаются «лёгкими» и быстрозагружаемыми.

С помощью Macromedia Flash я создала страничку отдыха, где можно поиграть в игру «Сборка пазла». Также на страничках моего сайта можно встретить анимированные кнопки и объекты, выполненные в Macromedia Flash.

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

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

Моя гостевая книга ссылается на страничку гостевой книги школьного сайта и, соответственно, выглядит так же.

2.7. Авторские права и контактная информация

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

Кто-то нашёл наш сайт в Интернете и хочет связаться с нами, например, для того чтобы переписываться с кем то, пригласить в свою школу в гости, обменяться интересной информацией или просто познакомиться. В этом случае необходима контактная информация. Она должна быть легко доступной и полной. Город, телефон, адрес электронной почты, имя и отчество контактного лица – всё это обязательно нужно отражать на сайте. Я разместила контактную информацию в самое посещаемое место на сайте – на стартовой странице glavnaya. htm

3. Заключение

В заключение хочется дать добрый совет начинающим веб-дизайнерам. Не пугайтесь новых программ. Изучайте, это очень интересно и познавательно! Глаза боятся, а руки делают. С помощью несложных программ, таких как Microsoft Front Page, Adobe Photoshop, Macromedia Flash можно сконструировать неплохой сайт. В приложениях 1-3 можно найти краткие руководства по работе в этих программах. Ну и неплохо придерживаться следующих советов:

Делайте то, что от вас хотят видеть. Не увлекайтесь графикой Держите стиль Дизайн не должен быть литым Уделяйте внимание мелочам Удобная навигация – залог успеха Ваш браузер не единственный, разрешение экрана не уникально Любите себя в меру Дизайн не должен портить жизнь веб-мастеру Точность – вежливость королей Авторские права не шутка На сайте всё должно быть на своих местах Не выкладывайте всё на одну страницу Работайте в рамках дизайна Отвечайте на все письма посетителей Чем чаще обновления, тем больше посетителей Работайте оперативно Ваша настольная книга – орфографический словарь ИМХО сабж рулез или пишите по-русски Не пишите чепухи Будьте вежливы

 

4. Использованная литература и ссылки на Интернет - ресурсы

электронные учебники MS Front Page 2003:

http://www. *****/frontpage/ishod. htm,

http://study. *****/

электронные учебники Adobe Photoshop:

http://photoshop. *****/

http://www. *****/

электронный учебник Macromedia Flash:

http://*****/lesson. htm

http://www.

Flash - технологии. Уроки для начинающих. Пособие по разделу курса «Создание Web - представлений» Мейксон в технологию Flash, Московский Центр Интернет-образования, 2000. Давыдова графики для Web- страниц. Москва. Кирий создания Web-страниц. Чебоксары, 2002. http://www. ***** – Всероссийский клуб вебмастеров.