Taptop | Визуальный редактор кода

Покажем, как сделать сайт более эстетичным и залипательным, добавив видео на фон главной страницы. Расскажем, как правильно настроить виджет Видео, а также его размеры и позиционирование.

В этом уроке мы научим вас разбираться в единицах измерения в верстке. Максимально подробно расскажем, зачем и для каких случаев используют px, %, vw, vh.

1

Назад

Нравится 1

• Евгения Байкова

00:15:46

Комментировать 0 0 0

Это было настоящее исследование — 15 часов верстки одного макета в трех вариациях: на обычной Тильде, на Тильде с модами и на Таптопе. Мы решили точно узнать, сколько времени займет верстка, насколько удобен процесс работы и получится ли полностью повторить макет. Для этого мы обратились к независимому эксперту — веб-дизайнеру Алине Котылевской. Она провела эксперимент по верстке одного из своих макетов, сняла свою работу на видео и сделала подробное сравнение по целому списку критериев. Этот пр

5

+2

Назад

Нравится 5

• Julia Lein
• Nikolay Khan
• Кирилл
• Марина Гузей
• Евгения Байкова

11 мин. читать

Комментировать 0 2 2

Разберем, как настроить анимацию при наведении и клике на платформе Taptop — на примере стильной карточки, которая украсит любой сайт и точно привлечет внимание пользователей.

2

Назад

Нравится 2

• Евгения Байкова
• Домовой

00:13:55

Комментировать 0 2 2

Расскажем про настройку анимации по триггерам Click & Hover на платформе Taptop, а также на примерах объясним настройки такой анимации. Это не только визуально выделит элементы сайта, но и повысит его юзабилити.

2

Назад

Нравится 2

• Марина Гузей
• Евгения Байкова

00:14:25

Комментировать 0 1 1

Стоит ли дизайнеру участвовать в баттлах? Приз, конечно же, хочется... Но начинающий дизайнер может подумать: «У меня же нет крутых скилов». А опытный решит: «Зачем мне отвлекаться от оплачиваемых проектов?» Мы считаем, что каждый дизайнер сможет получить большую пользу от участия в профессиональном конкурсе. Какую именно — расскажем в статье. А заодно — пригласим вас на новый баттл для веб-дизайнеров от no-code платформы Taptop.

1

Назад

Нравится 1

• Евгения Байкова

4 мин. читать

Комментировать 0 1 1

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

1

Назад

Нравится 1

• Евгения Байкова

6 мин. читать

Комментировать 0 0 0

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

1

Назад

Нравится 1

• Евгения Байкова

8 мин. читать

Комментировать 0 0 0

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

3

Назад

Нравится 3

• Филипп Ян
• Kseniya
• Евгения Байкова

00:08:27

Комментировать 0 2 2

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

2

Назад

Нравится 2

• Макс Брызгалов
• Евгения Байкова

00:14:41

Комментировать 0 1 1

Это было настоящее исследование — 15 часов верстки одного макета в трех вариациях: на обычной Тильде, на Тильде с модами и на Таптопе. Мы решили точно узнать, сколько времени займет верстка, насколько удобен процесс работы и получится ли полностью повторить макет. Для этого мы обратились к независимому эксперту — веб-дизайнеру Алине Котылевской. Она провела эксперимент по верстке одного из своих макетов, сняла свою работу на видео и сделала подробное сравнение по целому списку критериев. Этот пр

5

+2

Назад

Нравится 5

• Julia Lein
• Nikolay Khan
• Кирилл
• Марина Гузей
• Евгения Байкова

11 мин. читать

Комментировать 0 2 2

Стоит ли дизайнеру участвовать в баттлах? Приз, конечно же, хочется... Но начинающий дизайнер может подумать: «У меня же нет крутых скилов». А опытный решит: «Зачем мне отвлекаться от оплачиваемых проектов?» Мы считаем, что каждый дизайнер сможет получить большую пользу от участия в профессиональном конкурсе. Какую именно — расскажем в статье. А заодно — пригласим вас на новый баттл для веб-дизайнеров от no-code платформы Taptop.

1

Назад

Нравится 1

• Евгения Байкова

4 мин. читать

Комментировать 0 1 1

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

1

Назад

Нравится 1

• Евгения Байкова

6 мин. читать

Комментировать 0 0 0

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

1

Назад

Нравится 1

• Евгения Байкова

8 мин. читать

Комментировать 0 0 0

Адаптация сайта под разные экраны — привычная головная боль для веб-дизайнера при верстке проекта. Как не потратить на это целую вечность и получить сайт, как на макете? Расскажем, как автоматизировать процесс и ускорить создание сайта, используя фишки верстки в конструкторе Taptop.

2

Назад

Нравится 2

• Julia Lein
• Евгения Байкова

6 мин. читать

Комментировать 0 1 1

Слайдер добавляет сайту динамики и помогает нестандартно упаковать контент, а значит — привлечь внимание пользователей. Предлагаем не ограничиваться скучным блоком со стрелками по бокам и точками снизу, а создавать более креативные решения. Чтобы клиенты залипли и не смогли оторваться от листания. Давайте посмотрим, какие интересные эффекты можно сделать на слайдерах, на примере креативов из конструктора сайтов Taptop. А потом разберемся, как самим создать кастомный слайдер. Итак, начинаем смотр

2

Назад

Нравится 2

• Julia Lein
• Евгения Байкова

6 мин. читать

Комментировать 0 5 5

Долгая загрузка — это стоп-фактор, мешающий продвижению сайта в Google. Поисковик знает, что пользователи не любят ждать, и понижает в выдаче медленные веб-страницы. Расскажем, от чего зависит производительность и как ее проверить в сервисе Google PageSpeed Insights. А еще разберемся, как ускорить загрузку сайта, чтобы он смог попасть в топ поиска.

2

Назад

Нравится 2

• Julia Lein
• Евгения Байкова

6 мин. читать

2 комментария 2 3 3

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

2

Назад

Нравится 2

• Julia Lein
• Зорич Юрий

7 мин. читать

Комментировать 0 4 4

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

4

+1

Назад

Нравится 4

• Julia Lein
• Паша Бурмистров
• Аngela
• Евгения Байкова

7 мин. читать

Комментировать 0 3 3

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

2

Назад

Нравится 2

• Diana Biktasheva
• Julia Lein

5 мин. читать

Комментировать 0 2 2

Покажем, как сделать сайт более эстетичным и залипательным, добавив видео на фон главной страницы. Расскажем, как правильно настроить виджет Видео, а также его размеры и позиционирование.

В этом уроке мы научим вас разбираться в единицах измерения в верстке. Максимально подробно расскажем, зачем и для каких случаев используют px, %, vw, vh.

1

Назад

Нравится 1

• Евгения Байкова

00:15:46

Комментировать 0 0 0

Разберем, как настроить анимацию при наведении и клике на платформе Taptop — на примере стильной карточки, которая украсит любой сайт и точно привлечет внимание пользователей.

2

Назад

Нравится 2

• Евгения Байкова
• Домовой

00:13:55

Комментировать 0 2 2

Расскажем про настройку анимации по триггерам Click & Hover на платформе Taptop, а также на примерах объясним настройки такой анимации. Это не только визуально выделит элементы сайта, но и повысит его юзабилити.

2

Назад

Нравится 2

• Марина Гузей
• Евгения Байкова

00:14:25

Комментировать 0 1 1

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

3

Назад

Нравится 3

• Филипп Ян
• Kseniya
• Евгения Байкова

00:08:27

Комментировать 0 2 2

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

2

Назад

Нравится 2

• Макс Брызгалов
• Евгения Байкова

00:14:41

Комментировать 0 1 1

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

1

Назад

Нравится 1

• Евгения Байкова

00:06:16

Комментировать 0 0 0

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

1

Назад

Нравится 1

• Евгения Байкова

00:28:01

Комментировать 0 1 1

В этом уроке мы расскажем, как сделать уникальный дизайн кнопок при наведении курсора — разберем, как работает hover.

2

Назад

Нравится 2

• Евгения Байкова
• Софья

00:15:29

Комментировать 0 1 1

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

6

+3

Назад

Нравится 6

• Julia Lein
• Максим Апухтин
• badkadieff
• Кир Белый
• Dmitrii Goldobin
• Евгения Байкова

00:39:07

Комментировать 0 1 1