{"id":14291,"url":"\/distributions\/14291\/click?bit=1&hash=257d5375fbb462be671b713a7a4184bd5d4f9c6ce46e0d204104db0e88eadadd","hash":"257d5375fbb462be671b713a7a4184bd5d4f9c6ce46e0d204104db0e88eadadd","title":"\u0420\u0435\u043a\u043b\u0430\u043c\u0430 \u043d\u0430 Ozon \u0434\u043b\u044f \u0442\u0435\u0445, \u043a\u0442\u043e \u043d\u0438\u0447\u0435\u0433\u043e \u0442\u0430\u043c \u043d\u0435 \u043f\u0440\u043e\u0434\u0430\u0451\u0442","buttonText":"","imageUuid":""}

Как собрать сайт-визитку за два часа бесплатно: пошаговая инструкция

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

Эк меня Миджорни изобразил 😂

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

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

Сайт я буду собирать на Тильде. А поскольку я написал уже с десяток статей на vc — для примера сделаю себе портфолио копирайтера.

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

Пишем прототип и выбираем шаблон

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

Что должно быть на главной странице сайта-визитки эксперта:

— кто я такой;

— какие услуги оказываю;

— отзывы (если найдутся);

— собственно портфолио;

— контакты или обратная форма.

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

Блоки в шаблоне можно удалять, менять местами и использовать «не по назначению». Например, если честных отзывов у вас нет — не надо брехать и сочинять, удалите этот блок да и всё.

Шрифты, цвет и расположение элементов менять крайне не советую — может получиться шляпа. Всё-таки шаблон делали профессионалы 😊

Я выбрал шаблон с симпатишным психотерапевтом. Неважно для какой профессии делали шаблон — главное, что он подходит для нашей визитки эксперта

Пишем прототип в гуглдоке. Шаблон при этом можно использовать как подсказку: смотреть на количество текста и столбцов в блоках. На первом экране заголовок в две строки, а текст в четыре. Если я напишу в два раза больше текста, получится говно.

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

Если в прототипе есть колонки — надо написать в них одинаковое количество текста, иначе всё будет криво-косо 💩

Держите мой прототип, дарю. Чтобы вы не заморачивались, как колоночки собирать — сделайте себе копию и пользуйтесь на здоровье

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

Регаемся на Тильде и собираем сайт

Заходим на страницу регистрации, вписываем имя, почту и придумываем пароль. На бесплатном тарифе можно сделать один сайт размером до 50 Мб с доменным именем tilda.ws. А уж если вы хотите красивый домен, настройки СЕО, аналитику и побольше места на диске — извольте покупать платные тарифы.

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

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

Переносим на страницу тексты и иллюстрации из прототипа. Шаблон устанавливается на сайт вместе с демо-контентом — подсказками и картинками. В процессе мы всё это заменим, но можно подглядывать на пропорции и общий вид сайта.

Всё просто: кликаем на элемент, копируем и вставляем. Сначала текст, потом картинки. Их у нас — одна 😄

Все шаблоны Тильды адаптивные — подстраиваются под размер экрана

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

Настройка меню в Тильде

Публикуем сайт. Тыкаем на кнопку «Опубликовать» в панели управления, переходим по ссылке и смотрим, что получилось. Обязательно оцените, как выглядит сайт в разных браузерах и на разных устройствах — например, смартфонах и планшетах. Убедитесь, что всё ок и ничего не поехало.

У меня получился вот такой сайтик:

Какава красота 😍

Ребзя, я потратил на этот сайт и статью три часа. Если бы не статья — наверное, справился бы за два.

Я уверен, что вы справитесь не хуже, а может и лучше меня! И если вы давно собирались сделать себе сайт визитку, но всё как-то откладывали и ждали знак, то вот он:

Пока писал — даже забыл, что я не копирайтер, а транскрибатор и искусственный интеллект! Чего не сделаешь ради друзей! 😉

С нетерпением жду ваши видео и аудиофайлы — все расшифрую в лучшем виде! Всем обнимашки, мои золотые! 🤗

0
4 комментария
Макс Кравец

Ничошная визиточка получилась)

Ответить
Развернуть ветку
Alexey Zholobov

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

Ответить
Развернуть ветку
Сергей Епифанцев

Ля, а я в бутстрапе неделю ковырялся))))

Ответить
Развернуть ветку
Писец
Автор

ну зато теперь новая ачивка

Ответить
Развернуть ветку
1 комментарий
Раскрывать всегда