Материал опубликовал

Россия, Камчатский край, село Соболево

#11 класс #Информатика и ИКТ #Учебно-методические материалы #Методические указания и рекомендации #Все учителя #Школьное образование #УМК И. Г. Семакина

Методические рекомендации «Создание персонального сайта на платформе "Google-сайт"»

Создание персонального сайта на платформе «Google-сайт»

Морозов Александр Игоревич

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

Проанализировав различные платформы по созданию сайта, я пришел к выводу, что самой подходящей и легкой в освоении является платформа «Google-сайт».

Анализ существующих платформ

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

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

Особенности конструкторов1:

Настройки SEO. Многие конструкторы предлагают фирменные инструменты, позволяющие продвигать сайт. Благодаря этому можно сэкономить не только на разработке, но и на продвижении.

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

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

Экономия. Можно сэкономить как на разработчиках, так и на хостинге.

Последнее, о чем стоит упомянуть перед обзором популярных конструкторов, – это их стоимость. Чаще всего услуги предоставляются с ежемесячной оплатой, которая в среднем составляет 500 рублей. Есть и бесплатные тарифы с урезанным функционалом, но на них создать продающий сайт не получится.

Обзор лучших конструкторов сайтов

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

Craftum2

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

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

Другая особенность – это стоимость, которая на порядок ниже, чем у конкурентов. Кроме того, при оплате за год клиент получает бесплатный домен в зоне .ru и .рф.

Преимущества:

Удобный и понятный интерфейс. Многостраничный сайт можно сделать всего за час!

Более 270 готовых шаблонов и блоков на любой вкус.

Дизайн-блок, который позволит создать уникальный шаблон.

Огромная коллекция шрифтов, стоковых картинок и иконок. Все в одном месте!

Автоматическая адаптивная верстка сэкономит вам уйму времени при создании сайта и его оптимизации для поисковой системы Google.

Возможность вставить свой HTML-код.

10-дневный тестовый период.

Автоматическая установка SSL-сертификата. Вам вообще не нужно думать о настройке защищенного соединения.

Недорогой тарифный план + домен в подарок за годовую подписку.

Стоимость: 169 рублей в месяц.

Официальная страница: Craftum

WIX

WIX3 – это один из самых популярных в мире конструкторов сайтов. Он отлично подходит как для простых лэндингов, так и для полноценных интернет-магазинов – на его основе было создано более 175 миллионов различных сайтов.

Главная особенность – создание базы данных и программирование поведения элементов в зависимости от заданных условий, что отлично подойдет как для новичков, так и для профессиональных веб-дизайнеров. Wix предоставляет доступ к более чем 500 шаблонам сайтов, базовые варианты легко адаптируются под мобильные устройства. Еще одна особенность – WIX ADI, с помощью которой конструктор сам может собрать сайт на основе введенных данных.

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

Преимущества:

Возможности конструктора позволяют создать практически любой сайт, но если нужно сделать что-то уникальное, то всегда можно добавить собственный HTML- или JS-код.

Доступ к таким функциям, как Wix ADI, Ascend, Code, Arena.

Есть встроенная CRM, с помощью которой можно выстраивать грамотный диалог с пользователем.

Отлично подходит для туристических, гостиничных и ресторанных сайтов.

Богатый набор всевозможных шаблонов под разные задачи.

Стоимость: от 90 рублей/месяц.

Ukoz4

Ucoz – это один из первых конструкторов на территории России. Он был разработан в 2005 году и за свою карьеру взрастил много веб-разработчиков. Спустя 16 лет движок заметно развился: с помощью Ucoz можно создать интернет-магазин, блог, портал, форум, сайт-визитку или лэндинг.

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

Преимущества:

Бесплатный тариф предоставляет возможность использовать доменное имя второго уровня.

Более 300 бесплатных и 500 платных шаблонов разных уровней.

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

Есть возможность добавить свой код, который легко редактируется через FTP.

Недостатки:

Создать уникальный и конкурентоспособный сайт можно только со знаниями CSS и HTML.

Сложно разобраться в интерфейсе конструктора.

Стоимость: есть бесплатный тариф, платные начинаются от $2.99.

Официальная страница: Ucoz

uKit5

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

Из начинок – более 400 адаптивных шаблонов, встроенный магазин, калькулятор услуг, CRM, новостная лента, набор маркетинговых инструментов и многое другое.

Преимущества:

uKit довольно прост в освоении.

Интеграция с такими сервисами, как amoCRM и SendPulse.

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

Отличная техподдержка, готовая всегда прийти на помощь.

Есть 14-дневный пробный период.

Стоимость: от $5 в месяц.

Официальная страница: uKit

Tilda6

Один из героев нашего времени в сфере разработки сайтов – Тильда. Лэндинг, многостраничный сайт, интернет-магазин – все это можно сделать как на основе шаблонов, так и с помощью инструмента «Zero-Block». Он позволяет конструировать страницы сайта своими руками и вставлять в них текст, кнопку, видео, галерею и многое другое. В нем же можно настраивать анимацию и незначительно редактировать фотографии.

Также недавно появились шаблоны, созданные с помощью Zero-Block. Благодаря этому можно подобрать шаблонный сайт и быстро переделать его под свои задачи.

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

Преимущества:

Функция «Zero-Block», с помощью которой можно сделать мощный и продающий сайт.

Встроенная CRM, доступная даже в бесплатной подписке.

Вставка собственного HTML-кода, который может быть использован как отдельный скрипт.

Подключение собственных шрифтов.

Подключение платежных систем.

Есть 14-дневный пробный период.

Недостатки:

Скудный функционал в бесплатной версии.

Цена.

Стоимость: от 750 рублей в месяц.

Официальная страница: Tilda

UMI7

Umi – конструктор, разработанный российской компанией Umisoft. Основное предназначение – создание и продвижение коммерческих сайтов. Подойдет для блога, сайта-визитки, лэндинга и интернет-магазина.

Хоть сервис и позиционирует себя как конструктор, правильнее его отнести к CMS. Он предоставляет шаблоны сайтов, состоящие из нескольких веб-страниц. Редактор позволяет добавлять такие элементы, как текст, изображения, блоки, слайдеры.

Преимущества:

Синхронизация с CRM и аналитическими сервисами.

Большие возможности SEO – редактирование тегов, файла robots.txt и управление редиректами.

15-дневный пробный период.

Недостатки:

Изменение стилей возможно только с помощью CSS.

Мало функциональный редактор страниц.

Для новичков будет сложно освоить весь необходимый функционал.

Стоимость: от 136 рублей в месяц.

Официальная страница:UMI

Nethouse8

Nethouse – решение для тех, кто хочет создать сайт своими руками без каких-либо сложностей. Бесплатный тариф предоставляет пользователям SSL-сертификат с возможностью подключения домена 3-го уровня, а также десятки адаптивных шаблонов для разных отраслей.

Если говорить о редакторе, то он не отличается особой функциональностью: можно изменять только те элементы, что предоставлены в шаблоне. Также мы можем связать сайт с Яндекс.Метрикой, GoogleAnalytics, CRM, GoogleAds и другими сервисами.

Преимущества:

Бесплатный тарифный план.

Возможность подключить SSL-сертификат на бесплатном тарифе.

SEO-настройка в шаблонах.

Недостатки:

Небольшой запас шаблонов.

Возможности конструктора сильно ограничены.

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

Официальная страница: Nethouse

Flexbe9

Решение для тех, кому нужно быстро создать сайт-визитку/портфолио или открыть небольшой интернет-магазин. Flexbe – это простой конструктор, использующий шаблонные решения, которые можно легко и быстро отредактировать. Этот сервис отлично подойдет для тех, кто хочет ознакомиться с разработкой сайтов.

Преимущества:

Интеграция с платежными системами Тинькофф, Robokassa и ЮKassa.

Доступна возможность встраивать свой HTML-код.

Недостатки:

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

Отсутствует поддержка.

Высокая стоимость за не самый мощный функционал.

Нет автосохранения.

Стоимость: от 750 рублей.

Официальная страница: Flexbe

Insales10

Insales – мощный инструмент для создания интернет-магазинов. Он предоставляет более 100 готовых решений для будущего сайта, а также поддерживает связь со многими сторонними сервисами.

Преимущества:

14-дневный бесплатный период.

Интернет-магазином можно управлять через мобильное устройство.

Встроенная CRM.

Генератор промокодов.

Мультивалютность и мультиязычность.

Недостатки:

Стоимость тарифов крайне высока.

Много платных шаблонов.

Кастомизация шаблонов доступна только через редактирование HTML и CSS.

Стоимость: от 1590 рублей в месяц.

Официальная страница: Insale

LPGenerator11

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

Преимущества:

Тонкая SEO-настройка: редактирование метатегов и альтов, установка заголовков разных уровней и многое другое.

Функциональный визуальный конструктор с инструментами графического редактора и возможностью глубокой кастомизации шаблона.

Интеграция с большим количеством сервисов для взаимодействия с посетителями.

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

Недостатки:

Сложный для новичков интерфейс.

Стоимость: от 466 рублей в месяц.

Официальная страница: LPGenerator

Google12

С Google Формами вы можете не только быстро провести опрос, но и составить список гостей, собрать адреса электронной почты для новостной рассылки и даже провести викторину.

Преимущества:

Красочное оформление

Тонкие настройки

Всегда с вами- можно создавать на любом устройстве

Результаты и статистика

Эффективная совместная работа – можно работать с друзьями или коллегами

Оптимизация контента для разных экранов

Стоимость: Бесплатно.

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

Инструкция по созданию сайта

Этапы создания сайта

Разработка сайта — это процесс, состоящий из нескольких последовательных этапов.

Работу по созданию можно разделить на такие этапы:

1. Подготовительный

2. Разработка макета

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

4. Раскрутка сайта

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

Остановимся на этих этапах подробнее:

1.Подготовительный этап

Определяется идея сайта, цели, задачи, целевая аудитория

2. Разработка макета

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

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

Эффективность работы сайта связана с понятием контента, то есть текстовой и графической информации.

4. Раскрутка сайта

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

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

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

Главная страница сайта

Главная страница сайта – это витрина, «парадный вход», на котором посетители:

знакомятся с вашим сайтом;

узнают, о чем этот сайт;

узнают, чем вы можете быть им полезными.

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

Элементы главной страницы

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

Шапка сайта (или хедер).

Это самая верхняя часть страницы, на которой обычно размещен логотип и название сайта (в правом верхнем углу). Логотип или название сайта выполняет для него ту же роль, что и вывеска на входе в какое-либо учреждение. Когда мы идем в магазин, достаточно на входе увидеть вывеску, чтобы внутри магазина точно знать, что я нахожусь в нем до тех пор, пока не выйду. Другое дело Интернет: здесь основной способ перемещения - это навигация, и поэтому нужно видеть эту вывеску на каждой странице.

(рис.11. Шапка/хедер)

Меню (элементы навигации).

О но может быть горизонтальным, вертикальным, но главная цель – дать посетителю понять, как перейти в другие разделы сайта. Сейчас модно прятать меню под значок-гамбургер. Главное правило, о котором нельзя забывать — красота не должна вредить функциональности вашего сайта. Если пользователям не будет понятно, как пользоваться вашим новомодным меню – лучше сделать выбор в пользу простой классики.

(рис.12. Меню)

Баннер или слайдер.

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

Блоки контента.

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

(рис.13. Главная страница)

Кнопки социальных сетей.

Кнопки перенаправят посетителя на ваши официальные странички.

Форма обратной связи.

Позволит посетителю сразу же связаться с вами.

7. Подвал сайта, или футер (footer).

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

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

Регистрация на сайте

Создание Google аккаунта фраза «Создать аккаунт в Google» по-простому означает: представьтесь пожалуйста, укажите ВАШЕ имя, фамилию и год рождения, и мы создадим для ВАС почтовый ящик, дадим ему адрес *****@ gmail.com для того, чтобы ВЫ могли писать и получать письма, чтобы ВЫ могли пользоваться службами Google. Создадим Google-аккаунт.

1. Зайдите на сайт https://www.google.ru /. В правом верхнем углу нажмите кнопку Войти

(рис.14 Вход)

2. В появившемся окне выберите команду «Создать аккаунт» – Для себя.

(рис.15 Создать аккаунт)

3. Теперь необходимо создать Google аккаунт. Для работы с сайтом, нам понадобится электронная почта Google, поэтому мы сразу создадим почтовый ящик Gmail: введите свое имя, фамилию, имя пользователя и пароль. ВНИМАНИЕ: Адрес Вашего почтового ящика (имя пользователя) должен содержать ТОЛЬКО буквы латинского алфавита, без пробелов, в одно слово, допускаются цифры и символ «точка». Нажмите кнопку Далее.

(рис. 16 Google аккаунт)

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

(рис.17 Номер телефона)

5. В появившемся окне можно заполнить данные номера телефона (необязательно), дату рождения и пол. Нажмите Далее.

(рис.18 Дата рождения)

6. Вы можете добавить в аккаунт номер телефона – кнопка «Добавить номер» или нажать «Пропустить».

(рис. 19. Добавить номер)

7. На следующей странице прочитайте текст и нажмите кнопку «Принимаю».

Регистрация Google-аккаунта прошла успешно. Если Вы не хотите отвлекаться на различные уведомления и рекламу в вашем браузере, то нажмите «Блокировать» в появившемся ниже окне.

(рис.20. Уведомления и реклама)

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

Список использованных источников

ЖУРНАЛ ПЛАС

URL:https://plusworld.ru/daily/tehnologii/segodnya-ispolnyaetsya-30-let-pervomu-sajtu-v-internete/

PROSMM

URL:https://prosmm.org/articles/luchshie-konstruktory-sajtov-obzor-top-20