在一個段落中考慮對比的整個地方

當我們考慮在設計中選擇顏色時，我們一直在考慮可訪問性。每當顏色觸摸時，就會發生對比度，如果我們談論文本的顏色對比，則需要足夠高才能可讀。這使患有各種視覺障礙的人受益，但每個人都喜歡易於閱讀的文本。

讓我們看一下只有一個段落的顏色對比度考慮！

段落中的鏈接可能以另一種顏色設置，以將其區分為鏈接。

聚焦元素（例如鍊接）也需要具有焦點樣式。默認情況下，我們可能會得到一個模糊的藍色輪廓，因此我們需要檢查是否有足夠的顏色對比度。而且，如果我們自定義，則自定義也需要良好的顏色對比度。

我們還需要鼠標用戶的懸停狀態。在這裡，我將使用覆蓋文本一半的背景效果。當您做這樣的事情時，效果需要足夠強大才能在懸停方面顯著，並且對比度需要在兩個背景下工作。

這不是超常見的，但是您可以樣式：也訪問的鏈接。樣式有些有限（例如，您無法更改不透明度或背景，因為這是安全問題），但是您可以更改顏色。如果這樣做，它也需要正確的對比度。也許我們可以用顏色來拉動顏色的差異：繼承；在某種程度上強調了鏈接，但仍然表明了這一點。

要考慮的另一件事是人們強調文本。在我的計算機上，我設置了它以默認情況下以橙色突出顯示（通常是MacOS上的淺藍色）。

希望鏈接顏色在用戶可能擁有的任何突出顯示顏色選擇下都能保持。它們往往是非常淺的陰影。

您也可以通過::選擇來控制文本選擇顏色{背景：紫色； }。如果您這樣做了，則必須再次檢查所有顏色，以確保您獲得了足夠的對比度。

您可以通過改變顏色和背景來嘗試將措施納入自己的手中。

但是請注意，文本內部的鏈接在這裡失去了一些對比。我們可以通過在A ::選擇以及文本中具有自己的其他顏色的其他元素上設置新顏色來繼續沿兔子洞沿兔子洞。

我想說一個好的經驗法則是，如果您要製作自定義突出顯示顏色，然後不為選定的文本執行任何其他自定義。

這篇文章的想法來自我從人們報告的一些錯誤報告中，在強調文本時，在此網站上很難閱讀鏈接，然後將其集中在此網站上。我嘗試通過更精緻的方式來修復它，但是您可以做的事情有限制。

 ::選擇A：焦點{ / * nope * /}
答：焦點::選擇{ / * nope * /}
A ::選擇：焦點{ / * nope * /}

通過做得比更多的事情更好地處理。

我最近閱讀了Ethan Muller在設計系統帖子中的設計，他在對比度上也有類似的觀點，但是在顏色譜而不是跨環境中。例如，您的藍色鏈接顏色可能在您的一些設計系統顏色上可以正常工作，但在其他設計系統顏色上卻沒有那麼多。

有幾件事可能會有所幫助。

• “每次您聲明背景色，聲明顏色”可能會有所幫助。
• 我已經使用了父母級別的類，例如on Light，在淺色容器中廣泛地更改事物的顏色。
• 我已經使用了Sass Mixin來幫助更容易更改鏈接和鏈接狀態，因此在更改背景時，我更容易做到這一點。

 @mixin linkstyletext（$ linkColor）{
  a {
    //用$ linkColor更新通用鏈接樣式
    ＆：徘徊，
    ＆：重點 {
      //還可以通過編程更改$ linkColor來更改懸停/焦點樣式
    }
  }
}

。變化 {
   背景：$ SOMENEWBGCOLOR；
   linkstyletext（$ SOMENEWLINKCOLOR）
}

好吧，感謝您與我一起旅行。我只是想到顏色對比並不像在背景上檢查單個鏈接顏色那樣簡單，以確保其通過。根據您在身體副本中著色的東西，可能會有十二件或更多的東西可以檢查。

這些屏幕截圖中的字體是Ibarra Real Nova，該字體最近剛剛在Google字體上發布。

以上是在一個段落中考慮對比的整個地方的詳細內容。更多資訊請關注PHP中文網其他相關文章！