3. 模態(tài)窗口
模態(tài)窗口(Modal windows),或者稱為浮窗,一般用于在空間緊張的頁面中展示額外信息。在模態(tài)窗口中,你可以放置放大版的圖像、額外內(nèi)容、警告/提示信息、視頻等等。用模態(tài)窗口展示信息時,記得要同時明確地提示用戶如何關(guān)閉它。
同時,用于打開模態(tài)窗口的鏈接、縮略圖、圖標(biāo)或者其他圖形元素,一定要保證與模態(tài)窗口要展示的內(nèi)容有足夠的關(guān)聯(lián)。相似的圖標(biāo)、摘要、圖形元素都能幫助用戶建立原始鏈接與打開的窗口的聯(lián)系。
模態(tài)窗口的例子運用到登錄和注冊流程中的浮窗模態(tài)窗口最典型的運用就是登錄/注冊窗口了(與諸如圖像、音頻、視頻、Flash等“傳統(tǒng)”媒體文件相比)。登錄和注冊表單不是用戶每次瀏覽頁面都要用到 的必要部分,所占頁面空間理所應(yīng)當(dāng)被節(jié)約下來。而使用浮窗,則又為用戶省去了重開一個頁面的時間,畢竟這只是一個很簡單的非常用動作。他們能在網(wǎng)站的任何 頁面中登錄/注冊,而不用中斷現(xiàn)有流程——只要網(wǎng)站的設(shè)計者能提供基于Ajax的“靜悄悄的” 登錄/注冊。
Grooveshark 整個站點的每一個頁面中,這個漂亮的登錄窗口都觸手可及。注意,點擊登錄( Lodin> )按鈕后并不會載入一個新頁面,而是直接把注冊表單替換成了登陸表單(使用了手風(fēng)琴效果)。非常方便,非常友好的用戶界面。
消隱頁面/使用投影
如果要使用模態(tài)窗口,讓窗口下面的頁面淡出焦點十分重要。你可以用半透明背景覆蓋或者為窗口添加投影,或者兩者結(jié)合。這么做有兩個作用:一是能讓用戶將注 意力集中到浮窗上,然后暫時忽視掉背后的頁面。另外,也能增加窗口和頁面之間的深度感和區(qū)分度,讓人在視覺上覺得這窗口確實是漂浮著的。注意看下面的例子 (KissMetrics),半透明的黑色背景讓頁面消隱,有助于登錄浮窗暫時成為視覺重點。另外,取消和關(guān)閉窗口的按鈕也設(shè)計得很好,夠明顯,夠漂亮。
|