<pre id="bbfd9"><del id="bbfd9"><dfn id="bbfd9"></dfn></del></pre>

          <ruby id="bbfd9"></ruby><p id="bbfd9"><mark id="bbfd9"></mark></p>

          <p id="bbfd9"></p>

          <p id="bbfd9"><cite id="bbfd9"></cite></p>

            <th id="bbfd9"><form id="bbfd9"><dl id="bbfd9"></dl></form></th>

            <p id="bbfd9"><cite id="bbfd9"></cite></p><p id="bbfd9"></p>
            <p id="bbfd9"><cite id="bbfd9"><progress id="bbfd9"></progress></cite></p>
            網頁設計

            網頁設計中的文字長度如何控制

            時間:2025-05-13 08:32:32 網頁設計 我要投稿
            • 相關推薦

            網頁設計中的文字長度如何控制

              網頁設計中的文字長度設計也是很有講究的,那么網頁設計中的文字長度如何控制呢,下面小編為你講解一下吧!

              提升網頁文字可讀性的關鍵之一,就是讓每行文字承載合適的字數。這不僅僅是設計一下文字寬度的問題,它也應該是一個易讀性的問題。

              文字最佳長度是每行承載50-60字符,包括空格。也有其他資料建議不超過75字/行也可以接受。但你一定會問,不按這樣的標準做又會怎樣?

              太長-如果一行里文字太多,用戶眼球很難長時間聚焦文本。因為文本長度過長會讓人很難注意到段落的起點和終點。此外,對于這么大塊文本來說,也很難對當前行進行繼續閱讀。

              太短-如果一行里文字太少,眼睛要不停的來回掃視,破壞了閱讀節奏。同時,每行文本太短也樣會讓人覺得緊張,這行沒看完就跳到下一行去了(很可能一些重要的詞會被跳過)。

              原本跳到下一行文字時,潛意識里是會那么有點小亢奮(只要別太頻繁,原因見上面兩點)。因此在每一行的開頭,讀者的精力都很集中,但這種專注會逐漸消褪,可能還沒等把這行看完。

              為了避免文本過長或過短所帶來的弊端,同時又能持續的激勵讀者,我們建議把每行承載的文本量控制在5-75個字符(中文建議35-45個漢字,14px)。

              網頁設計中如何控制最佳長度

              在網頁設計中,可以使用em或px(像素)來實現每行字符的最佳數目(使用em可以獲得很好的效果,但操作起來比px略顯復雜)。其實無論選擇哪一種,要獲得最佳效果,都需要為你的讀者設置一個固定寬度。

              這也是我們為什么不推薦使用“流式”布局的原因之一:實際上你在強制用戶通過改變瀏覽器窗口,來獲得更好的閱讀體驗。當想到時下顯示器屏幕有這么多不同的分辨率,很明顯,“流式”布局會讓文本行變得要么寬,要么窄。

              正如大家看到在站上,我們使用了17px的Arial來呈現文字。文章容器寬度為504px,每一行大概65個字符。在你的頁面中,每行顯示多少個字符?50-75個?如果你想讓你的讀者擁有更好的閱讀體驗,就該這么做。

            【網頁設計中的文字長度如何控制】相關文章:

            網頁設計中的文字如何設計05-07

            網頁設計中的文字運用07-09

            網頁設計中如何設計按鈕07-29

            網頁設計中應該如何配色09-06

            網頁設計中字體和文字搭配的技巧10-01

            網頁設計文字排版10-07

            網頁設計中如何運用柔和色調07-29

            如何使用網頁設計中的圖片敘事07-28

            網頁設計文字排版技巧08-24

                    <pre id="bbfd9"><del id="bbfd9"><dfn id="bbfd9"></dfn></del></pre>

                    <ruby id="bbfd9"></ruby><p id="bbfd9"><mark id="bbfd9"></mark></p>

                    <p id="bbfd9"></p>

                    <p id="bbfd9"><cite id="bbfd9"></cite></p>

                      <th id="bbfd9"><form id="bbfd9"><dl id="bbfd9"></dl></form></th>

                      <p id="bbfd9"><cite id="bbfd9"></cite></p><p id="bbfd9"></p>
                      <p id="bbfd9"><cite id="bbfd9"><progress id="bbfd9"></progress></cite></p>
                      飘沙影院