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