Муниципальное бюджетное образовательное учреждение

«Территориальный ресурсный центр города Черемхово»

Работа с контентом школьного сайта

(форма обратной связи, интерактивные публикации,

слайд - альбомы, баннеры)

Методические рекомендации

Составитель:

Черемхово, 2011

Составитель: методист по ИКТ МБОУ «Территориальный ресурсный центр г. Черемхово»

Работа с контентом школьного сайта (форма обратной связи, интерактивные публикации, слайд – альбомы, баннеры). Методические рекомендации. - Черемхово: ТРЦ г. Черемхово, 2011. – 14 с.

©

© МБОУ «Территориальный ресурсный центр города Черемхово», 2011

Содержание

Введение……………………………………………………………………………………….…

1.  Добавление формы обратной связи на школьный сайт…………………………….…

2.  Создание и добавление интерактивных публикаций на сайт…………………………

3.  Создание и размещение на сайте слайд – шоу со школьных мероприятий…..……...

4.  Применение баннеров на школьном сайте………………………………………….….

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

3

5

6

8

10

13

Введение

Согласно ч. 2 ст. 32 Закона РФ «Об образовании», в компетенцию образовательных учреждений входит обеспечение создания и ведения официального сайта образовательного учреждения в сети Интернет. Таким образом, образовательное учреждение обеспечивает открытость и доступность следующей информации:

1) сведений:

·  о дате создания образовательного учреждения;

·  о структуре образовательного учреждения;

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

НЕ нашли? Не то? Что вы ищете?

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

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

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

·  о правилах приема в ОУ;

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

·  о поступлении и расходовании финансовых и материальных средств по итогам финансового года;

2) копий:

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

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

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

·  отчет о результатах самообследования;

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

·  сведения, указанные в пункте 3.2 статьи 32 Федерального закона от 01.01.01 года N 7-ФЗ "О некоммерческих организациях".

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

Кроме того, Федеральный закон N 293 от 8 ноября 2010 г. дополняет этот перечень пунктом 5, который устанавливает периодичность обновления информации на сайте в течение тридцати дней со дня внесения соответствующих изменений.

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

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

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

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

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

·  защита прав и интересов участников образовательного процесса.

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

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

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

1.  Добавление формы обратной связи на школьный сайт

Fox Contact Form – компонент формы обратной связи с возможностью вывода дополнительных полей, управлением полями, созданием выпадающих списков, чек боксов, подсветкой полей, отправлением писем сразу на несколько E-mail адресов, информацией о пользователях и многое другое.

Возможности Fox Contact Form:

·  можно иметь несколько экземпляров модулей на одной странице.

·  поле пользователя и поле для загрузки 

·  несколько получателей

·  антиспам система

·  мультиязычность

·  запись лога в текстовый файл

·  легко обновляется

Работа с компонентом достаточно проста. Сначала компонент необходимо установить через Расширения – Менеджер расширений.

Подпись: Рисунок 1Далее, в менеджере меню создайте новый пункт меню. Укажите тип пункта меню – Fox Contact. Заголовок меню может быть, например, таким «Оставить сообщение для нас», «Ваше сообщение для нас», «Написать нам сообщение» и др. (рисунок 1) Остальные поля в разделе Подробно можно оставить без исправлений.

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

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

2.  Теперь перейдем к окну «Поля формы». Выбор количества полей здесь достаточно широкий и удовлетворит даже самого взыскательного пользователя. В минимальной же форме Обратной связи обязательны такие поля: Ваше имя, Ваш email, содержание сообщения.

3.  Подпись: Рисунок 2В окне События у вас появляется возможность добавить текстовые комментарии к создаваемой форме. Данная форма может быть заполнена произвольно, например как на рисунке 2.

4.  Подпись: Рисунок 3В этом компоненте формы обратной связи предусмотрено окно Безопасность с возможностью включения Антиспама, что для школьного сайта является скорее необходимостью. Во вкладке Безопасность активируйте спам-фильтр, а в окно Сообщение можно ввести примерно такой текст «Извините, но система считает, что ваше сообщение содержит нежелательную рекламу, поэтому оно <b>было заблокировано</b>.<br />Если вы считаете, что это ошибка, то, пожалуйста, вернитесь и попробуйте еще раз, избегая таких слов как <i>www, http,</i> и так далее.» Здесь же существует возможность добавить Капч на сайт, который все чаше встречается на просторах Интернета (рисунок 3). Настроить капч также можно по собственному усмотрению, выбрав стиль, цвет и шрифт, отображаемых в капче букв и цифр.

5.  Подпись: Рисунок 4Остальные окна формы могут быть также настроены, но чаще далее настройка не производится.

Как только все поля формы Обратной связи заполнены можно нажать на кнопку «Сохранить и закрыть», а на сайте появиться примерно такая форма (рисунок 4)

2.  Создание и добавление интерактивных публикаций на сайт

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

Для сайта под управлением Joomla достаточно удобно для этих целей использовать дополнительный сервис Calameo. Calaméo - это сервис для мгновенного создания интерактивных публикаций в Интернете, простой для использования и с невероятно широкими возможностями. Из файла формата PDF можно создавать журналы, брошюры, каталоги, отчеты, презентации и многое другое

Calaméo приемлет большинство типов офисных форматов (Microsoft Office, OpenOffice и другие): Microsoft Office - Microsoft Word (.doc, .rtf), Microsoft Powerpoint (.ppt, .pps), Microsoft Excel (.xls); OpenOffice. org - Writer (.odt, .ott, .sxw, .stw), Impress (.odp, .otp, .sxi, .sti), Calc (..ods, .ots, .sxc, .stc). Другие: Document Adobe PDF (версии , текстовой файл (.txt), страница HTML (HTML-файл) (.htm, .html).

Calaméo предоставляет возможность публиковать в Интернете документы в виде: книги, журнала, брошюры, презентации. 

Работа с сервисом Calomeo можно представить поэтапно:

1.  Перейти на сервис http://www. /

2.  В появившемся окне выбрать «Создать бесплатный аккаунт» (рисунок 5)

3.  Подпись: Рисунок 5В следующем окне вводим электронный адрес, пароль и ваши Фамилию и Имя, дату рождения. Обратите внимание, что все поля данной формы являются обязательными для заполнения. После того как все поля формы заполнены и проверены, вы отметили пункт «Я принимаю соглашение об использовании и условия конфиденциальности, можно нажимать на кнопку «Создать бесплатный аккаунт. (рисунок 6)

4.  Подпись: Рисунок 6Теперь следует дождаться, когда на указанный вами электронный ящик придет письмо со ссылкой на подтверждение регистрации.

5.  Кликнув по ссылке с почтового ящика вы попадаете в окно управления своим аккаунтом. Во вкладке «Мой аккаунт» кликнув по кнопке «Создать публикацию» вы можете перейти в окно добавления публикаций. Используя вкладку «Мои публикации» вы можете просмотреть все свои ранее загруженные документы и добавить новые. (рисунок 7)

6.  Подпись: Рисунок 7Подпись: Рисунок 8Теперь создадим свою публикацию. Выбираем «Создать публикацию» во вкладке «Мой аккаунт» и в следующем окне «Создать публикацию» (рисунок 8) заполняем поля предложенной формы. Находим необходимый материал с помощью кнопки Просмотр и добавляем его в это окно. Вводим название публикации, оно должно быть читаемым и понятным. Выбираем формат представления материала: альбом, брошюра, буклет, газета, журнал, каталог, книга, комиксы, манга, мультимедиа, новелла, отчет, песня, презентация, руководство, разное. А также Категорию к которой следует отнести материал, для нас «Образование». Далее определяемся режимом публикации «Публичная» или «Частная». В Calomeo предусмотрены также и дополнительные настраиваемые опции, где вы можете оставить дополнительное описание для документа, изменить параметра просмотра вашего документа и многое другое. Когда все необходимые поля заполнены, выбираем «Начать загрузку». В зависимости от объема вашего документа она может потребовать значительного количества времени.

7.  http://*****/plugins/content/jumultithumb/img.php?src=Li4vLi4vLi4vaW1hZ2VzL3N0b3JpZXMvZmlsdHIuanBnJmFtcDt3PTU1MCZhbXA7aD01NTAmYW1wO3E9OTA=Подпись: Рисунок 9По окончании загрузки вашего документа появится окно с ссылками на вашу публикацию (рисунок 9). В этом окне следует скопировать код HTML в буфер обмена. Полный список ссылок на ваш документ для разных типов сайтов вы можете скопировать, нажав на кнопку «Поделиться».

8.  Подпись: Рисунок 10Для вставки данной ссылки на сайт и её корректного отображения следует сначала произвести дополнительные настройки вашего сайта. Во-первых, войдите в административную панель управления сайта и в Менеджере пользователей найдите свою учетную запись. Измените для своей записи права, назначив группы пользователей только Super Users. Сохраните изменения. Снова зайдите в Административную панель сайта – Менеджер материалов – Настройки (рисунок10). Во вкладке Фильтры текста установите Нет фильтрации для Super Users. Сохраните и закройте данные настройки.

9.  Подпись: Рисунок 11Откройте или создайте материал, в который вы хотите внедрить интерактивную публикацию с Calameo. Отключите визуальный редактор, нажав на кнопку Источник. (рисунок 11) Вместо текста вы увидите HTML код материала, в нем нужно вставить в место между тегами абзаца <p> и </p> вставить текст из буфера обмена и сохранить.

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

3.  Создание и размещение на сайте слад-шоу со школьных мероприятий

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

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

Возможности программы достаточно обширны:

·  загрузка фотографий в компьютер со сканера и камеры;

·  автоматическая индексация фотографий на жёстком диске компьютера;

·  просмотр фотографий в обычном и полноэкранном режимах, в том числе в виде слайд-шоу;

·  редактирование фотографий, включая ретуширование, кадрирование и выравнивание;

·  применение к фотографиям различных эффектов, в том числе коррекция эффекта красных глаз;

·  присвоение фотографиям ярлыков и ключевых слов;

·  распечатка фотографий;

·  создание коллажей фотографий.

·  отправка фотографий по электронной почте;

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

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

Такие отличные возможности программы позволяют частично отказаться от использования графических редакторов и перекрывают небольшие недостатки Picasa:

·  не воспроизводит анимированные GIF-файлы;

·  иногда проблемы с отображением альфа-канала в PNG.

Подпись: Рисунок 12Алгоритм работы с Picasa можно представить поэтапно: регистрация на сайте, размещение фотографий, обработка фотографий, размещение фото-слайдов на сайте. Рассмотрим каждый этап подробнее.

Для начала работы с Picasa необходимо пройти регистрацию на сайте www. *****. Для этого перейдите на сайт www. ***** и в верхней панели управление во вкладке «Еще» выберите пункт «Фотографии» (Рисунок 12). В появившемся окне фотосервиса Picasa выберите «Создать аккаунт» (рисунок 13).

Подпись: Рисунок 13В новом окне Google Аккаунты следует заполнить все поля регистрационной формы: Электронный адрес, пароль, имя, фамилия, страна, согласиться с Лицензионным соглашением и выбрать создать аккаунт. (рисунок 14).

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

Подпись: Рисунок 14Следующим этапом следует научиться создавать фотоальбомы и загружать фотографии. Для этого достаточно переключиться с главной страницы на вкладку Мои фотографии и нажать на кнопку «Загрузить». Сервис Picasa предоставляет каждому пользоваМб свободного места. В открывшемся окне загрузки фотографий следует создать фотоальбом или выбрать из списка, добавить фото можно в основном окне нажав на «Выберите файлы на компьютере». Следует отметить, что интерфейс Picasa интуитивно понятен и прост в работе.

Подпись: Рисунок 15Загруженные фото вы можете сразу же просмотреть в этом же окне, а также настроить параметры отображения фото «Только Вам» или «Публично». Когда загрузка фотографий в фотоальбом закончена и произведены настройки можно приступать к публикации слайд-шоу на вашем сайте. Для этого необходимо скопировать ссылку на этот фотоальбом выбрав «Встроить слайд шоу» и скопировав в буфер обмена появившийся HTML код. (рисунок 16)

Вставка данного HTML кода в материал на вашем сайте аналогична описанному выше способу добавления публикации с Calomeo (см. пункты 8 и 9 выше).

Подпись: Рисунок 16Чтобы обработать какую либо фотографию достаточно просто кликнуть по ней и выбрать Изменить. Процессы работы с фотографиями в Picasa мы предлагаем Вам освоить самостоятельно.

4.  Применение баннеров на школьном сайте

Дополнительную интерактивность сайт приобретает еще и в том случае, когда на нем размещаются баннеры. Баннер — это не большой графический блок рекламы. Как правило, на баннер надо кликнуть курсором мышки, чтоб посетить рекламируемый проект (сайт), но не всегда. Баннеры помещаются на Интернет страничках школьных сайтов, для привлечения людей на собственный сайт с других сайтов и информировании посетителей о социальных партнерах школы, в качестве которых может выступать, например, другая школа, управление образованием, другие образовательные сайты. Также использование баннеров на школьных сайтах позволяет настроить его SEO оптимизацию в Интернет.

Существуют разные виды баннеров: JPG баннер — состоит из простого изображения в формате JPG; GIF баннер — это также как и в JPG баннере, простое изображение, но уже в формате GIF; Flash баннер — самый эффективный из анимированных баннеров, в смысле интерактивности. На школьных сайтах такие баннеры снабжаются ссылками на сайты социальных партнеров (другие школы, министерства управления образованием и др.)

Основной единицей измерения являются пиксели. Существуют несколько общепринятых стандартов: это баннеры таких размеров: 468x60, 120x60, 100x100, 88x31. Есть и множество других размеров, но они менее популярны в использовании. Очень важным является размер (объем) самого файла баннера. Обычно, принято, чтобы размер баннера был не более 15Kb. Конечно, с введением новых форматов (flash) достичь этого будет уже невозможно.

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

Подпись: Рисунок 18На школьных сайтах под руководством Joomla 1.6. баннеры можно создавать несколькими способами. Если требуется создать одиночный баннер большого размера, например 120х60, то следует воспользоваться компонентом Баннеры. В этом случае открываем Компоненты – Баннеры – Категория и создаем категорию под именем Баннер – сохранить и Закрыть. Далее Компоненты – Баннеры создаем Баннер: задаем название Баннер1, указываем категорию Баннер, тип Изображение, в поле изображение задаем ссылку на баннер загруженный через медиа-менеджер, выставляем размеры (ширина и высота), в поле URL_для перехода указываем ссылку на сайт которому принадлежит ваш баннер. (рисунок 17) В этом же окне вы позже можете просмотреть статистику просмотра вашего баннера в окне Функции публикации и при желании изменить их.

Подпись:Количество баннеров может быть неограниченным, но увлекаться им на школьных сайтах не стоит. Когда все баннеры созданы, их следует разместить на сайте. Для этого открываем Расширения – Менеджер модулей и создаем новый модуль Баннеры. (рисунок 18) Тип модуля – Баннер. В открывшемся окне вам следует указать позицию, где будет размещен ваш баннер на сайте и порядок показа ваших баннеров (созданных с помощью компонента баннеры). Выберите категорию Баннеры и укажите, сколько баннеров отображать одновременно (количество). Когда все готово нажимаем Сохранить и Закрыть. Если все сделано правильно, то на вашем сайте баннеры (если их более двух) будут выставлены в столбец (рисунок 19), что не совсем удобно и красиво, хотя это идеальный способ создания баннера, если он один и достаточно большого размера.

Подпись: Рисунок 20Чаще баннеры социальных партнеров школы уместнее расположить горизонтально в линию (рисунок 20), это можно сделать также с помощью компонента баннеры, но можно предложить более простой способ.

Подпись: Рисунок 21Подпись:Для этого заходим в Расширения – Менеджер модулей и создаем новый модуль Баннеры. Тип модуля – HTML –код. Определяемся с позицией модуля на сайте. Если в этой позиции расположены еще и другие баннеры, то следует указать порядок показа создаваемого баннера. В окне Пользовательский текст (рисунок 21) создаем таблицу с количеством колонок равных количеству предполагаемых баннеров. Границы таблицы устанавливаем прозрачными (размер бордюра =0). Далее в каждую ячейку этой таблицы добавляем заранее приготовленные изображения баннеров, вставка баннера аналогично добавлению любого изображения в материал. Когда все изображения добавлены в таблицу, нужно установить гиперссылки для каждого. Для этого открываем свойства каждого изображения (рисунок 22) добавляем URL сайта на которой будет осуществляться переход при нажатии на баннер, а также выставляем ширину и высоту (80х31). Во вкладке Ссылка (чтобы при нажатии на баннер открывалось новое окно) выберите Target – New Window. Сохраните изменения свойств изображения и сохраните и закройте менеджер модулей. Если все выполнено правильно, то на сайте отобразятся баннеры в горизонтальной линии (рисунок20).

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

1.  Fox Contact Form - компонент для создания контактной формы в Joomla. http://*****/blogs/item/874-fox-contact-form-komponent-dlya-nastroyki-kontaktnoy-formyi-v-joomla. html

2.  Joomla: работа с баннерами. http://*****/joomla/joomla-rabota-s-bannerami/

3.  Закон «Об образовании» http://www. zakonrf. info/zakon-ob-obrazovanii/32/

4.  Закон «Об Образовании». Управление системой образования http://base. *****//3/

5.  Компонент - Fox Contact Form v1.6.12. http://joomla-master. org/joomla/components/ komponent-fox-contact-form-v1.6.12.html

6.  О программе Picasa. http://ru. wikipedia. org/wiki/Picasa

7.  О социальном сервисе . http://*****/index. php/Calameo

8.  Официальный сайт Calomeo http://www. /

9.  Сведение о программе Picasa. http://picasa.

10.  Что такое баннер? http://www. *****/articles/banner

ЧЕПУРЫГИНА НАДЕЖДА АЛЕКСАНДРОВНА

Работа с контентом школьного сайта

(форма обратной связи, интерактивные публикации, слайд – альбомы, баннеры)

Методические рекомендации

 

Подписано в печать 01.11.2011. Бумага писчая. Печать RISO.
Гарнитура Times New Roman Формат 60х84 1/16.

Усл. печ. л. 1,2. Тираж 10 экз.

г. Черемхово, .