Читать книгу 9 шагов: Свой сайт за 0 р. - Александр Валериевич Марков - Страница 2

Создать сайт в конструкторе удобнее на компьютере или ноутбуке, т.к. там больше экран. Заходим в поисковую систему и набираем «конструктор сайтов тинькофф» или переходим по ссылке на официальный сайт tinkoff.ru/business/website-builder/ .

На странице конструктора сайтов проходим регистрацию.

Регистрация в конструкторе сайтов Тинькофф

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

Вход в личный кабинет в конструкторе сайтов Тинькофф

После входа вы должны оказаться в разделе «Конструктор сайтов»(сверху должна быть выделена ссылка «сайты»). Кликаем «Добавить сайт».

Добавление сайта в конструкторе Тинькофф

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

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

Выбор шаблона в конструкторе сайтов Тинькофф

1. Основные операции с шаблоном страницы

Сейчас мы кратко рассмотрим основные операции с шаблоном страницы, которые понадобятся в дальнейшем. Сайт состоит из различных блоков. Для изменения блока – наведите мышкой на него(при просмотре с компьютера) или кликните на значок с 3 точками(при просмотре с телефона). Значения каждого значка подписано ниже.

Редактирование блоков в конструкторе сайтов Тинькофф

2. Как изменить цвет или изображение фона блока

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

Изменение цвета или изображения фона блока в конструкторе сайтов Тинькофф

3. Как изменить стиль и размер шрифта, дизайн кнопок

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

1. Для всего содержания

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

Общее изменение размера и стиля шрифта, дизайна кнопок

2. Для отдельных текстовых элементов:

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

Изменение размера и стиля шрифта текстовых элементов

4. Как изменить картинку или ее стиль

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

Как изменить картинку или ее стиль в конструкторе сайтов Тинькофф

5. Откуда брать доп. изображения

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

Чтобы избежать возможного конфликта с автором изображения, лучше использовать картинки, создатели которых разрешают копирование. Найти изображения для сайта, у которых авторы разрешили их копирование можно на следующих сайтах: pixabay.com , unsplash.com , flaticons.net (только значки). На данных сайтах, которые указаны выше в момент написания этой статьи было можно скачать изображения для коммерческих и некоммерческих целей без указания ссылки на сайт автора.

Но как создать сайт, если этих сервисов будет недостаточно? В этом случае вы можете найти в поисковиках по запросу «изображения для сайта». На других сервисах изображения могут быть платными или доступными для бесплатного использования только для некоммерческих целей и/или с указанием ссылки на автора.

1 Шаг. Как сделать шаблон сайта более красочным

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

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

Делаем шаблон сайта более красочным

2 шаг. Как выбрать и изменить верхнюю шапку(меню страницы) сайта или другой блок

По умолчанию в шаблоне «Универсальная страница» указан неплохой шаблон блока верхней шапки(меню страницы), но если вы хотите изменить расположение элементов в верхней шапке(меню страницы), то наведите мышкой на верхнюю шапку(при просмотре с компьютера) или кликните на значок верхней шапки с 3 точками(при просмотре с телефона). У вас появятся доступные операции с блоком, описанные выше. Функция «Заменить» обладает ограниченным выбором, поэтому вместо нее кликаем «удалить» блок, чтобы потом на это место вставить другой.

После удаления наведите мышкой на самый верхний блок и нажмите на плюсик(добавление нового блока), далее выбираем верхнюю шапку, которая понравится.

Удаление и добавление блока верхней шапки в конструкторе Тинькофф

При выборе блока «Меню страницы» название компании, которое выделено желтым фоновым цветом можно заменить на ваш логотип(т.е. картинку). В других вариантах(не выделены желтым фоном) название компании написано текстом и заменить его на картинку(логотип) не получится, можно только изменить надпись.

Логотип или текст в шапке сайта

3 Шаг. Как создать продающую верхнюю шапку