|
3. 模态窗口
模态窗口（Modal windows），或者称为浮窗，一般用于在空间紧张的页面中展示额外信息。在模态窗口中，你可以放置放大版的图像、额外内容、警告/提示信息、视频等等。用模态窗口展示信息时，记得要同时明确地提示用户如何关闭它。
同时，用于打开模态窗口的链接、缩略图、图标或者其他图形元素，一定要保证与模态窗口要展示的内容有足够的关联。相似的图标、摘要、图形元素都能帮助用户建立原始链接与打开的窗口的联系。
模态窗口的例子运用到登录和注册流程中的浮窗模态窗口最典型的运用就是登录／注册窗口了（与诸如图像、音频、视频、Flash等“传统”媒体文件相比）。登录和注册表单不是用户每次浏览页面都要用到 的必要部分，所占页面空间理所应当被节约下来。而使用浮窗，则又为用户省去了重开一个页面的时间，毕竟这只是一个很简单的非常用动作。他们能在网站的任何 页面中登录/注册，而不用中断现有流程——只要网站的设计者能提供基于Ajax的“静悄悄的” 登录/注册。
Grooveshark 整个站点的每一个页面中，这个漂亮的登录窗口都触手可及。注意，点击登录（ Lodin> ）按钮后并不会载入一个新页面，而是直接把注册表单替换成了登陆表单（使用了手风琴效果）。非常方便，非常友好的用户界面。
消隐页面/使用投影
如果要使用模态窗口，让窗口下面的页面淡出焦点十分重要。你可以用半透明背景覆盖或者为窗口添加投影，或者两者结合。这么做有两个作用：一是能让用户将注 意力集中到浮窗上，然后暂时忽视掉背后的页面。另外，也能增加窗口和页面之间的深度感和区分度，让人在视觉上觉得这窗口确实是漂浮着的。注意看下面的例子 (KissMetrics)，半透明的黑色背景让页面消隐，有助于登录浮窗暂时成为视觉重点。另外，取消和关闭窗口的按钮也设计得很好，够明显，够漂亮。
|
