2014-08-22 分類: 網(wǎng)站建設(shè)
這類設(shè)計(jì)看起來(lái)胖嗎?沒(méi)有什么能毀掉一個(gè)設(shè)計(jì)排版不適合。是否太大(或過(guò)小),不當(dāng)型標(biāo)度是一個(gè)主要的問(wèn)題。
這是一個(gè)問(wèn)題可能比你想象的更多的設(shè)計(jì)。太常你訪問(wèn)一個(gè)網(wǎng)站的類型呈現(xiàn)精美的桌面瀏覽器,只有重新審視后從電話和難以閱讀。它發(fā)生的時(shí)間。
問(wèn)題是,型不是真正規(guī)模為每個(gè)設(shè)備。這是一個(gè)完全可以避免的問(wèn)題,當(dāng)你考慮一個(gè)印刷 規(guī)模項(xiàng)目。
一個(gè)印刷的尺度是什么?
視覺(jué)印刷規(guī)模的封裝尺寸,類型元素相對(duì)于另一個(gè)項(xiàng)目中的空間和比例。這包括一切從主體文體新聞、旗標(biāo)、字幕和其他文本元素。
成都網(wǎng)站推廣seo網(wǎng)站優(yōu)化
規(guī)模有助于確定關(guān)系的文本元素的大小和位置到另一個(gè)。對(duì)于網(wǎng)頁(yè)設(shè)計(jì),特別是視覺(jué)型的規(guī)模往往對(duì)應(yīng)你的CSS標(biāo)簽(如H1,H2,H3,P, 等等)。
一種幫助你創(chuàng)造規(guī)模設(shè)計(jì)的和諧與節(jié)奏。它也會(huì)讓你從文體的麻煩因?yàn)槲谋驹貙?duì)應(yīng)的CSS元素,設(shè)計(jì)的每個(gè)部分使用相同的元素和一致性。
規(guī)模應(yīng)根據(jù)正文文本大小。(總是設(shè)置字體和大小,第一)。然后建立規(guī)模圍繞這一主體的字體。不知道從哪里開(kāi)始?谷歌有一個(gè)可靠的推薦:
使用CSS基礎(chǔ)字體大小16像素。調(diào)整基于使用的字體屬性大小。
使用尺寸相對(duì)于基本尺寸確定的規(guī)模。
文本需要人物之間的垂直空間;一般推薦使用1.2瀏覽器默認(rèn)行高,
限制使用的字體的數(shù)量和規(guī)模的印刷。
創(chuàng)建和諧的節(jié)奏
一種尺度不僅僅是幫助用戶通過(guò)移動(dòng)復(fù)制,它創(chuàng)建文本流的和聲與節(jié)奏。這是重要的任何設(shè)備。
所以你從哪里開(kāi)始?
UX問(wèn)題有一些研究可在最小文本大小的裝置。請(qǐng)注意,這些都是最小尺寸和身體大小的文字繼續(xù)增加(如行距),你應(yīng)該考慮更大一點(diǎn)的尺寸。Steven Hoober建議啟動(dòng)至少百分之40大于推薦值。此外,增強(qiáng)的內(nèi)容風(fēng)格可以達(dá)到百分之80以上,但你應(yīng)該謹(jǐn)慎的特大型以及。
設(shè)備類型 最小尺寸 40%建議(調(diào)整使用方便) 80%大(調(diào)整使用方便)
小的手機(jī) 四 5.6(6) 7.2(7.5)
大的電話 六 8.4(8.5) 10.8(11)
phablet 七 9.8(10) 12.6(13)
平板電腦 八 11.2(11.5) 14.4(14.5)
筆記本/臺(tái)式機(jī) 十 14(14) 18(18)
一旦身體文字大小的設(shè)置,你可以決定如何支持文本元素的大小。有,驗(yàn)眼的藝術(shù)往往是一個(gè)好的開(kāi)始。
幾乎沒(méi)有這樣的東西作為一個(gè)整體,太大了。說(shuō)你要說(shuō)的和大小尺度空間中的話。兩行標(biāo)題會(huì)即使文字大小一樣的感覺(jué)超過(guò)一行。
要想放大標(biāo)題和其他較大的測(cè)試元素的最簡(jiǎn)單的方法是在百分之根據(jù)正文。而每一個(gè)設(shè)計(jì)師都有不同的起點(diǎn),百分之250大于正文的標(biāo)題很好的球場(chǎng);百分之150為H2,為元素如塊引用H3和百分之50百分之75。(這是一個(gè)不規(guī)則的,只是一個(gè)起點(diǎn)。)
這就是為什么百分?jǐn)?shù),而不是集大小,都是重要的:一旦你的身體類型的比例調(diào)整大小,因此無(wú)論屏幕大小。每一種元素是相對(duì)于體型。
字符間距的準(zhǔn)則
還有一些其他的指南,設(shè)計(jì)師看也說(shuō)到型屏幕上。當(dāng)談到間距,一個(gè)拇指規(guī)則是看每行文字以確??勺x性。
桌面和大型設(shè)備:60每行75個(gè)字符
手機(jī)和小型設(shè)備:35每行40個(gè)字符
值得注意的是,在較小的屏幕可讀性是基于具有更少的字符(較大的文本)。
同樣的想法適用于間距以及。你需要更多的文本行之間的空間時(shí),屏幕的大小是有限的它讓用戶閱讀和瀏覽內(nèi)容更容易。考慮添加百分之25線間距較小的設(shè)備比桌面排版。
額外的大小和間距有助于緩解緊張或緊縮的感覺(jué),用戶可以感受到在較小的設(shè)備上閱讀。因?yàn)楫?huà)布小,讀者流和易讀性是保持用戶滾動(dòng)至關(guān)重要。
提示開(kāi)始
有創(chuàng)建一個(gè)印刷規(guī)模和確保文字不讓你的設(shè)計(jì)看起來(lái)胖很多方式。你如何去了解它可能取決于你的舒適程度與規(guī)范和發(fā)展除了設(shè)計(jì)。
最簡(jiǎn)單的做法是先與你的網(wǎng)站主題。只是一定要選擇一個(gè)完全響應(yīng)選項(xiàng)。當(dāng)你使用一個(gè)高質(zhì)量的響應(yīng)主題,大部分的猜測(cè)是出來(lái)了你。你真的想是正文文本大小。只是一定要檢查一下所有的移動(dòng)式尺寸符合你的標(biāo)準(zhǔn)。
3工具來(lái)創(chuàng)建一個(gè)類型量表
有一些工具可以幫助你看到一個(gè)視覺(jué)排版表確切的影響。這里有一些和最人性化的選擇。
式量表:輸入文本和玩選項(xiàng),如大小,規(guī)模和字體在屏幕右側(cè);畢業(yè)生的CSS或編輯代碼的工具;
規(guī)?;阂?guī)模的作品就像一個(gè)規(guī)則來(lái)確定尺寸的類型;然后下載結(jié)果為薩斯或js插件或看到他們?cè)谄聊簧希?br/>黃金比例字體的計(jì)算器:工具優(yōu)化大小、行高、每線采用黃金比例 寬度和特征
結(jié)論
正確的印刷規(guī)模將保持你的設(shè)計(jì)在裝飾和苗條。這是說(shuō),用戶可能不理解但有助于整體的可讀性和可用性。
這有可能是規(guī)模如果設(shè)計(jì)只是看起來(lái)不正確。“不恰當(dāng)?shù)念愋涂梢允呛茈y做到的卻往往是一個(gè)地方看時(shí),一些關(guān)于設(shè)計(jì)不平衡。玩規(guī)模不同的幾個(gè)方案,解決之前的東西,記住趨勢(shì)現(xiàn)在是那種比過(guò)去大一點(diǎn)。
分享文章:這類設(shè)計(jì)看起來(lái)胖嗎
標(biāo)題鏈接:http://www.rwnh.cn/news48/20248.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供響應(yīng)式網(wǎng)站、定制開(kāi)發(fā)、建站公司、微信公眾號(hào)、面包屑導(dǎo)航、網(wǎng)站收錄
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容