Подборка сайтов из галереи лучших проектов на Тильде — Дизайн на vc.ru
#madeontilda — галерея проектов пользователей Тильды, где можно найти примеры современного веб-дизайна. Каждый день нам присылают десятки работ, дизайнеры отбирают лучшие из них и публикуют в открытом доступе. Мы выбрали для вас девять проектов из галереи и расскажем об интересных визуальных решениях, которые заметили.
8930 просмотров
В статье: сайт онлайн-курсов по гуманитарным наукам от медиа-проекта «Страдающее Средневековье», сайт и интернет-магазин сети салонов для кудрявых, лендинг выставки, посвящённой Алексею Балабанову, лонгрид об игре-головоломке Тетрис и другие проекты. Это вторая подборка для вдохновения читателей VC: сайты можно сохранить как референсы, или познакомиться и поддержать новый проект. Первую подборку смотрите по ссылке.
Так и ходи
https://takihodi.ru
Сайт сети салонов для кудрявых. Дизайн выполнен в фирменном стиле бренда: яркие цвета и немного небрежный акцидентный шрифт напоминают о таких же кудрявых волосах.
На сайте также есть интернет-магазин с косметикой для волос и мерчем, которые можно купить с доставкой. В каталоге при наведении на карточки кондиционеров появляется фотография с типом волос, для которых это косметическое средство подходит.
Балабанов — выставка-путешествие
https://balabanov.live
Лендинг выставки в пространстве «Севкабель Порт», посвящённой Алексею Балабанову. Акцидентный шрифт с засечками Camerton и «шумный» фон создают на сайте атмосферу архива. На странице представлены не только фотографии с выставки, но и кадры из фильмов режиссёра.
Обложка, сделанная из нескольких слоёв текста и изображений, выглядит как плакат.
Шапка при скролле фиксируется вверху страницы. В меню выделен пункт с целевым действием — покупкой билетов. Жёлтый цвет сразу бросается в глаза, позволяет быстро найти ссылку и оплатить посещение выставки. В бегущей строке посетитель сайта может прочитать о ключевых особенностях экспозиции: её площадь, наличие аудиогида, количество тематических зон. Организационную информацию о выставке и правила посещения тематически вынесли в конец лендинга — в блок «Титры». Выставка проходит до 15 января 2023 года.
Страдариум
https://stradarium.ru
Сайт онлайн-курсов по гуманитарным наукам от медиа-проекта «Страдающее Средневековье». Сайт выполнен в контрастных цветах с отрисованными границами модулей и изогнутыми линиями в оформлении. Анимация по ховеру с инверсией цвета добавляет дизайну динамики и интерактивности.
На главной странице для каждого курса используются авторские иллюстрации, символизирующие тему. Страницы образовательных программ также оформлены по-разному: на лендинге «Пять разговоров о Данте» преобладают красный и бежевый цвета, а на странице курса про Босха — зелёный и чёрный.
На каждом лендинге можно найти программу курса, узнать, как проходить обучение, а если ведётся набор на курс — сразу оплатить его.
Monday4me
https://monday4.me
Сайт сервиса заботы о ментальном здоровье, работающего на базе телеграм-бота. Главная страница запоминается благодаря иллюстрациям с маскотом. Он и рукописные элементы дополняют лендинг, делая его дружелюбным. Видео с демонстрацией сервиса показывают, как работает бот и чем он будет полезен. Проблемы, с которыми помогает сервис, перечислены в виде карточек с анимацией по ховеру. При наведении на них текст меняется и посетитель сайта может узнать, где искать помощь внутри бота.
Список психологов сервиса сделан в виде карточек в слайдере. На каждой указаны специализация, опыт работы и есть кнопка «Подробнее», кликнув на которую можно узнать больше об эксперте. Блок с ответами на часто задаваемые вопросы сделан в виде раскрывающегося списка. Такое оформление позволяет быстро найти нужный вопрос и открыть развёрнутый ответ.
Ниже привлекает внимание анимированный по скроллу блок из трёх рядов кнопок с призывами к действию: попробовать, завести дневник эмоций, помочь другим. При клике них открывается телеграм-бот.
Светлячок
https://svetlyachok.nnov.ru
Сайт центра раннего развития детей в Нижнем Новгороде. Дизайн сайта напоминает детскую книжку, которую читают перед сном. Анимация помогает погрузить пользователя в историю и подталкивает пролистать блоки ещё раз. Пастельные цвета, фетровые игрушки и облачка передают атмосферу детства. Пунктирные линии в иллюстрациях, логотипе и в оформлении блоков объединяют элементы, делая дизайн сайта гармоничным и цельным.
RisePack
https://risepack.ru
Сайт производства вакуумных и термоусадочных пакетов. Основной цвет сайта — молочный, а жёлтый и синий используют для акцентов и интерактивных элементов, например, для кнопок. На сайте можно оформить заказ продукции. Для этого нужно кликнуть на кнопку «сделать заказ» и заполнить форму.
На главной странице в слайдере изображены пакеты, которые производит компания. Ниже визуальная перебивка — пакет с акулой внутри во весь экран и бегущая строка на заднем фоне. Необычная крупная деталь привлекает внимание посетителя сайта, он прокручивает сайт дальше и попадает на блок с преимуществами продукта. Ключевая информация о компании выделяется анимацией цветного шейпа, который как будто перетекает с одного пункта в другой. География поставок изображена в виде интерактивной карты с цифрами, при наведении на которые подсвечивается название региона.
Клиника «Апельсин»
https://apelsinstom.ru
Сайт стоматологической клиники Санкт-Петербурга. Тёплая палитра, нетипичная для сайта медицинского учреждения, создаёт ощущение комфорта и уюта. Фотографии клиники и команды сделаны в единой стилистике, хорошо вписываются в дизайн сайта, располагают к себе и вызывают доверие.
В блоке «Услуги и цены» при наведении карточка меняет цвет: фон становится оранжевым, а шрифт белым.
Этот приём с инверсией цвета по ховеру помогает пользователю понять, на какой услуге он сейчас находится, и выделяет её среди других. При клике на карточку появляется поп-ап со стоимостью и кнопкой записи на приём.
Ano-identity
https://ano-identity.ru
Минималистичный сайт образовательного курса для студентов. Выполнен в чёрно-белых тонах. Заголовок в обложке залит градиентом. В качестве декоративных элементов используют фигуры и акцидентный шрифт, который задаёт характер. Заявки на курс принимались до 20 октября. Количество дней до окончания срока показывал таймер с обратным отсчётом.
Тетрис
http://tetris-game.tilda.ws
Лонгрид об игре-головоломке Тетрис. Игровую тему подчёркивают шрифты и сочетание чёрного и зелёного цветов. Текстовые блоки повторяют вид фигур из игры. По всему лендингу появляются анимированные формы и гифки, отсылающие к Тетрису. А если нажать на кнопку Start, можно сыграть в игру прямо на сайте.
Больше вдохновляющих проектов, созданных на Тильде, смотрите в галерее #madeontilda.
Основные виды сайтов: примеры и шаблоны
Сайтов в интернете более миллиарда, у каждого есть своя цель и функция. Сайты можно разделить на 4 вида: авторитетные, лидогенерирующие, продающие и обслуживающие. Некоторые сайты сочетают в себе сразу несколько функций, но как правило один из них преобладает.
Зная об основных видах сайтов, их структуре и отличительных чертах, вы сможете избежать ошибок при выборе и разработке вашего сайта, а также определить примерную стоимость и общий бюджет проекта.
Рассказываем подробнее о 4 основных видов сайтов, а также их категориях. Поехали!
- Авторитетные
- Лидогенерирующие
- Лидогенерирующие
- Обслуживающие
Основная задача авторитетного сайта — обеспечить присутствие в интернете и генерировать лиды офлайн. Из названия можно сделать вывод, что целью авторитетного сайта является демонстрация легитимности вашей компании и услуг, которые вы можете предложить посетителям.
Персональные сайты
Главная цель при создании персонального сайта — демонстрация онлайн-резюме или портфолио. Сайт музыканта и видеопродюсера Эндрю Хуанга является отличным примером. На сайте присутствует большое количество контента, описывающего его самого, его профессиональные достижения, услуги и способы сотрудничества.
Источник: Andrew HuangКорпоративные сайты
Дизайн корпоративного сайта должен быть информативным и понятным. Возможно, пользователи, которые посещают ваш сайт, уже знают что-то о вас. Все, что им теперь нужно, — это удобное меню, обновления и услуги.
Правительственные сайты
Сайты правительственных организаций известны своим простым и незатейливым дизайном. Дизайн для них занимает далеко не первое место по приоритету, так как им нет необходимости привлекать посетителей, они предпочитают вкладывают средства в создание полезного контента, чтобы любой пользователь мог без труда найти нужную информацию на сайте.
Свадебные сайты
Благодаря техническому прогрессу даже традиционные форматы переходят на цифровые платформы. Простой свадебный сайт позволит оформить приглашения, которые не вредят экологии и сэкономят средства, создать фотогалерею, доступную сразу всем гостям и многое другое.
Источник: Zola
Такие сайты оптимизированы под SEO и созданы для привлечения лидов из интернета. Многие сайты, генерирующие лиды, предоставляют свои услуги офлайн, но тем не менее имеют цель появляться в результатах поиска в рамках маркетинга.
Сайт местного бизнеса
Местному малому бизнесу очень важно иметь лидогенерирующий сайт, который поможет завоевать популярность и привлечь клиентов. Такие сайты обычно состоят из одной страницы, которая дает краткую информацию о бизнесе, контакты, меню и услуги.
Источник: The People VS Coffee
Сайты некоммерческих организаций
Сайты благотворительных и некоммерческих организаций — отличный пример комбинации функций авторитетных и лидогенерирующих сайтов.
Их целью является конвертация пользователей, но при этом они служат и в качестве онлайн-каталога для демонстрации прошлых проектов и достижения, чтобы вызвать доверие и заинтересовать аудиторию.
Сайты образовательного учреждения
Посещая сайты учебных заведений, пользователи уже знают о высшем образовании, и, казалось бы, сайт должен быть авторитетным по виду. Но высокая межвузовская конкуренция и запросы студентов изменили сферу образования. Теперь университеты стремятся не только создать сайт с привлекательным дизайном, но и занять высокие позиции в ранжировании.
Источник: The University of Chicago
Создание продающего сайта предполагает и привлечение лидов и продажи онлайн. Такие сайты полагаются на SEO и маркетинг, чтобы повысить конверсию и привлечь и сохранить клиентов посредством контент-маркетинга.
Сайты электронной коммерции
Очевидно, что основная цель продающих сайтов — продавать товары. Электронная коммерция — одна из самых быстрорастущих отраслей, на что есть свои основания.
Поскольку 18% мировых розничных продаж происходит в интернете, неудивительно, что многие международные конгломераты, например, Apple, H&M и IKEA, переключают свои усилия на электронную коммерцию. За последнее десятилетие появилось множество сайтов прямой электронной коммерции, среди которых лидируют Amazon и eBay.
Читайте также:
- 7 шаблонов лендинга для маркетинга на 2022
- Как создать сайт с помощью Renderforest
Сайты малого бизнеса
Люди по всему миру все чаще совершают покупки в маленьких магазинах, оказывая таким образом поддержку малому бизнесу. Такие типы бизнеса обычно имеют маленькую команду и одностраничный сайт электронной коммерции. Рекламу они публикуют в основном в социальных сетях, поэтому целью сайта является не генерирование лидов, а простая и удобная система продажи товаров.
Источник: Bluboho
Стриминговые сайты
Стриминговые сервисы стали неотъемлемой частью нашей жизни.
Такие компании, как Netflix, Hulu и Disney+ появились сравнительно недавно, но уже завоевали внимание и любовь зрителей, и мы уже не можем представить свою жизнь без них.
Сайты для краудфандинга
Краудфандинг — настоящая находка для тех, у кого есть крутая идея и нужны средства для ее реализации. В 21 веке инвестиции и кредиты в банке совсем не обязательны. Достаточно создать краудфандинговый сайт, собрать нужные средства и начать свой путь в бизнесе. Сегодня в интернете можно найти множество сайтов, единственной целью которых является краудфандинг, такие, как GoFundMe, Indiegogo и Patreon.
Источник: Patreon
Такие сайты — это и есть бизнес. Сайт не разрабатывается для продажи продукта, сайт и есть продукт. Эти сайты не генерируют лиды, они открыты для пользователей.
Сайты-социальные сети
Ярчайшими примерами таких сайтов являются Facebook, Instagram, Twitter и другие платформы. Наши профили в социальных сетях трансформировались в бесплатные страницы для личного и коммерческого использования.
Да, многие платформы социальных сетей начали превращаться в торговые и рекламные площадки, но их первоначальная цель — предоставить пространство для общения с друзьями, семьей и всем миром.
Сайты-форумы
Чаты и форумы были первыми обслуживающими сайтами. Когда личные компьютеры стали частью обыденности, люди стали формировать сообщества и обсуждать общие интересы. Это и стало предпосылкой к появлению социальных сетей.
Источник: Wedding Bee
Развлекательные сайты с видеоконтентом
Поскольку концентрация внимания людей продолжает снижаться, видеоконтент стал настоящим развлечением 21 века. Малыши, которые не умеют читать и писать, могут найти свои любимые мультфильмы; пожилые люди могут смотреть видео с рецептами, а молодежь развлекается как может. Кто из нас не пропадал часами на YouTube?
Wiki-сайты
Такие сайты разработаны на основе форумов и Википедии и стали настоящим социальным феноменом. Пользователи тратят свое свободное время на редактирование, развитие и обновление сайтов о книгах, фильмах и знаменитостях.
Какие бы ни были у вас интересы, вы сможете найти тематический Wiki-сайт.
Современные сайты продолжают развиваться и обретать новый функционал, чтобы удовлетворить возникающие потребности пользователей. О главных видах сайтов мы уже рассказали, теперь предлагаем просмотреть готовые шаблоны и создать свой сайт.
СОЗДАТЬ САЙТ
сайтов Google Sites: более 25 вдохновляющих примеров (2023 г.)
веб-сайтов Google Sites: более 25 вдохновляющих примеров (2023 г.)Последнее обновление 2 января 2023 г.
Написано Стив Бенджаминс
Сайты Google бесплатны, но базовые . Определенно есть лучшие, более настраиваемые конструкторы сайтов (например, Squarespace), но они стоят денег. Так что это вопрос вашего бюджета.
Если вы решите использовать Сайты Google, вы должны знать, что он включает только один шаблон с несколькими вариантами стиля (называемый «Темы» в Сайтах Google).
Вот почему все приведенные ниже примеры выглядят одинаково. Те, у кого самый уникальный внешний вид, максимально использовали Сайты Google, используя свои собственные фотографии и типографику.
Примечание — Если важно найти бесплатный конструктор сайтов, вы также можете попробовать Square. У него лучший бесплатный план среди конструкторов сайтов.
Сделано с Сайтами Google
Режиссер из Чехии.
Сделано с Сайтами Google
Профессор-исследователь, преподает в Университете Ксавьера. Вы можете найти информацию о его образовании, резюме и загрузить некоторые из его исследований, чтобы узнать о его выводах.
Сделано с Сайтами Google
Jivrus Technologies предоставляет программные решения на глобальном уровне. Они берут самые важные основы, такие как простота использования и решение проблем, и учитывают их при создании новых программ для поддержания совершенства.
Сделано с Сайтами Google
Avox Architects — молодая архитектурная фирма, которая стремится представить свои проекты и использовать свой новый веб-сайт для демонстрации своих услуг и портфолио, чтобы привлечь потенциальных клиентов.
Сделано с Сайтами Google
Сюй Чу — группа профессоров Университета Торонто. Все исследования и учения основаны на изучении петрологии. Если вы являетесь частью его класса, вы также можете получить доступ к информации о курсе.
Сделано с Сайтами Google
Экспертиза и консультации по онлайн-ставкам и играм. Эксперты по электронным играм предоставят консультанта с многолетним опытом, который поможет вам получить максимальную отдачу от затраченных средств.
Сделано с Сайтами Google
Поддержка технологий и программного обеспечения на рабочем месте, которые значительно облегчают вашу жизнь. Прочитайте, почему они рекомендуют VOIP, системы безопасности и подпишитесь на их рассылку.
Сделано с Сайтами Google
Flipping Retail — это консультационная фирма по брендингу, которая помогает компаниям успешно продавать на Amazon, а также продавать в розницу. Компанией управляет Бриттани Браун, которая сама работала на Amazon, прежде чем открыть самостоятельное отделение.
Сделано с Сайтами Google
Рестон ЛОР — это отделение оториноларингологии, расположенное в Вирджинии. Вы можете найти формы и другие ресурсы, если вы уже запланировали посещение одного из двух мест.
Сделано с Сайтами Google
Дополнительный сайт шоу, предлагающий подкасты, доступную музыку из шоу и многое другое. По сути, фанатичный веб-сайт, который связывает вас со всем, что связано, включая людей, которые имеют такую же любовь.
Сделано с Сайтами Google
Petersfieldhigh.com — это школьный веб-сайт + сайты интрасети, созданные Дэниелом Уиздомом (учителем в школе) для управления деятельностью школы, веб-сайт, академические отчеты, административные рабочие процессы, дисциплина, информационная панель для учащихся и родителей.
Сайт полностью полагается на использование приложений GSuite для сбора и представления данных.
Сделано с Сайтами Google
Moalboal Adventures предлагает индивидуальные приключения на юге Себу, Филиппины.
Сделано с Сайтами Google
Совет учителей из долины Патнэм. Эти учителя работают вместе, чтобы поддерживать стандарты преподавания и обсуждать важные вопросы, такие как пенсии и сбор необходимых средств.
Сделано с Сайтами Google
Лео Ки Чье — автор интернет-журнала, который публикует статьи в качестве хобби. Живя в Сингапуре, он пишет для журнала Molton Dew.
Сделано с Сайтами Google
Huegel Eagles PTO — родительская организация начальной школы. Этот веб-сайт прилагает усилия, чтобы объединить школу и домашнюю жизнь, чтобы цели в обоих местах совпадали.
Сделано с Сайтами Google
Научные исследования и профессор, занимающийся вопросами окружающей среды.
Найдите исследования, людей в его группе и контактную информацию, если это необходимо.
Сделано с Сайтами Google
Энди Уолбер — писатель, консультант и оратор. Вы можете связаться с ним, чтобы узнать о потребностях бизнеса, связанных с технологиями, и прочитать его статьи в TechRepublic.
Сделано с Сайтами Google
Курс йоги и медитации в Вирджинии. Вы можете присоединиться к этой группе бесплатно, слушать загрузки и смотреть видео, а также узнавать о доступных ретритах.
Сделано с Сайтами Google
Комедийный ситком в Кливленде, штат Огайо. Ознакомьтесь с актерским составом и просмотрите полные списки доступных эпизодов. Проверьте информацию о кастинге для будущей работы!
Сделано с Сайтами Google
Фестиваль в Новой Зеландии, посвященный японской культуре. Найдите информацию о спонсорах, площадках и арендной плате. Этот фестиваль посещает более 10 000 гостей.
Сделано с Сайтами Google
Группа ревизии лесов в Аризоне. Вы можете найти всю необходимую информацию, чтобы знать, где они находятся в процессе, а также посетить их лично на местных мероприятиях.
Сделано с Сайтами Google
Портфолио Illustrator и советы по всем изображениям, созданным с помощью Google Drawings. Вы можете посетить вкладку процесса, чтобы просмотреть ресурсы о том, как он это делает, и загрузить его бесплатные ресурсы, если вы хотите попробовать сами.
Сделано с Сайтами Google
Фармацевтическая продукция, используемая в больницах, аптеках и кабинетах врачей в Йемене. Они сосредоточены на предоставлении качественных и современных продуктов для своих объектов.
Сделано с Сайтами Google
Шарон и Данило Васич — семейный дуэт фотографов из Европы. У них обоих есть опыт в моде и рекламе, который перетекает в их свадебное и редакционное портфолио.
Сделано с Сайтами Google
Группа директоров в штате Мэн, которые тратят свое время на совершенствование технологических систем в местных школах. Они надеются, что тем самым проложат путь к стандартам высшего образования.
Сделано с Сайтами Google
K-8 Школа языка и культуры хмонгов в Миннесоте. Они сосредоточены на приеме самых разных детей, чтобы расширить и обучить несколько культур.
Сделано с Сайтами Google
Джошуа Помрой — смелый дизайнер и преподаватель всего, что связано с дизайном. Он работает над книгами, журналами, декором и многим другим. Посмотрите его видео, чтобы получить помощь в своих творческих проектах.
Сделано с Сайтами Google
Отель в Бельгии, который уже несколько лет входит в топ-15. Просмотрите их галерею, забронируйте проживание и узнайте о многих доступных удобствах, включая туры по каналам.
Играть
Топ-5 конструкторов сайтов в 2023 году
Играть
Бизнес-тур: $500 в месяц Продажа мешковины из мешковины
Играть
Яблоки обожают этот маркетинговый трюк
Примеры квадратного пространства
Веб-сайты GoDaddy
Веб-сайты Wix
Веб-сайты Weebly
Магазины Shopify
Примеры веб-сайтов Squarespace — Сделано с помощью Squarespace — Squarespace
Прокрутите, чтобы изучить
rebeccamapes.
com
gretelny.com
caylonhackwith.com
mikeperrystudio.com
yarzatwins.com
architectureplusinformation.com
ryucreative.com
highgloss.biz
studiobramble.com
aronmayo.com
morgansiggard.com
la playa.studio
alanadimou.com
meiwensee.com
samanthakeelysmith.com
scottsnyderphoto.com
fuktmagazine.com
villarondinelli.com
playandpublic.com
oilboy.sg
flaneur-magazine.com
drinkminna.com
supernaturalkitchen.com
samuelsparrow.com
melula.com
beinginhistory.com
schneidstudio.com
aspect-home.com
shopnotworkrelated.com
Palaceramics.com
jbd- label.com
unwrp.com
shopmemor.com
artipsstudio.com
meiwensee.com
ashowens.com
ripostemagazine.com
9000 2 onemag.ustaylranne.com
legue.
co
deemjournal.com
hunterandfolk.com
simplelivingwell.com
bluedognyc.com
banditsnyc.com
redbirdro oftop.com
eatatelma.com
comvietnamese.com
kingrestaurant.nyc
leisirwine.com
drandgrain.com
fatchoynyc.com
jusjus.saladforpresident.com
jonesbbqkc.com
дочка.nyc 90 003
eatniceday.com
laloubrooklyn.com
minaab.com
pilatesbyamanda.com
casamami.co
in8lovewellness.com
altrocksurfaces.com
90 002 abathhouse.comlavada.com.au
pierrethiam.com
wildheartflowers .com/home
yellowco.co
backbipoc.com
ланч-групп.com
openhouseworldwide.org
thetraumaofmoney.com
ПортфолиоИнтернет-магазинБлогРесторанМестный бизнес
ПОРТФОЛИО
МАГАЗИН
БЛОГ
РЕСТОРАН
9 0375 БИЗНЕС
rebeccamapes.
com
Коллекция самых красивых, функциональных и вдохновляющих веб-сайтов, созданных пользователями Squarespace. 100003
highgloss.biz
studiobramble.com
aronmayo.com
morgansiggard.com
laplaya.studio
alanadimou.com
mei wensee.com
samanthakeelysmith.com
scottsnyderphoto.com
fuktmagazine.com
villarondinelli.com
playandpublic.com
oilboy.sg
flaneur-magazine.com
drinkminna.com
supernaturalkitchen.com
samuelsparrow.com
melula.com
beinhistory.com
schneidstudio.com
аспект-дом.com
shopnotworkrelated.com
Palaceramics.com
jbd -label.com
unwrp.com
shopmemor.com
artipsstudio.com
meiwensee.com
ashowens.com
ripostemagazine.com
onemag.us
taylranne.com
legue.co 90 003
deemjournal.com
hunterandfolk.com
simplelivingwell.