本文以携程、去哪儿、途牛和飞猪四家为例，从网页的头部区域和导航设计、内容区域与底部方面探讨了东西型产物需要奈何的首页。

在成果型产物中，OTA平台算是差旅场景中必备的产物，机票、旅馆、观光、交通预订四项是OTA的基本成果。

本文将以携程、去哪儿、途牛和飞猪四家为例，从主页设计方面阐明其PC端产物，探讨东西型产物在网站设计时的必备要素和设计思路。

一、头部区域和导航设计

头部区域是用户进入网站后头对的之一视觉攻击，一般包罗网站Logo、搜索框、登录提示、导航栏等必备要素。在东西型产物中，用户对主页的等候在于辅佐他办理这几个主要问题：

这是什么网站？

我能在这里做什么？

从那边开始？

可以将用户对OTA平台的需求分为两种：

抱着订票需求即明晰的消费目标来的用户；

临时没有明晰差旅需求以随便走走为心态的用户。

OTA网站设计时需要分身两者需求同时举办思量，但这四家在头部区域的设计上其实都有本身的思量。

先调查一下四家在首页机关上的整体设计：

1. 导航栏

导航栏是将用户引向详细分类的指向标，可以看到四家平台都选择在Logo或搜索框下端安排导航栏，并保持了和主页一致的色系以凸显导航栏的一级进口。本文主要思量从体验性评估导航栏，详细差别表此刻这几个细节：

1）携程导航栏的特色在于利用了下标箭头设计。

下标箭头其实起到的引导用户移动光标举办二次展开的浸染。

在二级导航栏下，携程回收的设计是所有字体的巨细颜色保持一致。跳转二级导航后，地址的一级导航栏会加深，二级目次字体标蓝（但不展开），可以辅佐用户更好明晰本身的欣赏位置。

2）去哪儿的导航栏体验要差于携程。

之一，首页导航栏位置不牢靠，跳转差异页面后导航栏巨细和位置会有差异变革，在视觉结果上不连贯；

第二，去哪儿对二级导航顶用赤色标志重点，但跳转二级页面后，没有标志显示用户此刻处于的位置，苍茫的用户只能选择退回顾页从头操纵。

但去哪儿的利益在于：部门二级导航用UI设计吸晴，看起来比携程的界面要年青态和生动，携程则更简捷和商务风。

3）途牛的导航栏可以说是上面两家特色的综合体——思量了向下箭头和二级重点标红的设计，并在移动光标到二级目次上，会呈现绿色加深。

但进入二级子页面后，没有一级和二级导航加深标志，容易呈现和去哪儿用户迷失在本身选择的菜单中的问题。

四家OTA平台中，途牛特有的设计是在导航栏上插手了要害词的引导。如邮轮游的“海上假期”、门票的“上海迪士尼”。这样的设计更多是起到一种叫醒浸染，以引发随意欣赏的用户某个乐趣点。

4）飞猪的导航栏设计除了剔除下标箭头的引导外，在其他方面都举办了具体思量。

之一，在二级目次的重点标志上，没有选择用字体颜色来强调，而是用右上角的H小标来暗示热门水平；

第二，进入子页面后，用标题加深来明晰当前位置，二级目次保持展开状态。

2. 搜索框

搜索框的设计在于辅佐用户更快速找到本身想要的内容。从机关来看：四家平台都选择把搜索框安排在Logo同一区域的中部，并有词根遐想的设计。

从搜索框的调取逻辑来看：都是从数据库匹配用户输入的要害词；但在匹配字段上，从四家的搜索深度、机动度和便利性来看，可以凭据这样的顺序举办排名：飞猪＞携程＞途牛>去哪儿。

1）携程