В Рунете практически нет проектов на Google Sites — конструктор у русскоязычной аудитории не пользуется популярностью. Встречаются образцы, собранные на старой версии редактора, с откровенно примитивным дизайном. Смотреть там не на что. А вот за рубежом Google Sites любят чуть больше, у некоторых даже получается создавать действительно неплохие сайты. Им в этом ощутимо помогает возможность вставки HTML-кода — ребята добавляют недостающие элементы кодом, расширяя сравнительно бедную стоковую базу возможностей.
Мы составили подборку из наиболее качественных экземпляров — создать что-либо заметно более интересное, чем в примерах ниже, не получится. Вы увидите предел возможностей сервиса, причём, с учётом вставок кода. Без опыта кодинга новички не смогут повторить некоторые элементы сайтов из подборки, поэтому не стоит слишком уж обольщаться по поводу возможностей движка.
Примеры Google Sites-сайтов:
Reston ENT — медицинский сайт
Restonent.com — сайт-визитка американского медицинского центра. Оформлен в классических цветах ниши — сочетанием белого и синего цветов. Страницы имеют простейшую структуру — чередующиеся текстовые блоки и секции со ссылками. Единственный дизайнерский изыск, придающий целостность конструкции, — чередование цвета фона блоков с белого на синий. Шрифты тоже перекрашены под фон для комфортного чтения. Здесь много блоков, состоящих из перечней ссылок. Выглядит всё это аккуратно, но скучно — изображений очень мало, везде одни ссылки да текст. Иллюстрации смогли бы разбавить поток букв.
Страниц более десятка, используется двухуровневое меню сайта. Навигация простая — здесь нечему быть сложным. В разделе форм находятся образцы документов для записи на приём в pdf-формате. Предлагается заполнить их и отправлять на почту клиники — неудобно. Есть ссылки на социалки в футере, там же подробные контакты и условия политики конфиденциальности. С точки зрения контента сайт хорош — отвечает на вопросы, ради которых создан. Неплохо структурирован, не раздражает, но мог бы быть интереснее, оформлению не хватает драйва — побольше фото улыбающихся актёров в бело-синих халатах, отзывы, какие-нибудь логотипы партнёров и т. д. Дизайн излишне серьёзный, сухой, он усыпляет. Может, в этом сокрыта задумка — экономия на снотворном для пациентов.
E-Gaming Experts — сайт агентства
E-gamingexperts.com — сайт-визитка компании, которая занимается консультированием разработчиков приложений азартных игр. Здесь можно получить консультации по оптимизации прибыльности букмекерских контор, лотерей, казино, покерных клубов и других электронных видов развлечений. Дизайн сайта простейший. Использование контрастного красно-зелёного сочетания в элементах и хедерных изображениях отлично передаёт суть игорного бизнеса — живость эмоций, зелёное полотно стола и т. д. Логотип соответствующий. Страницы адаптивные. Шрифт подобран удачно — он округлый, легко читается, размер в самый раз. Никаких других элементов персонализации дизайна нет. Кнопок соцсетей тоже, что наводит на мысли. Связь только через доменную почту.
На сайте всего 5 страниц, заполненных большим количеством текстового контента. Упор сделан на отзывы в прессе и статьи (что-то вроде блога). Форматирование других разделов выполнено колонками и списками — самыми простыми типами подачи текстового материала. Ни выделенных заголовков, ни таблиц, ни табов каких-нибудь — просто списки и текстовые абзацы. Хорошая демонстрация стоковых возможностей Google Sites. Именно так же просто собраны большинство сайтов на движке. Выглядят аккуратно, но простовато. Спасает контент — в основном, это качественно написанные статьи, намекающие на значимость сайта для своих владельцев, серьёзное отношение к нему. В остальном никаких изысков — рассматривать нечего.
PCS — сайт маркетингового агентства
Electricpcs.com — сайт американской компании по продвижению услуг и продуктов предприятий энергетической сферы. Дизайн сайта приятный, по уровню выше, чем в среднем бывает на этом движке. За счёт использования большого количества иконок, комбинаций различных типов шрифтов и цветовых акцентов, ярких изображений и чёткой структуры подачи информации сайт выглядит привлекательным. Даже контакты оформлены фотографиями ответственных лиц — на сайтах от Google такую роскошь редко встретишь. Есть отдельный раздел с условиями принятия на работу — требования, перспективы.
Материалы отформатированы аккуратно, текст грамотный, хоть и пестрит местами превосходными степенями и общими определениями — самый, лучший, стабильный рост и т. д. Ну любят они так, что поделать, работает там такого плана маркетинг. Навигация элементарная, на странице продуктов вставлены pdf-листы с google-диска, почти на всех страницах используется мини-галерея из трёх миниатюр, которые невозможно увеличить. Вообще, используя Google Sites разработчики нередко рисуют блок нужной структуры в графическом редакторе, а потом вставляют его виде изображения. Этот подход хорошо иллюстрирует страница географии деятельности компании. Сайт очень недурно сделан по меркам движка.
Huegel Eagles PTO — образовательный сайт
Huegelpto.com — сайт добровольной организации досуга и воспитания детей вне школы. То есть что-то вроде кружка — копают грядки, играют, продают печенье, собираются на мероприятия и т. д. Примечателен вертикальным боковым меню. В остальном ничего особенного — простые шапки заголовков страниц, белый фон, использование простейших блоков (картинка+текст) для иллюстрации вариантов активностей кружка. На странице волонтёров внизу есть форма от фирменного сервиса, а для расписания мероприятий добавили страницу Google-календаря.
Сайт простейший, но является хорошим примером интеграции сервисов Google. На самом деле, их редко используют, поскольку информация всегда висит в окошке, дизайн примитивный, плюс ко всему, висит ссылка на используемое приложение. То есть страница больше напоминает текстовый документ, чем часть сайта с целенаправленно разработанным дизайном. Страница контактов оформлена сильнее всего, поскольку содержит фото всей команды организации с подписями. Текста на сайте мало, да он и не нужен особо. Сайт нацелен на узкую аудиторию родителей школы, при которой работает кружок. В своём роде он вполне неплох.
CSE — сайт сообщества
Csemn.org — сайт образовательной организации, помогающей адаптироваться в новых языковых условиях детям и целым семьям. Изучают культуру, английский, китайский, пишут, читают, обсуждают, кушают — в общем, платный кружок по интересам. Наиболее интересная часть адаптивного дизайна — многоуровневое меню, способное сворачиваться в гамбургер. Страниц множество, сайт довольно сложный структурно. Оформление отличное, активно используются колонки для текста, фотографии, значки и прочее. Дизайн хоть не впечатляет, но и не отталкивает примитивностью. Сайт активно использует ресурсы сервисов Google — календарь, диск и т. д.
Это первый сайт в подборке, имеющий возможность поиска материалов. А почитать тут есть что, особенно в медиацентре — контента куча, он отлично подан и отформатирован. Настолько, насколько позволяет платформа. Внутри куча ссылок, ведущих на другие страницы и внешние ресурсы. Есть что-то вроде блога — по факту, это одна страница, в которой по цепочке с ручным датированием после заголовка расположены публикации. То есть выглядит как блог, но им не является. В целом, сайт впечатляет размахом. Наверное, один из самых крупных на Google Sites. Кто-то очень постарался — здесь такое непросто сделать.
DrPete — экспертные консультации для бизнеса
Drpete.co.uk — британский сайт-визитка компании, предоставляющей услуги консалтинга для двух дюжин ниш бизнеса. Проект мощный, количество страниц, задействованных в нём, гораздо больше того, что отражено в меню. Активно используются сервисы Google для отображения документов, статей блога, форм и прочего. Есть кастомные элементы вроде карусели брендов. В целом, дизайн серьёзный и симпатичный — почти такой же, какой можно получить в более продвинутом конструкторе с визуальным редактором. Хорошо смотрятся полоски заголовков под хедером, отделённые синей линией, — своя фишка, так сказать. Такой же акцент (синяя линия) использован в меню. Всё вместе хорошо смотрится.
Страницы построены, в основном из комбинация обычных абзацев с отформатированным текстом и колонок из изображений с заголовками и описаниями, содержащими ссылки. Выглядит это насыщенно, а за счёт ссылок — ещё и содержательно. На сайте куча текстового материала. Есть страница команды с фото, клиентов, контактов со сложной Google-формой подачи заявки и нечто вроде блога. Все блоки, колонки, картинки и прочее равномерно подогнаны, ничего не вылазит и не торчит. Ещё один образец отлично собранного проекта на Google Sites с минимальным вкраплением элементов кодом — почти всё собрано родными инструментами редактора.
Flanders hotel bruges — бронирование номеров
Hotelflanders.com — сайт бельгийского отеля Flanders, расположенного в Брюгге. Цель — привлечение туристов, реклама услуг и возможность предоставления бронирования номеров в онлайн-режиме. Всё это сайт может. Дизайн адаптивный, выглядит богато за счёт коричневой цветовой гаммы, красивых изображений, а также контрастного чередования тёмных и светлых блоков. Сайт задействует возможности движка по полной программе. Особенно впечатляет возможность 3D-путешествия по номерам и территории отеля при помощи средств Google Maps. Есть ссылки на социалки, обычная карта, нормально оформленный блок контактов и прочее в таком духе.
На сайте есть более-менее прилично оформленная галерея (видимо сторонняя интеграция) и, конечно же, форма для заказа номеров — тоже не гугловская. За 3 шага можно заказать и оплатить номер. То есть сайт является ещё и магазином в своём роде — здесь совершают покупки услуг. В принципе, за счёт интеграций возможностей сторонних сервисов через код можно организовать многое. Вообще, показательно, что явно процветающий, богатый западный отель использует бесплатный конструктор от Google и старательно адаптирует его под свои требования. Результат получился хороший — для этого движка просто супер. Объективно же — обычная визитка.
Metda — сайт образовательной организации
Metda.org — сайт американской некоммерческой организации, которая занимается консультациями по внедрению информационных технологий в учебные заведения. По сути, они рекламируют необходимость закупки оборудования, за ними стоят производители и поставщики. То есть мы имеем дело с сайтом-визиткой. Дизайн у неё адаптивный, самая яркая его часть — оранжевое выпадающее меню. Для контраста используется чередование областей разного цвета в текстовых материалах. Раздел «О нас» выполнен в виде вставки правового документа, загруженного с Google-диска. Скроллинг в окошке смотрится не очень, зато практично.
Контента на сайте немного, наиболее богато оформлен раздел с мероприятиями. Похоже, информацию в нём обновляют перед каждым ивентом — афиша своего рода. Что интересно, на карте главной страницы отображены маячки членов организации. Наведя на любой из них, можно почитать краткую информацию о человеке — имя, адрес и прочее. Более информативного раздела «Команда» трудно представить для сайта. В целом, проект выполнен просто, но со вкусом. Текста немного, всё по делу, а фишка с картой и командой вообще вне конкуренции.
Ассоциация скульпторов России
Вьюговей.рф — простенькая и, очевидно, очень старая визитка ассоциации скульпторов, работающих со снежными, песчаными и ледовыми композициями. Дизайн не адаптивный, в снежной теме, устаревший давным-давно. Спокойный, отторжения не вызывает, но и описывать особо нечего – примитив. Сайт служит источником ссылок на другие сайты сообщества, а также отражает перечень партнёров, с которыми работала ассоциация. Практически весь мультимедийный контент (видео, картинки) нерабочий – ссылки битые, от их содержимого остались только пустые фреймы. Тем не менее, контакты вполне рабочие, всё видно – кому нужно, смогут обраться. Памятник сайтостроения, доживший до наших дней.
Портал об орехах
Еморехи.рф — объёмный, структурно сложный портал, полностью посвящённый всевозможным орехам и сухофруктам: статьи, обсуждения, объявления о продаже и всё такое. Удивительно, но люди умудряются создавать на Google Sites даже такое. Сайту лет 10, дизайн не адаптивный, понятно. Выглядит чисто, опрятно. Пестрят лишь красно-синие акценты рекламных заголовков. Структура серьёзная – обширное основное меню, сайдбар с полным перечнем ассортимента, куча статей в формате блога и миллион ссылок на внешние и внутренние страницы по теме.
Здесь реализована доска объявлений, причём, выглядит она неплохо несмотря на то, что последние публикации датируются 2015 годом. Есть блог на несколько сотен статей, который портят нерабочие кнопки социальных сетей и счётчики – пустые фреймы. В сайдбаре сделали рекламную ленту с яркими заголовками, в отдельном разделе можно посмотреть список магазинов с профильной продукцией. Это сайт-монстр по меркам движка, контента море и в структурном плане постарались. Пример того, что можно сделать, если выжать из движка все соки и подключить воображение. Браво!
Визитка типографии
Пикселёк.рф — ещё один шедевр сложности и технологической мысли, реализованных в Google Sites. На сей раз это мощная визитка типографии с огромным количеством пунктов в главном двухуровневом меню, которое, кстати, украшено анимацией смены фона кнопок при наведении курсора мыши и выборе. Дизайн адаптивный, чистый и яркий за счёт использования большого количества цветастых фонов, рекламных баннеров, заголовков и уникальных графических разноцветных шильдиков, указывающих на ассортимент предоставляемых услуг. Шрифты крупные, внятные, легко читаются.
Контента на сайте очень много и он, на удивление не только качественный, но и более-менее аккуратно форматирован – несложно воспринимается. Каждая страница, не считая шапки, содержит баннер с номером телефона типографии – пропустить сложно. Более того, раздел контактов оформлен богато – есть карта проезда, даже две и форма обратной связи. Сайт поддерживает регистрацию клиентов. Информация о вакансиях, доставке, ценах и оплате вынесена в отдельный раздел. Отличная визитка, единственное «но» - не для всех услуг есть примеры работ.
Киноклуб «7 этаж»
Сайт Kino.irk.ru принадлежит камерному киноклубу в Иркутске, участником которого может бесплатно стать любой желающий, предварительно подав заявку. Смысл заключается в том, что 4-12 человек собираются для просмотра фильма под определенный перекус с последующим обсуждением увиденного. Главная страница предельно лаконична, она состоит из шапки с многоуровневым меню и строкой поиска, основного экрана и подвала. В подвале размещены ссылки на аккаунты в социальных сетях, а также каналы коммуникации с организатором данного мероприятия. Основной экран занимают тематические изображения с дублирующими важные пункты меню ссылками.
С оформлением других страниц разработчики особо не заморачивались – текст на белом фоне, некачественные изображения, на отдельных страницах встроено видео, добавлены ссылки на тематические материалы. Идея неплохая, и в 2012 году сайт занимал первые строки поисковой выдачи по запросу "киноклуб седьмой этаж". Но, к сожалению, последнее мероприятие датировано 2018 годом.
Региональный координационный центр
Wsr-vol.viro.edu.ru – проект принадлежит Вологодскому региональному центру ассоциации «Молодые профессионалы», целью создания которой является мотивация молодежи к повышению уровня своей профессиональной подготовки в различных сферах деятельности. Навигация организована с помощью сквозного бокового меню, из которого удобно перейти в нужный раздел сайта. В правом верхнем углу зафиксирован значок поиска.
Главная страница представляет собой новостную ленту. Из-за того, что материалы публикуются в полном объеме, страница получилась неоправданно длинной. Рациональней было бы выделить для новостей отдельные страницы, а на главной разместить небольшие анонсы. В подвале указаны контакты Центра, ссылки на социальные сети и основной сайт Ассоциации.
Для подачи информации использованы фото и видео материалы, pdf-документы. В целом сайт достаточно емкий, видно, что проделана большая работа. Дизайн скромный, но вполне достойный для образовательного проекта.
Арт-платформа «Дом да Винчи»
Domdavinci.ngonb.ru – сайт отдела искусств Новосибирской государственной областной научной библиотеки. Меню сайта расположено под первым экраном с тематическим изображением. Дом да Винчи проводит много выставок и других культурных мероприятий, информацию о которых можно найти на главной странице в соответствующих блоках (ближайшие события, выставки, календарь событий) или по ссылкам в меню сайта. Внизу страницы находятся ссылки на соцсети, интерактивная карта с координатами заведения.
Отдел искусств владеет большим физическим фондом печатных изданий, виниловых пластинок, аудио- и видеодисков, а также на сайте представлены тематические онлайн коллекции. На страницах опубликовано много видеоматериалов, 3D тур по помещению Дома. Большая часть ссылок ведет на материалы, размещенные на основном сайте НГОНБ.
Сайт выглядит очень достойно, как в плане оформления, так и навигации и контента. Яркий пример эффективного использования Google Sites для разработки некоммерческих проектов.
Караоке-бар «Барселона»
Сайт Barcelona38.ru принадлежит караоке-бару, который находится в Иркутске. Он состоит из четырех страниц – основного меню, карты бара, третий этаж (отдельный караоке зал) и правила заведения. При этом главная страница, как таковая, отсутствует. Сайт сразу начинается с меню, которое оформлено в виде галереи. Изображения содержат фотографии блюд, ингредиенты, выход и стоимость. В шапке сайта зафиксирована ссылка на Instagram аккаунт, меню сайта и значок поиска. В подвале – адрес заведения, контактные телефоны и интерактивная карта.
Карта бара оформлена аналогично, только без фото напитков. Вкладка Третий этаж содержит небольшое описание и слайдер с фотографиями зала. Правила посещения оформлены в виде раскрывающихся пунктов. Сайт небольшой, но содержит достаточно необходимой для потенциальных клиентов информации. Замечания имеются к его оформлению, в частности к главной странице. Уместней было бы разместить на ней красивую презентацию заведения, отзывы клиентов, а также указать контакты в шапке сайта.
Подведём итоги
Вы сами всё видели: иностранные разработчики умудряются создавать при помощи Google Sites весьма приличные проекты. Да, дизайн, как правило у них простой, разнообразия элементов нет. Они выезжают за счёт контента и его подачи. Комбинируя различные стили форматирования, симулируют дизайн блоговой ленты, подтягивают сторонние интеграции, используют много отредактированных в графических программах изображений (яркий пример — партнёры, бренды и т. д.), через код вставляют свои элементы и прочее выдумывают. Фантазия у них работает.
Очевидно, Google Sites на западе используют не только некоммерческие организации, но и вполне мощные компании, которые могут позволить себе создание сайта в платном конструкторе либо на CMS (движке), либо на ещё чём-нибудь. Вывод прост: они любят Google, доверяют его продуктам и внедряют их по максимуму в свои бизнес-процессы. У нас иначе: большинство предпочитает использовать конструктор со всеми необходимыми инструментами из коробки, чем фантазировать, как сделать галерею из 10 картинок с лайтбоксом и подписями либо добавить нормальный слайдер.
Сайты Google быстро работают, они бесплатные, но не такие уж простые в оформлении — для красивой подачи контента придётся повозиться с тем минимумом инструментов, что предлагает система. Это задача не для новичков, нужен опыт — придётся думать, подключать воображение, как из 3-х палок слепить домик с крышей. Поэтому движок у нас популярностью не пользуется — хватает более функциональных решений.
