页游真实素材地址获取_分享一个小技巧,用Ant Design 做企业官网落地页

本文介绍如何设计有效的落地页,包括选用合适的组件、构建吸引人的Banner以及整合关键信息如产品介绍、价格页等内容。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

6208a525c189229635c7b6525d3a1647.png

流量当道的今日,无法获取到流量就无法获取到用户。

常见的流量获取方式有:付费搜索流量、社交软件页面广告投放、电子邮件广告、自然搜索流量。

就像是这样:

64fb662609d774b7d450780342b1a106.png

但每一个流量渠道的适用人群都会有不一样的特征,我们在投放时也会选用更加契合渠道用户的广告词,以此来吸引更多的人点击。

9b143babb02bdc1077e7a90eafa27597.png

但是,点击后你不可能将他们都统一放在首页,这样不具有针对性,反而在这一步流失掉用户。所以,不如创建一个与广告文案匹配的独立目标网页。我们称之为:着陆页或落地页。

0141b1a007661bc0363026c7dbba44ce.png

落地页跟首页相似,但也包含了不同的地方。

以下图为例:

8a197fe3115b617acf579a2dc17e5e10.png

左图为首页,展示更加的多元化;右图为展示页,仅仅是对于某个商品的展示。

简单说,首页有很多潜在的干扰因素,是为了让一个陌生的用户完全的了解我们,但落地页却非常专注。我们靠着什么样的广告语,吸引了人群,则落地页就要服务于那样的广告语。

430ce6ebc0383fe68db0114c6609ca63.png

那如何设计好一个落地页呢?我们可以选择用 Ant Design Web 组件中的落地页组件来进行组合。

Ant Design 落地页组件,都是源自它们精心设计的百搭型 Landing 模板,用它可以快速拼搭出自己所需要的精美 Landing Page(着陆页、落地页)。

落地页通用设计,那肯定是好看的 banner 啦!

图片比文字承载的信息更多,也更容易抓人眼球。banner页要充分的凸显自己的业务或者彰显品牌的格调。

举几个例子

2a99d3b077df5096468973758418bd8b.png

8e1fe8a506409021d8c6deb377331911.png

76ead962b5b0366b7787a6d22c8b4b2d.png

想要宣传的点比较多,还可以采用轮播图:

ebddc01802a5278eecee50f2fab2453f.png

如果是服务性的公司想要建设这样的落地页,还需要提及一些自己的产品介绍、功能点解析:

fc08bdf4caa94288875bd289ca0e9e5f.png

fbc78a1cce498d0ce3df5a6d32fa48f5.png

客户案例、成员介绍是必不可少的:

eb9cbce1aea11dd445c82d47a0ab814d.png

984a09dd4f34b971523e57a675051396.png

最关键的价格页,也不能忘记:

e7718bf1c7b3a3a5da5c5837adca8480.png

以上这些组件样式,只是作为举例,并不是单一的。

素材广场中的 Ant Design Web 落地页组件,我们一共六种类目,共 30 种设计样式供大家参考。

a12c36599b9db24b6639f1b5aa454f29.png

因为落地页与官网其它常见页面所用到的元素基本一致,如果做企业官网,这一套组件也很有用。我们的素材广场也提供了现成的官网原型素材,可以在这些官网原型的基础上,使用Ant Design Web 落地页组件快速搭建官网原型。

举个例子,我们可以搭配下面这个企业服务类官网素材来快速搭建一个官网原型。

1dad5d2dc711e1355e1e9d0e0681cda6.png

在这个企业服务类官网原型中,包含了首页、产品服务、解决方案、服务定价等核心页面。与一般企业官网相比,他更侧重产品服务说明、行业解决方案说明,同时会涉及付费。大家可以在它的基础上,根据产品设计需求,使用Ant Design Web 落地页组件完善具体页面~

欢迎大家去墨刀素材广场体验,或者直接一键复用到自己的设计中哦~

也可以去 Ant design 官网可以下载 sketch 资源哦~

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值