這幾天想來分享幾個設計行動版網頁要素,想必也有許多人開發過行動版網頁,也有許多的手機APP是透過嵌入一個Webview將網頁放到其中,大多數的使用者是感受不出來的,還是有一部分的人可以感受到,畫面不是操作的那麼流暢,這之中各有利弊,今天不是針對webview來做討論,提到一些我開發手機版的網頁會去注意的事項,也歡迎大家再下面留言,給予更好的建議。
簡單帶過吧!網路上有許多的文章可以參考,打「RWD、響應式」都可以找的到,簡單來說你可以不用寫不同版本的網頁,同一個網頁透過CSS @media 的屬性來調整使用者看到的內容,下面有一個CSS的範例,當你縮小視窗的時候文字的顏色也會跟著改變
div {
color: black;
}
@media screen and (min-width: 560px) {
div {
color: red;
}
}
有許多的網站是用響應式的設計,像是中華民國總統府(這個應該夠有份量了吧xDD),透過手機已及電腦看到的畫面,有不一樣的呈現方式,因為總統府的網頁沒有商業模式,沒有利益上的問題,但在許多的購物網站可以看到,分別設計桌上版及行動版的網站,因為他想要賣廣告,在手機看到的廣告會與電腦上看到的廣告不一樣,因為這樣所以這些網站在設計為護這些頁面上的成本相對來說較高,不同的模式會有不同的設計,我想講到這邊應該可以了解自己想要的是什麼樣的模式吧!
簡單說響應式有幾個優點
對於行動版的Layout尤其重要,如果在小小的螢幕下面塞了滿滿的東西,使用者看起來應該不會覺得很開心吧。
在手機的設計中超過五個的按鈕或是擺放,會造成使用者的操作不順。
(露天拍賣 行動版)
(Android手機 Google搜尋)
POPUP的廣告最最最討厭的就是按鈕小小的,還讓你按到連結的廣告,在設計
曾經在一個機會下,幫朋友寫了一個行動版的網站,在開發的時候一直沒有出現問題,直到網站正式上線後卻發現很多的內容怎麼都跑版了,而且js怎麼也掛了,這時候才發現在每個手機看到的狀況並不會一樣,或許是手機版本過新,或手機版本過舊...等等,有許多的問題,所以在開發完成後,最好在每個裝置上都測試一遍,不斷的去修正這些問題,當你下次在開發新專案時,你將更注意這些細節。
當然你要怎麼測試,有許多的方法,我的好友在這次鐵人賽有寫了篇關於測試的文章系列Nighwatch,測試就是我們開發的流程,盡量去做到面面俱到的功夫摟。
今天的減肥計畫,應該在晚上執行,今天主管們準備豐富的下午茶來替我們補補腦,減肥最辛苦的就是看到食物的時候,要先再三想一想「這熱量高嗎?我還要運動多久才補的回來?」到後面開始自我放棄「算了啦!胖就胖沒有什麼不好的,肥宅我也教了個可愛的女朋友」,最折磨人的其實是心理因素吧。來想想看,今天練練腿好了!
有沒有必要上健身房??
許多人會有這樣子的疑惑,我也曾經問過自己到底有沒有必要上健身房?常常聽到朋友、同事下班或是假日的時候都往建身房裡面跑,說為了健康、為了體態...有許多的原因,但最重要的是「你」有沒有必要上健身房,沒有一定的答案,但如果你想要達到下面幾點,我建議你可以考慮
- 有正常規律運動習慣
- 平時有在訓練但手邊的器材不夠
- 真的下定決心要運動
- 有一筆預算
上健身房也是要一筆花費,或許你只是想減肥,那我建議你可以到公立的運動中心或是操場跑跑,先建立起運動的好習慣,再加入健身的行列也不遲喔!
有人說,男工程師穿網襪很奇怪
不是很奇怪,是因為你不常看到男生穿網襪
By 從網襪轉型黑絲的工程師