Создаем и обустраиваем сайт ДОУ © Склемина Галина Александровна, начальник отдела информационных технологий МОУ «Учебно- методический центр» г. Балаково. - презентация

1 Создаем и обустраиваем сайт ДОУ © Склемина Галина Александровна, начальник отдела информационных технологий МОУ «Учебно- методический центр» г. Балаково Саратовской области, 2010 г.

2 Адрес электронной почты Пароль к сайту УМЦ

3 Так выглядит вебтоп – место из, которого можно управлять сайтами

4 Важно!!!!! На этом этапе Вам будет предложено создать пароль для входа в админчасть сайта. Этот пароль должен отличаться от того пароля, который Вы использовали для входа на платформу. Зафиксируйте этот пароль в регистрационной бумажной форме (которую вам раздали на семинаре) в графе Пароль для входа в админ.часть. Этот пароль будем в дальнейшем называть паролем администратора сайта. Текущим паролем будем называть тот, который вы записали в графу Пароль для входа на сайт.

5 Открываем кнопку с надписью U. Откроется меню, в нем выбираем пункт Сайты, в нем Создать сайт

6 Далее нужно вписать в окошко пароль, который Вы создали на этапе входа в вебтоп и нажать на кнопку Подтвердить

7 Здесь ставим курсор после и дописываем dou7balakovo, вписываем код безопасности, ставим галочку в окошке около фразы Согласен с правилами хостинга и жмем на Продолжить

8 Если все сделано правильно, то Вы увидите вот такое окно. Здесь нужно будет нажать на кнопку Панель управления сайтом

9 Затем Вас перенаправят на такую страницу. В поле название сайта напишите краткое название Вашего ДОУ и нажмите на кнопку Выбрать дизайн

10 Пролистываем шаблоны здесь Рекомендуется использовать шаблоны 804, 819, 999, 963, 946, 933, 886, 771, 161, 371, 441 Шаблон выбрать просто: нажмите на картинку.

11 Здесь нажмите на Ок

12 Здесь нажмите на кнопку Продолжить

13 Подключаем необходимые модули (остальные будем постепенно подключать по мере продвижения в семинаре) Нам будут нужны на первое время: Редактор страниц Фотоальбомы Новости сайта Почтовые формы. Проставьте галочки в квадратиках около этих модулей Проставили галочки, жмем на Продолжить

14 Вас перенаправят на панель управления сайтом. Именно отсюда в дальнейшем вы будете управлять сайтом: добавлять страницы, подключать дополнительные модули, категории, форумы и пр. Поработаем сначала с Редактором страниц. Жмем на надпись Редактор страниц

15 В этом блоке нам пока нужно будет только Управление страницами сайта. Жмем на эту надпись

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

17 Безопасность превыше всего ! Поэтому заполняем форму входа и не раздражаемся Ваш электронный адрес (в таблице записан в графе Логин для входа на сайт) Текущий пароль (еще раз напомню, что так будем называть пароль, который у Вас записан в графе Пароль для входа на сайт) Все заполняем и жмем на Вход

18 Защитный код (могут попросить, а могут и нет, все зависит о того как быстро Вы выполняете отдельные шаги

19 Вот так выглядит «заготовка для любой страницы сайта. Рассмотрим ее более детально. Здесь впишем название страницы, оно будет отображаться в меню, поэтому не должно быть длинным и «некрасивым» Панель редактиров ания (подробно описана на следующем слайде) Текст страницы Кнопка сохранения изменений, внесенных в страницу

20 Панель редактирования Кнопка предварительного просмотра Вставка объекта из буфера обмена Кнопки Отменить и Повторить (действуют аналогично кнопкам в Word) Выбор цвета шрифта Выбор цвета для выделения текста Настройка ссылок на сайты и файлы Вставка картинок в страницу Вставка флэш-роликов Вставка и редактирование таблиц соответственно Вставка специальных символов Горизонтальная линия Удаляет все со страницы Отменяет форматирование (цвет, размер, тип шрифта) Редактирование html-кода (пока нам не понадобится) Эти кнопки очень похожи на кнопки в Word, поэтому не комментирую

21 Заполните страницу по приведенному образцу: укажите почтовый и электронный адреса, опишите схему проезда. Можно использовать рассмотренные кнопки для того, чтобы сделать текст более привлекательным. Все написали? Тогда жмите на кнопку Сохранить

22 Если все сделали правильно, то увидите вот такую картинку. Можно нажать на ссылку Перейти на страницу и полюбоваться результатами Вы сможете просмотреть страницу так как ее будут видеть другие посетители. Откроется она в новом окне или новой вкладке. Следите за тем, чтобы одновременно не было открыто много окон и вкладок, это будет тормозить работу компьютера. Лишние (те с которыми не работаете) закрывайте.

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

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

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

26 Нажмите на кнопку для вставки изображения (см. 20 слайд). Откроется такое окно. Жмем на папку. Кстати, картинку заранее нужно найти и сохранить на компьютере (можно поискать в интернете)

27 После этого откроется новое окно. С помощью кнопки Обзор находим нужную картинку на компьютере и жмем кнопку Загрузить файл.

28 Как только файл загрузится в систему, вы увидите его в списке, строка, в которой он описан будет выделена желтоватым цветом. Нажмите на имя файла

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

30 Вот какая красотища получилась ! Но нужно работать дальше. Переходим из меню на страницу Главная страница

31 Пишем первую новость. Для этого жмем на ссылку Добавить новость

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

33 Для начала сделано немало. Подведем итоги: Сайт зарегистрирован. Созданы 4 блока: Стартовая страница, Новостной блок, Страница с контактной информацией. Что еще нужно сделать? Вписать адрес сайта в таблицу (вот ее адрес Frkp1NZGNzd3JuczhfNjA1Z3g0Y3Z6Z2Y&hl=ru &authkey=CIOz0LAP)

34