圖像版式是靜態(tài)圖像,它不會移動,可受用戶控制,是靈活的Web頁面。它們將與最終創(chuàng)建的頁面的在外觀上十分相近。然而,在創(chuàng)建版式的過程中還要執(zhí)行很多操作步驟,以使其更接近最終的頁面,并且在對版式進(jìn)行切片時更容易將它轉(zhuǎn)換成最終頁面。
設(shè)置畫布尺寸
當(dāng)為固定寬度的設(shè)計創(chuàng)建版式時,很容易確定所需畫布的尺寸。只要決定最終的固定頁面的寬度,并且為畫布設(shè)置同樣的盡寸即可(或者可能將它設(shè)置得更大一些,如果對超出的空白區(qū)域也進(jìn)行了設(shè)計,即使用戶使用超出固定寬度的尺寸,同樣也可以顯示設(shè)計圖案)。
當(dāng)創(chuàng)建靈活設(shè)計時,以像素為單位的頁面寬度將因用戶而異,那你會為畫布選擇什么寬度呢?我想你有3種選擇:
a.選擇你認(rèn)為的最小的設(shè)計寬度。
b.選擇你認(rèn)為的大的設(shè)計寬度。
c.選擇你認(rèn)為的大多數(shù)用戶都會采用的中等尺寸。
每種選擇都有它的優(yōu)缺點(diǎn)。
1.匹配最小的寬度
在創(chuàng)建版式之前,應(yīng)該決定設(shè)計的最小寬度(或你想讓用戶看到的最重要部分的最小寬度)。于是,你可以將這個最小寬度或與之按近的寬度作為畫布的寬度。這可以讓你確保所有一切都非常適合這個小尺寸。同時還可以讓你避免犯因疏忽而讓圖像過大以至于不匹配最小寬度的錯誤。
然而,設(shè)計成最小寬度也會有問題,這主要是因?yàn)樽罱K的設(shè)計效果在得到延展后,一切看起來是那么的松散、稀疏。你不妨想象一下這個設(shè)計被拉寬后的效果,這樣一來,你便可以根據(jù)一個更寬的寬度范圍來更改設(shè)計了。
2.匹配大的寬度
除了最小的寬度外,你也許還要在設(shè)計里包含大的寬度——要么是你想要展現(xiàn)的壯麗的場景,要么是那些超出你意料之外的瀏覽者所期望的。如果你在設(shè)計中使用大的寬度來設(shè)定畫布的尺寸,就可以避免設(shè)計在較大的顯示尺寸下顯得過于松散、稀疏的問題,并確保文字的長度不會變得太長而難以閱讀。在切分設(shè)計版面前,你說不定還可以省卻修改版面的功夫了——見后續(xù)內(nèi)容,通常,創(chuàng)建小于最終頁面的版面意味著在切分版面時必須延展版面,因此切片需要與所需頁面相同大小。
然而,以一個大的寬度設(shè)計可能會不經(jīng)意地增添了設(shè)計的難度——它比設(shè)計小尺寸的空間要難一些。你也許會過度地放大圖像或者在設(shè)計中填入過多的“素材”(功能框、圖像、工具條),這樣一來,當(dāng)頁面以較小的寬度顯示時,頁面看起來會非常擁擠并且很難閱讀。
3.選擇一個折衷的辦法
除了使用最小和大的寬度,你還可以選擇位于這兩種寬度尺寸之間的值用做畫布尺寸??纯茨姆N尺寸可能為大多數(shù)瀏覽者所使用,并將該尺寸用做設(shè)計尺寸。你可以將設(shè)計優(yōu)化為大多數(shù)人想看的那種。
使用折衷的畫布尺寸可以幫助你避開那兩種缺點(diǎn)。但是如果你不仔細(xì)的話,它也可以讓你的設(shè)計更受兩種缺點(diǎn)的影響。例如,你應(yīng)該讓設(shè)計的寬度跨越600像素到1200像素,并且創(chuàng)建一個寬度為900像素的設(shè)計。非常有可能,你會創(chuàng)建一個四不像的設(shè)計:圖像對于600像素的最小寬度來說不合適——太大,頁面元素和文本對于1200像素的大寬度來說太稀疏,很不容易閱讀。盡管就很多方面而言,這個設(shè)計都非常了不起,但是它始終有一個缺陷:在兩個極端的寬度尺寸(而非一個)都存在問題。然而,當(dāng)你采用位于它們中間的尺寸瀏覽時,這些問題的嚴(yán)重性又將得到不同程度的緩解。對于大多數(shù)設(shè)計而言,中間寬度可能足的-一在整個設(shè)計過程中,要謹(jǐn)慎小心并且持續(xù)不斷地考慮以其他可能的寬度顯示的情形。始終要牢記的一點(diǎn)是,最終創(chuàng)建的Web頁面不是一個靜態(tài)的頁面,它將是一個靈活的頁面。
標(biāo)題名稱:網(wǎng)頁設(shè)計準(zhǔn)備:創(chuàng)建圖像版式
文章位置:http://jinyejixie.com/news/194385.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)網(wǎng)站建設(shè)、ChatGPT、小程序開發(fā)、網(wǎng)站維護(hù)、響應(yīng)式網(wǎng)站、全網(wǎng)營銷推廣
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源:
創(chuàng)新互聯(lián)