Создание структуры сайта.

На прошлой странице был создан сайт и после его создания мы попали на страницу, вид которой показан ниже. Можно также войти на страницу по адресу: https://sites.google.com/site/abcsaitg/.

Но сайт не имеет информации, так как мы его пока не заполнили. Сверху находится надпись, которую мы указали ранее в названии сайта. Главная страница – это та страница, на которую попадает пользователь, указав адрес сайта.

Сначала создадим структуру файлов. Предположим, что мы имеем два файла, на которые имеются ссылки с главной страницы (Zap, Struct) и одна (Em), на которую имеется ссылка с файла Zap.

Сверху окна справа имеются три кнопки с режимами.

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

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

Теперь создадим страницу Em, ссылка на которую происходит со страницы Zap, которую мы только что создали. Щелкнем по кнопке Создать страницу.

В Названии укажем имя страницы (Em) и переключатель установим Разместить под страницей «Zap», так как ссылка на новую страницу произойдет со страницы Zap.

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

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

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

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

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

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

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

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

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

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

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

Далее перенесем боковую панель слева направо. Для этого нажмем на кнопку Дополнительные действия, которая находится слева экрана и в появившемся табло выберем режим Управление сайтом.

В появившемся окне щелкнем по надписи Макет сайта.

Далее нажмем на кнопку Изменить оформление сайта.

В появившемся окне в отделе Боковая панель установим переключатель справа, нажмем на кнопку ОК и далее на кнопку Сохранить изменения и далее на надпись Вернуться на сайт.

Теперь изменим цвет фона. Снова нажмем на кнопку Дополнительные действия, которая находится слева экрана и в появившемся табло выберем режим Управление сайтом. Далее нажмем на надпись Цвета и шрифты.

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

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

Вся страница

Цвет фона страницы

Фоновое изображение страницы

Фоновое изображение оболочки страниц

Шрифт страницы

Цвет ссылки на страницу

Цвет ссылки на посещенную страницу

Заголовок сайта

Шрифт названия сайта

Размер шрифта названия сайта

Цвет заголовка сайта

Цвет фона заголовка сайта

Фоновое изображение заголовка сайта

Область содержания

Шрифт текста содержания

Размер шрифта текста содержания

Цвет текста содержания

Шрифт названия содержания

Размер шрифта названия содержания

Цвет заголовка содержания

Шрифт заголовков содержания

Цвет фона содержания

Фоновое изображение содержания

Гаджеты области содержания

Шрифт названия гаджета содержания

Размер шрифта названия гаджета содержания

Шрифт гаджета для содержания

Цвет текста гаджета для содержания

Цвет ссылки на гаджет для содержания

Цвет фона гаджета для содержания

Цвет текста заголовка гаджета для содержания

Цвет фона заголовка гаджета для содержания

Фоновое изображение заголовка гаджета для содержания

Цвет строчного делителя гаджета для содержания

Гаджеты боковой панели

Шрифт гаджета боковой панели

Шрифт названия гаджета боковой панели

Размер шрифта названия гаджета боковой панели

Цвет текста гаджета боковой панели

Цвет ссылки для гаджета боковой панели

Цвет фона гаджета боковой панели

Цвет текста заголовка для гаджета боковой панели

Цвет фона заголовка для гаджета боковой панели

Фоновое изображение заголовка для гаджета боковой панели

Цвет строчного делителя для гаджета боковой панели

Гаджет навигации

Фон текущей страницы в разделе навигации

Цвет текста текущей страницы в разделе навигации

Горизонтальная навигация

Шрифт элементов горизонтальной навигации

Цвет текста элементов горизонтальной навигации

Цвет текста элементов горизонтальной навигации при наведении на них курсора

Цвет фона элементов горизонтальной навигации

Цвет фона элементов горизонтальной навигации при наведении на них курсора

Цвет текста выбранных элементов горизонтальной навигации

Цвет фона выбранных элементов горизонтальной навигации

Раскрывающееся меню горизонтальной навигации

Цвет текста раскрывающегося меню горизонтальной навигации

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

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

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

Для того, чтобы в дальнейшем просматривать статистику посещений сайта, сначала зайдем на страницу Google Analytics по адресу http://www.google.com/analytics/.

Нажмем на кнопку Доступ к Google Analytics. Укажем пароль нашего аккаунта и нажмем на кнопку Регистрацию.

Заполним поля регистрации.

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

Зайдем на главную страницу нашего сайта, и снова перейдем в режим Управления сайтом в режим Общие. На появившейся странице изменим Название сайта, так как предыдущее было слишком длинным и в блоке Статистика включим переключатель Включить Google Analytics для этого сайта, а в поле ниже вставим недавно полученный номер. Скопируем код, который мы получили ранее и который находится в буфере обмена в поле Проверка инструментов Google для веб-мастеров.

Сохраним изменения и перейдем на главную страницу сайта.

Осталось вставить перекрестные ссылки. Для этого перейдем в режим редактирования и выделим текст, который будет ссылкой. Затем нажмем на кнопку ссылка.

В появившемся окне щелкнем на страницу, на которую нужно сделать ссылку (Zap) и щелкнем на кнопку ОК. Точно также создадим и другие ссылки.

Наконец, уберем в боковой панели меню. Для этого в режиме редактирования щелкнем по надписи Изменить боковую панель.

В появившемся окне нажмем на надпись удалить под названием Навигация. После этого Сохраним изменения.

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

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

О↙О↘О↙О↘О↙О↘О↙О↘О↙О↘О↙О↘О↙О↘О↙О↘О