Башкы беттин (же башкы беттин) дизайны - бул веб-сайттын биринчи бетинин визуалдык жана структуралык дизайны, аны коноктор сайтка биринчи жолу киргенде көрүшөт. Башкы бет сайттын биринчи элесин түзүүдө негизги ролду ойнойт жана конокторго керектүү маалыматты табууга же ресурс аркылуу ары багыттоого жардам берет.
1. Shopify Башкы бетинин дизайны
Бул посттогу башка көптөгөн баракчалар сыяктуу эле, үлгү бет Shopify жөнөкөй кылат. Мисалы, колдонуучуга багытталган баш сап бир нече сөздөн турат жана барак сот процессинин чоо-жайын жана артыкчылыктарын берүү үчүн абзацтарга эмес, жөнөкөй окторго таянат. Баштоодон мурун толтурулушу керек болгон бир нече талаалар бар. Мунун баары сиздин куралыңыз менен онлайн сатууну жеңилдетет.
2. Mozzle Башкы бетинин дизайны
Түзүлгөн баракчалар колдонуучуларга сиздин өнүмүңүз же кызматыңыз алардын баалуу убактысына жана күч-кубатына татыктуу экенин чечүүгө жардам берет. Колдонмоңуз чечкен көйгөй менен конокторуңузду далдаштыруудан көрө, баалуу сунушуңузду так жана түз жеткирүүнүн кандай жакшы жолу бар?
Instagram комментарийлери көбүрөөк болот
MozzleЭкрандагы эскертмелердин үнүн басуучу Mac колдонмосу муну толугу менен камтыйт айтпай көрсөтүү алардын минималдуу беттеги менталитет. Бул барактын конокторун экрандын жогорку сол бурчунда ыңгайсыз эскертмелердин тез оту тосуп алат. Анимация кызыктуу гана эмес, ошондой эле узак сүрөттөмөлөрсүз тиркеменин пайдалуулугун ынандырарлык түрдө көрсөтөт.
3. TransferWise Башкы бетинин дизайны
TransferWise сизге бир нече валютада акча жөнөтүүгө жана алууга мүмкүнчүлүк берет жана анын төмөндө көрсөтүлгөн баштапкы бети сизге тиешелүү эмес варианттарга алаксып калбоо үчүн ар бир иш-аракетти бөлүп берет.
Эгерде сиз акча жөнөтүүнү кааласаңыз, анда которуу формасын толтурсаңыз болот. Акча алуу үчүн жөн гана ортоңку өтмөккө өтүңүз жана дебеттик картаңызды колдонуп TransferWise кызматына катталуу үчүн эң оң жактагы өтмөккө өтүңүз.
Бул беттеги ар бир өтмөк өзүн түзөт аракетке чакыруу эмнеге катталып жатканыңызга жараша - үч мүмкүн болгон баштапкы чекиттен кийин кийинки кадамыңызды баса көрсөтүү үчүн ар бири ачык жашыл рамкага ээ.
4. Airbnb Башкы бетинин дизайны
Конокторду хостторго айлантууга жардам берүү үчүн, Airbnb азгыруучу жекелештирүүнү сунуштайт: жайгашкан жериңиз боюнча орточо кирешенин болжолдуу баасы. Сиз дагы жекелештирилген баа алуу үчүн талааларга потенциалдуу жайгаштыруу тууралуу кошумча маалыматты киргизсеңиз болот.
Эгер сиз буга чейин ынанган баракка кирген болсоңуз, барактын жогору жагында иш-аракет кылууга так чакыруу аны ошол эле жерде өзгөртүүнү жеңилдетет.
5.Teambit
кызык HR программалык камсыздоо жөнүндө ойлонгондо, адатта, биринчи сөз эмес, бирок Teambitтин визуалдык баштапкы бети дал ушул. Бир талаа менен жөнөкөй форма жаныбарлардын каармандарына толгон сүйкүмдүү кеңсе менен коштолот - алардын бардыгы абдан Эгер кызыккан болсоңуз, Teambit менен бактылуу болуңуз. Көбүрөөк билүү үчүн конокторду ылдый сыдырууга кызыктыруучу мультфильм жаныбары конуу баракчасынын ар бир маалымат бөлүмүнүн жанында пайда болот. Башкы бет дизайны
Landing page Teambit күлкүлүү десант баракчасын түзүү үчүн "көңүлдүү" продукт же кызматка ээ болуунун кереги жок экендигинин сонун далили.
6. Wistia Башкы бет дизайны
Биринчиден, бул баштапкы бет Wistia алардын акысыз Wistia эсеби үчүн. Каттоо эсебин түзүү үчүн бир талаа менен форманы дароо байкайсыз - минималдуу дизайндагы көк фон ачык ак форма талаасынан сонун карама-каршы келет.
Форма талаасынын узундугу көрүнүктүү жайгаштыруу менен айкалышып, каттоо эсебин түзүүдө дээрлик бардык сүрүлүүнү жок кылат... бирок күмөн санап жатсаңыз, КБСти окуу үчүн ар дайым ылдый сыдырсаңыз болот. Экөөнү күчтүү түстүү контраст менен бөлүп, Wistia конверсия процессин бир топ жеңилдетет.
7. Webflow. Башкы бет дизайны
Webflow, веб-иштеп чыгуучулар үчүн дизайн куралы, GIF жана үч форма талаасына көп маалыматты топтойт. Каттоо формасы толугу менен бир сапта болсо жакшы болмок - бул баракты кыскартып гана койбостон, ар бир талааны солдон оңго карай толтуруу колдонуучуларга төртүнчү көк баскычты басууга жана бекер баштоого канчалык жакын экенин көрсөтөт.
Форманын астындагы анимацияланган GIF веб-сайтта ошол эле кадрда көрсөтүлөт, андыктан колдонуучулар продукттун кантип иштешин көрө алышат. и жылдырбай же жаңы баракка өтпөстөн катталыңыз.
Электрондук китептин башкы бетинин дизайны
8. Nauto Башкы бет дизайны
Науто, өзүн-өзү айдаган унаа маалымат платформасы автопарктарды башкарган компаниялар үчүн автономдуу айдоону коопсуз кылууга жардам берет. Албетте, анын кардарларына бул платформада сатуу үчүн бардык маалымат керек болот. Nauto бул абдан жөнөкөй электрондук китеп, анын баштапкы бети сизге кыска байланыш формасын жана бул ресурс эмне үчүн мынчалык маанилүү экенин далилдөө үчүн алдын ала статистиканы берет.
Жашыл "Азыр жүктөп алуу" баскычы атүгүл атайын жасалган болушу мүмкүн (жашыл түс "баруу" дегенди билдирет).
Төмөн сыдырсаңыз, колдонуучуларга дүкөндө эмне бар экенин эскертиш үчүн дагы бир "Электрондук китепти алуу" CTA көрөсүз. Колдонуучуларды көбүрөөк билүүгө үндөш үчүн, сиз ошондой эле үч оор автокырсык статистикасын көрөсүз. Төмөндө текшерип көрүңүз.
9. Industrial Strong Marketing Башкы бет дизайны
Бул ачылуучу баракча мени дароо өзүнө тартып турат: "Мени чоңойтпо". Бул түздөн-түз телефондорубузду же планшеттерибизди сыдырганда көпчүлүгүбүздүн жалпы тажрыйбабызды көрсөтүп турат - жана бул дагы бир аз шылдың.
Бирок мени бул десант баракчасына кызыктырган жалгыз нерсе эмес. Кызыл түс кандайча стратегиялык түрдө форманын үстүнкү жана ылдый жагына жайгаштырылып, конверсия окуясына дагы жакындап калганына көңүл буруңуз.
Ошондой эле, бул дизайн жүктөө үчүн мета болуп саналат: ал көрүнөт жана жакшы иштейт мобилдик түзмөктөр. Эсиңизде болсун, көптөгөн коноктор сиздин десанттык баракчаларыңызга смартфондорунда же планшеттеринде кире алышат веб-сайтыңыздын дизайны аларга туура келбейт, алар баш тартып, сиздин баракчаңызды таштап кетиши мүмкүн.
Industrial Strength Marketing адистери талаага чыгышты шрифттер жана конокторго, мисалы, окуу жана мазмун менен иштешүү үчүн чоңойтууга муктаж болбошу үчүн жетиштүү өлчөмдөгү формалар.
10. Velaro Live Chat
Кээде эң кичинекей детальдар эң чоң айырманы жаратат. Мисалы, алар десант баракчасын жасагандар Velaro Live Chat укмуш.
Элементтин сүрөтүнүн үстүндөгү кичинекей PDF белгиси жүктөө кандай форматта болорун аныктоого жардам берет. Чакан аталыштын алдындагы жебе коноктор окугусу келген маанилүү көчүрмөнү баса көрсөтүүгө жардам берет. IMPACT сыяктуу, аларда да автоматтык түрдө белгиленген белги кутучасы бар жазылуулар Бюллетенге алардын формасы боюнча - бул кошумча кутучага айланса, жазылуучуларыңыздын санын көбөйтүүнүн эң сонун жолу. Бул кичинекей, анча деле маанилүү эместей көрүнгөн деталдардын баары катуу, укмуштуудай беттин дизайнын кошууга жардам берет. Башкы бет дизайны
11. IMPACT Брендинг жана дизайн / Башкы бет дизайны
башкы бет ТААСИРИ дизайнерлер үчүн илхам булагы болуп келген. Мага беттин жөнөкөй макети, чоң аталышынан жана деталдуу сүрөтүнөн тартып, форманы курчап турган контурга, көзгө абдан жаккан түстөр менен шрифттерге чейин жакшы көрөм.
Бул жерде жүктөп алуу үчүн акысыз кол IMPACT сунуштары да толтурулган форманы тапшырууга мүмкүндүк берген көк баскычта жүктөөнүн өзүн баса көрсөтпөйт. Тескерисинче, IMPACT сизди колдонмону окуудан эмнеге ээ боло турганыңызга көңүл буруп, "көбүрөөк конверсияларды жаратууга" чакырат.
Көбүрөөк билүү үчүн беттер
12. Unbounce
Бекеринен эмес Unbounce Бул тизменин башында турат - алар чындап эле жогорку конвертивдүү десант баракчаларын түзүү боюнча китеп жазышкан. Бул десант баракчасында көптөгөн таң калыштуу нерселер бар болсо да, мага абдан жаккан экөөсү: 1) классикалык форманын ордуна чат кутучасын колдонуу жана 2) форманын/Үйдүн астындагы деталдуу, бирок жакшы пакеттелген маалымат Барактын дизайны
Биринчиси барактын максатына көңүл бурууга жардам берет — анкетаны толтуруу үчүн — көзгө көрүнбөгөн жана түйшүктүү сезилбейт. Экинчиси, ал баракка SEO күчөшүн берет (издөө машиналары сойлоп чыгуу үчүн көбүрөөк мазмунга ээ болот) жана адамдарды чат терезесинен алаксытпай, маалыматты тапшырардан мурун мазмундун бир бөлүгү жөнүндө көбүрөөк билиши керек болгон адамдардын тынчсыздануусун жок кылат.
13. Bills.com. Башкы бет дизайны
Адамдар көбүнчө веб-сайтыңыздагы статикалык баракчалар деп ойлошот. Бирок туура куралдар менен сиз аларды интерактивдүү жана жекелештирилген кыла аласыз.
менен төмөндөгү мисалды алыңыз Bills.com. Алардын кеңеши сага пайда алып келер-келбесин билүү үчүн, форма көрсөтүлө электе үч суроого жооп бер. Муну менен башталат:
Андан кийин сиз төмөндөгүдөй дагы эки суроого жооп бересиз:
Бул жерде сиз маалыматыңызды толтурган акыркы бет формасы:
Алгоритмдин кантип иштээрин билбейм (же такыр бар болсо), бирок мен аны толтуруп жатканда бир аз тынчсыздандым. жок квалификациялар. Мен эмне кылганымды билгенден кийин, анкетаны толтуруу үчүн толкундандым, аны карызы бар жана бул куралды колдонгон адамдардын көпчүлүгү жасашат деп ишенем. Бул сунушту форма конуу бетинде пайда болгонго чейин эксклюзивдүү кылуу менен, мен Bills.com сайты олуттуураак болот деп ишенем. конверсияны жогорулатуу.
14. Trulia Башкы бет дизайны
Trulia анын ачылыш бети менен Bills.com абдан окшош бир нерсе жасады. Ал "даректи" сураган жөнөкөй формадан башталат (бул "сиздин дарегиңизге" караганда анча коркунучтуу эмес угулат, бирок алар ушуну билдирет). Бул жөнөкөй форма талаасынын астында ачык кызгылт сары баскыч бар, ал форманын артындагы каармандын сүрөтүнө жакшы карама-каршы келет жана баа сиздин үйүңүзгө жекелештириле тургандыгын баса белгилейт.
Албетте, үйдүн баасын баалоого даректин өзү аздык кылат. Бул жөн гана үйдүн айланасын билдирет. Мына ошондуктан кийинки бетте мүлктүн өзү жөнүндө кошумча суроолор камтылган, мисалы керебеттердин жана ванналардын саны. Төмөндө "Бизге отчетту кайда жөнөтүш керек экенин айтыңыз" көчүрмөсүн көрө аласыз - бул маалыматты киргизүү менен сиз кыймылсыз мүлк агенти менен байланышууга макул экениңизди билдиресиз. Бул компания өзүнүн конокторун башынан эле кандай баалаарынын сонун үлгүсү, ошол эле учурда коноктордун натыйжада эмне болорун күтөт.
15. Landbot Башкы бетинин дизайны
Landbot, чатботко негизделген десанттык баракчаларды түзгөн сервис, чатта негизделген десант баракчасынын борборуна өзүнүн продуктусун жайгаштырат. Конокторду эмодзилер жана GIF сүрөттөрү менен толукталган достук бот тосуп алат, бул аларды салттуу түрдө эмес, сүйлөшүү форматында маалымат берүүгө үндөйт.
16. Webprofits
Бир аз карама-каршылык үчүн ... узун беттер жөнүндө эмне айтууга болот? Бир нече амалдар менен сиз эң узун бет ача турган бетти да кыска кылып көрсөтө аласыз. Төмөндөгү Webprofits бетинде муну кантип жасоо керектиги көрсөтүлгөн. Башкы бет дизайны
Көбүрөөк билүү үчүн жогорку оң жакта көрүнүктүү CTA баскычы бар - аны өзгөчө кылуу үчүн фондо жакшы контраст жана сыдырууну кубаттоо үчүн ылдый жебе. Форма талаасын алдыга койбой, алар сүрүлүүнү азайтууга жардам берет жана конверттөө опциясы сунушталганга чейин конокторго көбүрөөк билүү мүмкүнчүлүгүн берет.
Алар ошондой эле чындыгында эмне экенин түшүнүүгө мүмкүндүк берет кылат Webprofits . Барактын калган бөлүгүндө маалыматыңызды тапшырганыңызда сиз эмнени ала турганыңыздын чоо-жайы камтылган. Мындан тышкары, анда "Келгиле, сүйлөшөлү" сыяктуу форманы толтуруу үчүн жогору жагына өтүүгө жардам берген стратегиялык CTA камтылган.
17. H.BLOOM
Кээде жөн гана токтоп, анын канчалык кооз экенине суктануу керек. Жогорку чечилиштеги сүрөттү жана конуу бетинде көп ак боштукту колдонууда H.BLOOM кароо жакшы.
Анын кооздугунан тышкары, баракчада бир нече сонун конверсия элементтери бар: үстүнкү форма, форманы толтурганда эмне болорун так жана кыска сүрөттөп берүү, ал тургай ачык кызгылт сары "Тапшыруу" баскычы. Биз өзгөртө турган бир гана нерсе? Тапшыруу баскычына көчүрүңүз - Бул сунушталып жаткан сунушка көбүрөөк мүнөздүү болушу мүмкүн. Башкы бет дизайны
18. Conversionlab
Десант баракчалары жөнүндө постко мисал форма постун кошпойм, бирок бул сайт өзгөчө. башкы бет толугу менен сайт - навигациялык шилтемелер сизди төмөндөгү маалыматка алып барат. Башкы бет дизайны
"Ачуу баракчаларында жардам алуу" баскычын чыкылдатканыңызда, формага орун бошотуш үчүн сайттын баары жылат. Бул чыкылдатуудан мурун кандай көрүнөт:
Жана, ошол CTA чыкылдатканыңызда, форма кандай экенин текшериңиз:
Мага форманы толтуруу үчүн баракты таштап кетүүнүн кереги жок, бирок форма сайттын кокусунан келген коноктору үчүн кийлигишпейт.
Идеялар/Үй бетинин дизайны
Жакшы оптималдаштырылган башкы бет кардарларыңызды жакшыраак түшүнүүгө, сатууга жана конокторуңузду кубантууга жардам бере турган маалыматты алуу менен кардарларды лидерге айландырышы мүмкүн. Баштапкы беттер конверсиялар үчүн абдан маанилүү болгондуктан, алардын жакшы пландаштырылган, иштелип чыккан жана аткарылганын текшерүү маанилүү. багытталган беттер:Жагымдуу эстетика: Сиздин бетиңиздин түсү жана таза колдонуучу интерфейси гана жардам бере алат. Коноктор сиздин өнүмдөрүңүз жөнүндө көбүрөөк билгиси келет жана сиз сунуш кылган баалуулуктун далилин көргүсү келет. Эң сонун веб-баракчанын үлгүсү үчүн биздин тизмедеги №10, Inbound Emotion караңыз.
Азыраак нерсе: Сүйлөмдүн же сүрөттөрдүн көбү сүйлөсүн, бирок бетиңиз ачык жана ынанымдуу болушу үчүн бардык сүрөттөмө баш саптарды жана колдоочу текстти камтууну унутпаңыз. Бул беттеги дээрлик бардык компоненттерге тиешелүү: ак боштук, жөнөкөй көчүрмө жана кыскараак формалар.
Башкы бет дизайны
Конокторду баракчада кармап туруңуз: Негизги навигацияны же алаксыткан шилтемелерди алып салуу менен, конокторду сиздин баракчаңыздан баш тартууга алып келиши мүмкүн болгон коргошун муундун сүрүлүүсү азыраак болот.
Социалдык тармактарда бөлүшүү. Сиздин конуу баракчаңызга конокторду тартуунун оңой жолу бул бөлүшүү баскычтарын колдонуукоомдук тармактар, ошондуктан алар сиздин мазмунуңузду социалдык медиа жолдоочуларына тарата алышат. Анткени, кардарлар сиздин маркетинг маховик борбору болуп саналат.
A/B тестирлөө: Десант баракчаларын туура аткаруу маанилүү жана керектөөчүлөрдүн психологиясы кээде таң калыштуу болушу мүмкүн, ошондуктан кайсынысын конвертациялоо ылдамдыгы (CVR) эң жогору экенин көрүү үчүн баракчаларыңыздын ар кандай версиялары менен эксперимент жасап көргөнүңүз жакшы. Сунуштун позициясын, CTA түрлөрүн, ал тургай түс схемасын текшериңиз.
Чакыруу-аракет: CTA, бул жерде эт конуу бетинде же бурулуш чекити, анда байланыш болуу мүмкүнчүлүгү. CTAлар коноктордон жазылууну, жүктөп алууну, форманы толтурууну, бөлүшүүнү суранышы мүмкүн коомдук тармактар ж.б., бирок жалпысынан, CTA сиздин сунушуңуз менен аудиторияңызды активдүү тартуу үчүн зарыл. Лидерлерди түзүү үчүн, CTAs тайманбас жана кызыктуу болушу керек, бирок эң негизгиси, алар баалуулукту натыйжалуу жеткирүүсү керек.
Комментарий калтыруу