Tufte-css: 링크 색상 μ‘°μ–ΈμœΌλ‘œ 인해 μ ‘κ·Όμ„± λ¬Έμ œκ°€ λ°œμƒν•  수 있음

에 λ§Œλ“  2019λ…„ 06μ›” 05일  Β·  3μ½”λ©˜νŠΈ  Β·  좜처: edwardtufte/tufte-css

이 λ¬Έμ œλŠ” 링크 μŠ€νƒ€μΌμ„ λ…Όμ˜ν•˜λŠ” 이 단락에 κ΄€ν•œ κ²ƒμž…λ‹ˆλ‹€.

항상 그렇듯이 μ΄λŸ¬ν•œ λ””μžμΈ 선택은 Tufte CSSκ°€ 기본적으둜 μ œκ³΅ν•˜λŠ” ν•œ 가지 μ ‘κ·Ό 방식일 λΏμž…λ‹ˆλ‹€. 클릭 λ˜λŠ” λ§ˆμš°μŠ€μ˜€λ²„ μ‹œ 색상을 λ³€κ²½ν•˜κ±°λ‚˜ 링크λ₯Ό ν‘œμ‹œν•˜κΈ° μœ„ν•΄ 밑쀄 λŒ€μ‹  κ°•μ‘° λ˜λŠ” 색상을 μ‚¬μš©ν•˜λŠ” 것과 같은 λ‹€λ₯Έ μ ‘κ·Ό 방식도 μž‘λ™ν•˜λ„λ‘ λ§Œλ“€ 수 μžˆμŠ΅λ‹ˆλ‹€. λͺ©ν‘œλŠ” 링크의 κ°„μ„­ 없이 λ¬Έμž₯을 읽을 수 μžˆλ„λ‘ ν•˜κ³  일반 μ›Ή μ‚¬μš©μžλ„ 링크λ₯Ό μ¦‰μ‹œ 식별할 수 μžˆλ„λ‘ ν•˜λŠ” κ²ƒμž…λ‹ˆλ‹€.

ꡬ체적으둜 νŠΉλ³„νžˆ:

링크λ₯Ό ν‘œμ‹œν•˜κΈ° μœ„ν•΄ 밑쀄 λŒ€μ‹  κ°•μ‘° ν‘œμ‹œ λ˜λŠ” 색상 μ‚¬μš©

λ‚΄ μš°λ €λŠ” λ…μžκ°€ WCAG 2.0 1.4.1 색상 μ‚¬μš©μ„ μΈμ‹ν•˜μ§€ μ•Šκ³  이 쑰언을 λ”°λ₯Ό 수 μžˆλ‹€λŠ” κ²ƒμž…λ‹ˆλ‹€.

색상은 정보λ₯Ό μ „λ‹¬ν•˜κ³ , 행동을 λ‚˜νƒ€λ‚΄κ³ , λ°˜μ‘μ„ μΌμœΌν‚€κ±°λ‚˜, μ‹œκ°μ  μš”μ†Œλ₯Ό κ΅¬λ³„ν•˜λŠ” μœ μΌν•œ μ‹œκ°μ  μˆ˜λ‹¨μœΌλ‘œ μ‚¬μš©λ˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. (레벨 A)

λ‹¨μˆœνžˆ 이 쑰언을 μ œκ±°ν•˜λŠ” 것이 κ°€μž₯ μ’‹μŠ΅λ‹ˆλ‹€.

documentation enhancement help wanted

λͺ¨λ“  3 λŒ“κΈ€

μš°λ¦¬κ°€ λ°”λ‘œ 이 죄에 λŒ€ν•΄ μœ μ£„μΈ ν”Œλž«νΌμ—μ„œ 이 문제λ₯Ό λ…Όμ˜ν•˜κ³  μžˆλ‹€λŠ” μ•„μ΄λŸ¬λ‹ˆμ— μ£Όλͺ©ν•©λ‹ˆλ‹€.

https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/F73 :

이 μ‹€νŒ¨μ˜ λͺ©μ μ€ 색상 차이λ₯Ό 인식할 수 μ—†λŠ” μ‚¬λžŒλ“€μ΄ 링크λ₯Ό 식별할 수 μ—†λŠ” 상황을 ν”Όν•˜λŠ” κ²ƒμž…λ‹ˆλ‹€(색각을 가진 μ‚¬λžŒλ“€μ΄ 링크λ₯Ό 식별할 수 μžˆλŠ” 경우). 링크 밑쀄 λ˜λŠ” 기타 색상이 μ•„λ‹Œ μ‹œκ°μ  ꡬ뢄이 ν•„μš”ν•©λ‹ˆλ‹€(링크가 색상 μ‹œκ°μ„ 가진 링크λ₯Ό 식별할 수 μžˆλŠ” 경우).

탐색 링크와 같은 일뢀 λ§ν¬λŠ” νŽ˜μ΄μ§€ λ””μžμΈ 및 μ»¨ν…μŠ€νŠΈμ—μ„œ μ‹œκ°μ μœΌλ‘œ λͺ…ν™•ν•  수 μžˆμ§€λ§Œ ν…μŠ€νŠΈ λ‚΄μ˜ λ§ν¬λŠ” μ’…μ’… 자체 ν‘œμ‹œ μ†μ„±μ—μ„œλ§Œ μ‹œκ°μ μœΌλ‘œ μ΄ν•΄λ©λ‹ˆλ‹€. 밑쀄을 μ œκ±°ν•˜κ³  μ΄λŸ¬ν•œ 링크의 색상 차이만 남겨두면 λ§ν¬μž„μ„ λ‚˜νƒ€λ‚΄λŠ” λ‹€λ₯Έ μ‹œκ°μ  ν‘œμ‹œ(색상 외에)κ°€ μ—†κΈ° λ•Œλ¬Έμ— μ‹€νŒ¨ν•©λ‹ˆλ‹€.

지적해 μ£Όμ…”μ„œ κ°μ‚¬ν•©λ‹ˆλ‹€. 당신은 틀리지 μ•Šμ•˜λ‹€. κ·ΈλŸ¬λ‚˜ "λ‹€λ₯Έ μ ‘κ·Ό 방식도 μž‘λ™ν•  수 μžˆμŠ΅λ‹ˆλ‹€."λ₯Ό μœ μ§€ν•˜κ³  μ‹ΆμŠ΅λ‹ˆλ‹€. λ¬Έμž₯ 쀑간에 "X λ˜λŠ” Y와 같은" 동사λ₯Ό μ‚¬μš©ν•˜λŠ” 것이 μ’‹μŠ΅λ‹ˆλ‹€. μ‚¬λžŒλ“€μ—κ²Œ μ ‘κ·Ό κ°€λŠ₯ν•œ λŒ€μ•ˆμ„ μ•Œλ €μ£ΌλŠ” 것은 μ ‘κ·Όν•  수 μ—†λŠ” λŒ€μ•ˆμ„ μ•Œλ €μ£Όμ§€ μ•ŠλŠ” κ²ƒλ§ŒνΌμ΄λ‚˜ μ€‘μš”ν•˜λ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€.

이 μŠ€λ ˆλ“œμ—μ„œ λͺ‡ 가지 ν‘œν˜„μ„ μ œμ•ˆν•  수 μžˆμŠ΅λ‹ˆκΉŒ? μš°λ¦¬κ°€ μ˜¬λ°”λ₯Έ 야ꡬμž₯에 λ„μ°©ν•˜λ©΄ PR은 맀우 ν™˜μ˜λ°›μ„ κ²ƒμž…λ‹ˆλ‹€.

이 νŽ˜μ΄μ§€κ°€ 도움이 λ˜μ—ˆλ‚˜μš”?
0 / 5 - 0 λ“±κΈ‰

κ΄€λ ¨ 문제

fustkilas picture fustkilas  Β·  5μ½”λ©˜νŠΈ

gamecubate picture gamecubate  Β·  10μ½”λ©˜νŠΈ

langford picture langford  Β·  21μ½”λ©˜νŠΈ

Saturate picture Saturate  Β·  5μ½”λ©˜νŠΈ

adamschwartz picture adamschwartz  Β·  16μ½”λ©˜νŠΈ