阿右
WEB DESIGN

[工具] ILoveAdaptive 設計網站行動裝置呈現比較@AWD 網頁版型手機效果

[工具] ILoveAdaptive 設計網站行動裝置呈現比較@AWD 網頁版型手機效果

ILoveAdaptive 網頁呈現效果測試工具提供針對 iPhone、iPad、電腦等裝置,進行 AWD(自適應、響應式、回應式)網頁樣式線上測試工具,支援解析度、調整尺寸寬度、畫面捲動模式操作。「ILoveAdaptive 網站設計測試網頁版」線上版型、測試回應式網頁開發服務工具。

產品設計視覺傳達圖文插畫攝影藝術建築家具

 

網站名稱:ILoveAdaptive
軟體分類:回應式網頁測試
官方網站:http://iloveadaptive.com/

[工具] ILoveAdaptive 設計網站行動裝置呈現比較@AWD 網頁版型手機效果

現在設計網站、部落格、購物商城購物車等網頁,都需要考量到各種不同裝置的呈現效果,像是電腦、手機、平板、筆電看到的尺寸畫面都會有點不一樣。

 

不論你是用 AWD、RWD(響應式、自適應、回應式)網頁樣式,都建議以智慧型手機呈現的效果為準,現在用手機行動上網的人口非常多。

 

 

[工具] ILoveAdaptive 設計網站行動裝置呈現比較@AWD 網頁版型手機效果

這次要介紹給大家的「I Love Adaptive」,是一款可以協助網站開發者測試各種不同裝置,呈現的視覺效果與介面操作感受。

 

開啟 ILoveAdaptive 官網,在視窗中間輸入要測試的網址,系統就會針對常見的行動裝置尺寸列出版型。

 

 

[工具] ILoveAdaptive 設計網站行動裝置呈現比較@AWD 網頁版型手機效果

可以勾選想要測試的裝置型號(iPhone、iPad、Android),並針對解析度、調整寬度、自動尺寸、畫面捲動等模式切換。

 

按上方工具列「Custom size」自定義螢幕解析度尺寸,「Compare Urls」也可以針對不同裝置或頁面進行比較功能。

 

 

網頁基礎觀念-徹底理解前端網頁常用 CSS 單位

加入「FUNTORY設計生活粉絲團」,追蹤更多設計軟體資訊

Avatar for 阿右 阿右

大家好~我是Funtory設計生活的站長:阿右。透過Funtory設計生活分享吃喝玩樂的美好生活經驗。本身從事設計相關工作,對設計充滿熱情,歡迎設計人一起學習、切磋、指導。請大家多多指教^^
| 個人介紹 | 更多文章 »

發表留言