網站設計的時候經常需要有好的用戶體驗，好的用戶體驗可以帶給網站更多的用戶停留和跳轉，繼而提高網站頁面的權重，這也是獲得百度排名的一個重要方式。 良好的排版帶來秩序頁面，並增加可讀性。它使人們能夠更快地處理信息。
更可掃描，讀取網站表示高興的訪問者。快樂訪問者返回的時候，購買的產品，留下評論，並與朋友分享的網站。看到爲什麼它可能是值得我們思考？ 我可以永遠地亂說就多遠印刷術已經在網絡上，並多遠但它已去。我網絡和印刷設計之間經常反彈。當你打算從InDesign到TextMate的，網絡型的限制都一清二楚。 但很多已經說了什麼類型的網站無法做到。這不會是另一種咆哮。相反，讓我們專注於5個簡單的修復對於網絡上比比皆是的排版不美觀。 1。使用A重置樣式表 愚蠢的，但卻是事實：沒有兩個瀏覽器使用相同的演示文稿的默認值。在填充的差異，利潤率，標題和壓痕猖獗。如果你希望你的頁面佈局是跨瀏覽器比較一致，就得先從一個CSS樣式表復位。 使用樣式表重置爲更好的網絡類型。 二，我建議： 雅虎的CSS樣式表復位 Eric Meyer的CSS樣式表重置 2。看你的測量尺寸 措施是指類型的單個行的長度。較長線=更長的測量。有研究表明，以獲得最佳的可讀性，運行文本列如你的主體副本應該是介於45 – 75個字符（30 – 50 EMS）包括空格。這是流體設計（那些在該列膨脹和收縮以適應瀏覽器的寬度）是很難對眼睛的原因之一。 此外，您的領導要加強與您測量的長度。主要是文本行之間的空白量，並通過CSS line-height屬性進行控制。如果你需要使用一個超長措施，確保您的領導打開。 同樣，如果你有一個小專欄，如用短衡量一個側邊欄，你的領導應該是嚴格的。我發現默認值大多數瀏覽器分配是有點太緊。約1.4em A線高度適用於大多數的主體內容。 3。往往會之間的空間 這不只是關於你的文字 – 其約，圍繞它的空間。空間太少，使文字難以閱讀，但這樣做太多。關鍵是要找到一個簡單的平衡，引導眼睛從一個元素到下一個。 空白示例 其中一個常見的錯誤新晉設計師提出的是，以填補每一寸空間。白色空間指的是空或“負”空間周圍的內容，這是至關重要的。看看一個精心設計的雜 志，如暫停或好你會看到，即使它的成本出版商錢打印每一頁，他們離開的空白量豐富文本週圍。該頁面將在平衡，你的眼睛會有效地移動從空間到空間。 除了 調整你的line-height（如上文＃1），儘量增加你的padding和margins。除非你想拉一個瘋狂的視覺小把戲，應該永遠是空白量好你周圍的文字。別讓它對接起來反對其他元素，特別是圖片。讓你的內容塊（標題，段落，工具條等）的呼吸。 馬克·博爾頓寫了一個非常豐富的文章空白的列表除了，檢查出來。 4。不要去使用瘋狂的字體 根據經驗，任何設計師一個很好的規則是：用不超過兩個字體的面孔在你的設計。兩種字體外觀看起來非常時尚。列表除了使用格魯吉亞和Verdana字體的變化，創造出優雅和精緻的外觀。但持續字體外觀添加到您的界面創建不必要的混亂。同樣，避免使用過多的字體大小，顏色，或治療上的頁面或段落，否則會互相競爭，而不是增加重點爲目的。 雖然字體棧和技術，如sIFR那樣和Typeface.js允許您指定只是你想要作爲默認的任何字體，抵制誘惑，去野外與體內複製。裝飾字體最好保持在頭條新聞，因爲它們會影響可讀性。想想看-如果是你撿到一本平裝小說在Comic Sans字體設置完全是最後一次？ 當創建字體棧，注意你配對的大小。看起來相似呈現在非常不同的尺寸有些字體。宋體和Arial是一個很好的例子。Typetester是比較核心的Web字體和創造一個成功的堆棧一個很好的工具。另一個叫有用的工具，字體堆棧生成器顯示你有多少比例的用戶會看到每一個變化。 不管什麼字體你決定使用，確保它們不會極小的微小。我知道它很難……微小的文字看起來很酷。不過想想可憐，眯眼用戶！保持高於10或12個像素正文。如果你堅持極小的微小，至少使用相對大小爲所有的IE 6.0用戶，否則誰也不能使它更大。閱讀威爾遜礦工的文章上的字體大小爲一個偉大的作爲在辯論。 5）不要忽視細節 客戶端提供的內容。將其添加到該網站僅僅是複製和粘貼的事，對不對？錯，錯，錯，這是一個陷阱網頁設計師陷入所有過於頻繁。 連我們這些誰勤奮加上標題標籤，格式化每個段落，並組織項目符號列表小心忘記一些重要的排版細節。許多人（包括我）錯過了正式的排版訓練，所以你不能責怪我們完全。但魔鬼在細節中。其時，我們採用以下基本內容： 使用智能引號 什麼是智能引號和啞引號之間的區別？智能引號（也稱爲書或捲曲）是彎曲的，並同時具有打開和閉合式。阿呆（直）的報價通常是直上直下。撇號是印刷上只是一個單引號，因此同樣的問題適用。一個愚蠢的報價（也稱爲黃金）只測量之間使用。例如，6’4“採用雙和單質引號。 Web版式智能引號 不幸的是我們的鍵盤默認爲黃金的報價。Microsoft Word和其它的文本編輯器只是糾正他們對我們，因爲我們寫的。添加智能引號HTML頁面，需要從Web開發者更多的工作，因爲你需要使用標記來產生打開和關閉引號符號。我看到了同樣的問題與EM和EN-破折號，省略號，商標和版權符號。編碼器採取簡單的方法通過用連字符，多時段，大TM與臭名昭著的（C）取代。使用正確的符號，並有所作爲視覺。這樣做的權利，使編輯器隨處可見的笑容。 如何使智能引號： ＃8216; =開單引號' =右單引號“ =開雙引號“ =右雙引號 我知道-沒有人願意整天追捕報價。幸運的是，像工具SmartyPants和Textism可以通過自動格式化文本，包括智能引號之類的做多跑腿給你的。 閱讀“在與EM和CS故障”從列表中除了瞭解有關該主題的更多細節和最常用的特殊字符的UTF-8字符編碼。 一個警告 – 許多CMS文本編輯器（如一個這個網站使用）不會讓你實現智能引號，無需額外的插件。傷心，但卻是事實。 停止把兩個空格一段時間後，請！這是沒有必要的，它實際上相當惱人。 您的鏈接，使用底部邊框：1px的固體，而不是文本裝飾：下劃線。下劃線可以通過下降的字符（G，J，P，Q，Y）使得它們難以閱讀，使用較小的字體大小，尤其是當運行。 雖然它沒有任何關係與排版，運行快速拼寫檢查從來沒有殺過人。即使所有你所做的就是複製和粘貼，拼寫錯誤滑倒通過對現場工地嚴重反映了人人蔘與。 注意那些5修復和您的網站的設計一定會改善。請記住，這些只是一個起點。良好的排版就像其他任何一門學問，它需要研究和實踐， 始終保持眼睛出了越來越正確的網站，讓他們在做什麼值得注意的。 總結：上面就是我們在製作網站的時候需要注意的用戶體驗問題，也是我們以後再設計網站的時候注意的點，好的網頁設計不代表好的用戶體驗，但是好的用戶體驗一定不是差的網頁設計。 |
