基于浏览器兼容和手机兼容的网页设计分析
来源：im电竞平台官网
|
2015.11.19
如果我们目前为止没有做错的话，基础内容和功能在大部分的浏览器里都可以运行良好。如果你要设计一个网络应用程序，有一点需要提醒你的是需要准备详细的技术参数（比如地图应用程序需要CSS、JavaScript、图片和GPS支持能力作为基础)。线框设计可能不会起作用。因为我们会把用户关在门外。尝试尽可能多地放入可接受的内容。我们的草图设计会告诉我们这个网站可能会长成什么样子，同时把它放到手机终端上去运行看一下是否兼容。下面济南网站建设对基于浏览器兼容和手机兼容的网页设计分析
但是现在我们更喜欢进一步设计，加强在浏览器和平台上的综合体验，可以支持更强大的功能。下面给出一些案例。
线性的设计只有一栏内容。为了大尺寸的屏幕，或者是为了方便那些需要在一些设备上任意切换肖像和景观模式的时候，我们可以做一点调整。如果有更多的空间，布局可以设计成适应多栏的。把元素放在不同的位置也会明显发挥作用，因为用户站在一个更远视点的时候和屏幕的交互方式会显著不同；比如说用户可能还想要扭转或者重新定位一下导航。你可能也会重新思考一下哪些内容是重要的，因为此时不再是像线性设计那样简单地只要将内容由上至下摆开就可以了。
还有些设备会有一些我们非常想要去利用的功能，比如相机和GPS功能。大部分人都想只要能够支持javascript就可以了（常见的情况是可以支持的，但是有的时候却不这样，特别是对于一些低端设备，而且这样的在周围还不少)。考虑一下如果设备具有加强视觉的功能，比如第三方字体或者CSS渐变？在特定设备中的特定浏览器里，这种真实环境下进行设计使我们可以测试这些特性是不是起作用（也可以知道是不是好的作用），同时也可以知道这个设计在表现层上的影响力。我们需要去考察，要在哪些特定的平台和设备上把某些特定排除在外，又在其他的平台和设备上使用某些特性。读者可以参考《在不同浏览器和分辨率下的网站设计流程》这篇文章获得更多的关于浏览器兼容方面的信息。
基于特定的平台或设备，我们可能甚至想去加、减、移动或是改变一些内容。比如说，在小屏幕设备或者是手机终端上，会希望使用小尺寸图片作为默认的图片，但是在大屏幕设备上，会希望使用更大一点的图片。我们也不希望提供一些对于场景没有用处的内容给用户；GPS相关的内容只需要在支持GPS功能的时候出现，因此我们只会在符合条件的设备上添加这些内容。
为了加强结构化内容的体验，我们至少得将我们需要支持的设备列出一张清单来，对它们进行分门别类，归纳出几个层级。换句话说，将相似类型的设备合成一种，这样你就可以聚焦在针对这几类设备的设计上，而不是针对每一个不同的个体。我们通常仅仅满足IOS和Android,但是这样太有限了，最后，我们将针对其他不间种类的设备对产品做出调整，使它在任何设备上运行良好。
不要根据设备的物理表象特征来对它们进行分类，比如说:桌面、智能手机、便签等。这种分类和你需要思考的问题关联性不大。相反，应该按照你的APP所需要的特征将设备（甚至是延伸到它们默认的浏览器）拆分成你所需要的类别。任何可能关联到的因素都需要考虑在内，比如它的触控能力、屏幕尺寸、像素密度、地理定位、本地存储、SVG支持情况等。
我们应该关注在设备的特征上，因为当有新的设备出现，这种设备又很难归类到日常消费品和市场类目的时候，我们之前所作的工作还是有效的。
