Разработка малобюджетного учебного сайта на основе концепции Wiki Часть 1

Содержание

Слайд 2

Как будем работать? (45 мин+ 5 перерыв + 40 мин) У

Как будем работать? (45 мин+ 5 перерыв + 40 мин)

У нас

есть продюссер (Юлия Завдовьева)
Отвечает на все технические и организационные вопросы
Записывает все обещания ведущего
На все вопросы, которые прозвучат по ходу вебинара, рассказа, ответы даются перед перерывом (5 мин. в середине) и в конце вебинара
Просьба вопросы задавать в спец. подразделе чата «Вопросы»
По итогам вебинара будет открыта тема в форуме, где размещаются материалы (презентация и видеозапись)

3.12.10

Слайд 3

Знакомство О себе ФИО: Порошин Александр Николаевич преподаватель СПб гос. ун-та

Знакомство

О себе
ФИО: Порошин Александр Николаевич
преподаватель СПб гос. ун-та (СПбГУ, ЭФ)
образование:

инженер-системотехник (ПО ЭВМ, 1979), web-мастер (ФПК СПбГУ, 1996)
преподаватель (колледжи, вузы, ФПК, с 1981 г.)
в области ДО с 1997 г.;
2002–2003 гг. – декан факультета ДО СПб филиала Международного университета
Личный учебный сайт на сервере ЭФ СПбГУ с 2003 г. (в т.ч. LMS Moodle)

3.12.10

Слайд 4

Опрос. Смотрите, кто пришел! ☺ Интересующийся Студент Преподаватель, желающий применять ИТ

Опрос. Смотрите, кто пришел! ☺

Интересующийся
Студент
Преподаватель, желающий применять ИТ
Преподаватель, уже использующий ИТ
Преподаватель

+ специалист ИТ
Специалист ИТ
Администратор/организатор обучения

3.12.10

Слайд 5

Наша цель Цель: научиться создавать веб-страницы сайта (наполнять их содержанием) При

Наша цель

Цель: научиться создавать веб-страницы сайта (наполнять их содержанием)
При условии: уже

развернутой системы
И быстро: не дольше одной веб-страницы (25-35 строк текста, возможно, с графикой, таблицей и загружаемыми файлами) за 10–15 минут

3.12.10

Слайд 6

Использование wiki-системы при разработке и поддержке учебного информационного ресурса Задачи преподавателя

Использование wiki-системы при разработке и поддержке учебного информационного ресурса

Задачи преподавателя и

возможные варианты использования его учебного сайта
Порядок разработки сайта и принципы подготовки материалов для публикации в сети
Принцип работы Wiki-системы и основные "операторы" wiki-разметки
Редактирование веб-страниц на основе своего учебного материала
Поддержка сайта, плюсы и минусы рассмотренной технологии.

3.12.10

Слайд 7

Ранние работы (тезисы конференции) Учебный сайт преподавателя как базовый элемент современной

Ранние работы (тезисы конференции)

Учебный сайт преподавателя как базовый элемент современной образовательной

среды вуза. ИТО-2004. Секция 1.1.3 (Образовательные Интернет-ресурсы) http://www.ito.su/main.php?pid=26&fid=4485
Методика разработки и использования учебного сайта при обучении преподавателей. ИТО-2006. Секция 1.3. Подготовка и повышение квалификации преподавателей. http://www.ito.su/main.php?pid=26&fid=6496

3.12.10

Слайд 8

Немного истории Поддержка очного обучения (младшие курсы и магистранты) Организационно-методическая и

Немного истории

Поддержка очного обучения (младшие курсы и магистранты)
Организационно-методическая и техническая поддержка

(«смерть интеллектуальному иждивенчеству!»)
Постепенное формирование учебно-методического фонда («Сперва ты работаешь на сайт, а затем он – на тебя!»)

3.12.10

Слайд 9

Особенности учебного контент-сайта размещение преимущественно текстового материала и сравнительно небольшой объем

Особенности учебного контент-сайта

размещение преимущественно текстового материала и сравнительно небольшой объем графики,

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

3.12.10

Слайд 10

Содержание ресурса учебные материалы – оригинальные и заимствованные (с соблюдением авторских

Содержание ресурса

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

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

3.12.10

Слайд 11

Выкристаллизовались методические решения Использование учебного веб-сайта: для организационно-методической поддержки очного обучения

Выкристаллизовались методические решения

Использование учебного веб-сайта:
для организационно-методической поддержки очного обучения и ФПК:

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

3.12.10

Слайд 12

Сопутствующие решения Электронная почта Использование LMS Moodle Использование средств Google (напр. docs) 3.12.10

Сопутствующие решения

Электронная почта
Использование LMS Moodle
Использование средств Google (напр. docs)

3.12.10

Слайд 13

Ваше мнение? Для каких целей еще может быть использован сайт преподавателя?

Ваше мнение?

Для каких целей еще может быть использован сайт преподавателя?
Какие особенности

учебного сайта Вы бы назвали дополнительно к перечисленным

3.12.10

Слайд 14

Подготовка к работе над сайтом Просьба прислать материалы, касающиеся разработки своего сайта на адрес: anpspb@gmail.com 3.12.10

Подготовка к работе над сайтом
Просьба прислать материалы, касающиеся разработки своего сайта

на адрес: anpspb@gmail.com

3.12.10

Слайд 15

Жизненный цикл сайта 1. Постановка задачи 2. Проектирование 3. Размещение в

Жизненный цикл сайта

1. Постановка задачи
2. Проектирование
3. Размещение в сети
4. Регистрация

( для государственных сайтов)
5. Эксплуатация
6. Редизайн

3.12.10

Слайд 16

Трудоемкость разработки сайта 3.12.10

Трудоемкость разработки сайта

3.12.10

Слайд 17

Средства разработки сайта 1.Ручные средства Текстовый редактор (ручное HTML-кодирование) Web-редактор WYSIWYG

Средства разработки сайта

1.Ручные средства
Текстовый редактор (ручное HTML-кодирование)
Web-редактор WYSIWYG (напр. DreamWeaver)
2. Автоматизированные

средства
На основе шаблонов сайта хостера
СУК (CMS) – системы управления контентом (напр. joomla и др.)
Wiki-системы
WikiPad
MediaWiki
Tikiwiki…

3.12.10

Слайд 18

Стас Фомин о wiki(1) Бизнес-форум "Управление знаниями – стратегические подходы к

Стас Фомин о wiki(1)

Бизнес-форум "Управление знаниями – стратегические подходы к росту

эффективности бизнеса» (25-26.10.10)
Сессия 5. Инновации в сфере управления знаниями: сети и сообщества, сотрудничество и Web 2.0, новые техники и технологии
Доклад «Оранжерея знаний с MediaWiki». Стас Фомин, зам. дир-ра по инф. технологиям, Заказные ИнформСистемы, Россия.

3.12.10

Слайд 19

Стас Фомин о wiki (2) Нам всегда приходится выбирать: полнота или

Стас Фомин о wiki (2)

Нам всегда приходится выбирать: полнота или актуальность

знаний.
Какая есть хорошая практика управления знаниями? Человечество решает эту проблему в Интернете. А на корпоративном уровне?
Сперва при работе в Интернет появились закладки (в браузерах). Затем – переход к сетевым закладкам, а потом – обратились к персональным закладкам.
Следующий шаг – блог как средство фиксации знаний, когда все "привязывается" только к дате. Это – более высокий уровень по сравнению с закладками. Нет актуальности, но зато быстро.
Далее – форум: место, где "вопросы встречаются с ответами". Довольно "мусорный" уровень, но по сравнению с блогами – уровень выше.
И наивысший уровень – это вики-вики, ресурс, где знания должны поддерживаться актуальными. Т.е. получение максимума эффекта при наименьших затратах.
Однако на первый взгляд в Вики есть только «плоский текст». Так ли?

3.12.10

Слайд 20

Стас Фомин о wiki(3.) Нет! Например сиистема МедиаВики (МВ) – не

Стас Фомин о wiki(3.)

Нет! Например сиистема МедиаВики (МВ) – не фетиш

плоского текста. Вы можете работать и с pdf-файлами и со всем, что у вас есть; и делаете это быстро.
В Вики грузится не только текст, все – майнд-мапы, фото, диаграммы и т.п.
Наши программисты проводят ретроспективы, строят диаграммы, фотографируют и т.п. – и все помещают в Вики.
У нас на фирме через вики реализуется все – управление заказами, протоколы заседаний и т.п.
Вам с МВ не нужны sharepoint-порталы, вам не нужны системы управления требованиями и многое другое.
Итак, Вики – это хорошо, но есть нагрузка: требуется поддерживать актуальность . (Форумы требуют ее меньше, блоги – вообще ничего не требуют с точки зрения актуальности.)
Может быть конфликт использования, если смешивать блог, форум, вики-движком и т.п. Люди не будут связываться ни с чем. И какое решение?
Пусть все будет в Вики – и форумы, и блоги, и закладки, и т.д.
Мы распрощались с Word, Sharepoint, html... и многими другими системами – все реализуется через Медиавики!

3.12.10

Слайд 21

Wikipad и wiki-подход Возможность многократно править текст посредством самой вики-среды: ДА

Wikipad и wiki-подход

Возможность многократно править текст посредством самой вики-среды: ДА
Особый язык разметки : ДА
Учёт

изменений (версий) страниц: НЕТ
Проявление изменений сразу после их внесения: ДА
Разделение содержимого на именованные страницы и гипертекстовость системы: ДА.
Множество авторов: НЕТ

3.12.10

Слайд 22

Три «кита» сайтостроения Его величество Контент (содержательное ядро) Ее величество дизайн

Три «кита» сайтостроения

Его величество Контент
(содержательное ядро)
Ее величество дизайн
(единство стиля сайта и

эффективность его интерфейса)
Их верная служанка Навигация
(предсказуемый и надежный доступ)

3.12.10

Слайд 23

Этапы разработки сайта в среде Wiki Этап 1. Разработка паспорта сайта

Этапы разработки сайта в среде Wiki

Этап 1. Разработка паспорта сайта
Этап 2.

Структура и навигация
Этап 3. Наполнение контентом
Этап 4. Редактирование дизайна
Этап 5. Комплексная проверка

3.12.10

Слайд 24

Этап 1. Разработка паспорта сайта Учетные данные: общие сведения Краткое описание

Этап 1. Разработка паспорта сайта

Учетные данные: общие сведения
Краткое описание сайта (эскиз

«что хочу»)
Целевая аудитория («кто посетитель»)
Цели и задачи («для чего»)
Основные функциональные блоки («какое наполнение»)

3.12.10

Слайд 25

Обсуждение присланных материалов Этап 1: паспорт сайта Обсуждаем: насколько полно и

Обсуждение присланных материалов

Этап 1: паспорт сайта
Обсуждаем:
насколько полно и четко указаны

цели, аудитория и функциональные блоки сайта

3.12.10

Слайд 26

Этап 2. Структура и навигация Задача этапа: раскрыть основные функциональные блоки

Этап 2. Структура и навигация

Задача этапа: раскрыть основные функциональные блоки сайта,

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

3.12.10

Слайд 27

Этап 3. Наполнение контентом Задача этапа: формирование страниц на основе Вики-разметки

Этап 3. Наполнение контентом

Задача этапа: формирование страниц на основе Вики-разметки
Основные операторы:
Структуризация

заголовками
Форматирование текста
Указание объекта (таблицы, рисунка)
Создание гиперссылки на страницу сайта
Создание ссылки на загружаемый файл
Создание ссылки на внешний ресурс

3.12.10

Слайд 28

Структуризация заголовками При написании текстов можно использовать заголовки 5 уровней. Каждый

Структуризация заголовками

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

должен быть окружен знаками равно "=" (от 2 до 6 знаков). Чем больше знаков равно "=", тем более вложенным будет заголовок.
== Заголовок первого уровня == === Заголовок второго уровня === ==== Заголовок третьего уровня ====

3.12.10

Слайд 29

Форматирование текста Абзацы разделяются знаком «пустая строка» Разрыв строки дается двойным

Форматирование текста

Абзацы разделяются знаком «пустая строка»
Разрыв строки дается двойным слэшем (\\)
Для

выделения в тексте можно использовать два (для ''курсивного'') или три (для '''полужирного''' начертания) апострофа
Полужирный курсив – '''''пять апострофов'''''
Левый отступ строки задается двоеточием (:)
Списки задаются: нумерованный через #, а марированный – с помощью звездочки (*)

3.12.10

Слайд 30

Указание объекта Указание графического файла (png, jpg, gif): простой вариант: [[Image:picture.png]]

Указание объекта

Указание графического файла (png, jpg, gif):
простой вариант: [[Image:picture.png]]
сложный вариант : [[Image:picture.png|left|frame|Описание

рисунка]]
Указание таблицы
|100%|highlight|Штатное расписание нашей фирмы |Имя Фамилия ||Должность | Год рождения | |Иван |Иванов |Директор | 1966 | |Семен |Семенов |Бухгалтер | 1958 | |Мария |Петрова |Секретарь | 1980 |

3.12.10

Слайд 31

Создание гиперссылки на страницу сайта Cсылка указывается ее идентификатором и через

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

Cсылка указывается ее идентификатором и через вертикальную

черту – названием страницы в нужной форме; все заключается в двойные квадратные скобки.
Если такая страница существует, то ссылка сразу будет работать. Если нет, то при вызове этой ссылки появится форма создания новой страницы в редакторе.
Пример: [[news|Новости]]

3.12.10

Слайд 32

Создание ссылки на загружаемый файл простой вариант: [[File:archive.zip]] сложный вариант: [[File:archive.zip|Архив c примерами]] 3.12.10

Создание ссылки на загружаемый файл

простой вариант: [[File:archive.zip]]
сложный вариант: [[File:archive.zip|Архив c примерами]]

3.12.10

Слайд 33

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

Создание ссылки на внешний ресурс

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

либо более сложная конструкция (если необходимо дать метку для ссылки).
простой вариант: http://www.cherry-wiki.spb.ru/
сложный вариант [http://www.econ.pu.ru/ ЭФ СПбГУ]

3.12.10

Слайд 34

Демонстрация редактирования страницы Страницу «Карта сайта» формируем на основании предложенных материалов

Демонстрация редактирования страницы

Страницу «Карта сайта» формируем на основании предложенных материалов (функциональные блоки,

объединенные в более крупные единицы – разделы сайта)

3.12.10

Слайд 35

Этап 4. Редактирование дизайна Дизайн может быть изменен путем редактирования файла

Этап 4. Редактирование дизайна

Дизайн может быть изменен путем редактирования файла screen.css
Графическая

«шапка» сайта может быть отредактирована в гр. редакторе (Photoshop)
Элементы страницы могут быть введены (отформатированы) непосредственно средствами языка HTML

3.12.10

Слайд 36

Этап 5. Комплексная проверка Проверка включает: наличие и правильность всех страниц

Этап 5. Комплексная проверка

Проверка включает:
наличие и правильность всех страниц
тестирование переходов внутри

сайта
тестирование загрузки архивных файлов сайта, отображение рисунков, таблиц
тестирование переходов на внешние ресурсы

3.12.10

Слайд 37

Практическая работа В качестве «испытательного полигона» используется сайт: http://site.idpo.org Каждый желающий

Практическая работа

В качестве «испытательного полигона» используется сайт:
http://site.idpo.org
Каждый желающий сообщает имя

своей странички и она появляется в Песочнице на «Карте учебных сайтов»

3.12.10

Слайд 38

Ограничения системы Навигация через карту сайта и ссылки на страницах Дизайн

Ограничения системы

Навигация через карту сайта и ссылки на страницах
Дизайн задается через

описание каскадными таблицами стилей

3.12.10

Слайд 39

Пример сайта преподавателя А. Б. Лебедева (http://study.econ.pu.ru/lab/) 3.12.10

Пример сайта преподавателя А. Б. Лебедева (http://study.econ.pu.ru/lab/)

3.12.10

Слайд 40

Пример сайта преподавателя А. Б. Лебедева (общая информация) Я смог создать

Пример сайта преподавателя А. Б. Лебедева (общая информация)

Я смог создать этот сайт

после двух ознакомительных лекций в рамках программы повышения квалификации преподавателей в конце 2007– 2008 учебного года, а также ознакомления с учебными материалами, представленными здесь (ссылка на первую версию сайта http://site.idpo.org)
Всего создание сайта – без загрузки материалов в Интернет – заняло 9 часов (с учётом того, что размещаемые материалы надо было обработать – например, удалить из них тестовые вопросы и т.п.)

3.12.10

Слайд 41

Временные затраты (1) 1 час – Разобрался, как создавать многочисленные страницы

Временные затраты (1)

1 час – Разобрался, как создавать многочисленные страницы через

файлы «карты сайта», сделал шаблоны трёх или четырёх страниц, научился оформлять красивые ссылки (т.е. без отображения полного веб-адреса в тексте).
2 час – Создал шаблоны всех необходимых страниц (11), полностью закончил отладку титульной страницы, страницы «Карта сайта» и первой из информативных страниц. Начал обрабатывать материалы к размещению с учётом требований системы UNIX.
3 час – В соответствии с требованиями оформлена страница по курсу «Экономическая политика». К сожалению, ряд файлов не удалось загрузить в систему, так как они превышают по размеру 2 Мб.
4 час – В соответствии с требованиями оформлена страница по курсу «Экономика Санкт–Петербурга» и страница полезных ссылок.

3.12.10

Слайд 42

Временные затраты (2) 5 час – Оформлена страница «Семинары для МЭ»

Временные затраты (2)

5 час – Оформлена страница «Семинары для МЭ» (реально

потрачено 1 час 20 минут), внесены мелкие исправления в другие страницы.
6 час – Оформлена страница «Мои публикации», начал оформление страницы «Макроэкономика–2». Открыл, что для тестовой загрузки файлов в систему необязательно пользоваться интерфейсом Википад, можно просто копировать файлы в нужную папку внутри системы.
7 час – Завершено оформление страницы «Макроэкономика–2».
8 час – Оформлены страницы по семинарам на юрфаке, факультете социологии, страница видеофайлов и расписания.
9 час – Изменено визуальное оформление (4 файла в папке PIC).
10–13 часы (точный хронометраж не вёлся) – адаптация материалов к серверу (нельзя закачивать файлы более 2Мб) и размещение на нем материалов.

3.12.10

Слайд 43

Поддержка сайта Включает: резервное копирование (по FTP-протоколу) регулярное обновление сайта просмотр

Поддержка сайта

Включает:
резервное копирование (по FTP-протоколу)
регулярное обновление сайта
просмотр счетчиков посещений
продвижение (при необходимости)

3.12.10

Слайд 44

Достоинства и недостатки подхода Плюсы Простота разработки и поддержки Быстрота при

Достоинства и недостатки подхода

Плюсы
Простота разработки и поддержки
Быстрота при редактировании страниц
Отсутствие необходимости

изучать дополнительный инструментарий и устанавливать сложные системы
Свободная лицензия
Минусы
Жесткость навигации и дизайна
Отсутствие базы данных

3.12.10

Слайд 45

Ваше мнение? Какие еще плюсы и минусы Вы видите в рассмотренном

Ваше мнение?

Какие еще плюсы и минусы Вы видите в рассмотренном подходе?
Будете

ли Вы использовать эту систему в своей практике? Почему?
Какими свойствами (функционалом) Вы бы предложили дополнить систему?

3.12.10