设计图片背景网页

【译者的话】 将一张美丽开阔的照片作为网页背景图,不但美丽吸引,而且也让观众有一种亲临其境的体验感,增强了网页所传达的信息。而设计这样一个网页,技术上并不难,但在图片处置上却有留意的中央。让我们一同来体验

【译者的话】 将一张美丽开阔的照片作为网页背景图,不但美丽吸引,而且也让观众有一种亲临其境的体验感,增强了网页所传达的信息。而设计这样一个网页,技术上并不难,但在图片处置上却有留意的中央。让我们一同来体验这种充溢视觉冲击力的网页制造。

原文出处:www.bamagazine.com

北卡罗莱纳州商务部上司的旅游网站并没有象其它网站一样仅仅引见该州的诱人风光,而是让你恍如置身于该州的风光之中。由于该网站采用了视野开阔、美丽诱人的照片作为背景。广大的图片给人一种超大屏幕影院( IMAX )的视觉效果,传达出空间感及真实感。整个网页显得美丽诱人。还有一点:这种效果其实很容易制造。

美丽网页从美丽图片开端。为了设计这样的一种超大屏幕感的视觉效果,背景图片必需很宽――至多 22 英寸 ――比普通的显示器都要宽,这样就算在大小不一的显示器中观看,也一样能占满背景。为了使视觉一致协调,无论网页窗口是拉大拉小,我们都要保证背景图片及内容网页都依然居中。

运用具有激烈中心焦点的图片

焦点是最大的关键:上述图片上方的中心地位构成一个视觉焦点,这让我们在观看这个网页时有了一个终点。所以我们要选择那些具有中心焦点的图片(参考上方三张图片)。最好是选择那些视野开阔、较少细节的图片。留意上述三张图片中,透视消逝点与图片的焦点是处于同一个地位的(或十分接近)。防止构图发散、繁琐或焦点偏离中心的图片,否则会使整个网页显得拥堵,让读者无法适从。

在 Photoshop 里预备图片

尺寸及象素:处置图片最好的办法就是将一张本来300dpi 的图片变成 72dpi 。在 PS 里很容易完成,选择:图像 > 图像大小,然后在对话框中,不要选“重定图像像素”选项,在分辨率一栏中输出 72 后,按确定即可。

最新案例