Практическая работа. Создание сайта на Tilda
Оценка 4.6

Практическая работа. Создание сайта на Tilda

Оценка 4.6
Лабораторные работы
docx
информатика
18.11.2021
Практическая работа. Создание сайта на  Tilda
ПР. Создание сайта на Tilda.docx

Практическая работа

«Создание сайта на Tilda»

1.      Открываем официальный сайт (https://tilda.cc/ru/) и на главной странице нажимаем «Создать сайт бесплатно».

Регистрация на Тильде

2.      Указываем данные для регистрации и жмем «Зарегистрироваться». Обратите внимание на электронную почту – проверьте ее корректность, она потребуется для подтверждения аккаунта.

Регистрация учетной записи на Тильде

3.      В результате мы попадаем в личный кабинет, где перед нами отображается модальное окно с просьбой создать новый сайт. Укажем для него название, например, «Мой первый сайт на Тильде», и нажмем «Создать».

Как создать сайт на Тильде

4.      Перед тем как перейти к редактированию нашего сайта, давайте подключим тариф Personal, который бесплатно предоставляется на 2 недели. Благодаря ему у нас будет доступ ко всему функционалу Тильды, а это значит, что мы сможем создать практически любой сайт. Переходим для этого в раздел «Тарифы и оплата».

Тарифные планы Тильда

5.      В нижней части выбираем «Активировать».

Как получить Tilda Personal бесплатно на две недели

6.      Далее нас информируют о том, что все прошло успешно – здесь просто жмем «Продолжить».

Готово! Мы создали сайт и активировали тариф Personal. Теперь можно переходить к редактированию будущего веб-ресурса, подключению домена и т.д. Первым делом наполним наш сайт теми блоками, что мы решили создать.

1.      После того как мы создали новый сайт, перед нами отобразилось главное окно с доступными сайтами – в нашем случае это «Мой первый сайт на Тильде». Приступим к его редактированию – нажмем «Создать новую страницу».

Как работать с конструктором Tilda

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

Как создать пустой сайт на Тильде

3.      Для начала выбираем «Все блоки».

Как на Тильде добавить новый блок

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

Как создать сайт-визитку на Тильде

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

Как в Тильде изменить содержимое блока

6.      Также изменим название кнопки – это происходит в разделе «Контент». Чтобы включить отображение этой кнопки, достаточно навести курсор мыши на экран редактирования.

Как в Тильде изменить название кнопки

7.      Пролистываем вниз и указываем название для кнопки, например, «Узнать подробнее». Также добавляем ссылку, которая будет открываться при нажатии на кнопку. В завершение не забываем нажать на кнопку «Сохранить и закрыть».

 Как в Тильде поменять название и цвет кнопки

8.      Также давайте поменяем цвет кнопки – сделать это можно в разделе «Настройки».

Как работать с конструктором Тильда

9.      Следующим шагом нажимаем «Кнопки» и выбираем «Цвет фона». В результате отобразится панель цветов – она предназначена для изменения цвета. Для примера возьмем бирюзовый, вы же можете указать любой другой.

Как поменять цвет кнопки в Тильде

10.  Вот такая у нас получилась главная страница:

Как работать с Тильдой

11.  Перейдем к следующему блоку – «Информация о компании». Его уже создадим с помощью окна редактирования Zero-Block, который позволяет располагать элементы блока так, как вам захочется. Чтобы добавить данный блок, внизу страницы воспользуемся опцией «Все блоки» и выберем «Нулевой блок».

Как в Тильде добавить Zero Block

12.  Блок создан, но пока что он наполнен ненужной нам информацией. Отредактируем ее – для этого воспользуемся опцией «Редактировать блок».

Редактирование Zero Block на Тильде

13.  Мы попадаем в самое сердце Тильды – окно редактирования зиро-блока, в котором можно менять контент и адаптировать его. Первым делом избавимся от старого контента – для этого выделим все объекты комбинацией клавиш «CTRL+A» и нажмем клавишу «Delete». В результате блок станет пустым:

Как создать страницу о компании в Тильде

14.  Так как мы решаемся в этом блоке рассказать о компании, нужно создать соответствующий заголовок. Не будем долго думать и назовем его «О компании». Чтобы добавить заголовок, нажимаем в верхнем левом углу на кнопку в виде плюса и выбираем «Add Text».

Как в Тильде добавить заголовок

15.  Вводим заголовок («О компании») и нажимаем на кнопку «Settings», расположенную в нижнем правом углу.

Как создать заголовок в Zero Block Тильда

16.  В отобразившемся окне предоставляется доступ к модификации текстового элемента. Зададим в верхней части расположение по центру, укажем размер шрифта в строке «SIZE» и добавим толщину «WEIGHT».

Как изменить текстовый блок в Тильде

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

Как добавить текст в Zero Block Tilda

18.  Последним действием добавляем картинку, на которой будет показан дружный коллектив компании. Для этого в верхнем правом углу нажимаем на плюсик и выбираем «Add Image».

Как добавить изображение в Zero Block Tilda

19.  Размещаем блок справа от текста и увеличиваем его размер – просто кликаем по нему и тянем за нижний левый ползунок. Аналогичным образом изменяем ширину текстового блока. После этого переносим свое изображение в добавленный блок:

 Как в Tilda создать страницу о компании

20.  В завершение жмем «SAVE», а затем «CLOSE».

Как создать Zero Block на Тильде

21.  Аналогичным образом добавим еще один блок, но уже не Zero, а простой, из раздела «Контакты».

Как создать сайт-визитку на Тильде

22.  Редактируем блок так, как мы это делали в самом начале. Изменяем заголовок на «Наши контакты» и прописываем дополнительную информацию.

 Как добавить блок контакты в Тильде

23.  Готово! Наш сайт-визитка создан, осталось разместить его в интернете. Для этого в верхней части жмем «Опубликовать» и задаем доменное имя, например, myfirstsiteki. Затем нажимаем «Сохранить и продолжить».

Как задать адрес для сайта на Тильде

24.  После этого нас попросят верифицировать email. Достаточно зайти на почту и найти письмо от Tilda. В случае с телефоном – жмем на кнопку «Подтвердить телефон» и вводим код из сообщения. Как только это будет сделано, сайт опубликуется и будет доступен по ссылке.

Как опубликовать страницу на Тильде

25.  Что получилось:

Создание продающего сайта на Тильде

Как настроить сайт на Tilda

Те функции, с помощью которых мы создали сайт, – это не все, что может Тильда. Есть еще один раздел редактирования, в котором можно поменять различные настройки веб-сайта. Чтобы его открыть, достаточно перейти в раздел «Мои сайты», выбрать «Редактировать сайт» и затем нажать «Настройки сайта».

Здесь находятся все внутренности сайта: настройка шрифтов, цвета и главной страницы, аналитика сайта, добавление собственного доменного имени, подключение SEO-сервисов и многое другое.

Тут же мы можем подключить платежные системы либо ограничить доступ к опубликованным страницам. Функционала вполне достаточно, но я не рекомендую забивать голову всем сразу: для начала будет достаточно первых 4-х разделов.


 

Скачано с www.znanio.ru

Практическая работа «Создание сайта на

Практическая работа «Создание сайта на

Далее нас информируют о том, что все прошло успешно – здесь просто жмем «Продолжить»

Далее нас информируют о том, что все прошло успешно – здесь просто жмем «Продолжить»

В отобразившемся меню для нас открывается доступ к различным блокам

В отобразившемся меню для нас открывается доступ к различным блокам

Пролистываем вниз и указываем название для кнопки, например, «Узнать подробнее»

Пролистываем вниз и указываем название для кнопки, например, «Узнать подробнее»

Блок создан, но пока что он наполнен ненужной нам информацией

Блок создан, но пока что он наполнен ненужной нам информацией

В отобразившемся окне предоставляется доступ к модификации текстового элемента

В отобразившемся окне предоставляется доступ к модификации текстового элемента

Размещаем блок справа от текста и увеличиваем его размер – просто кликаем по нему и тянем за нижний левый ползунок

Размещаем блок справа от текста и увеличиваем его размер – просто кликаем по нему и тянем за нижний левый ползунок

Готово! Наш сайт-визитка создан, осталось разместить его в интернете

Готово! Наш сайт-визитка создан, осталось разместить его в интернете
Скачать файл