网页设计案例分析:Pettrust宠物医疗用品网站首页设计分析

网页设计前,很多客户都找来一大堆网站案例,让我们去设计。的确,观察别人网站,了解那些好看又使用的页面是怎样运作设计的,能帮我们找到灵感之余,还能确定好网站定位和方向。但是有时蒐集了大量各式各样的范本素材,有可能会让人眼花缭乱,越看越不知道该怎样设计。

今天,小编将和大家一起说说,确定范文素材後,要如何分析才能为自家网站所用。本文将以「Pettrust宠物医疗用品网站」作为本次的网页设计案例分析,有兴趣的朋友就往下看吧!

网页设计案例分析:Pettrust宠物医疗用品网站首页设计分析

网页设计案例分析:Pettrust宠物医疗用品网站首页设计分析

网页设计案例分析

♎ 建立视觉目标

网站首页,就好像店面的大门,传递给消费者「我是谁」的意思。

Pettrust网站设计首页以健康宠物为首图,容易让用户联想到宠物、正向、安心等关键字或感受。品牌医疗对象虽然是「动物」,但是受众目标是「宠物主人」,因此在建立品牌形象时,除了展现出「我是专业的宠物医疗专家」外,还给用户带来如宠物般温暖的信赖感。

♎ 基础色调简单

为避免用户眼花缭乱、模糊医疗专业形象,Pettrust的主色调采用明亮而不刺眼的橘色,以区别於其他医疗类网站。(市面上绝大多数医疗类网站都是选择蓝色、绿色等冷色系,以给人专业与权威的感觉)这主要是因为Pettrust网站是以宠物、照顾为品牌形象,考虑暖色系既可展现出宠物活泼的一面,同时也给用户传递一种温馨的温暖。

辅助色方面,主要以白色和透明度低的浅藕为主,让整个界面呈现出乾净的感觉,同时也避免以缤纷热闹的视觉效果设计网站,容易让用户分神,无法将实现集中於界面的重点上。

♎ 空间适时留白

Pettrust网站设计适时使用留白,让用户的眼睛有喘息的空间,以及足够的时间好好消化资讯。

在最上方的目录区,Pettrust让目录选单一整排清晰展开,中间没有被其他元素打断,使各选项之间有种「属於同一层级」的关系感。第二、三项旁边出现小箭头标志,可让用户直觉知道「这里有其他子目录可供浏览」,当游标滑过去时会特别停顿留意。

在最右的语言选单中,延续目录选单的字体,但中间留白大於每个选项简的留白,可让用户知道此区域并不属於目录群,再加上地图图案,方便用户选择自己熟悉的语言。

网页设计案例分析:Pettrust宠物医疗用品网站首页设计分析

网页设计案例分析

♎ 突出界面层级

当用户往下滚动时,可发现界面中的颜色配置、字体和字幅对网站设计的作用,即划分出内容文字的层次,强调CTA按钮,引导用户视线移动等,让人一眼就知道该画面的标题是什麽、页面内容摘要重点是什麽、详细资讯连结按钮在哪等。

此外,当游标滑过按钮时,按钮会变色,也是非常实用的方法,能告知用户点击浏览。

♎ 滚动页面资讯

再滚动往下,页面资讯部分是从各种重要内容中挑出几篇,再搭配精美图片设计,有助於用户快速了解网站的动态。Pettrust页面各资讯的大小都控制得刚刚好,用户无需一直滑来滑去看讯息,影响阅览效率。

此外,不同资讯内容的底色也不同,方便用户不用看内容也知道「这些内容是不一样」。不过这样设计有可能会减低界面的整体性和乾净度,所以需要控制色彩搭配和版块大小等的度。

♎ Footer再现目录选单

滚动至网页底部,我们能惊喜地发现目录选单再次在Footer出现。与顶部目录不同,此处再次安排目录选单,主要是为了供用户滑到底时方便跳去页面。

另外,Footer位置通常还放上商业重要性此稿的连结和子项目,如:人才招募、服务法规等,方便有需要的人去查询。最後,还加上「完整联络资讯」和「社交平台连结」,以及建立「意见信箱」,为用户提供更多与品牌交流的管道。

企业想要设计出符合自家品牌定位,同时又能为用户提供流畅体验,旨在茫茫商海中突围而出,选择参考案例和素材时一定要谨慎。当然,你也可以直接联系我们,我们将根据的你需求,制定合适的网站制作方向,打造美观且实用的专业品牌网站!

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/41999.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
上一篇 2022年6月23日 16:31
下一篇 2022年6月23日 16:31

相关推荐

  • 新手科普!4个方面帮你快速熟悉UI组件中的瀑布流。

    本文从组件介绍、使用场景、设计要点、样式拓展4个方面,帮你快速熟悉UI组件中的瀑布流设计。一、组件介绍瀑布流 (Waterfall Layout),又称瀑布流式布局,是信息流网格布局的一种视觉形式。顾名思义,这种布局形...

    2023年3月2日 SEO操作
    00
  • 2018年流行的文字排版设计趋势

    字体在网页设计中扮演着相对重要的角色,字体的好与坏是直接影响网站的易读性。因此,在网站设计时,我们会综合多方面的需求来选字体。下面,Inspirr Creation将为大家分享正在流行的文字排版设计趋势,希望各位...

    2022年6月25日 建站资讯
    0131
  • SVG图标的高级用法,让你界面适配效率翻一倍。

    SVG 格式图标在软件界面中有广泛应用,它与生俱来的矢量属性,使其在高分辨率屏幕上的表现非常完美。SVG 是一个基于 XML 标记语言的开放网络标准格式,拥有跨设备多平台的兼容效果。前面我们有分享过一篇关于 WPS...

    2023年3月1日 SEO操作
    00
  • 如何选择网站设计公司网站模板?

    网站设计,对于现在很多中小企业和创业者来说,尽可能的节约成本,以及尽可能的压缩开发周期,是首先需要考虑的。因此,在建网站之前,现在很多人都会去选择企业网站模板来制作。那给企业选择一个既有良好体验、...

    2019年11月13日
    0273
  • 在网页设计如何运用明亮色彩吸引眼球

    现在的网页设计逐渐趋向於简约风格,所以大多数企业网站都会选用黑白灰,或者是比较柔和的色彩为主色。但事实上,网页设计中大胆运用明亮色彩,可以吸引用户的眼球,让用户着眼於界面中重要的元素。那麽在网页设...

    2022年6月25日 建站资讯
    0114
  • 优秀设计的背后,离不开这11个应该掌握的底层理论。

    这是我在 Medium 上看到一位工作超过 17 年的国外设计 leader 写的一篇关于设计原理的文字,讲为什么设计可以变得有效?讲得很透。强烈推荐大家阅读,定有收获! 1. 奇数原则和三分法构图 奇数法则意思是说,在设...

    2023年3月2日 SEO操作
    00
  • 如何高效地进行网页设计?重点关注这7个要素。

    今天为大家分享的是「网页设计要素」,希望能让你有所收获~ 把握中心目标 大多数网页设计是以目标为导向,也就是网页做出来能为用户提供什么、能解决用户的哪些问题。例如电商网站的终极目标是卖出更多的商品,...

    2023年3月1日 SEO操作
    00
  • 系统弹窗设计的注意事项

    最常见的是评分类的系统弹窗类型,这类弹窗很容易被用户直接忽略,因为最容易影响用户体验: 1、不要在用户第一次注册登陆你的页面时,就立马弹出来。很明显,用户还没开始使用你产品界面,如何评价? 必须注意弹...

    2022年6月25日
    0140

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息