网页设计准备：创建图像版式

2022-08-31 分类：网站建设

图像版式是静态图像，它不会移动，可受用户控制，是灵活的Web页面。它们将与最终创建的页面的在外观上十分相近。然而，在创建版式的过程中还要执行很多操作步骤，以使其更接近最终的页面，并且在对版式进行切片时更容易将它转换成最终页面。

设置画布尺寸

当为固定宽度的设计创建版式时，很容易确定所需画布的尺寸。只要决定最终的固定页面的宽度，并且为画布设置同样的尽寸即可（或者可能将它设置得更大一些，如果对超出的空白区域也进行了设计，即使用户使用超出固定宽度的尺寸，同样也可以显示设计图案）。

当创建灵活设计时，以像素为单位的页面宽度将因用户而异，那你会为画布选择什么宽度呢？我想你有3种选择：

a.选择你认为的最小的设计宽度。

b.选择你认为的大的设计宽度。

c.选择你认为的大多数用户都会采用的中等尺寸。

每种选择都有它的优缺点。

1．匹配最小的宽度

在创建版式之前，应该决定设计的最小宽度（或你想让用户看到的最重要部分的最小宽度）。于是，你可以将这个最小宽度或与之按近的宽度作为画布的宽度。这可以让你确保所有一切都非常适合这个小尺寸。同时还可以让你避免犯因疏忽而让图像过大以至于不匹配最小宽度的错误。

然而，设计成最小宽度也会有问题，这主要是因为最终的设计效果在得到延展后，一切看起来是那么的松散、稀疏。你不妨想象一下这个设计被拉宽后的效果，这样一来，你便可以根据一个更宽的宽度范围来更改设计了。

2.匹配大的宽度

除了最小的宽度外，你也许还要在设计里包含大的宽度——要么是你想要展现的壮丽的场景，要么是那些超出你意料之外的浏览者所期望的。如果你在设计中使用大的宽度来设定画布的尺寸，就可以避免设计在较大的显示尺寸下显得过于松散、稀疏的问题，并确保文字的长度不会变得太长而难以阅读。在切分设计版面前，你说不定还可以省却修改版面的功夫了——见后续内容，通常，创建小于最终页面的版面意味着在切分版面时必须延展版面，因此切片需要与所需页面相同大小。

然而，以一个大的宽度设计可能会不经意地增添了设计的难度——它比设计小尺寸的空间要难一些。你也许会过度地放大图像或者在设计中填入过多的“素材”（功能框、图像、工具条），这样一来，当页面以较小的宽度显示时，页面看起来会非常拥挤并且很难阅读。

3.选择一个折衷的办法

除了使用最小和大的宽度，你还可以选择位于这两种宽度尺寸之间的值用做画布尺寸。看看哪种尺寸可能为大多数浏览者所使用，并将该尺寸用做设计尺寸。你可以将设计优化为大多数人想看的那种。

使用折衷的画布尺寸可以帮助你避开那两种缺点。但是如果你不仔细的话，它也可以让你的设计更受两种缺点的影响。例如，你应该让设计的宽度跨越600像素到1200像素，并且创建一个宽度为900像素的设计。非常有可能，你会创建一个四不像的设计：图像对于600像素的最小宽度来说不合适——太大，页面元素和文本对于1200像素的大宽度来说太稀疏，很不容易阅读。尽管就很多方面而言，这个设计都非常了不起，但是它始终有一个缺陷：在两个极端的宽度尺寸（而非一个）都存在问题。然而，当你采用位于它们中间的尺寸浏览时，这些问题的严重性又将得到不同程度的缓解。对于大多数设计而言，中间宽度可能足的-一在整个设计过程中，要谨慎小心并且持续不断地考虑以其他可能的宽度显示的情形。始终要牢记的一点是，最终创建的Web页面不是一个静态的页面，它将是一个灵活的页面。

分享文章：网页设计准备：创建图像版式
文章源于：https://www.cdcxhl.com/news35/194385.html

成都网站建设公司_创新互联，为您提供虚拟主机、标签优化、网站设计、企业网站制作、微信小程序、网站营销

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容