網(wǎng)頁制作設(shè)計時你不的不考慮的東西

網(wǎng)頁制作設(shè)計時你不的不考慮的東西，其實在實際工作中，網(wǎng)頁制作設(shè)計時需要考慮的東西不僅僅是網(wǎng)頁色調(diào)，網(wǎng)頁的風(fēng)格等等，這些是最為基礎(chǔ)的，但是一個網(wǎng)頁最為能體現(xiàn)出細(xì)節(jié)性的東西比如文字的行距，行高，大小，顏色等等，這些也時候網(wǎng)站的主要元素，也是最為能體現(xiàn)歘網(wǎng)站的細(xì)節(jié)性的東西，但是這些細(xì)小的東西往往是人們在實際制作網(wǎng)頁的時候最容易忽略的元素，接下來我們來詳細(xì)的看看專業(yè)的網(wǎng)站制作公司的專家是怎么說的。最近負(fù)責(zé)某知識型社區(qū)的改版，其中一塊是提升讀者在網(wǎng)頁端閱讀的體驗。在調(diào)研一些網(wǎng)站的設(shè)計規(guī)范和查閱部分文獻(xiàn)后，結(jié)合自己的思考，總結(jié)如下幾點，以供參考。一個閱讀型網(wǎng)頁，比如各新聞資訊網(wǎng)站、閱讀型社區(qū)、web端讀書網(wǎng)站等，在去除廣告等干擾元素后，純內(nèi)容的閱讀體驗會受到以下幾個因素的影響：字體、字號、字色、行寬、行間距、段間距、背景色。

接下來一一介紹。字體：襯線字體 or 非襯線字體：調(diào)研了多個網(wǎng)站，均采用非襯線字體。查閱資料，襯線字體更富表現(xiàn)力，可提高辨識度和閱讀效率，多用于報紙、書籍等印刷品，以及電子雜志和藝術(shù)網(wǎng)站的正文字體。在電子屏上顯示時，由于字號、顯示器尺寸、顯示器分辨率等影響因素，使用襯線字體時過細(xì)的筆畫可能會顯示不清難以辨認(rèn)。從穩(wěn)妥角度考慮，這可能是各大網(wǎng)站均采用非襯線字體作為選字體的原因。推薦以下字體：MacOS中文：選 蘋方regular 次選 冬青黑體簡體。英文：選 Helvetica Neue 次選 Arial。Windows中文：選 微軟雅黑 次選 冬青黑體簡體。英文：選 Arial 次選 Tahoma。字號：字號太小看不清累眼睛，太大頁面不精致且顯示效率低。一個字在顯示器上顯示出來有多大，取決于字號和單個像素方塊的物理尺寸。單像素塊尺寸，取決于顯示器尺寸和顯示器分辨率。隨著顯示器技術(shù)發(fā)展，在顯示器尺寸沒有變大的情況下，顯示器分辨率越來越高，這意味著單像素方塊的物理尺寸越來越小，因此網(wǎng)頁端設(shè)計時的推薦字號也在變大，從12px 到 14px 到 16px。穩(wěn)妥起見，正文建議使用 16px 。以此為基準(zhǔn)，擴大和減小后確定標(biāo)題和輔助文本的字號，此處建議以 4px 為步長，使對比明顯。字色和背景色：閱讀體驗受文字和背景的對比度影響。高對比度時，識別清晰，但眼睛容易疲勞。只有找到一個合適的對比度，才能做到既識別清晰，長時間閱讀又不容易累。首先是白底黑字和黑底白字。二者本身對比較強，加上人類眼睛側(cè)抑制等視覺機制，會讓反差特別大，因此識別起來很清晰。由于白底黑字相較于黑底白字的反差更小[1]，故而可讀性更高，適用于注重文字閱讀的網(wǎng)站；黑底白字視覺刺激性強，適用于注重視覺表現(xiàn)力或營造氛圍的單頁面，比如海報、主題網(wǎng)站首頁等。另外，對于視覺受損的用戶，此兩種配色方案也是較人性化的選擇。然而，白底黑字并非最好。由于白色具有100%的亮度，黑色是0%，巨大的亮度對比讓眼睛在閱讀時要盡全力去適應(yīng)，容易引起眼部疲勞，因此白底黑字仍不適宜長時間的閱讀，所以印刷品讀物的紙張多用乳白色或淡黃色的紙張。又因為顯示器本身就發(fā)光，所以在電腦上閱讀純白色背景的文字，比在紙上閱讀時，眼睛會更容易疲乏。然而Hill(1997)的研究卻表明：黑色和白色一直被認(rèn)為是最可讀的；有黑色在內(nèi)的色彩組合比沒有黑色的色彩組合更易于閱讀；較淺背景上較深的文本比較暗的背景上較淺的文本的評價高。因此，更好的組合可能是保證了對比度(大于4.5)的淺灰背景 + 深灰文本。行寬：行寬過大，閱讀時要轉(zhuǎn)動脖子，降低閱讀效率，而且目光從行尾移至下一行首容易串行。行寬過小，用戶注視點要在行間頻繁跳躍，降低了閱讀速度，體驗也不好。為防止此現(xiàn)象，文本寬度最好在450-700px之間。確定具體數(shù)值時，要注意行寬應(yīng)該是正文字號的整數(shù)倍。這是因為中文是方塊字，最好的排版應(yīng)該像小學(xué)時的作文本那樣，每一列字都對齊，除最后一行外，每一行應(yīng)該寫滿，這樣才能整整齊齊。如果采用左對齊，可以達(dá)到每一列字都對齊(有半角字符的行，會破壞隊形)，但當(dāng)最后一個字符為標(biāo)點時，會直接換行，導(dǎo)致此行會缺一塊，不好。如果采用兩端對齊，就能避免這種情況。但兩端對齊有另一個問題，段落的最后一行不一定寫滿行。當(dāng)最后一行未寫滿行，且，行寬不是正文字號的整數(shù)倍時，為了達(dá)到兩端對齊，前面行會增加字間距，但最后一行不會增加字間距。這樣，最后一行的每個字都不能與其所在列對齊。如果行寬是正文字號的整數(shù)倍，就能避免這種情況。達(dá)到兩端對齊不留空，每列對齊像閱兵的效果。左對齊兩端對齊行間距：行間距太小，有密不透氣的感覺，讀者瀏覽文章時容易串行；行間距太大，閱讀時會感覺文章不夠連貫，頁面也不夠精致。網(wǎng)頁上行距常用em為單位，不管是中文網(wǎng)站還是英文網(wǎng)站，大多用1.5em-1.8em的行距。段間距：分情況。文章較短，就不需要很寬的段距；文章很長，最好利用段距分隔文章的節(jié)奏，給閱讀者喘息和思考的機會，提高文章的可讀性。經(jīng)驗值是，段間距一般為行間距的75% 。實際上，影響純內(nèi)容閱讀體驗的遠(yuǎn)不止以上這些。實際工作中，環(huán)境光、設(shè)備尺寸和分辨率、用戶視力等都應(yīng)該在設(shè)計師的考慮范圍內(nèi)。魔鬼在細(xì)節(jié)中，多考慮一些，用戶體驗就會提升一些。

分享題目：網(wǎng)頁制作設(shè)計時你不的不考慮的東西
當(dāng)前網(wǎng)址：http://muchs.cn/news23/66623.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站內(nèi)鏈、網(wǎng)頁設(shè)計公司、營銷型網(wǎng)站建設(shè)、品牌網(wǎng)站制作、電子商務(wù)、網(wǎng)站設(shè)計

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)