触屏设备网页设计的几个想法

手机上：

       1、 大部分人都是右手放在手机右下角进行操作，单手，大拇指。所以，网页排版应该跟pc端的方向完全相反，从右到左，从下到上。

       2、每个手机都在把屏幕做到stupidly big，棒子居然搞到5寸。大拇指是根本够不到左上角的。应该有一个按钮在右手边，可以把整个网页向右平移大概半个屏幕，方便操作。大体上就是把body中的所有东西都放到一个div中，这个div的position是relative，按下按钮后，将left设置为window.innerWidth/2+"px'。

       3、手机屏幕大小相对于pc很有限，显示的内容也很有限。所以，所有的标签，选项卡都应该在不需要的时候完全不显示。在网页上做一个基于touchstart，touchend的手势系统，模拟android4.0浏览器的菜单，把z-index设为最高，能够划出，划入，覆盖原有页面内容。

平板上：

       1、平板操作是手在屏幕左右两侧的中间位置，两个手指。所以，大部分的按钮或连接应该在左右两边或者直接每个链接都是做在div上，div的width是100%。

2、手机上的网页大部分是单列表，上下滑动，就像android的listView，平板上应该是两个并排的listView的样子，左右都能滑动，充分利用触屏的良好交互和大屏幕的显示功力。

3、即使平板是一个屏幕显示基本媲美pc机的平台，网页仍然需要重新设计，链接根本不适合触屏设备，多于两列内容显示也不适合触屏。

这几天看win8和android4、写网页效果的几点心得，留下点痕迹。