浅议手机上网与web开发

搁笔多日,此文有应景应压之嫌。春节归家,穷乡僻壤,不通网络,依仗手机上网解瘾。对其有了更多的了解,也对手机网站开发有了一些了解,不过终受经验知识所限,望各位异议相与析,欢迎鸡蛋茄子。

因习惯用电脑冲浪,所以我更喜欢打开www而不是wap。用的是opera,感觉opera的缩放功能很人性化,特别是对深度互联网用户来说,因为他们深知所去网站所需信息的位置。不过国内手机的web开发真的有点落后.来看一下没用缩放时新浪的首页是怎样的(右图)。sina phone

而电脑中新浪首页是这样的:

sina

而在手机中没用缩放时新浪的首页是这样的(右图)。

可以发现右边手机浏览器中内容都是上面电脑浏览器中导航栏和广告栏内容,其实更恐怖的是,在手机中还得下拉很长很长才能看到内容。因为新浪黄色的左边栏还是广告和软文。

在开发网站时,怎样可以让网站在手机浏览器中显示效果更好,而不需要另外架设wap服务器和写个手持设备主题?个人思考可以做几个地方的改善:

1.头部与导航栏尽量简洁

一般人在一个网站查找信息就只有点击鼠标三四次的耐心,但在像右图那样的网站中,我们不仅需要担心耐心用完,还担心姆指体力和电池用完。多用百分比来设计导航栏,banner广告能少就少,不要用flash广告,现在不仅iphone不支持,还有很多手机不支持。

2.从左到右布局最佳

现在手机浏览器对很多标准支持都不够(可以看一下挨踢农民工的文章),手机浏览器的显示次序也是从上到下,从左到右,所以说在web设计中把内容放在左边,把边栏放在右边应该是最佳的布局方式。

3.谨用图片

继承国内电信商的带宽小又贵的光荣传统,手机上网套餐也让我们钱包难得温饱。在超出流量后,1M就是一块钱(怪不得移动可以打银行的主意,见过银行收购企业,没见过企业收购银行,国企就是”牛”),所以我把opera的载入图片的选项都去掉了。用图片作背景,用图片作导航栏的做法看来问题很大。

4.宽屏就是好

在国外iphone的上网流量非常大,这不仅与iphone的功能强大和销量大有关,还应该与iphone的宽屏有关。很多专门为iphone设计主题如果放在240*320的屏幕上,效果会大打折扣吧。不过好消息的是,现在手机的屏幕是越来越大了。

用adobe device central 测试网站在手机上的显示效果

装了dreamweaver一般都会带有adobe device central的。测试方法就是:

1.在dreamweaver中搞好网页后,然后在文档栏中打开以下窗口。

adobe-device-central 1

2.在出现的adobe device  central中可以选择不同的设备组以及下载各种手机的库来测试在不同手机中的显示效果,当然也有自定义的选项。

adobe-device-central-2

  • 7yue
    7yue (12) Thinking in RIA Solutions...
  • 5key
    5key (0) 目前就职于阿里巴巴B2B国际站UED
  • 腾讯ISD
    腾讯ISD (29) 腾讯互联网系统Web团队
  • 折折熊
    折折熊 (2) 折折熊de交互论
  • 引子
    引子 (26) 杭州,互联网/城市媒体,@19lou.com
  • 米随随
    米随随 (5) 本站是基于人类交互的,您的想象决定了我们的应用!
  • 支付宝UED
    支付宝UED (15) 支付宝UED团队
  • 花匠
    花匠 (3) 互联网产品设计师,ITFeed发起人

更多荣誉成员...