图像版式是静态图像,它不会移动,可受用户控制,是灵活的Web页面。它们将与最终创建的页面的在外观上十分相近。然而,在创建版式的过程中还要执行很多操作步骤,以使其更接近最终的页面,并且在对版式进行切片时更容易将它转换成最终页面。
设置画布尺寸
当为固定宽度的设计创建版式时,很容易确定所需画布的尺寸。只要决定最终的固定页面的宽度,并且为画布设置同样的尽寸即可(或者可能将它设置得更大一些,如果对超出的空白区域也进行了设计,即使用户使用超出固定宽度的尺寸,同样也可以显示设计图案)。
当创建灵活设计时,以像素为单位的页面宽度将因用户而异,那你会为画布选择什么宽度呢?我想你有3种选择:
a.选择你认为的最小的设计宽度。
b.选择你认为的最大的设计宽度。
c.选择你认为的大多数用户都会采用的中等尺寸。
每种选择都有它的优缺点。
1.匹配最小的宽度
在创建版式之前,应该决定设计的最小宽度(或你想让用户看到的最重要部分的最小宽度)。于是,你可以将这个最小宽度或与之按近的宽度作为画布的宽度。这可以让你确保所有一切都非常适合这个小尺寸。同时还可以让你避免犯因疏忽而让图像过大以至于不匹配最小宽度的错误。
然而,设计成最小宽度也会有问题,这主要是因为最终的设计效果在得到延展后,一切看起来是那么的松散、稀疏。你不妨想象一下这个设计被拉宽后的效果,这样一来,你便可以根据一个更宽的宽度范围来更改设计了。
2.匹配最大的宽度
除了最小的宽度外,你也许还要在设计里包含最大的宽度——要么是你想要展现的壮丽的场景,要么是那些超出你意料之外的浏览者所期望的。如果你在设计中使用最大的宽度来设定画布的尺寸,就可以避免设计在较大的显示尺寸下显得过于松散、稀疏的问题,并确保文字的长度不会变得太长而难以阅读。在切分设计版面前,你说不定还可以省却修改版面的功夫了——见后续内容,通常,创建小于最终页面的版面意味着在切分版面时必须延展版面,因此切片需要与所需页面相同大小。
然而,以一个大的宽度设计可能会不经意地增添了设计的难度——它比设计小尺寸的空间要难一些。你也许会过度地放大图像或者在设计中填入过多的“素材”(功能框、图像、工具条),这样一来,当页面以较小的宽度显示时,页面看起来会非常拥挤并且很难阅读。
3.选择一个折衷的办法
除了使用最小和最大的宽度,你还可以选择位于这两种宽度尺寸之间的值用做画布尺寸。看看哪种尺寸可能为大多数浏览者所使用,并将该尺寸用做设计尺寸。你可以将设计优化为大多数人想看的那种。
使用折衷的画布尺寸可以帮助你避开那两种缺点。但是如果你不仔细的话,它也可以让你的设计更受两种缺点的影响。例如,你应该让设计的宽度跨越600像素到1200像素,并且创建一个宽度为900像素的设计。非常有可能,你会创建一个四不像的设计:图像对于600像素的最小宽度来说不合适——太大,页面元素和文本对于1200像素的最大宽度来说太稀疏,很不容易阅读。尽管就很多方面而言,这个设计都非常了不起,但是它始终有一个缺陷:在两个极端的宽度尺寸(而非一个)都存在问题。然而,当你采用位于它们中间的尺寸浏览时,这些问题的严重性又将得到不同程度的缓解。对于大多数设计而言,中间宽度可能足最好的-一在整个设计过程中,要谨慎小心并且持续不断地考虑以其他可能的宽度显示的情形。始终要牢记的一点是,最终创建的Web页面不是一个静态的页面,它将是一个灵活的页面。