<big id="n3dbt"><strong id="n3dbt"></strong></big>
      1. <small id="n3dbt"><delect id="n3dbt"></delect></small>

        <thead id="n3dbt"><ruby id="n3dbt"><rp id="n3dbt"></rp></ruby></thead>
        <th id="n3dbt"></th>
        <span id="n3dbt"></span><span id="n3dbt"></span><span id="n3dbt"></span><strike id="n3dbt"></strike>

        建站百科Website News

        當前位置:首頁 »精雕細琢!打造先進用戶體驗網站排版規則

        精雕細琢!打造先進用戶體驗網站排版規則

        至成科技 2016-04-07 訪問量(1355) 評論(0)
        摘要:

            對于西安網站建設和APP而言,良好的排版不僅僅是擺上漂亮的字體就可以搞定的,高度的可讀性和可識別性并不是簡單的要求,視覺設計和內容風格也應當做好一致性。雖然這些要求看起來和“高大上”的需求一樣空泛,但是找準方向稍加訓練,并不難做到。

            所以,今天至成科技將為你奉上10條可以幫你提升用戶體驗的排版規則,每條規則都附上實際案例助你理解和運用。

        可讀性原則

            網頁必須使用非襯線體字體這種想法已經過時了,但是這種說法背后的核心思想并不過時:文本必須是易于閱讀的。想要挑選易于閱讀的字體,手寫字體、哥特字體和過于新穎的字體應當盡量避免使用。當然,如果是需要藝術性字體來做裝飾的場景就另當別論了。可讀性先進的字體在可識別性上也不錯,并且他們通常不會特別的“顯眼”。這些字體應該是“透明”的,這樣可以讓用戶無障礙、下意識地接受,這就是他們的工作原理。

        行間距足夠寬

            行間距是影響用戶閱讀體驗的關鍵因素之一,太過致密會令人閱讀困難,有呼吸感的行間距則會令人著迷。尤其是如今大量用戶在手機和平板上閱讀,相對寬一點的行間距對于緩解閱讀大量內容有相當的緩解作用。

            而要控制好行間距需要牽涉到好幾個變量:

        ·字體尺寸
        ·段落長度
        ·字體樣式
        ·屏幕寬度

            而非常遺憾的一點在于,并不存在一個固定的換算公式可以幫你搞定這一切,不過可以這么做:

        ·對于絕大多數網站而言,較佳行間距應該是字體高度的125%
        ·對于絕大多數移動端設備而言,較佳行間距是字體高度的150%
        ·寬松的行間距(比如直接空一行作為行間距)能讓內容更易于被識別和掃描
        ·控制行間距的松緊,用雙眼來瀏覽段落進行測試,基于感覺來進行調整

        選擇有字母含有大圓角的字體

            對于西文字體,含有較大圓角和內空的字體更易于閱讀。明顯的圓角弧度讓B和R這樣的字體易于被識別,而內空則是O和Q這樣字母的標志。

            緊湊和致密的字體讓眼睛難于辨識,而曾經在紙媒上流行過的較寬的標題字體,識別度就相當不錯,因為當字體拉寬之后,不同字母的差異就越發明顯。圓角弧度更大的字體看起來更接近于給孩子們設計的字體,而幼年時期對于字體所構建起的美學認知,是會伴隨人的一生的。

        讓字體更大一點

            毫無疑問,字體適當的放大會讓人感覺更舒服。當然,字體的大小通常取決于你的實際需求,而在處理大段文字的時候,就需要注意了。

            雖然不同的設計師在文字的處理上有著不同的想法,但是通常大家會認為每行的字符數量應當控制在45~60個之間(中文也有一個約定俗成的數量),而在移動端上,這個數量通常需要減半看起來才足夠舒適。

        找x高度較高的字體

            和中文字體不同,西文字體有上伸區和下降區,小寫字母x的高度是這套字體的x高度。小寫字母的整體比例會直接影響到閱讀的體驗。

            x高度相對比例更大的字體更易于閱讀,換句話來說,就是小寫字母的高度更接近大寫字母的高度。較理想的情況是,字體的x高度處于大寫字母高度的三分之二到四分之三之間。

        顯示字體的字距調整

            細致到位的字距調整能創造好的排版。

            正文的內容如此之多,仔細調整所有的字母間的字距當然是不現實的,而且也沒有這個必要。但是對于標題字體和展示字體,字距的調整就相當有必要了。不同字母的筆畫角度都不盡相同,每對字母之間的距離進行適當調整,讓它們看起來像是天生一對那樣。這樣的細節能讓你的設計在諸多網站設計中脫穎而出。

            其實中文和日文的字體排版中也同樣用到了字距調整的技巧,使用平假名和片假名尤其多的日本,在標題和展示字體的排版上經常會用到字距調整,來整體的視覺體驗。

        仔細思考比例

            當你在為一個項目挑選字體樣式的時候,將不同部分的尺寸比例想清楚對于后續的設計相當有幫助。可能聽起來好像有許多計算工作要做,但是并不一定麻煩,并且會對你的整個項目有極大的幫助。

            我們之前所提到的行間距的設定,就是需要考慮的比例之一。除此之外,標題、副標題和正文的字體大小比例應當如何設定,怎么樣設定尺寸大小才能營造出視覺的和諧感。剛剛開始把控比例的時候可能還不是太跟手,但是Tut Plus 有一個不錯的教程,可以幫你理解這件事。

        筆畫統一的字體較理想

            再看字體筆畫樣式,筆畫的寬度無疑是較重要的事情。超細的筆畫由于缺乏對比度大多難于識別,而筆畫太過于粗壯的字體可能存在同樣的問題,閱讀起來也相當的費眼睛。如果字體的粗細部分對比過于強烈、過于突然也可能帶來一定的顯示問題。

            其實解決方案也不難,挑選字母筆畫粗細適中,且筆畫相對比較一致的字體就好了。這類字體可以兼容更多的背景,在可讀性和適用性上相對更強。

        克制地使用字體

            只用兩種字體。再強調快速,只能用兩種字體。

            控制字體類型的數量應該是每一個項目的目標。太多用戶喜歡在一個界面當中瘋狂地塞進各種不同類型的字體,這對于眼睛是災難性的,閱讀困難,甚至招致用戶厭倦。

            你可以挑選兩個字體族作為常用字體——較多再挑選一款藝術字體用作展示之用——然后堅持使用這幾種字體。想清楚每個字體在什么時候使用,在什么地方使用,這其中應當涉及到字體的顏色、大小和位置。另外,在不同的頁面、不同設備上,字體的使用應該是一致的。

        提升對比度

            有許多時尚的網頁設計會讓背景和文字之間的對比度降0,營造出炫酷和融合的效果,但是內容的識別度就很0了,對于用戶而言并不友好。

            你的內容是網站的核心之一,所以重要性是毋庸置疑的。將內容和背景之間的對比度提升起來,讓每個詞都能在屏幕上清晰的識別出來,讓用戶輕松地獲取信息。網站所包含的文字內容越多,排版設計的重要性就越突出。排版結構舒適穩定、對比度明顯和諧、安全用色都是你必須做到的事情。

        網友評論

        登錄后可評論,請登錄

        全部評論:0條

        掃描左側二維碼
        關注至成微信公眾號

        西安至成信息科技有限公司  Copyright 2012-2019  xazcit.com  All rights reserved.

        Email:[email protected]     郵政編碼:710016     《中華人民共和國增值電信業務經營許可證》陜B1.B2-20140011     陜ICP備12008874號-1

        聯系地址:西安市經開區鳳城四路西安國際企業中心B座23層06-10室    售前咨詢熱線:029-89390727    售后服務電話:029-89393039

        西安網站建設、網站設計制作公司-至成科技,已為眾多企業提供網站建設網站制作響應式網站設計手機網站建設虛擬主機云主機服務器租用等建站解決方案。

        網絡警察 12321垃圾信息舉報 不良信息舉報 中國文明網 西安工商
        ×
        安徽25选5计划 福彩走势网首页 山西快乐10分玩法 2019年香港特马最准资料大全 极速赛车规律公式 体彩十一运夺金遗漏 千喜3d排列三试机号金码 澳洲幸运5预测 浙江11选5前三 彩票开奖黑龙江p62 E环球国际 代玩彩票兼职五十块 6加1开奖结果查询今天 上海快3开奖结果公告 爱彩乐查上海基诺开奖 足彩胜负彩预测分析及开奖结果