久久国产色AV免费看,精品国精品国产自在久国产应用男,精品国产成人AV制服,精品人伦一区二区三区潘金莲

設(shè)計(jì)是一個(gè)高維問(wèn)題：我們可以為單個(gè)標(biāo)簽設(shè)置數(shù)百個(gè)CSS 變量。很難知道從哪里開(kāi)始。整個(gè)過(guò)程可能會(huì)開(kāi)始感覺(jué)像是在一個(gè)令人著迷但最終是異國(guó)風(fēng)景的令人眼花繚亂的隨機(jī)漫步。大多數(shù)設(shè)計(jì)師似乎依靠直覺(jué)和多年來(lái)之不易的經(jīng)驗(yàn)來(lái)做出設(shè)計(jì)判斷，這對(duì)直覺(jué)上受到挑戰(zhàn)的新手沒(méi)有幫助。因此，我從數(shù)據(jù)科學(xué)家的手冊(cè)中翻出一頁(yè)，開(kāi)始為我稱(chēng)為設(shè)計(jì)數(shù)據(jù)

網(wǎng)站vi設(shè)計(jì)公司爬取了超過(guò)一百萬(wàn)個(gè)主頁(yè)并保存了它們的HTML 和CSS 文件，以分析網(wǎng)站的各個(gè)方面，從圖像和布局到字體和顏色。對(duì)于本文，我們將查看作為桌面查看的前一千個(gè)網(wǎng)站（有關(guān)詳細(xì)信息，請(qǐng)參閱詳細(xì)信息和注意事項(xiàng)部分）。我

 甚至使用puppeteer來(lái)解析javascript 渲染的網(wǎng)站。目標(biāo)是提供一些數(shù)值洞察力和基準(zhǔn)，以更好地定量地理解網(wǎng)頁(yè)設(shè)計(jì)世界。

注意——這些發(fā)現(xiàn)并不打算成為一個(gè)嚴(yán)格的風(fēng)格指南：畢竟，設(shè)計(jì)是一門(mén)豐富且以人為本的學(xué)科。我們永遠(yuǎn)不應(yīng)該忘記這一點(diǎn)。僅僅因?yàn)?5% 的在線字體是無(wú)襯線字體（見(jiàn)下文）并不意味著您只需要使用無(wú)襯線字體。但是，如果您確實(shí)選擇了反抗并采用襯線字體，那么您真正脫穎而出有多少呢？什么時(shí)候使用襯線字體更常見(jiàn)？

因此，事不宜遲，讓我們深入了解網(wǎng)站vi設(shè)計(jì)公司的第一篇博客文章，這都是關(guān)于字體的：

字體系列

字體選擇是一個(gè)情緒化的話題：只要看看這個(gè)提案的數(shù)百條反應(yīng)和數(shù)十條評(píng)論，就

 可以更改normalize.css中的默認(rèn)字體系列。在字體中，也許最突出的內(nèi)戰(zhàn)是襯線字體和無(wú)襯線字體之間。誰(shuí)在網(wǎng)絡(luò)上贏得了這場(chǎng)戰(zhàn)斗？得知它是無(wú)襯線字體時(shí)，您可能不會(huì)感到驚訝。平均而言，我們估計(jì)85% 的字體是無(wú)襯線字體，其余的則留給襯線字體、等寬字體和其他所有字體。我們是如何推斷出來(lái)的？繼續(xù)閱讀以獲取更多信息！

字體系列堆棧的中值深度為4：一種主要字體和三種備用字體。

首先，關(guān)于font-family 如何工作的基本提示：記住font-family CSS 屬性不僅僅是一個(gè)單一的值，而是一個(gè)優(yōu)先排序的字體列表。瀏覽器嘗試第一個(gè)字體，如果不可用，它會(huì)處理字體系列堆棧中的后續(xù)字體，直到找到系統(tǒng)支持的字體。設(shè)計(jì)師的最佳實(shí)踐是首先列出他們的預(yù)期字體，并列出隨后的備份字體列表，這些備份字體試圖保留該意圖，同時(shí)降低保真度但增加流行度。那么多少備份字體就足夠了？

字體系列堆棧的中值深度為4：一種主要字體和三種備用字體。但我們經(jīng)?？吹缴疃葹?（第75 個(gè)百分位）甚至12 個(gè)（第99 個(gè)百分位）的堆棧。一個(gè)網(wǎng)站的字體堆棧深度甚至為21！下面是深度分布圖：

那么使用什么字體呢？下面是整個(gè)堆棧中使用的前10 種字體的列表。請(qǐng)注意，這些不一定是顯示的字體——它們往往是特定于網(wǎng)站的。相反，我們看到了最常見(jiàn)的備份字體：

十大網(wǎng)絡(luò)字體</a>

在前10 種字體中，前9 種都是無(wú)襯線字體。通過(guò)對(duì)這些最常見(jiàn)的“包羅萬(wàn)象”字體進(jìn)行分類(lèi)，我們可以自動(dòng)推斷出第一個(gè)字體在堆棧中的廣泛屬性，即使它們往往是高度特殊的。因此，上面關(guān)于無(wú)襯線字體流行的統(tǒng)計(jì)數(shù)據(jù)。

但我們可以走得更遠(yuǎn)！上述統(tǒng)計(jì)數(shù)據(jù)是整個(gè)段落(P) 和標(biāo)題（H1、H2 等）標(biāo)簽。如果我們按標(biāo)簽類(lèi)型查看無(wú)襯線字體的比例，您會(huì)看到一個(gè)截然不同的故事。事實(shí)證明，標(biāo)頭不太可能是無(wú)襯線的，但是這種可能性會(huì)降低標(biāo)頭的從屬程度。

因此，無(wú)襯線的概率范圍從H1 的58% 到H2 的70% 到H5 的89% 和P 的93%。如果您喜歡使用serif，那么您將在更好的公司中將其應(yīng)用于標(biāo)題而不是段落標(biāo)簽?。ㄓ腥さ氖牵@似乎符合傳統(tǒng)的設(shè)計(jì)理念，即較大的字體比較小的字體更適合襯線。

但如果網(wǎng)站vi設(shè)計(jì)公司考慮字體配對(duì)，情況就會(huì)變得更加復(fù)雜。下面，我們分解了serif/sans-serif 與P/H1 標(biāo)簽的每個(gè)2X2 中的概率。我們可以看到那些帶有無(wú)襯線段落的襯線標(biāo)題是反襯線的兩倍多。換句話說(shuō)，平均襯線段落與襯線標(biāo)題配對(duì)的時(shí)間約為51%，但平均襯線標(biāo)題僅與襯線段落配對(duì)的時(shí)間為36%。最后，大多數(shù)字體都是無(wú)襯線字體似乎符合傳統(tǒng)觀點(diǎn)，即無(wú)襯線字體是網(wǎng)頁(yè)設(shè)計(jì)的基礎(chǔ)

最基本的問(wèn)題之一是我的字體應(yīng)該是什么大小？較大的字體更易于閱讀和訪問(wèn)。但是較小的字體具有更大的信息密度。我們?nèi)绾纹胶膺@些競(jìng)爭(zhēng)因素？我們計(jì)算了數(shù)字，結(jié)果顯示中值字體大小為14 像素。但是，您很可能會(huì)看到16 像素的字體；12px 甚至18px 并非聞所未聞。也就是說(shuō)，很少低于10 像素或高于24 像素。

當(dāng)網(wǎng)站vi設(shè)計(jì)公司在襯線和無(wú)襯線之間進(jìn)行分解時(shí)，情況會(huì)有所不同。事實(shí)證明，無(wú)襯線字體往往更大一些。雖然無(wú)襯線字體的中值大小仍為14 像素，但襯線字體的中值大小為16 像素。您可以在它們的尺寸分布中看到這個(gè)更大的尺寸：

標(biāo)頭

標(biāo)題是通過(guò)促進(jìn)頁(yè)面掃描來(lái)幫助組織文本的基本元素。因此，它們通常具有較大的字體大小和較重的字體粗細(xì)。但是設(shè)計(jì)師選擇哪一個(gè)呢？查看數(shù)據(jù)，我們將標(biāo)題標(biāo)簽與最大的文本進(jìn)行比較。我們發(fā)現(xiàn)設(shè)計(jì)師更常選擇使用更大的尺寸而不是更重的重量（94% 對(duì)82%），但他們經(jīng)常同時(shí)使用兩者（76%）。（如果您想知道，我們正在使用最大的標(biāo)頭標(biāo)簽，因?yàn)橛行┚W(wǎng)站不使用H1，而是選擇將H2 或其他標(biāo)頭作為最大的標(biāo)頭。）

讓我們放大字體粗細(xì)。毫不奇怪，大多數(shù)段落標(biāo)簽都是正常的（400 字體粗細(xì)），而多個(gè)標(biāo)題粗細(xì)是粗體（700）。請(qǐng)注意，標(biāo)題標(biāo)簽的中等(500) 和半粗體(600) 字體粗細(xì)或段落標(biāo)簽的淺(300) 字體粗細(xì)也很常見(jiàn)。

現(xiàn)在讓我們看看標(biāo)題字體大小。由于基線段落字體大小因頁(yè)面而異，因此要調(diào)查的正確指標(biāo)是標(biāo)題字體大小與段落字體大小的比率。下面是我們數(shù)據(jù)集中不同頁(yè)眉和段落標(biāo)簽之間字體大小的中值比率。我們可以看到，在中間頁(yè)面上，H1 大約是P 大小的1.9 倍：所以如果P 是16px，H1 大約是30px (16 x 1.9)。副標(biāo)題的比例會(huì)降低，直到我們到達(dá)H5，其中值大小與P 相同（并且可能使用不同或更重的字體來(lái)區(qū)分H5 和P）。

現(xiàn)在需要注意的是：網(wǎng)站vi設(shè)計(jì)公司使用了巨大的百萬(wàn)作為網(wǎng)站列表，但并非每個(gè)網(wǎng)頁(yè)都適合程序化抓取，因此結(jié)果并不完全具有代表性。該分析僅模擬了桌面瀏覽器：未來(lái)，我們將考慮移動(dòng)和平板電腦瀏覽器，它們應(yīng)該會(huì)在響應(yīng)式頁(yè)面上產(chǎn)生非常不同的答案。對(duì)于這篇博文，我們只分析了大約前1000 個(gè)網(wǎng)站以節(jié)省時(shí)間。我們不區(qū)分外語(yǔ)和英語(yǔ)網(wǎng)站，也不區(qū)分不同類(lèi)型的網(wǎng)站。顯然，如果您正在為T(mén)he Daily Mail 設(shè)計(jì)，那么您的外觀與Medium 博客完全不同。

設(shè)計(jì)數(shù)據(jù)是一個(gè)對(duì)話框！我對(duì)設(shè)計(jì)師、數(shù)據(jù)科學(xué)家和更廣泛的社區(qū)對(duì)設(shè)計(jì)的看法以及人們想要學(xué)習(xí)的定量見(jiàn)解感興趣。我想分析和寫(xiě)下你覺(jué)得有趣的東西。