СДЕЛАЙТЕ СВОИ УРОКИ ЕЩЁ ЭФФЕКТИВНЕЕ, А ЖИЗНЬ СВОБОДНЕЕ

Благодаря готовым учебным материалам для работы в классе и дистанционно

Скидки до 50 % на комплекты
только до

Готовые ключевые этапы урока всегда будут у вас под рукой

Организационный момент

Проверка знаний

Объяснение материала

Закрепление изученного

Итоги урока

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

Категория: Информатика

Нажмите, чтобы узнать подробности

Просмотр содержимого документа
«Активизация службы Сайты. Создание структуры сайта»



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

Первый раз для активизации службы Сайты Google в аккаунте вам необходимо будет подтвердить свою учетную запись и пароль (справа) в ответ на дополнительный запрос.

На следующем экране нажмите кнопку Создать сайт и переходите к заполнению информационной анкеты о вашем сайте.

Комментарии к заполнению анкеты.

  1. Название сайта вводите по-русски — Сетевой электронный кабинет педагога1.

  2. Одновременно в следующей строке ввода: URL сайта, после общей для всех сайтов Google части в адресной строке: http://sites.google.com/site/ появится последовательность латинских символов, которые "будут идентичны" вводимому вами названию сайта на русском языке. Вы можете отредактировать этот текст, сократить, например, слишком длинную ссылку или привести к близкому переводу на английский язык.

В нашем случае получится: http://sites.google.com/site/ setevojelektronnyjkabinetpedagoga, понятно, что последнее слово в ссылке лучше откорректировать, например:

http://sites.google.com/site/onlineroomteacher

Обратите внимание, что Google перед тем, как создать ваш сайт, осуществляет проверку доступности определяемого вами имени, и если данная ссылка уже занята (не забудьте, что этими сервисами пользуются миллионы людей, может быть ктото уже до вас решил использовать выбранную вами последовательность символов), то вам сообщат, что:

Выбранное вами местоположение недоступно. Подробнее...

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

  1. В следующем поле вы можете ввести Описание сайта, которое в данном случае предназначено для регистрации в поисковых системах и каталогах. Из описания становится ясно, о чем сайт2. Это 2—3 предложения, включающие по возможности ключевые слова о:

сущности сайта;

содержании сайта и его основных разделах; отличии от других, аналогичных сайтов.

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

Иногда, создавая сайт, пользователи считают, что откроют сайт для общего просмотра после окончания основных работ, лишая себя тем самым возможности просмотра результата своей работы в режиме пользователя, а не в режиме редактирования автором. На самом же деле, формирующиеся ссылки при создании сайта службой Сайты Google не слишком просты и удобны. Фактически, пока вы сами не захотите, ваш сайт не будет легко найден пользователями и, соответственно, часто посещаем в сети. Зато выиграете вы в удобстве редактирования сайта, запуская, например, одновременно два разных браузера: один для редактирования сайта, а другой для просмотра. Можно на время редактирования открывать общий доступ, а перед выходом из своего аккаунта закрывать его.

Мы выберем Общий доступ с возможностью просмотра любым пользователем.

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

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

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

Итак, нам пришлось изменить последнее слово в ссылке имени сайта, еще раз ввести кодовое слово, и вот перед нами открывается Главная страница нашего сайта (рис. 11.1), которая состоит из четырех областей:

заголовка сайта, автоматически включающего поле Поиск по сайту;

боковой панели, состоящей из панели навигации, истории редактирования и, возможно, добавленных текстовых гаджетов;

содержания страницы;

нижнего колонтитула для приложений и ссылок сайта.

Рис. 11.1. Первый вход в режим редактирования сайта

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

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

В адресной строке браузера вы видите URL своего сайта (окончательный вариант у нас: http://sites.google.com/site/onlineroomteacher/).

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

Рис. 11.2. Вход в режим редактирования сайта

П роверьте себя!

  • Зарегистрируйтесь в службе Сайты.

  • Создайте свой сайт.

Теперь приступим к формированию структуры сайта, соответствующей описанию выше: 6 страниц — 1-го уровня (включая главную страницу), в двух из них есть вложенные страницы (иначе подстраницы) — 2-го уровня.

Предлагаю вам действовать в следующей логике: сначала создать все страницы 1-го уровня, затем перейти к созданию страниц 2-го уровня.

Создание страниц 1-го и 2-го уровней

К Главной странице — первой, автоматически создаваемой странице 1-го уровня, следуя структуре нашего сайта, необходимо добавить еще 5 страниц. Например:

Новости из жизни школы и класса;

Актуальные вопросы;

Банк учителя;

Родителям на заметку; Наши достижения.

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

Комментарии к созданию страницы

  1. Из предложенных шаблонов3 выбираем шаблон: Веб-страница.

  2. Вводим название страницы на русском языке: Новости из жизни школы и класса.

  3. Ниже будет сообщено, по какому адресу автоматически размещается новая страница, учитывайте, что адрес достаточно длинный, на экране приводится только последняя часть:

Ваша страница будет расположена по адресу:

/site/onlineroomteacher/novosti-iz-zizni-skoly-i-klassa.

Как вы понимаете, последняя часть этой ссылки сформировалась автоматически как латиница слов "Новости из жизни школы и класса". Конечно, вы можете, перейдя по ссылке Изменить, откорректировать этот адрес.

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

В данном случае, мы будем добавлять страницы на верхний уровень, т. е. отметим Поместить страницу на верхний уровень.

  1. Осталось нажать кнопку Создать страницу.

Обратите внимание, что практически все ваши команды во время их выполнения сопровождаются контекстными сообщениями, которые появляются в строке служб Google (верх экрана) на желтом фоне, например, .

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

  1. После создания новой страницы вы сразу попадаете в режим ее редактирования. Другой путь в этот режим из режима редактирования сайта — по кнопке Редактировать страницу

(см. рис. 11.1).

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

  2. Обратите внимание, что новая страница должна автоматически появиться на левой панели навигации. Если это так, то достаточно сохранить изменения, перейдя тем самым в режим редактирования сайта, и точно так же добавить остальные страницы первого уровня. Не обращайте внимания, если страницы размещаются на боковой панели не в том порядке, как нам необходимо, исправить это можно, перейдя по ссылке Изменить боковую панель (рис. 11.3).

  3. Созданная страница может не появиться на боковой панели, где так и осталось только 2 страницы (Главная страница и Карта сайта), несмотря на то, что вы попали в режим редактирования новой страницы. Откройте Карту сайта и убедитесь, что страница была создана, иначе придется вернуться назад и снова создать нужную страницу. Если страница создана, но ее нет в окне навигации, то ее необходимо самим добавить в окно навигации. Для этого перейдите по ссылке Изменить боковую панель, которая приведет вас в раздел Макет сайта системы управления сайтом4.

Рис. 11.3. Результат создания страницы. Режим редактирования страницы

Настройка навигации

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

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

В окне Настроить навигацию должен быть установлен флажок

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

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

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

Осталось установить определенный порядок вывода страниц на боковую панель, что нетрудно сделать, зафиксировав какую-либо страницу, и с помощью кнопок-стрелок и переместить ее на нужное место (вернемся к настройке навигации сайта (см. рис. 11.4)). Лишнюю страницу можно удалить, зафиксировав ее и нажав кнопку .

В дальнейшем мы будем только так настраивать вложенные страницы. Здесь указывает на вложение страницы в предыдущую стрелка вправо , стрелка влево поднимает на уровень выше зафиксированную страницу.

Обратите внимание, именно в этом окне вы либо оставляете флажок ссылки Карта сайта на ее размещение в окне навигации, либо можете его убрать.

Закончив настройку навигации, не забудьте нажать кнопку OK, тем самым вы возвращаетесь в окно оформления сайта Макет сайта, которое видно на заднем плане (см. рис. 11.4).

Перед тем как покинуть окно настройки навигации, можете снова выставить флаг Автоматически генерировать дерево навигации, который мы недавно убрали, чтобы настроить порядок вывода страниц на боковую панель. Сейчас же мы его вернем для того, чтобы страницы 2-го уровня автоматически отобразились в окне навигации после их создания, порядок которых потом вы сможете настроить. Кстати, вы заметили, сколько уровней будет отображаться при выборе автоматической организации? Должно быть по умолчанию 2, если вам нужно больше, установите заранее нужное значение.

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

Создание страниц 2-го уровня

Страницы 2-го уровня вложены в уже созданные страницы. Зафиксировав на боковой панели в окне навигации страницу, имеющую вложенные, например Актуальные вопросы, можно приступать к уже отработанной процедуре создания страниц.

  1. Нажмите кнопку Создать страницу.

Шаблон — Веб-страница.

Введите название страницы, отметьте ее расположение — Разместить под страницей (рис. 11.5).

  1. Нажмите кнопку Создать страницу.

Рис. 11.5. Создание страницы 2-го уровня

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

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

Если страницы второго уровня не появились на боковой панели, значит, вы забыли выставить флажок Автоматически генерировать дерево навигации. Это можно исправить, внеся их на боковую панель так же, как было сделано ранее на примере страниц 1-го уровня:

  1. Щелкнуть по ссылке Изменить боковую панель.

  2. В окне навигации щелкнуть по ссылке изменить.

  3. Щелкнуть по ссылке Добавить страницу.

  4. Зафиксировать нужную страницу, нажать кнопку OK.

  5. Поднять с помощью кнопки страницу к ее родительской странице.

  6. Нажать кнопку (указывает, что страница вложена).

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

Выйдя из окна настройки навигации сайта, остается подтвердить сделанные изменения так же, как делали ранее:

  1. Нажать кнопку OK.

  2. Нажать кнопку Сохранить изменения.

  3. Щелкнуть по ссылке « Вернуться на сайт.

Убедитесь, что на боковой панели появились вложенные страницы. Точно так же добавляем вложенные страницы в другие страницы 1-го уровня.

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

Вы создали лишние страницы, которые могут появиться в окне навигации, а могут там не появиться. Однако эти страницы все равно видно на карте сайта, следовательно, их обязательно нужно убрать! Сделать это просто (рис. 11.6):

перейдите на лишнюю страницу, которую нужно удалить (зафиксируйте ее);

откройте меню Дополнительные действия; выберите операцию Удалить страницу.

Рис. 11.7. Окно навигации до и после настройки порядка указания страниц в меню

Как вы ни старались, но страницы в окне навигации выводятся не в том порядке, как надо (рис. 11.7). Исправить несложно. Повторим еще раз:

щелкните по ссылке Изменить боковую панель;

во фрейме Навигация щелкните по ссылке изменить;

сбросьте флажок Автоматически генерировать дерево навигации и переместите окно Настроить навигацию вверх;

выберите страницу, зафиксируйте ее щелчком левой кнопки мыши;

переместите страницу, используя кнопки-стрелки и , устанавливая нужный порядок (это касается как страниц 1-го уровня, так и 2-го);

нажмите кнопку OK;

нажмите кнопку Сохранить изменения; щелкните по ссылке Вернуться на сайт.

Страницы 2-го уровня в окне навигации не совпадают со страницами 2-го уровня на карте сайта. Неприятная ошибка, которую надо исправить:

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

зафиксируйте страницу 1-го уровня, подстраницу которой нужно создать;

создайте вложенную страницу;

назовите новую страницу;

добавьте страницу в окно навигации (см. ранее).

Мастер создания боковой панели навигации сайта позволяет включить ссылки на внешние страницы. Возвращаясь к оформлению навигации (см. рис. 11.4), обратите внимание на ссылку Добавить URL, переход по которой откроет вам окно для ввода URL-адреса сайта и текста, закрепляемого за этой ссылкой (рис. 11.8).

Щелкнув по кнопке OK, вы добавляете еще одну страницу на панель навигации. Эту страницу можно так же, как и все остальные, перемещать относительно других уже описанным ранее способом.

Рис. 11.8. Дополнительная ссылка на сайт школы, размещенная на боковой панели

П роверьте себя!

  • Перейдите в режим редактирования сайта.

  • Создайте несколько страниц 1-го уровня в соответствии с на-значением вашего сайта.

  • Хотя бы у одной страницы 1-го уровня создайте подстраницы.

  • Оформите панель навигации, сравнивая уровень страниц с кар-той сайта.

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



1 Поскольку сервисы Google изменяются, возможно, у вас не получится ввести такое длинное название. Например, на момент работы над книгой длина имени была ограничена 30 символами. Поэтому вводите имя, исходя из реальных условий. — Ред.

2 Вукс Татьяна. Каким должно быть описание сайта./ Студия дизайна S-Corp http://www.nundesign.com/st/10.html, сентябрь 2009.

3 Выбор шаблона можно в дальнейшем изменить.

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