網頁設計中浮窗的使用實例
不動浮窗是網頁設計中常用的技巧,指一定區(qū)塊不動的在瀏覽器的響應位置而不隨滾動條的移動而改變位置的設計。
最常見的不動的浮窗設計是不動的在瀏覽器底部的彈窗廣告,比如新浪首頁會有新浪視窗的彈窗廣告。
最近當當網首頁廣告力度很大,其中大部分都是不動的在瀏覽器底部和兩邊。
由于不動的浮窗總是顯示在網頁內容的最上端,有時候甚至覆蓋了用戶想要的價值內容,這種設計確實不討人喜歡。有時候,有的不動的浮窗會提供“關閉”按鈕,但是這明顯不能消除用戶的反感情緒,因為在一片廣告上找關閉,也是一種煎熬,而且關閉按鈕總是很小,不注意就會點到廣告鏈接上,有時候這個“關閉”還有可能是假的關閉,點上去之后反而跳到了廣告頁面。
以上這些都是負面的甚至流氓的設計行為,我們不予討論,今天主要來討論不動的浮窗在設計中的良性使用。在此之前,我們淺談過如何提升網站用戶體驗,這里先分析一下不動的浮窗的特點:不隨滾動條移動而移動,出現(xiàn)在瀏覽器的不動的位置。如何利用這種特性呢?我們或許可以從桌面軟件的設計中找找靈感。
第一個例子,福昕閱讀器的標簽目錄頁,它有什么作用?在一篇長文中,用戶可以點擊標簽到達文章的特定部分。在團800網站左邊,有一分類團購的錨鏈,點擊了解就能到達相應的分類團購部分。
第二個例子,是WPS2012的工具欄和底部的數(shù)據(jù)顯示。作用很明顯,用戶隨時需要或者隨時可能需要使用的功能或者看到的信息,用不動的的模塊展示出來。在新浪微博頂部、新浪微博右邊“回到頂部”按鈕、人人網底部、美麗說登陸框,都有這樣的模塊。當然,從網站而非用戶的角度講,不動的浮窗廣告也是希望用戶能夠隨時注意到廣告信息。
因此,使用不動的浮窗必須具備的條件就是,頁面很長或者很寬(一般不可能很寬吧??。┑那闆r下,用戶有需要隨時或者隨時可能有需要在不同段落之間跳轉閱讀,或者有一些功能和信息隨時需要或隨時可能需要提供給用戶。
在整理一些合理使用了不動的浮窗設計的案例之后,我同時也發(fā)現(xiàn)了一些網站引入不動的浮窗設計的必要性。第一個是Godaddy的域名購物車,在用戶選購很多域名并且滾動條下移一定程度后,購物車里的具體信息不可見,影響了用戶體驗。第二個是GoogleCalender的添加事件界面,當垂直分辨率不足,用戶在滑動到設置界面下部之后,保存時需要重新滾動至上部。
綜上,圖趣總結出來:浮窗并不都是垃圾廣告、流氓代名詞,一個好的浮窗設計,能夠不僅提升網站用戶的體驗度,還能增加網站的專業(yè)性,那么,好好的設計和利用浮窗吧。
本文地址:http://irelandcustomcontracting.com/tutorial/id985.html