Козодой Маргарита Валентиновна

С целью облегчения организации Единого урока  подготовилен видеоурок.

Вы можете запустить его как на сайте, так и скачать. Ссылка для скачивания (mp4.3,3 Гб).

В данном мастер-классе мы научимся создавать фотографии в красивых  рамочках, используя портал «Одноклассники». В разделе «Игры» этого портала есть очень полезное приложение, которое называется «Вебка».

1. Заходим на сайт Одноклассники, используя свой логин и пароль. Читать далее →

Я, Козодой (Ватагина) Маргарита Валентиновна, родилась 10 февраля 1966 года в п. Уста Уренского района  Нижегородской (Горьковской) области. 1 сентября 1973 года поступила в 1 класс. В 1983 году закончила Варнавинскую среднюю школу и поступила в Горьковский Государственный институт иностранных языков им. Н.А.Добролюбова на факультет английского и немецкого языков.

В 1988 году  закончила институт и приехала по распределению в Варнавинский район. С 1988 по 1990 годы работала заведующей отделом по учащейся молодежи, секретарем Варнавинского РК ВЛКСМ. Потом до 1996 года в Варнавинской средней школе учителем английского языка. Позже, после окончания спецфакультета психологии, получив специальность практического психолога в системе образования, работала в Варнавинской школе практическим психологом.

В 1997 году переехала жить в Санкт-Петербург, где работала учителем английского языка в школе № 37 (689) Приморского района г. Санкт-Петербург. В 2000 году вышла замуж и сменила фамилию на Козодой. Имею двоих детей (сыновей) Андрея (2004 г.р.)  и Дмитрия (2005 г.р.). В 2009 году прошла переподготовку в ЛИМТУ при ИТМО по специальности «Специалист в области компьютерной графики и Web-дизайна.

В 2010 году вернулась на постоянное местожительства в п. Варнавино. В настоящее время работаю в управлении образования методистом по информатизации.

В этом шаге мы отредактируем и отформатируем оставшиеся страницы нашего сайта.

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

Посмотрите видеоролик «Знакомство со структурой сайта» .

Теперь вы должны продумать структуру Вашего сайта-портфолио. Создайте новые страницы и добавьте в них небходимую информацию.

Одна из страниц должна быть посвящена Вашим наградам. 

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

Вообще говоря, можно с Вашими грамотами поступить проще. Загрузить их все в google. То есть, создать на google альбом «Грамоты», загрузить туда все сканы своих наград, а на сайте на главной странице дать ссылку на альбом. Выглядеть все будет примерно так. Не удивляйтесь, вместо грамот Вы увидите кучу штендеров с солдатами Великой Отечественной войны. Это альбом одной из команд из другого моего проекта «Бессмертный полк». У Вас будут вместо штендеров сканы грамот и дипломов.

Такой  вариант размещения даже предпочтительней. Google разрешает грузить 4 Гб информации на диск. А ссылка на альбом не займет много места на диске.

Еще один способ предъявления грамот — это создание фотогаллереи. Предлагаю посмотреть небольшой видеоурок по созданию фотогаллереи на сайте.

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

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

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

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

В таблице продвижения  должны появиться ссылки  на ресурс даже у очень скромных участников мастер класса.

Удачи всем в доработке своего сайта!!!

Вопросы можно задать здесь в комментариях, или по телефону 89524744118.

В этом шаге мы поменяем фотографии на свои и научимся работать с файловым менеджером.

Чтобы его вызвать, достаточно нажать на любое изображение на сайте:

Сейчас в папке «Изображения» три файла. Они нам не нужны, их можно удалить.

Контекстное меню

Контекстное меню файла вызывается при нажатии правой кнопкой мыши на файл, контекстное меню раздела — при нажатии на пустое место внутри раздела. Все действия, доступные в контекстном меню подписаны и интуитивно понятны.

Контекстное меню файла:

Контекстное меню раздела:

Основные функции файлового менеджера:

Добавление файлов на сайт (Загрузка файлов в файловый менеджер):

Загрузить файл на сайт можно при помощи контекстного меню или основного меню файлового менеджера, нажав на кнопку «Загрузить файлы» с иконкой   . После нажатия на данную кнопку появится следующее окно:

Далее вы можете либо нажать на кнопку «Выбрать файлы для загрузки», либо «перетащить» файлы со своего компьютера в данное окно. При нажатии на кнопку «Выбрать файлы для загрузки» возникает стандартное окно для выбора файлов (можно выбрать как 1 файл, так и несколько). Ограничения на загрузку файлов:

Максимальное число файлов для одновременной загрузки 21.
Максимально допустимый размер для загружаемого файла: 30 Мегабайт.
Максимально допустимый размер изображения: 2 Мегабайта.
Допустимые форматы файлов для загрузки: gpx, txt, doc, docx, xls, xlsx, ppt, pptx, pps, ppsx, odt, sxw, ods, odg, pdf, csv, html, tpl, xsl, xml, zip, rar, 7z, tar, gz, tar.gz, rtf, chm, ico, jpg, jpeg, gif, png, bmp, psd, flv, mp4, swf, mp3, wav, wma, ogg, aac.
Выбор файла для использования:

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

Примечание: Если во время нажатия данной кнопки не будет выбран ни один файл, то поле для файла будет пустым.

Создание папок

Создать папку можно при помощи контекстного меню или основного меню файлового менеджера, нажав на кнопку «Новая папка» с иконкой  .

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

Теперь давайте вставим свои фото в наш шаблон. Нам понадобится одно фото приличного качества и размером не более 30 Мб. Лучше сразу приготовить два фото нужного размера (473 на 640 пикселей и 960 на 229 пикселей).

Помните, что в нашем распоряжении всего 100 Мб пространства на диске, поэтому, чем меньше объем файла, тем лучше.

1. Вызываем файловый менеджер, щелкнув по фото на странице, нажимаем кнопку «Загрузить» внизу и выбираем файл. Ждем, пока он загрузится.

2. Нажимаем кнопку «Выбрать» и файл встает на место фотографии, по которой мы щелкали вначале.

3. Эти же шаги проделываем со второй фотографией.

4.  Сохраняем результат.

5. Теперь из файлового менеджера удалим старые фотографии, чтобы они не занимали место.

Закрываем файловый менеджер. Любуемся результатом.

6. Осталось только подредактировать текст в новостных блоках.

Для этого перейдите на страницу «Новости».

Две новости можно удалить. Щелкаем «Редактировать», наводим мышку на новость. Сам блок окрашивается в голубой цвет, а справа появляется красный крестик. Если перевести мышку на  него, появится надпись «Удалить новость». Нажимаем крестик, новость удалена. Также поступаем со второй новостью.

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

Вот что получилось у меня: http://mivanova.umi.ru/novosti/

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

Перейти к шагу 8.

Вернуться к стартовой странице мастер класса.

Напомню, в прошлом шаге мы создали сайт и зашли в панель управления.

Предлагаю посмотреть ролик с обзором панели управления сайта Umi.ru

Давайте сейчас посмотрим, что мы имеем на данный момент в панели управления нашего сайта.

У нас выбран тип сайта «Сайт специалиста» (1). Шаблон можно поменять, но сейчас мы этого делать не будем.

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

И самая важная  кнопка в панели управления (зеленая): «Редактировать сайт» (3). С ее помощью мы сейчас будем вносить нашу информацию.

1. Жмем кнопку «Редактировать сайт». Попадаем на наш сайт ,жмем кнопку «Редактировать» вверху или клавишу F2 на клавиатуре:

2. Теперь все блоки, которые доступны для редактирования, видны в прямоугольничках, состоящих из точек. Последовательно щелкая по каждому из них, меняем информацию на свою. Я заменила фамилию, имя, отчество, телефон. Вместо слов «Преподавание и репетиторство» пишем свой предмет. Вместо часов  работы я ввела «Учебный сайт-портфолио…».

3. Далее меняем информацию в блоке «Главная». Здесь нужно вставить все личные данные о себе. Какую информацию нужно вводить? Мы будем руководствовать требованиями к интернет-ресурсу при аттестации.

Вот пример страницы персонального сайта-портфолио учителя начальных классов.

Думаю, Вы обратили внимание на панельку, которая всплыла после того, как мы установили мышку в блок «Главная»? Она похожа на панель в программе Word, поэтому подробно на ее кнопках останавливаться не будем.

4. Теперь редактируем названия страниц слева. Страницу «Новости» я оставлю. Вместо «Услуги» наберу «Грамоты и дипломы», вместо «Цены» — «Методическая работа», вместо «Контакты» — «Повышение квалификации».

5. Теперь важно сохранить все изменения, которые мы внесли. Для  этого нажимаем на кнопку «Сохранить» вверху. Она появляется вместо кнопки  «Редактировать». Появится маленькое окошко, где будет написано, сколько изменений внесено и сколько сохранено. Нажимаем ОК.

Все, основные изменения мы внесли. Теперь мы будем менять страницы, которые мы обозначили слева. На скриншоте чуть выше видны все изменения, которые мы уже внесли в шаблон.

В таблице продвижения втавьте ссылку на Вашу страницу. Скопируйте ее из адресной строки.

Перейти к шагу 7.

Вернуться к стартовой странице мастер класса.

В этом шаге мы начинаем создавать наш сайт — портфолио. Для начала нам нужно пройти регистрацию на сайте Umi.ru

Переходим по ссылке на сайт и жмем большую красную кнопку «Создать сайт сейчас»:

В появившемся диалоговом окне вводим

(1) Имя сайта сайта. Например, это может быть Ваша фамилия, набранная латиницей, или инициалы, или любая другая комбинация букв. которую будет легко набрать.

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

(3) Жмем кнопку «создать сайт»:

Теперь нам нужно выбрать тип сайта и дизайн.

Данный сервис позволяет создать неколько типов сайтов: сайт специалиста, сайт компании, лендинг (специальная рекламная страница) и интернет-магазин. нас интересует сайт специалиста (1). Далее выбираем дизайн (я выбрала сферу «Образование (2).

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

Вкладка «Образование» предлагает 10 шаблонов сайтов: два шаблона сайта учителя, сайт кафедры ВУЗа, студенческой группы, няни-гувернантки и т.д.

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

Потом можно будет поменять шаблон.

Вся информация, которую вы разместите к тому времени на своем сайте, останется там. Выбираем «Сайт учителя», к примеру:

Появляется маленькое диалоговое окно: «Вы создаете сайт специалиста. Дизайн «Сайт учителя». Соглашаемся, нажав «Да».

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

Если вы все сделали правильно, Вас перенаправят в панель управления сайтом. Я Вас поздравляю, Ваш сайт создан и теперь его нужно заполнять!

В таблице продвижения в этом шаге поставьте статус «Выполнено». Если есть проблемы, можете написать о них в комментариях к этому шагу. Не забудьте только указать Ваши ФИО.

Успехов Вам в работе!!!

Вернуться к программе мастер класса.

Редактирование информации на сайте. 

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

Хочу отметить, что почти у всех бесплатных платформ есть платные варианты. Дав Вам возможность попробовать бесплатный вариант, Вам  могут предложить перейти на платный. Чаще это носит рекомендательный характер. Например, вы нажимаете на ссылку «убрать рекламу», а Вам выводят сообщение,что это возможно только на платном тарифе. Иногда Вас вынуждают переходить с бесплатного на платный тариф, дают какое-то время на раздумья, а потом блокируют сайт. Это минус бесплатных хостингов. Так было, например, с сайтами  на samomu. Многие официальные сайты школ нашего района переехали на другие хостинги за последние полтора года, потому что им предложили перейти на платный тариф, весьма недешевый.

Тем, кто решил создавать сайт-портфолио на платном хостинге, я рекомендую Timeweb. Тарифы здесь намного дешевле, чем у других хостеров. Панель управления очень удобная, редактор страниц интуитивно понятен и дает очень много возможностей для форматирования текстов. Техподдержка работает что называется 7/24 (то есть семь дней в неделю, 24 часа в сутки). Высокая скорость загрузки страниц, стабильная работа сайтов. У меня было несколько сайтов на разных хостингах, сейчас я перевела все свои платные сайты сюда и  очень довольна. Могу иметь пять сайтов по цене одного. Все, что свыше, оплачивается отдельно.

Поэтому , с теми, кто решит создавать свой сайт-портфолио на платном хостинге, мы будем создавать их именно здесь…

На этом теоретическая часть нашего семинара закончена.

Задание к шагу 4

В комментариях к этому посту я прошу Вас ответить на два вопроса:

1. Насколько полной, интересной и полезной для Вас была информация, изложенная в шагах 1-4.

2. Какой информации, на Ваш взгляд, не хватает в теоретичекой части мастер класса?