首页 资讯 业界 查看内容

Resizer

2016-3-1 08:46 1784 0

摘要: Google 提供免费工具Resizer 能让使用者直接线上即时测试,不用额外下载软体,只要输入检测网址,就能得到电脑、平板电脑以及手机显示效果,同时还能切换一些常用的萤幕解析度,或者测试在行动装置直立、横式的显示 ...

Google 提供免费工具Resizer 能让使用者直接线上即时测试,不用额外下载软体,只要输入检测网址,就能得到电脑、平板电脑以及手机显示效果,同时还能切换一些常用的萤幕解析度,或者测试在行动装置直立、横式的显示状况。

Google Resizer 跟微软Browser Screenshots 最大差异在于Resizer 能真正模拟出网页在不同装置的实际运作情形,当然你也可以控制画面,点选链结,跳换到不同页面,或者拉开侧边栏选单等等,相较之下Resizer 会更为实用(如果不是只想看撷图的话)。

网站名称:Resizer
网站链结:http://g.co/design/resizer

使用教学

STEP 1
开启 Google Resizer 后,直接在上方输入你要测试的网站链结,预设也提供 Google 部分网站来让使用者进行实际操作,例如:Google Design、Material Design、Android。

STEP 2
接着就会看到网页出现在 Resizer 中间,从右上角来切换电脑或手机(平板电脑)。

看到上方有一排类似尺的工具列吗?这是在 Resizer 调整视窗宽度的功能,点选后就可快速切换一些宽度大小,同时网站也会立即变化。

STEP 3
切换到行动装置后,预设有几种宽度可以调整,例如:360、600、720 和1024,宽度比较大的是将装置横放或平板电脑,从下图可以发现免费资源网路社群选单在宽度过窄时会自动缩小,不会有挤出栏位或跑到其他行列的问题。

一样可以测试网页在平板电脑上直立、横放的显示效果。

不过Google Resizer 工具仅在视窗大小上进行调整,并无法重设User-Agent 来模拟行动装置浏览器的显示情形(例如行动装置使用者应该会看到行动版网页,但在Resizer 只会看到一般网页),若有类似需求,我会建议使用Responsive Web Design Tester 直接在浏览器测试网站显示效果,可能会来得更为准确。

值得一试的三个理由:

Google 推出自家 RWD 网页测试工具,输入网址即可使用
可测试网页在电脑、平板电脑以及手机的显示效果
内建多种解析度尺寸,可随时切换即时预览
声明:文章版权归原作者所有 部分文章转自互联网 如有侵权请联系 [邮箱地址] 删除

路过

雷人

握手

鲜花

鸡蛋

最新评论

返回顶部