Как сделать сайт?

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

Что такое сайт?

Сайт — это набор файлов. Эти файлы хранятся на сервере (это особый компьютер). Как только вы открываете браузер (Chrome, Firefox, Safari и т.п.) и переходите по ссылке, то вы скачиваете html файл с сервера. Затем браузер обрабатывает этот файл и показывает вам страницу сайта.

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

Вы прямо сейчас можете посмотреть HTML код этой страницы, если нажмёте правой кнопкой мыши на пустое пространство сайта и выберите пункт «исходный код». Так выглядит меню правой кнопки мыши в браузере FireFox: Вы увидите HTML код, в котором будут вперемешку русские и английские слова, на подобии этого: — это HTML код. Большая его часть не выводится на экран, а формирует страницу (дизайн). Но об содержании HTML файлов поговорим в следующих статьях. Сейчас же обсудим как эти файлы хранятся и какими бывают. А хранятся они на серверах, которые принадлежат хостинговым компаниям.

Что такое хостинг?

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

Серверы хостинга имеют бесперебойное электропитание (с дизельными генераторами на улице на всякий случай) и несколько интернет провайдеров. Дублирующие меры необходимы для бесперебойного доступа к сайту даже в случае чрезвычайного происшествия. Для размещения своего сайта можно использовать и свой домашний компьютер, но он должен быть включен 24/7 и иметь постоянный доступ к высокоскоростному интернету, чтобы сайт работал без перебоев. А так же иметь квалифицированную техническую поддержку для настройки серверного программного обеспечения. Ещё желательно иметь не простой компьютер, а корпоративного уровня с высокой отказоустойчивостью, в котором все системы продублированы. Такой компьютер стоит дорого, поэтому выгоднее заказать услуги хостинга у хостинговой компании.

Если у вас ещё нет хостинга, то стоит начать заказывать его уже сейчас. С рабочим хостингом и доменом вникнуть в тему гораздо проще. «Виртуальный хостинг» — это то, что надо для начала работы.

Что такое домен?

Домен — это имя сайта. К примеру, «mousedc.ru» или «yandex.ru». Чтобы соединить сервер, на котором хранятся данные сайта и доменное имя, надо в настройках домена написать ip адрес сервера. Не переживайте насчёт этого действия, если закажите хостинг у нас — сотрудники техподдержки помогут советом и делом. Не бойтесь писать нам, решим все проблемы.

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

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

Какие сайты бывают?

Бывают «статичные» и «динамичные» сайты. Это не общепринятое обозначение, но оно поможет понять как работают сайты. Поэтому будем использовать это название далее в статье.

Статичные сайты — это сайты, которые состоят только из HTML файлов (страниц сайта). Один HTML файл — это одна страница сайта. Все эти файлы находятся на сервере. HTML файлы не могут изменяться самостоятельно. Только администратор сервера может изменить их. Поэтому назовём статичными сайты, которые построены на HTML файлах.

Если хотите сделать сайт самостоятельно и не знаете с чего начать, то рекомендуем онакомиться с нашими обучающими статьями по HTML.

Внутреннее содержание тих таких сайтов выгладят как HTML файлы, разложенные по папкам. К примеру, вот структура сайта будет у сайта с двумя страницами: титульной (главной) страницей и страницей «о компании»: — здесь:

• mousedc.ru — это так называемая «корневая» папка сайта
• about. html — это файл страницы «о компании»
• index.html — это файл титульной страница сайта

Рассмотрим страницу «о компании» подробнее. Если захотите увидеть страницу сайта «о компании», то надо открыть страницу «mousedc.ru/about.html». Обратите внимание не слеш «/», он ставится по логике файлов и папок. Если бы страница «about.html» находилась в какой-то подпапке, то путь был бы длиннее. К примеру: — в таком случае, чтобы открыть страницу about.html, надо набрать в адресной строке браузера «mousedc.ru/folder/about.html».

Теперь обратим внимание на титульную страницу сайта, файл которой называется «index.html». В интернете принято называть титульную страницу как index.html. Эта страница так часто используется, что принято по умолчанию проверять а не запрашивается ли она. К примеру, если вы перейдёте по ссылке «mousedc.ru», то скачаете и откроете именно файл index.html. Эта же страница будет ещё и по адресу «mousedc. ru/index.html». Поэтому прибавлять к адресу «/index.html» нет необходимости.

Как загрузить HTML файлы на сервер?

Чтобы загрузить файлы на сервер, используется либо панель администратора на хостинге, либо специальные программы. Зайдите в личный кабинет пользователя на хостинге и найдите раздел управления файлами. Там есть возможность загрузить файл на сервер. Если возникнут вопросы — обязательно напишите нам в техподдержку. Мы всё расскажем и научим.

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

И рекомендуем ознакомиться со статьями, описывающими редакторы файлов, у которых есть возможность изменять файлы на удалённом сервере: «Средство разработки: Notepad++» или «Средство разработки: Atom»

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

К примеру, если вам надо загрузить новую страницу сайта, то вы скопируете старую страницу и чуть-чуть измените её содержание (контент), не трогая визуальное оформление остальных частей страницы. Этот способ будет действовать до тех пор, пока не появится необходимость изменять и загружать по 10 файлов в день. В этот момент надо задуматься над программированием и связью с базой данных.

Программирование сайтов

Существуют языки программирования, которые позволяют модифицировать страницу «на лету», во время запроса. Это сильно упрощает жизнь тем, кто создаёт сайты. Представьте, что на сервере вместо «index.html» лежит файл «index.php». Расширение «.php» означает, что этот файл может быть обработан языком программирования. И в зависимости от переданных параметров выдать страницы с разным содержанием.

Таким параметром для динамичных сайтов является строка запроса. К примеру, если зайдёте на новостной сайт через запрос:

mousedc. ru/index.php?novost=1

или

mousedc.ru/index.php?novost=2

То страница сайта выдаст новость под номером 1 или 2, потому что в запросе (в адресной строке) указан параметр «novost» со значением равным «1» и «2». Всё, что находится после знака вопроса «?» в строке запроса, является параметром (параметров может быть несколько).

Обратите внимание, что в двух примерах запрос идёт на один и тот же файл «mousedc.ru/index.php». Именно в этом состоит сила динамичных сайтов: один файл может выдавать совершенно разный результат в зависимости от передаваемых параметров и от того, как запрограммировать его. Если Вы заинтересовались темой программирования, то рекомендуем ознакомиться с разделом наших обучающий статей по программированию на PHP.

База данных

Как вы уже заметили из предыдущего параграфа, новость под номером 1 и новость под номером 2 должны откуда-то браться. Для хранения подобных вещей люди придумали «базы данных». Если утрировать, то общение с базой происходит примерно так:

Страница сайта: Эй, база данных, дай мне новость с номером 2!
База данных: Вот тебе весь текст новости, которая сохранёна под номером 2.

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

Система управления контентом

Чтобы не учить язык программирования PHP и не программировать взаимодействие с базой данных, а просто сделать свой сайт, люди начали разрабатывать CMS (Content Management System — системы управления контентом).

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

Одна из самых популярных и простых систем для новичков — это WordPress. Эта система позволяет человеку без знаний создать личный блог. Владелец блога может ничего не понимать в программировании, но сможет установить и настроить систему, писать статьи и размещать фотографии. Чтобы установить WordPress на сервер, закачайте архив с системой на сервер, распакуйте и перейдите по адресу своего сайта. Затем следуйте инструкциям по установке. Иногда даже WordPress можно установить в специальном меню хостинга — он сам скачается и распакуется.

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

С чего начать создание сайта?

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

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

Как создать сайт на WordPress с нуля

WordPress — это бесплатная платформа, которая позволяет создавать сайты без знания HTML-кода. Она подойдет новичкам и профессионалам. Особенно выручит, когда нужно собрать сайт, портфолио или блог, а вы этого раньше не делали. Как создать и настроить сайт на WordPress, используя CMS-хостинг RU-CENTER, расскажем в этой статье.

Кому подойдет WordPress

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

Что удобно создавать на WordPress:

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

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

• Бесплатная лицензия. 
• Быстрая и простая сборка сайта на хостинге со стандартными настройками: привлекать программистов точно не придется.
• Удобная панель управления для работы с контентом.
• Бесплатные или недорогие темы, которые можно изменять и адаптировать под фирменный стиль сайта.
• Много бесплатных плагинов. Они позволят расширить функциональность сайта и сделать сайт более безопасным.
• Открытый код позволяет разработать свои плагины и темы.

Недостатки WordPress

• Для многих функций нужно вручную устанавливать расширения и дополнения.
• Возможна перегрузка сервера: чтобы ее избежать, нужно оставить только необходимый набор плагинов и убирать лишние расширения. В RU-CENTER панель управления хостингом остается доступной независимо от состояния CMS и сайта. Это позволяет вручную отключить плагины и провести другие необходимые процедуры по восстановлению.
• Сайты на WordPress — популярная мишень для атак: их часто взламывают, поэтому важно внимательно следить за обновлениями платформы. RU-CENTER автоматически установит последнюю версию CMS.

Как создать сайт на WordPress: пошаговое руководство

Мы покажем, как создать сайт на WordPress, используя CMS-хостинг RU-CENTER. Для этого нужно выполнить пять шагов: 

1. Зарегистрировать доменное имя и приобрести CMS-хостинг.
2. Установить WordPress.
3. Настроить темы и шаблоны.
4. Добавить контент на готовый сайт.
5. Установить необходимые плагины.

Шаг 1. Регистрируем доменное имя и приобретаем веб-хостинг

Приобретите хостинг для сайта — домен .ru или .рф уже включен в стоимость. Для блога или сайта компании рекомендуем тариф «CMS-хостинг WordPress 1», для сайтов с высокой посещаемостью — «CMS-хостинг WordPress 2», а для интернет-магазинов и больших проектов — «CMS-хостинг WordPress 3».

Тарифы RU-CENTER на CMS-хостинг сайтов на WordPress

Шаг 2. Устанавливаем WordPress 

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

Нажмите «Создать сайт» в панели управления хостингом RU-CENTER

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

Выберите домен из списка или введите название сайта вручную. Нажмите кнопку «Продолжить»

Выберите CMS WordPress, затем укажите имя сайта, логин, email и пароль, нажмите кнопку «Продолжить».

Выберите CMS WordPress, укажите имя сайта, логин, email и пароль, нажмите кнопку «Продолжить»

На финальной странице вы увидите основные реквизиты для работы с сайтом — логин и пароль от панели администрирования. 

Обратитесь к своему сайту по адресу http://ваш_домен/. Продолжить работу с сайтом вы сможете в административной панели WordPress. Чтобы попасть в нее, нажмите на кнопку «Перейти в панель управления».

Чтобы начать работать с сайтом, нажмите на кнопку «Перейти в панель управления»

На странице авторизации введите логин и пароль, затем нажмите на кнопку «Войти».

Введите логин и пароль на странице авторизации

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

Шаг 3. Настраиваем темы

Темы в WordPress — это шаблоны для внешнего вида сайта. У каждого веб-сайта WordPress есть базовая тема, установленная по умолчанию. 

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

Чтобы выбрать тему, в панели управления перейдите в раздел «Внешний вид» → «Темы». Нажмите кнопку «Добавить новую».

В разделе «Внешний вид» → «Темы» вы можете подобрать тему для вашего сайта

Подберите тему WordPress из каталога, найдите нужную вам по названию или с помощью фильтра характеристик.

Найти нужную тему можно по названию или с помощью фильтра характеристик

Наведите курсор на выбранную тему и нажмите кнопку «Просмотреть». WordPress включит режим предпросмотра. Если внешний вид сайта вам нравится, установите тему.

Кнопка «Посмотреть» включит предпросмотр сайта, если она вам понравится — нажмите кнопку «Установить»

Более подробную инструкцию инструкцию и FAQ по настройке темы вы найдете в полном гиде от WordPress.

Шаг 4. Добавляем контент

У WordPress есть две разновидности контента: страницы и записи. 

Записи — часть блога, они показаны в обратном порядке: новые записи отражаются в начале.  

Так выглядят «Записи» в WordPress

Страницы — это статический контент: например, страница контактов, страница с информацией о компании и т. д.

Так выглядят «Страницы» в WordPress

Чтобы добавить контент на сайт, перейдите в раздел «Страницы» или «Записи» на панели управления, нажмите «Добавить новую». В редакторе страниц вы можете добавить текст, вставить видео, ссылку, картинку, аудио и т. п. Чтобы разместить готовый контент на сайт, нажмите кнопку «Опубликовать».

Редактор страниц в WordPress

Шаг 5. Устанавливаем дополнительные плагины

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

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

Существует два наиболее безопасных источника, где можно найти плагины:

1. На официальном сайте WordPress. org.
2. В консоли WordPress.

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

• Бэкап — он предотвратит потерю всей информации сайта, создаст резервные копии.
• Безопасность — такие плагины защищают данные сайта и пользователей. Например, если ваши пользователи создают личный кабинет, то пригодится плагин двухфакторной аутентификации, генерации надежных паролей и reCAPTCHA.
• Дизайн и настройка — эти плагины помогут вам определиться с дизайном главной страницы и придумать свою пользовательскую тему.
• Плагины для повышения производительности и настройки кеширования контента — такие плагины помогут ускорить работу сайта. Самые популярные из них — W3 Total Cache, WP Super Cache, WP Fastest Cache.

Ваш сайт на WordPress готов. Удачной работы!

Перейти ко всем материалам блога

Конструктор веб-сайтов — Создайте веб-сайт за считанные минуты — Squarespace

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

Посетите Справочный центр → →

Зачем мне сайт?

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

Что включает подписка Squarespace?

Squarespace — это комплексная система управления контентом, или CMS. С помощью одной подписки вы можете создать веб-сайт, разместить свой контент, зарегистрировать собственное доменное имя, продавать продукты, отслеживать аналитику своего сайта и многое другое.

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

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

Подходит ли мне Squarespace?

У каждого свои потребности в веб-сайте, поэтому есть один способ узнать, подходит ли вам Squarespace: попробуйте!

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

Для визуального предварительного просмотра перед регистрацией или для получения максимальной отдачи от бесплатной пробной версии веб-сайта мы рекомендуем следующие ресурсы:

1. Просмотр коротких справочных видеороликов.
2. Зарегистрируйтесь на вебинар с экспертами в прямом эфире.
3. Исследуйте в своем собственном темпе, используя руководства в этом Справочном центре.

Как мне начать создавать свой веб-сайт?

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

Может ли кто-нибудь создать для меня мой веб-сайт?

Да. В то время как Squarespace является отличным конструктором веб-сайтов для самостоятельного подхода, многие веб-дизайнеры специализируются на создании сайтов Squarespace для клиентов. Чтобы нанять эксперта Squarespace, посетите Squarespace Marketplace.

Как получить персональный домен для моего веб-сайта?

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

Как начать продавать в Интернете?

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

Что такое Сайты Google? Подробное руководство

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

Как обычно, у Google есть ответ: Сайты Google .

Что такое Сайты Google?

Google Sites — это конструктор веб-сайтов Google. Когда вы сравниваете Google Sites с WordPress или другим продвинутым конструктором веб-сайтов, он не будет складываться — у него гораздо меньше функций. Но в нем по-прежнему есть все необходимое для создания блога, портфолио, бизнес-сайта или внутренней сети компании. Это также достаточно просто для некоммерческих пользователей, чтобы создавать веб-сайты для своих семей, друзей и классных комнат.

На самом деле, с Google Sites можно неплохо поработать. В отчете Site Builder приведены некоторые профессионально выглядящие примеры Сайтов Google, например, сайт петрологической группы доктора Сюй Чу:

Сайты Google бесплатны?

Да! Вы можете создать сайт Google бесплатно. Кроме того, поскольку у него нет ценовых уровней, вы получаете все его функции бесплатно.

Как использовать Google Sites

Перейдите на сайт sites.google.com и выберите один из вариантов вверху, чтобы создать новый сайт: использовать шаблон или начать с нуля. Вы можете переключиться на классический редактор Сайтов Google в левом нижнем углу этой страницы, но в этом руководстве объясняется, как использовать новый редактор.

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

Создать заголовок

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

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

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

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

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

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

Выберите тему

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

Ищете больше контроля? Щелкните значок + под цифрой 9.0095 Пользовательская категория , чтобы создать собственную тему, которую Сайты Google сохранят на потом. Вы можете изменять шрифты и цвета по своему усмотрению.

Добавить текст и мультимедиа

Пришло время изучить элементы построения веб-сайтов Google Sites. Щелкните вкладку Вставка на правой панели, чтобы добавить следующие элементы на свой сайт:

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

• Блоки содержимого: Эти готовые блоки текста и изображений экономят ваше время на добавлении отдельных элементов и их размещении.

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

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

• Карусели изображений: Добавьте два или более изображений в карусель изображений, по которым можно перемещаться с помощью точек под ним, или автоматически переключайтесь между изображениями.

• Кнопки: Создайте кнопку-ссылку, которая использует шрифт и цвета из вашей темы.

• Разделители: Сайты Google создают простые разделители с дизайном, основанным на выбранной вами теме.

• Заполнители: Раздел заполнителя содержит место для изображения, видео YouTube, Календаря Google или Карты Google.

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

Включение элементов Google

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

• YouTube: Вставьте воспроизводимое видео YouTube на свой веб-сайт.

• Календарь: Поделитесь своим календарем в еженедельных, ежемесячных представлениях и представлениях повестки дня.

• Карта: Вставьте интерактивную карту Google для выбранного вами адреса.

• Документы, слайды, листы и диаграммы: Добавьте файл Google в режиме просмотра на свою страницу.

• Формы: Показать форму Google, которую посетители могут заполнить на вашем сайте.

Вставка контактной формы Google Sites

В Google Sites нет встроенной контактной формы. Вместо этого у вас есть два варианта вставки из внешнего источника:

• Google Forms: Создайте контактную форму в Google Forms, затем используйте Insert Сайтов Google или круговое меню, чтобы добавить ее.

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

Упорядочивание столбцов и разделов

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

Совет: Чтобы сохранить исходное соотношение сторон изображений, перетащите угол, чтобы начать изменение их размера, затем нажмите клавишу Shift, чтобы изменить размер с тем же соотношением сторон.

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

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

Добавление страниц и управление ими

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

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

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

Совет: Если вы хотите скопировать что-то с одной страницы на другую, выберите эту часть вашего сайта, нажмите command + C или Ctrl + C , затем вставьте это на новую страницу.

Публикация и совместная работа

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

После публикации вы можете посетить свой сайт по адресу sites.google.com/view/yourwebaddress , как показано под строкой веб-адреса на рисунке выше.

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

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

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

Поздравляем с созданием веб-сайта! Вот , как у меня получилось .

Часто задаваемые вопросы

Могу ли я иметь собственный домен в Сайтах Google?

Да. Вы можете настроить пользовательский URL-адрес Google Sites с помощью параметра Настройки > Пользовательские домены . Эта функция позволяет вам подключить домен через Google Domains или третью сторону.

Если вы планируете использовать свой сайт Google в профессиональных целях, персональный домен придаст ему дополнительный блеск . Кроме того, получить его довольно дешево — около 15 долларов в год.

Есть ли на Сайтах Google виджеты?

Сайты Google не имеют виджетов, кроме параметров приложений Google, но вы можете добавить любой внешний параметр с помощью кода для встраивания.