为了Windows Phone的用户靠直觉便能使用触摸屏操作系统，Win8在用户界面上做出了大量的彻底的调整。Apple隐隐约约的也放出了要改变OSX的风声，流线化 设计也越来越多的应用于他们的移动和桌面操作系统上，但是依然看不到带触摸屏的MAC。现在的用户花费越来越多的时间使用手机而不是电脑，这说明触摸屏革 命正在向我们袭来。
越来越多的人用手机或者平板浏览网页。网站需要作出调整，来让人们不用鼠标和键盘也能阅读他们的内容。一般对此的反应通常是 不就是再做一个独立的 手机用户界面么！ ，这种解决方案在过去手机还比较小的时候还挺奏效，但是对于大屏手机和平板电脑来说，这种方案是非常短视的。
本文将通过几个常规或非常规的网站来展示怎样去设计网站，以达到用户体验更 触摸友好 型。
聚焦式网站 VS 响应式网站
很多网站建立的附属的站点或者APP，专门针对触摸屏用户。以便让他们把精力放在该类用户上。但有一个问题就是，既然网站是分开的，那么所依赖的 URL指向会造成用户打开错误的链接，或者手机用户打开链接发现无法找到页面。
最大的问题在于移动版经常缺少普通版的特质和信息，有点缩减版的味道。网站的特点和交互界面被简化，按钮做大，减少选项。这可以通过响应式设计解 决。响应式站点从设计上就考虑到不同平台的显示问题，做到了不损失质量的显示。而且好处在于只需要设计一个站点就够了，而不是再设计一个移动版。
设计上的本质不同
当在设计网页之前，要考虑到触摸屏和台式之间有本质的不同。在触摸屏上敲击页面是为了滚动，然而在桌面上你需要下滑你的滚轮。Trackpad是采 用Apple交互触摸技术的触控板，Apple试图通过它改变传统的操作方式。然而无论PC用户还是MAC用户更常规使用的还是滚轮或者滑块，Apple 的产品处于不利的地位。
在移动设备上的按钮必须更大，为了敲击的精准性。再也没有比 想要打开一个链接，却突然点错了，需要退回去 这种状况更令人厌烦的场景了。而且因为 没有光标，所以也不需要给链接注释，总而言之要的就是 可点性 。
还有一点就是关于移动设备输入的精准性，因为触摸屏要么是电阻式的要么是电容式的，有着不同的敏感度。电阻式的灵敏性要差一些。所以，设计上必须要 结合两种不同的屏幕来考虑不同移动设备的不同设计定位。
屏幕的定位功能与宽高比
屏幕的分辨率多种多样，科技市场的快速发展，导致了屏幕尺寸的多样化、特殊化，制造商不同，屏幕尺寸也不同。看看智能手表的屏幕吧，已经不再是四边 形的屏幕了。通过转动，移动屏幕不但可以显示肖像画（垂直），还能显示风景画（水平），这使其更加复杂。
问题的答案便是液体布局，可面对不同场景进行自调整，能为水平和垂直显示做出改变。有些网站采用这种适应性布局大大的改变了网站外观，优化了控制 性。而且利用了屏幕方向定位的这种潜力。
鼠标的滚轮就是为了便于垂直移动而设计的，自从Apple支持更具有创新形式的触摸滑动来下拉页面，而不是采用转轴滚动后。很多用户都改用触控板或 者触控屏。至于有更多创新想法的水平滑动更不在话下。大部分App都采用了水平滑动，目前为止最成功的的水平滑动案例便是Kindle。所以为什么不在你 的网页UI界面里实现呢？很多单页网站仅有一个水平轴，但是通常也都会有按钮来引导用户滑动，因为很多用户可能不理解操作方式。
在设计形式上，水平滑动和垂直滑动可能很相似，然而合理的运用它们可以实现多轴滚动，这可能不会再浏览器中实现。很多用户更喜欢单轴，因为多轴容易 找不到方向，而单轴只需要划回来，就能回到主导航条了。对于双轴网站来说这可能不是那么容易，因为导航条需要静止，所以使用HUD风格的导航条吧。
那么你的页面该采用什么样的交互界面？
显而易见的是不是每个用户界面都适用于于各种类型的网站，所以问你自己一个最基本的问题：谁是你的目标用户？你想要 推销 的是什么？你想营造怎样 的印象？年轻的人更喜欢使用触摸屏，而岁数大点的可能更喜欢使用台式，但大龄用户可能也需要更大的按钮和清晰的用户界面。再有革新性的用户界面，如果没人 能够理解使用方法，那么也是毫无意义的，所以要牢记，创造用户界面的目的是用户一看便知如何使用。
放射式菜单
放射式菜单，或者叫馅饼菜单，是一种环形上下文菜单，采用了多种方向的上下文拓展，而不是那种通过拉长拉宽来提供更深一步选项的菜单。
这是一种优秀的直觉式设计，防止用户在种类繁多的子菜单中 迷路 。另外的一个好处是相比操作常规的下拉式菜单，触摸屏用户可以更好的控制，因为方 向性的操作比敲击操作更加精确。若采用放射式菜单，网站会极大地提高触屏用户的用户体验，而延伸出来的按钮开关让人联想到游戏中的控制台。放射式菜单能够 简化冗长的菜单，变为简单的形式，增加了网站的效率和易用性。
放射式菜单是一种优秀的上下文信息展示体验，举个例子来讲，在采用这种菜单的网站上你看到了一幅美食图片，你轻点一下这幅图片，然后就出现了转发、 食谱链接、食材清单、保存图片的选项。然而采用这种菜单一定要谨慎，保持菜单的适用性和简洁，否则用户会感到他被泛滥的 标志和词语结合的菜单 淹没了。 静止式的放射式菜单比动态的好，因为静止的更好方便进行选择，至于动态的反面教材就是Phong(http://phong.com/),非常混乱的操作 体验。
拟真
拟真设计临摹物体的外观和功能来创造出一种直觉性的交互界面，最近它已经不再流行，尤其是自从Scott Forstall从Apple辞职，做扁平化设计的Jony Ive的接管了iOS，还很有可能接管以及未来的OS X。拟真把Apple推向了直觉式操作设计上前所未有的高度，比如Mac上的Contacts看上去像地址簿，或者iOS上的Newsstand和 iBooks看起来像书架。这种设计对于采用触摸式交互的用户来说更容易理解.
通过熟悉感带来一种感官上的直觉，这是拟真的关键所在，用户把这种相似感和真实的物体结合起来，立即就能知道怎样去交互。一个好的拟真设计能做到用 户瞅那么一眼就能了解主题，知道页面是用来干什么的，而不用什么信息提示框的高亮提醒。
拨号式交互界面
这是结合了上面很多元素的界面，整个用户界面就是简单的拨号，和放射式菜单看起来很相似，但是它有一个中心，以此展开了选项，拨号式的转动来进行单 眩在音乐类型的网站/App中这非常有作用，通过拨号选歌、挑歌、调节音量都很方便。在SHSK H(http://www.shskh.com /www/)这个列子中就采用了拨号式UI，方便用户选择想听的音轨。
极简主义运动
极简主义就是界面尽可能的进行删减，直至剩下一些必要元素。对于移动用户来说非常非常的方便，因为它减少了载入时间和流量，在清爽的界面下可以快速 的找到所需信息。现今的极简主义不仅仅是对网站进行 减法 ，还形成了一种新的形式叫 扁平化设计
扁平化的关键在于不再以 注重用户的直觉 为核心理念，因为人们已经熟知了交互界面，养成了使用的习惯，他们已经熟悉了操作，所以现阶段的设计要超 越那种 引导用户如何去做 的概念。交互界面最终变成了一种工具，而不再是用户的导师了。扁平化设计的特质是使用明亮的色块，在iOS7中， 斜角 让位 于多彩的扁平化设计。
最后，我要用一个有些与众不同的网站结束这篇文章。Thibaud（http://www.thibaud.be/）是一个富有创造力的开发者，他 曾经设计过像Pikibox这样的网站。这里提到的这个网站Thibadu非常的 触摸友好 ，而且也没有限制桌面用户的适用性。
简单的设计效果却非常漂亮，专业的完整的展现了个人资料，而且富有操作趣味，第一眼看到这个网站就知道如何操作。当然，还把很大一部分设计的权力交 给了用户，用户可以改变导航条的位置，调整它的空间位置。而电脑版提供了四种页面形式，我建议你去尝试一下。
