์ ์ธ๊ณ ์ฌ์ฉ์๋ฅผ ์ํ ํฌ์ฉ์ ์ธ ๋์งํธ ๊ฒฝํ์ ๋ง๋๋ ๋ฐ ํ์ํ ์์น, ์ง์นจ, ๊ธฐ์ ๋ฐ ๋๊ตฌ๋ฅผ ๋ค๋ฃจ๋ ์น ์ ๊ทผ์ฑ ์ข ํฉ ๊ฐ์ด๋์ ๋๋ค.
์น ์ ๊ทผ์ฑ: ๊ธ๋ก๋ฒ ์ฌ์ฉ์๋ฅผ ์ํ ํฌ์ฉ์ ์ธ ๋์งํธ ๊ฒฝํ ๊ตฌ์ถ
์ค๋๋ ๊ณผ ๊ฐ์ด ์ํธ ์ฐ๊ฒฐ๋ ์ธ์์์ ์ธํฐ๋ท์ ์ผ์์ํ์ ํ์์ ์ธ ๋ถ๋ถ์ด ๋์์ต๋๋ค. ์ ๋ณด ๋ฐ ์๋น์ค ์ ๊ทผ์์๋ถํฐ ์ฌ๋ํ๋ ์ฌ๋๋ค๊ณผ์ ์ฐ๊ฒฐ์ ์ด๋ฅด๊ธฐ๊น์ง, ์น์ ์๋ง์ ๊ธฐํ๋ฅผ ์ ๊ณตํฉ๋๋ค. ๊ทธ๋ฌ๋ ์๋ฐฑ๋ง ๋ช ์ ์ฅ์ ์ธ์๊ฒ ๋์งํธ ํ๊ฒฝ์ ๊ด๋ฌธ์ด ์๋ ์ฅ๋ฒฝ์ด ๋ ์ ์์ต๋๋ค. ์น ์ ๊ทผ์ฑ์ ์น์ฌ์ดํธ, ์ ํ๋ฆฌ์ผ์ด์ , ๋์งํธ ์ฝํ ์ธ ๋ฅผ ๋ชจ๋ ์ฌ๋์ด ๋ฅ๋ ฅ์ด๋ ์ฅ์ ์ ๊ด๊ณ์์ด ์ฌ์ฉํ ์ ์๋๋ก ๋ณด์ฅํ๋ ๊ฒ์ ๋๋ค. ์ฌ๊ธฐ์๋ ์๊ฐ, ์ฒญ๊ฐ, ์ด๋, ์ธ์ง, ์ธ์ด ์ฅ์ ๊ฐ ์๋ ๊ฐ์ธ์ด ํฌํจ๋ฉ๋๋ค.
์น ์ ๊ทผ์ฑ์ด ์ค์ํ ์ด์
์น ์ ๊ทผ์ฑ์ ๋จ์ํ ๊ท์ ์ค์ ๋ฌธ์ ๊ฐ ์๋๋ผ, ํฌ์ฉ์ ๋์์ธ๊ณผ ์ค๋ฆฌ์ ๊ฐ๋ฐ์ ๊ทผ๋ณธ์ ์ธ ์ธก๋ฉด์ ๋๋ค. ์กฐ์ง์ ์ ๊ทผ์ฑ์ ์ฐ์ ์ํจ์ผ๋ก์จ ๋ค์๊ณผ ๊ฐ์ ์ด์ ์ ์ป์ ์ ์์ต๋๋ค.
- ๋ ๋์ ์ฌ์ฉ์์ธต ํ๋ณด: ์ ์ธ๊ณ์ ์ผ๋ก 10์ต ๋ช ์ด ๋๋ ์ฌ๋๋ค์ด ์ด๋ค ํํ๋ก๋ ์ฅ์ ๋ฅผ ๊ฐ์ง๊ณ ์์ต๋๋ค. ์น์ฌ์ดํธ๋ฅผ ์ ๊ทผ์ฑ ์๊ฒ ๋ง๋ค๋ฉด ์ ์ฌ ๊ณ ๊ฐ ๋ฐ ์ฌ์ฉ์์ธต์ด ํ๋๋ฉ๋๋ค.
- ๋ชจ๋๋ฅผ ์ํ ์ฌ์ฉ์ ๊ฒฝํ ๊ฐ์ : ๋ช ํํ ๋ด๋น๊ฒ์ด์ ์ด๋ ์ด๋ฏธ์ง ๋์ฒด ํ ์คํธ์ ๊ฐ์ ๋ง์ ์ ๊ทผ์ฑ ๊ธฐ๋ฅ์ ์ฅ์ ์ธ๋ฟ๋ง ์๋๋ผ ๋ชจ๋ ์ฌ์ฉ์์๊ฒ ์ด์ ์ ์ค๋๋ค.
- SEO ํฅ์: ๊ฒ์ ์์ง์ ๊ตฌ์กฐ๊ฐ ์ ์ง์ฌ ์๊ณ , ์๋งจํฑํ๋ฉฐ, ์ ๊ทผ์ฑ์ด ์ข์ ์น์ฌ์ดํธ๋ฅผ ์ ํธํฉ๋๋ค. ์ ๊ทผ์ฑ ๋ชจ๋ฒ ์ฌ๋ก๋ ์ข ์ข SEO ์์น๊ณผ ์ผ์นํฉ๋๋ค.
- ๋ฒ์ ์๊ตฌ์ฌํญ ์ค์: ๋ง์ ๊ตญ๊ฐ์์๋ ๋ฏธ๊ตญ์ ๋ฏธ๊ตญ ์ฅ์ ์ธ๋ฒ(ADA), ์บ๋๋ค์ ์จํ๋ฆฌ์ค์ฃผ ์ฅ์ ์ธ ์ ๊ทผ์ฑ๋ฒ(AODA), ์ ๋ฝ์ EN 301 549์ ๊ฐ์ด ์น ์ ๊ทผ์ฑ์ ์๋ฌดํํ๋ ๋ฒ๋ฅ ๋ฐ ๊ท์ ์ ๊ฐ์ง๊ณ ์์ต๋๋ค.
- ์ฌํ์ ์ฑ ์ ์ฆ์ง: ์ ๊ทผ์ฑ ์๋ ์น์ฌ์ดํธ๋ฅผ ๋ง๋๋ ๊ฒ์ ํฌ์ฉ์ฑ๊ณผ ์ฌํ์ ์ฑ ์์ ๋ํ ์ฝ์์ ๋ณด์ฌ์ค๋๋ค.
์น ์ฝํ ์ธ ์ ๊ทผ์ฑ ์ง์นจ(WCAG)์ ์ดํด
์น ์ฝํ ์ธ ์ ๊ทผ์ฑ ์ง์นจ(WCAG)์ ์น ์ ๊ทผ์ฑ์ ๋ํ ๊ตญ์ ์ ์ผ๋ก ์ธ์ ๋ ํ์ค์ ๋๋ค. ์๋ ์์ด๋ ์น ์ปจ์์์(W3C)์ด ๊ฐ๋ฐํ WCAG๋ ์ฅ์ ์ธ์ด ์น ์ฝํ ์ธ ์ ๋ ์ฝ๊ฒ ์ ๊ทผํ ์ ์๋๋ก ํ๋ ์ผ๋ จ์ ์ง์นจ์ ์ ๊ณตํฉ๋๋ค. WCAG๋ POUR์ด๋ผ๋ ์ฝ์ด๋ก ๊ธฐ์ต๋๋ ๋ค ๊ฐ์ง ํต์ฌ ์์น์ ์ค์ฌ์ผ๋ก ๊ตฌ์ฑ๋ฉ๋๋ค.
- ์ธ์ ๊ฐ๋ฅ์ฑ(Perceivable): ์ ๋ณด์ ์ฌ์ฉ์ ์ธํฐํ์ด์ค ๊ตฌ์ฑ์์๋ ์ฌ์ฉ์๊ฐ ์ธ์ํ ์ ์๋ ๋ฐฉ์์ผ๋ก ์ ์๋์ด์ผ ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ํ ์คํธ๊ฐ ์๋ ์ฝํ ์ธ ์ ๋ํ ํ ์คํธ ๋์ ์ ๊ณต, ์ค๋์ค ๋ฐ ๋น๋์ค ์ฝํ ์ธ ์ ๋ํ ์บก์ ๋ฐ ๊ธฐํ ๋์ ์ ๊ณต, ์ฝํ ์ธ ๋ฅผ ์ฝ๊ฒ ๊ตฌ๋ณํ ์ ์๋๋ก ๋ณด์ฅํ๋ ๊ฒ์ด ํฌํจ๋ฉ๋๋ค.
- ์ด์ฉ ๊ฐ๋ฅ์ฑ(Operable): ์ฌ์ฉ์ ์ธํฐํ์ด์ค ๊ตฌ์ฑ์์์ ๋ด๋น๊ฒ์ด์ ์ ์ด์ฉ ๊ฐ๋ฅํด์ผ ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ํค๋ณด๋๋ก ๋ชจ๋ ๊ธฐ๋ฅ์ ์ฌ์ฉํ ์ ์๋๋ก ํ๊ณ , ์ฌ์ฉ์๊ฐ ์ฝํ ์ธ ๋ฅผ ์ฝ๊ณ ์ฌ์ฉํ ์ถฉ๋ถํ ์๊ฐ์ ์ ๊ณตํ๋ฉฐ, ๋ฐ์์ ์ผ์ผํค๋ ์ฝํ ์ธ ๋ฅผ ํผํ๋ ๊ฒ์ด ํฌํจ๋ฉ๋๋ค.
- ์ดํด ๊ฐ๋ฅ์ฑ(Understandable): ์ ๋ณด์ ์ฌ์ฉ์ ์ธํฐํ์ด์ค์ ์๋์ ์ดํด ๊ฐ๋ฅํด์ผ ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ํ ์คํธ๋ฅผ ์ฝ๊ณ ์ดํดํ๊ธฐ ์ฝ๊ฒ ๋ง๋ค๊ณ , ์ฝํ ์ธ ๊ฐ ์์ธก ๊ฐ๋ฅํ ๋ฐฉ์์ผ๋ก ๋ํ๋๊ณ ์๋ํ๋๋ก ๋ณด์ฅํ๋ฉฐ, ์ฌ์ฉ์๊ฐ ์ค์๋ฅผ ํผํ๊ณ ์์ ํ๋๋ก ๋๋ ๊ฒ์ด ํฌํจ๋ฉ๋๋ค.
- ๊ฒฌ๊ณ ์ฑ(Robust): ์ฝํ ์ธ ๋ ๋ณด์กฐ ๊ธฐ์ ์ ํฌํจํ ๋ค์ํ ์ฌ์ฉ์ ์์ด์ ํธ๊ฐ ์์ ์ ์ผ๋ก ํด์ํ ์ ์์ ๋งํผ ์ถฉ๋ถํ ๊ฒฌ๊ณ ํด์ผ ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ์ ํจํ HTML ๋ฐ CSS ์ฌ์ฉ, ์ฝํ ์ธ ๊ฐ ํ์ฌ ๋ฐ ๋ฏธ๋์ ์ฌ์ฉ์ ์์ด์ ํธ์ ํธํ๋๋๋ก ๋ณด์ฅํ๋ ๊ฒ์ด ํฌํจ๋ฉ๋๋ค.
WCAG๋ A, AA, AAA์ ์ธ ๊ฐ์ง ์ค์ ์์ค์ผ๋ก ์ ๊ณต๋ฉ๋๋ค. ์์ค A๋ ์ต์ํ์ ์ ๊ทผ์ฑ ์์ค์ด๋ฉฐ, ์์ค AAA๋ ๊ฐ์ฅ ๋์ ์์ค์ ๋๋ค. ๋๋ถ๋ถ์ ์กฐ์ง์ ์ ๊ทผ์ฑ๊ณผ ์คํ ๊ฐ๋ฅ์ฑ ์ฌ์ด์ ์ข์ ๊ท ํ์ ์ ๊ณตํ๋ ์์ค AA ์ค์๋ฅผ ๋ชฉํ๋ก ํฉ๋๋ค.
์ฃผ์ ์ ๊ทผ์ฑ ๊ณ ๋ ค์ฌํญ ๋ฐ ๊ธฐ๋ฒ
์น ์ ๊ทผ์ฑ์ ๊ตฌํํ๋ ค๋ฉด ๋์์ธ, ๊ฐ๋ฐ, ์ฝํ ์ธ ์ ์์ ์์ฐ๋ฅด๋ ๋ค๊ฐ์ ์ธ ์ ๊ทผ์ด ํ์ํฉ๋๋ค. ์น์ฌ์ดํธ์ ์ ๊ทผ์ฑ์ ๋ณด์ฅํ๊ธฐ ์ํ ๋ช ๊ฐ์ง ์ฃผ์ ๊ณ ๋ ค์ฌํญ๊ณผ ๊ธฐ๋ฒ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
1. ํ ์คํธ๊ฐ ์๋ ์ฝํ ์ธ ์ ๋ํ ๋์ฒด ํ ์คํธ ์ ๊ณต
์ด๋ฏธ์ง, ๋น๋์ค, ์ค๋์ค ํ์ผ๊ณผ ๊ฐ์ ๋ชจ๋ ํ ์คํธ๊ฐ ์๋ ์ฝํ ์ธ ์๋ ํด๋น ์ฝํ ์ธ ์ ๊ทธ ๋ชฉ์ ์ ์ค๋ช ํ๋ ํ ์คํธ ๋์์ด ์์ด์ผ ํฉ๋๋ค. ์ด๋ฅผ ํตํด ์ฝํ ์ธ ๋ฅผ ๋ณด๊ฑฐ๋ ๋ค์ ์ ์๋ ์ฌ์ฉ์๊ฐ ๊ทธ ์๋ฏธ๋ฅผ ์ดํดํ ์ ์์ต๋๋ค.
- ์ด๋ฏธ์ง: `alt` ์์ฑ์ ์ฌ์ฉํ์ฌ ์ด๋ฏธ์ง์ ๋ํ ์ค๋ช ํ ์คํธ๋ฅผ ์ ๊ณตํ์ธ์. ์ฅ์์ฉ ์ด๋ฏธ์ง์ ๊ฒฝ์ฐ ๋น `alt` ์์ฑ(`alt=""`)์ ์ฌ์ฉํ์ธ์. ๋งค์ฐ ๋ณต์กํ ์ด๋ฏธ์ง์ ๋ํ ๊ด๋ฒ์ํ ์ค๋ช ์ด ํ์ํ ๊ฒฝ์ฐ `longdesc` ์์ฑ์ ๊ณ ๋ คํ ์ ์์ต๋๋ค(ํ์ฌ๋ ์ง์์ด ์ ์).
- ๋น๋์ค: ๋น๋์ค์ ๋ํ ์บก์ , ์คํฌ๋ฆฝํธ, ์ค๋์ค ์ค๋ช ์ ์ ๊ณตํ์ธ์. ์บก์ ์ ์ค๋์ค์ ๋๊ธฐํ๋ ํ ์คํธ๋ฅผ ์ ๊ณตํ๋ฉฐ, ์คํฌ๋ฆฝํธ๋ ์ ์ฒด ๋น๋์ค์ ํ ์คํธ ๋ฒ์ ์ ์ ๊ณตํฉ๋๋ค. ์ค๋์ค ์ค๋ช ์ ๋น๋์ค์ ์๊ฐ์ ์์๋ฅผ ์ค๋ช ํฉ๋๋ค. YouTube๋ Vimeo์ ๊ฐ์ ์๋น์ค๋ ์๋ ์บก์ ๊ธฐ๋ฅ์ ์ ๊ณตํ์ง๋ง, ์ ํ์ฑ์ ์ํด ์๋ ๊ฒํ ๋ฐ ํธ์ง์ด ์ค์ํฉ๋๋ค.
- ์ค๋์ค: ์ค๋์ค ํ์ผ์ ๋ํ ์คํฌ๋ฆฝํธ๋ฅผ ์ ๊ณตํ์ธ์.
์์ (์ด๋ฏธ์ง ๋์ฒด ํ ์คํธ):
<img src="logo.png" alt="ํ์ฌ ๋ก๊ณ - ์ ๊ทผ์ฑ ์๋ ์น์ฌ์ดํธ ๊ตฌ์ถ">
2. ํค๋ณด๋ ๋ด๋น๊ฒ์ด์ ๋ณด์ฅ
๋ชจ๋ ์น์ฌ์ดํธ ๊ธฐ๋ฅ์ ํค๋ณด๋๋ฅผ ์ฌ์ฉํ์ฌ ์ ๊ทผํ ์ ์์ด์ผ ํฉ๋๋ค. ์ด๋ ๋ง์ฐ์ค๋ ๋ค๋ฅธ ํฌ์ธํ ์ฅ์น๋ฅผ ์ฌ์ฉํ ์ ์๋ ์ฌ์ฉ์์๊ฒ ํ์์ ์ ๋๋ค.
- ํญ ์์: ํญ ์์๊ฐ ๋ ผ๋ฆฌ์ ์ด๊ณ ์ง๊ด์ ์ธ์ง ํ์ธํ์ธ์. ์ฌ์ฉ์๋ ์์ธก ๊ฐ๋ฅํ ๋ฐฉ์์ผ๋ก ์น์ฌ์ดํธ๋ฅผ ํ์ํ ์ ์์ด์ผ ํฉ๋๋ค. `tabindex` ์์ฑ์ ์๋ชป ์ฌ์ฉํ๋ฉด ์ ๊ทผ์ฑ์ ๋ถ์ ์ ์ธ ์ํฅ์ ์ค ์ ์์ผ๋ฏ๋ก ์ฃผ์ํด์ ์ฌ์ฉํ์ธ์.
- ์ด์ ํ์๊ธฐ: ๋งํฌ, ๋ฒํผ, ์์ ํ๋์ ๊ฐ์ ๋ํํ ์์์ ๋ํ ๋ช ํํ ์๊ฐ์ ์ด์ ํ์๊ธฐ๋ฅผ ์ ๊ณตํ์ธ์. ์ด๋ ์ฌ์ฉ์๊ฐ ํ์ฌ ์ด๋ค ์์๊ฐ ์ ํ๋์๋์ง ์ดํดํ๋ ๋ฐ ๋์์ด ๋ฉ๋๋ค.
- ๊ฑด๋๋ฐ๊ธฐ ๋งํฌ: ์ฌ์ฉ์๊ฐ ๋ด๋น๊ฒ์ด์ ๋ฉ๋ด์ ๊ฐ์ ๋ฐ๋ณต์ ์ธ ์ฝํ ์ธ ๋ฅผ ๊ฑด๋๋ฐ๊ณ ํ์ด์ง์ ์ฃผ์ ์ฝํ ์ธ ๋ก ๋ฐ๋ก ์ด๋ํ ์ ์๋๋ก ํ๋ ๊ฑด๋๋ฐ๊ธฐ ๋งํฌ๋ฅผ ์ ๊ณตํ์ธ์.
์์ (๊ฑด๋๋ฐ๊ธฐ ๋งํฌ):
<a href="#main-content">๋ณธ๋ฌธ์ผ๋ก ๊ฑด๋๋ฐ๊ธฐ</a>
<main id="main-content">...</main>
3. ์๋งจํฑ HTML ์ฌ์ฉ
์๋งจํฑ HTML์ HTML ์์๋ฅผ ์ฌ์ฉํ์ฌ ์ฝํ ์ธ ์ ์๋ฏธ์ ๊ตฌ์กฐ๋ฅผ ์ ๋ฌํฉ๋๋ค. ์ด๋ ๋ณด์กฐ ๊ธฐ์ ์ด ์ฝํ ์ธ ๋ฅผ ์ดํดํ๊ณ ์ฌ์ฉ์์๊ฒ ์ ๊ทผ ๊ฐ๋ฅํ ๋ฐฉ์์ผ๋ก ์ ์ํ๋ ๋ฐ ๋์์ด ๋ฉ๋๋ค.
- ์ ๋ชฉ: ์ ๋ชฉ ์์(
<h1>๋ถํฐ<h6>)๋ฅผ ์ฌ์ฉํ์ฌ ์ฝํ ์ธ ๋ฅผ ๊ตฌ์กฐํํ๊ณ ๋ช ํํ ๊ณ์ธต ๊ตฌ์กฐ๋ฅผ ๋ง๋์ธ์. - ๋ชฉ๋ก: ๋ชฉ๋ก ์์(
<ul>,<ol>,<li>)๋ฅผ ์ฌ์ฉํ์ฌ ํญ๋ชฉ ๋ชฉ๋ก์ ๋ง๋์ธ์. - ๋๋๋งํฌ ์ญํ : ๋๋๋งํฌ ์ญํ (์:
<nav>,<main>,<aside>,<footer>)์ ์ฌ์ฉํ์ฌ ํ์ด์ง์ ๋ค๋ฅธ ์น์ ์ ์๋ณํ์ธ์. - ARIA ์์ฑ: ARIA(Accessible Rich Internet Applications) ์์ฑ์ ์ฌ์ฉํ์ฌ ์์์ ์ญํ , ์ํ, ์์ฑ์ ๋ํ ์ถ๊ฐ ์ ๋ณด๋ฅผ ์ ๊ณตํ์ธ์. ARIA๋ ์๋งจํฑ HTML์ ๋ณด์ํ๊ธฐ ์ํด ํ์ํ ๋๋ง ๋๋ฌผ๊ฒ ์ฌ์ฉํ์ธ์. ๊ณผ๋ํ ์ฌ์ฉ์ ์ ๊ทผ์ฑ ๋ฌธ์ ๋ฅผ ์ผ๊ธฐํ ์ ์์ต๋๋ค.
์์ (์๋งจํฑ HTML):
<header>
<nav>
<ul>
<li><a href="#">ํ</a></li>
<li><a href="#">์๊ฐ</a></li>
<li><a href="#">์๋น์ค</a></li>
<li><a href="#">๋ฌธ์</a></li>
</ul>
</nav>
</header>
<main>
<h1>์ ํฌ ์น์ฌ์ดํธ์ ์ค์ ๊ฒ์ ํ์ํฉ๋๋ค</h1>
<p>์ด๊ฒ์ ํ์ด์ง์ ์ฃผ์ ๋ด์ฉ์
๋๋ค.</p>
</main>
<footer>
<p>Copyright 2023</p>
</footer>
4. ์ถฉ๋ถํ ์์ ๋๋น ๋ณด์ฅ
์ ์๋ ฅ์ด๋ ์๋งน์ธ ์ฌ์ฉ์๊ฐ ํ ์คํธ๋ฅผ ์ฝ์ ์ ์๋๋ก ํ ์คํธ์ ๋ฐฐ๊ฒฝ์ ๊ฐ์ ์ถฉ๋ถํ ์์ ๋๋น๋ฅผ ์ ๊ณตํ์ธ์. WCAG๋ ์ผ๋ฐ ํ ์คํธ์ ๊ฒฝ์ฐ ์ต์ 4.5:1, ํฐ ํ ์คํธ์ ๊ฒฝ์ฐ 3:1์ ๋ช ์๋น๋ฅผ ์๊ตฌํฉ๋๋ค.
๋๊ตฌ: ์์ ๋๋น ๊ฒ์ฌ๊ธฐ๋ฅผ ์ฌ์ฉํ์ฌ ์์ ์กฐํฉ์ด WCAG ์๊ตฌ์ฌํญ์ ์ถฉ์กฑํ๋์ง ํ์ธํ์ธ์. ์๋ก๋ WebAIM ์์ ๋๋น ๊ฒ์ฌ๊ธฐ ๋ฐ Accessible Colors ๋๊ตฌ๊ฐ ์์ต๋๋ค.
์์ (์ข์ ์์ ๋๋น): ํฐ์ ๋ฐฐ๊ฒฝ์ ๊ฒ์์ ํ ์คํธ๋ ๋ฐ์ด๋ ๋๋น๋ฅผ ์ ๊ณตํฉ๋๋ค.
5. ์ฝํ ์ธ ๋ฅผ ์ฝ๊ณ ์ดํดํ๊ธฐ ์ฝ๊ฒ ๋ง๋ค๊ธฐ
๋ช ํํ๊ณ ๊ฐ๊ฒฐํ ์ธ์ด๋ฅผ ์ฌ์ฉํ๊ณ , ์ ๋ฌธ ์ฉ์ด์ ๊ธฐ์ ์ฉ์ด๋ฅผ ํผํ๋ฉฐ, ์ฝํ ์ธ ๋ฅผ ๋ ผ๋ฆฌ์ ์ด๊ณ ๋ฐ๋ผ๊ฐ๊ธฐ ์ฌ์ด ๋ฐฉ์์ผ๋ก ๊ตฌ์ฑํ์ธ์.
- ๊ฐ๋ ์ฑ: ๊ฐ๋ ์ฑ ๊ฒ์ฌ๊ธฐ๋ฅผ ์ฌ์ฉํ์ฌ ์ฝํ ์ธ ์ ๊ฐ๋ ์ฑ์ ํ๊ฐํ์ธ์. ๋์ ๋ ์์๊ฒ ์ ํฉํ ๊ฐ๋ ์ฑ ์์ค์ ๋ชฉํ๋ก ํ์ธ์.
- ์ธ์ด: ํ์ดํ ์ธ์ด๋ฅผ ์ฌ์ฉํ๊ณ ๋ณต์กํ ๋ฌธ์ฅ ๊ตฌ์กฐ๋ฅผ ํผํ์ธ์.
- ๊ตฌ์ฑ: ์ ๋ชฉ, ๋ถ์ ๋ชฉ, ๊ธ๋จธ๋ฆฌ ๊ธฐํธ๋ฅผ ์ฌ์ฉํ์ฌ ์ฝํ ์ธ ๋ฅผ ๊ตฌ์ฑํ๊ณ ํ์ด๋ณด๊ธฐ ์ฝ๊ฒ ๋ง๋์ธ์.
6. ๋ช ํํ๊ณ ์ผ๊ด๋ ๋ด๋น๊ฒ์ด์ ์ ๊ณต
๋ช ํํ๊ณ ์ผ๊ด๋ ๋ด๋น๊ฒ์ด์ ๋ฉ๋ด, ๋ธ๋ ๋ํฌ๋ผ, ๊ฒ์ ๊ธฐ๋ฅ์ ์ ๊ณตํ์ฌ ์ฌ์ฉ์๊ฐ ์น์ฌ์ดํธ๋ฅผ ์ฝ๊ฒ ํ์ํ ์ ์๋๋ก ํ์ธ์.
- ๋ด๋น๊ฒ์ด์ ๋ฉ๋ด: ๋ด๋น๊ฒ์ด์ ๋ฉ๋ด ํญ๋ชฉ์ ๋ช ํํ๊ณ ์ค๋ช ์ ์ธ ๋ ์ด๋ธ์ ์ฌ์ฉํ์ธ์.
- ๋ธ๋ ๋ํฌ๋ผ: ์ฌ์ฉ์๊ฐ ์น์ฌ์ดํธ ๋ด์์ ์์ ์ ์์น๋ฅผ ์ดํดํ๋ ๋ฐ ๋์์ด ๋๋๋ก ๋ธ๋ ๋ํฌ๋ผ์ ์ ๊ณตํ์ธ์.
- ๊ฒ์: ์ฌ์ฉ์๊ฐ ํน์ ์ฝํ ์ธ ๋ฅผ ๋น ๋ฅด๊ฒ ์ฐพ์ ์ ์๋๋ก ๊ฒ์ ๊ธฐ๋ฅ์ ์ ๊ณตํ์ธ์.
7. ์ ๊ทผ์ฑ ์๋ ์์ ์ฌ์ฉ
์์ ํ๋์ ๋ช ํํ ๋ ์ด๋ธ์ ์ ๊ณตํ๊ณ , ์ ์ ํ ์ ๋ ฅ ์ ํ์ ์ฌ์ฉํ๋ฉฐ, ์ดํดํ๊ธฐ ์ฌ์ด ์ค๋ฅ ๋ฉ์์ง๋ฅผ ์ ๊ณตํ์ฌ ์์์ ์ ๊ทผ์ฑ ์๊ฒ ๋ง๋์ธ์.
- ๋ ์ด๋ธ:
<label>์์๋ฅผ ์ฌ์ฉํ์ฌ ๋ ์ด๋ธ์ ์์ ํ๋์ ์ฐ๊ฒฐํ์ธ์. - ์
๋ ฅ ์ ํ: ์ ์ ํ ์
๋ ฅ ์ ํ(์:
text,email,number)์ ์ฌ์ฉํ์ฌ ์์๋๋ ์ ๋ ฅ์ ๋ํ ์๋งจํฑ ์ ๋ณด๋ฅผ ์ ๊ณตํ์ธ์. - ์ค๋ฅ ๋ฉ์์ง: ์ค๋ฅ๋ฅผ ์์ ํ๋ ๋ฐฉ๋ฒ์ ์ค๋ช ํ๋ ๋ช ํํ๊ณ ์ ์ตํ ์ค๋ฅ ๋ฉ์์ง๋ฅผ ์ ๊ณตํ์ธ์.
8. ๋ฐ์ํ ๋์์ธ
์น์ฌ์ดํธ๊ฐ ๋ฐ์ํ์ด๋ฉฐ ๋ค์ํ ํ๋ฉด ํฌ๊ธฐ์ ์ฅ์น์ ์ ์ํ๋์ง ํ์ธํ์ธ์. ์ด๋ ๋ชจ๋ฐ์ผ ์ฅ์น๋ ํ๋๋ ๋ณด๊ธฐ๊ฐ ํ์ํ ๋ณด์กฐ ๊ธฐ์ ๋ก ์น์ฌ์ดํธ์ ์ ์ํ๋ ์ฌ์ฉ์์๊ฒ ํ์์ ์ ๋๋ค.
- ๋ฏธ๋์ด ์ฟผ๋ฆฌ: ๋ฏธ๋์ด ์ฟผ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ฌ ํ๋ฉด ํฌ๊ธฐ์ ๋ฐ๋ผ ์น์ฌ์ดํธ์ ๋ ์ด์์๊ณผ ์คํ์ผ์ ์กฐ์ ํ์ธ์.
- ์ ์ฐํ ๋ ์ด์์: ๋ค์ํ ํ๋ฉด ํฌ๊ธฐ์ ์ ์ํ๋ ์ ์ฐํ ๋ ์ด์์์ ์ฌ์ฉํ์ธ์.
- ๋ทฐํฌํธ ๋ฉํ ํ๊ทธ: ๋ทฐํฌํธ ๋ฉํ ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ฌ ๋ธ๋ผ์ฐ์ ๊ฐ ํ์ด์ง๋ฅผ ์ด๋ป๊ฒ ํฌ๊ธฐ ์กฐ์ ํ ์ง ์ ์ดํ์ธ์.
9. ๋ณด์กฐ ๊ธฐ์ ๋ก ํ ์คํธํ๊ธฐ
์คํฌ๋ฆฐ ๋ฆฌ๋, ํ๋ฉด ๋๋ณด๊ธฐ, ์์ฑ ์ธ์ ์ํํธ์จ์ด์ ๊ฐ์ ๋ณด์กฐ ๊ธฐ์ ๋ก ์น์ฌ์ดํธ๋ฅผ ํ ์คํธํ์ฌ ์ฅ์ ์ธ์ด ์ฌ์ฉํ ์ ์๋์ง ํ์ธํ์ธ์. ์ด๊ฒ์ด ์ ๊ทผ์ฑ ๋ฌธ์ ๋ฅผ ์๋ณํ๊ณ ํด๊ฒฐํ๋ ๊ฐ์ฅ ํจ๊ณผ์ ์ธ ๋ฐฉ๋ฒ์ ๋๋ค.
- ์คํฌ๋ฆฐ ๋ฆฌ๋: NVDA(Windows), VoiceOver(macOS ๋ฐ iOS), TalkBack(Android)๊ณผ ๊ฐ์ ์ธ๊ธฐ ์๋ ์คํฌ๋ฆฐ ๋ฆฌ๋๋ก ํ ์คํธํ์ธ์.
- ํ๋ฉด ๋๋ณด๊ธฐ: ํ๋ฉด ๋๋ณด๊ธฐ๋ก ํ ์คํธํ์ฌ ๋์ ํ๋ ์์ค์์๋ ์ฝํ ์ธ ๊ฐ ์ฝ๊ธฐ ์ฌ์ด์ง ํ์ธํ์ธ์.
- ์์ฑ ์ธ์ ์ํํธ์จ์ด: ์์ฑ ์ธ์ ์ํํธ์จ์ด๋ก ํ ์คํธํ์ฌ ์ฌ์ฉ์๊ฐ ์์ฑ์ ์ฌ์ฉํ์ฌ ์น์ฌ์ดํธ๋ฅผ ํ์ํ๊ณ ์ํธ ์์ฉํ ์ ์๋์ง ํ์ธํ์ธ์.
10. ์ ๊ธฐ์ ์ผ๋ก ์ ๊ทผ์ฑ ํ๊ฐ ๋ฐ ์ ์ง
์น ์ ๊ทผ์ฑ์ ์ง์์ ์ธ ๊ณผ์ ์ ๋๋ค. ์ ๊ธฐ์ ์ผ๋ก ์น์ฌ์ดํธ์ ์ ๊ทผ์ฑ ๋ฌธ์ ๋ฅผ ํ๊ฐํ๊ณ ํ์ํ ์ ๋ฐ์ดํธ๋ฅผ ํ์ฌ ์๊ฐ์ด ์ง๋๋ ์ ๊ทผ์ฑ์ ์ ์งํ๋๋ก ํ์ธ์. ์๋ํ๋ ์ ๊ทผ์ฑ ํ ์คํธ ๋๊ตฌ๋ฅผ ์ฌ์ฉํ์ฌ ์ ์ฌ์ ์ธ ๋ฌธ์ ๋ฅผ ์๋ณํ๋, ํญ์ ์๋ ํ ์คํธ ๋ฐ ์ฌ์ฉ์ ํผ๋๋ฐฑ์ผ๋ก ์๋ํ๋ ํ ์คํธ๋ฅผ ๋ณด์ํ์ธ์.
- ์๋ํ๋ ํ ์คํธ ๋๊ตฌ: WAVE, Axe, Siteimprove์ ๊ฐ์ ์๋ํ๋ ์ ๊ทผ์ฑ ํ ์คํธ ๋๊ตฌ๋ฅผ ์ฌ์ฉํ์ฌ ์ ์ฌ์ ์ธ ์ ๊ทผ์ฑ ๋ฌธ์ ๋ฅผ ์๋ณํ์ธ์.
- ์๋ ํ ์คํธ: ์๋ ํ ์คํธ๋ฅผ ์ํํ์ฌ ์น์ฌ์ดํธ๊ฐ WCAG ์๊ตฌ์ฌํญ์ ์ถฉ์กฑํ๊ณ ์ฅ์ ์ธ์ด ์ฌ์ฉํ ์ ์๋์ง ํ์ธํ์ธ์.
- ์ฌ์ฉ์ ํผ๋๋ฐฑ: ์ฅ์ ์ฌ์ฉ์๋ก๋ถํฐ ํผ๋๋ฐฑ์ ์์ฒญํ์ฌ ์ ๊ทผ์ฑ ๋ฌธ์ ๋ฅผ ์๋ณํ๊ณ ํด๊ฒฐํ์ธ์.
์น์ฌ์ดํธ๋ฅผ ๋์ด์ ์ ๊ทผ์ฑ: ๋์งํธ ์ ํ์ ํฌ์ฉ์ ๋์์ธ
์น ์ ๊ทผ์ฑ์ ์์น์ ์น์ฌ์ดํธ๋ฅผ ๋์ด ๋ชจ๋ฐ์ผ ์ฑ, ์ํํธ์จ์ด ์ ํ๋ฆฌ์ผ์ด์ , ์ ์ ๋ฌธ์๋ฅผ ํฌํจํ ๋ชจ๋ ๋์งํธ ์ ํ์ ์์ฐ๋ฆ ๋๋ค. ํฌ์ฉ์ ์ธ ๋์งํธ ๊ฒฝํ์ ๋ง๋ค๊ธฐ ์ํด์๋ ์ค๊ณ ๋ฐ ๊ฐ๋ฐ ๊ณผ์ ์ ๋ฐ์ ๊ฑธ์ณ ๋ชจ๋ ์ฌ์ฉ์์ ์๊ตฌ๋ฅผ ๊ณ ๋ คํ๋ ์ด์ฒด์ ์ธ ์ ๊ทผ ๋ฐฉ์์ด ํ์ํฉ๋๋ค.
๋ชจ๋ฐ์ผ ์ฑ ์ ๊ทผ์ฑ
๋ชจ๋ฐ์ผ ์ฑ์ ์์ ํ๋ฉด ํฌ๊ธฐ, ํฐ์น ๊ธฐ๋ฐ ์ํธ ์์ฉ, ๊ธฐ๋ณธ ํ๋ซํผ ๊ธฐ๋ฅ ์์กด์ฑ์ผ๋ก ์ธํด ๋ ํนํ ์ ๊ทผ์ฑ ๊ณผ์ ๋ฅผ ์ ์ํฉ๋๋ค. ๋ชจ๋ฐ์ผ ์ฑ ์ ๊ทผ์ฑ์ ๋ณด์ฅํ๋ ค๋ฉด ๋ค์์ ์ํํ์ธ์.
- ๊ธฐ๋ณธ UI ์์ ์ฌ์ฉ: ๊ฐ๋ฅํ๋ฉด ๊ธฐ๋ณธ UI ์์๋ฅผ ํ์ฉํ์ธ์. ์ผ๋ฐ์ ์ผ๋ก ์ฌ์ฉ์ ์ ์๋ก ๋ง๋ ๊ตฌ์ฑ ์์๋ณด๋ค ์ ๊ทผ์ฑ์ด ๋ ์ข์ต๋๋ค.
- ๋์ฒด ์ ๋ ฅ ๋ฐฉ๋ฒ ์ ๊ณต: ํฐ์น ๊ธฐ๋ฐ ์ ์ค์ฒ๋ฅผ ์ฌ์ฉํ ์ ์๋ ์ฌ์ฉ์๋ฅผ ์ํด ์์ฑ ์ ์ด ๋ฐ ์ค์์น ์ก์ธ์ค์ ๊ฐ์ ๋์ฒด ์ ๋ ฅ ๋ฐฉ๋ฒ์ ์ ๊ณตํ์ธ์.
- ์ถฉ๋ถํ ํฐ์น ๋์ ํฌ๊ธฐ ํ๋ณด: ํฐ์น ๋์์ด ์ถฉ๋ถํ ํฌ๊ณ ์ฐ๋ฐ์ ์ธ ํ์ฑํ๋ฅผ ๋ฐฉ์งํ ์ ์๋ ์ถฉ๋ถํ ๊ฐ๊ฒฉ์ด ์๋์ง ํ์ธํ์ธ์.
- ๋ช ํํ ์๊ฐ์ ์ ํธ ์ ๊ณต: ๋ช ํํ ์๊ฐ์ ์ ํธ๋ฅผ ์ฌ์ฉํ์ฌ UI ์์์ ์ํ์ ๊ธฐ๋ฅ์ ๋ํ๋ด์ธ์.
- ๋ณด์กฐ ๊ธฐ์ ์ง์: ์ฑ์ด ์คํฌ๋ฆฐ ๋ฆฌ๋ ๋ฐ ํ๋ฉด ๋๋ณด๊ธฐ์ ๊ฐ์ ๋ณด์กฐ ๊ธฐ์ ๊ณผ ํธํ๋๋์ง ํ์ธํ์ธ์.
์ํํธ์จ์ด ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ทผ์ฑ
์ํํธ์จ์ด ์ ํ๋ฆฌ์ผ์ด์ ์ ์คํฌ๋ฆฐ ๋ฆฌ๋, ํค๋ณด๋ ๋ด๋น๊ฒ์ด์ , ์์ฑ ์ธ์ ์ํํธ์จ์ด๋ฅผ ์ฌ์ฉํ๋ ์ฌ๋๋ค์ ํฌํจํ ์ฅ์ ์ฌ์ฉ์๊ฐ ์ ๊ทผํ ์ ์๋๋ก ์ค๊ณ๋์ด์ผ ํฉ๋๋ค.
- ํ๋ซํผ ์ ๊ทผ์ฑ ์ง์นจ ์ค์: ์ด์ ์ฒด์ ๊ณต๊ธ์ ์ฒด(์: Microsoft ์ ๊ทผ์ฑ ์ง์นจ, Apple ์ ๊ทผ์ฑ ์ง์นจ)๊ฐ ์ ๊ณตํ๋ ์ ๊ทผ์ฑ ์ง์นจ์ ์ค์ํ์ธ์.
- ์ ๊ทผ์ฑ ์๋ UI ํ๋ ์์ํฌ ์ฌ์ฉ: ์ ๊ทผ์ฑ ๊ธฐ๋ฅ์ ๋ํ ๋ด์ฅ ์ง์์ ์ ๊ณตํ๋ ์ ๊ทผ์ฑ ์๋ UI ํ๋ ์์ํฌ๋ฅผ ํ์ฉํ์ธ์.
- ํค๋ณด๋ ์ ๊ทผ์ฑ ์ ๊ณต: ๋ชจ๋ ๊ธฐ๋ฅ์ ํค๋ณด๋๋ฅผ ์ฌ์ฉํ์ฌ ์ ๊ทผํ ์ ์๋๋ก ๋ณด์ฅํ์ธ์.
- ์คํฌ๋ฆฐ ๋ฆฌ๋ ์ง์: ์คํฌ๋ฆฐ ๋ฆฌ๋๊ฐ ์ฝํ ์ธ ๋ฅผ ํด์ํ๊ณ ์ฌ์ฉ์์๊ฒ ์ ์ํ ์ ์๋๋ก UI ์์์ ๋ํ ์๋งจํฑ ์ ๋ณด๋ฅผ ์ ๊ณตํ์ธ์.
- ์ฌ์ฉ์ ์ ์ ์ต์ ์ ๊ณต: ์ฌ์ฉ์๊ฐ ๊ฐ์ธ์ ํ์์ ๋ง๊ฒ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ชจ์๊ณผ ๋์์ ์ฌ์ฉ์ ์ ์ํ ์ ์๋๋ก ํ์ธ์.
์ ์ ๋ฌธ์ ์ ๊ทผ์ฑ
PDF, ์๋ ๋ฌธ์, ์คํ๋ ๋์ํธ์ ๊ฐ์ ์ ์ ๋ฌธ์๋ ์ฅ์ ์ฌ์ฉ์๊ฐ ์ ๊ทผํ ์ ์๋๋ก ์ค๊ณ๋์ด์ผ ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ์ด๋ฏธ์ง์ ๋ํ ๋์ฒด ํ ์คํธ ์ ๊ณต, ์ ์ ํ ์ ๋ชฉ ๋ฐ ์์ ์ฌ์ฉ, ๋ฌธ์๊ฐ ์ ๊ทผ์ฑ์ ์ํด ํ๊ทธ ์ง์ ๋์๋์ง ํ์ธํ๋ ๊ฒ์ด ํฌํจ๋ฉ๋๋ค.
- ์ ๊ทผ์ฑ ์๋ ๋ฌธ์ ํ์ ์ฌ์ฉ: ๋ฌธ์์ ๊ตฌ์กฐ์ ๋ด์ฉ์ ๋ํ ์๋งจํฑ ์ ๋ณด๋ฅผ ์ ๊ณตํ๋ ํ๊ทธ๊ฐ ์ง์ ๋ PDF์ ๊ฐ์ ์ ๊ทผ์ฑ ์๋ ๋ฌธ์ ํ์์ ์ฌ์ฉํ์ธ์.
- ์ด๋ฏธ์ง์ ๋ํ ๋์ฒด ํ ์คํธ ์ ๊ณต: ๋ฌธ์์ ๋ชจ๋ ์ด๋ฏธ์ง์ ๋์ฒด ํ ์คํธ ์ค๋ช ์ ์ถ๊ฐํ์ธ์.
- ์ ์ ํ ์ ๋ชฉ ๋ฐ ์์ ์ฌ์ฉ: ์ ์ ํ ์ ๋ชฉ๊ณผ ์์์ ์ฌ์ฉํ์ฌ ๋ฌธ์๋ฅผ ๊ตฌ์กฐํํ๊ณ ํ์ํ๊ธฐ ์ฝ๊ฒ ๋ง๋์ธ์.
- ์ถฉ๋ถํ ์์ ๋๋น ๋ณด์ฅ: ํ ์คํธ์ ๋ฐฐ๊ฒฝ์ ์ฌ์ด์ ์ถฉ๋ถํ ์์ ๋๋น๋ฅผ ์ฌ์ฉํ์ธ์.
- ๋ณด์กฐ ๊ธฐ์ ๋ก ํ ์คํธ: ๋ณด์กฐ ๊ธฐ์ ๋ก ๋ฌธ์๋ฅผ ํ ์คํธํ์ฌ ์ฅ์ ์ฌ์ฉ์๊ฐ ์ ๊ทผํ ์ ์๋์ง ํ์ธํ์ธ์.
์ ๊ทผ์ฑ ๋ฌธํ ๊ตฌ์ถ
์ง์ ์ผ๋ก ์ ๊ทผ์ฑ ์๋ ๋์งํธ ๊ฒฝํ์ ๋ง๋ค๊ธฐ ์ํด์๋ ๊ธฐ์ ์ ์ง์นจ์ ๊ตฌํํ๋ ๊ฒ ์ด์์ด ํ์ํฉ๋๋ค. ์กฐ์ง ๋ด์ ์ ๊ทผ์ฑ ๋ฌธํ๋ฅผ ์กฐ์ฑํด์ผ ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ์ ๊ทผ์ฑ์ ๋ํ ์ง์ ๊ต์ก, ์ค๊ณ ๋ฐ ๊ฐ๋ฐ ๊ณผ์ ์ ์ ๊ทผ์ฑ ํตํฉ, ์ฅ์ ์ฌ์ฉ์๋ก๋ถํฐ์ ํผ๋๋ฐฑ ์์ฒญ์ด ํฌํจ๋ฉ๋๋ค.
์ ๊ทผ์ฑ ๊ต์ก ๋ฐ ํ๋ จ
๋์์ด๋, ๊ฐ๋ฐ์, ์ฝํ ์ธ ์ ์์, ํ๋ก์ ํธ ๊ด๋ฆฌ์๋ฅผ ํฌํจํ ๋ชจ๋ ์ง์์๊ฒ ์ ๊ทผ์ฑ ๊ต์ก ๋ฐ ํ๋ จ์ ์ ๊ณตํ์ธ์. ์ด ๊ต์ก์ ์น ์ ๊ทผ์ฑ์ ์์น, WCAG ์ง์นจ, ์ ๊ทผ์ฑ ์๋ ๋์งํธ ์ฝํ ์ธ ์ ์์ ์ํ ๋ชจ๋ฒ ์ฌ๋ก๋ฅผ ๋ค๋ฃจ์ด์ผ ํฉ๋๋ค.
์ค๊ณ ๋ฐ ๊ฐ๋ฐ ๊ณผ์ ์ ์ ๊ทผ์ฑ ํตํฉ
์ด๊ธฐ ๊ธฐํ ๋ฐ ์ค๊ณ๋ถํฐ ํ ์คํธ ๋ฐ ๋ฐฐํฌ์ ์ด๋ฅด๊ธฐ๊น์ง ์ค๊ณ ๋ฐ ๊ฐ๋ฐ ๊ณผ์ ์ ๋ชจ๋ ๋จ๊ณ์ ์ ๊ทผ์ฑ์ ํตํฉํ์ธ์. ์ด๋ฅผ ์ข ์ข ์ ๊ทผ์ฑ์ '์ข์ธก ์ด๋(shifting left)'์ด๋ผ๊ณ ํฉ๋๋ค. ์ด๊ธฐ์ ์ ๊ทผ์ฑ์ ๊ณ ๋ คํจ์ผ๋ก์จ ๋น์ฉ์ด ๋ง์ด ๋๋ ์ฌ์์ ์ ํผํ๊ณ ์ฒ์๋ถํฐ ๋์งํธ ์ ํ์ ์ ๊ทผ์ฑ์ ๋ณด์ฅํ ์ ์์ต๋๋ค.
์ฅ์ ์ฌ์ฉ์๋ก๋ถํฐ ํผ๋๋ฐฑ ์์ฒญ
์ ๊ทผ์ฑ ๋ฌธ์ ๋ฅผ ์๋ณํ๊ณ ํด๊ฒฐํ๊ธฐ ์ํด ์ฅ์ ์ฌ์ฉ์๋ก๋ถํฐ ์ ๊ทน์ ์ผ๋ก ํผ๋๋ฐฑ์ ์์ฒญํ์ธ์. ๋ณด์กฐ ๊ธฐ์ ์ ์ฌ์ฉํ๋ ์ฌ๋๋ค๊ณผ ์ฌ์ฉ์ ํ ์คํธ๋ฅผ ์ํํ์ฌ ๋์งํธ ์ ํ์ ๋ํ ๊ทธ๋ค์ ๊ฒฝํ์ ๋ํ ๊ท์คํ ํต์ฐฐ๋ ฅ์ ์ป์ผ์ธ์.
์ ๊ทผ์ฑ ์ด๋์ ํฐ๋ธ์ ๊ธ๋ก๋ฒ ์ฌ๋ก
์ ์ธ๊ณ์ ์ผ๋ก ๋ค์ํ ์ด๋์ ํฐ๋ธ๊ฐ ์น ์ ๊ทผ์ฑ๊ณผ ๋์งํธ ํฌ์ฉ์ ์ด์งํ๊ณ ์์ต๋๋ค. ๋ช ๊ฐ์ง ์๋ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
- ์ ๋ฝ: ์ ๋ฝ ์ ๊ทผ์ฑ๋ฒ(EAA)์ ์น์ฌ์ดํธ, ๋ชจ๋ฐ์ผ ์ฑ, ์ ์์ฑ , ATM์ ํฌํจํ ๊ด๋ฒ์ํ ์ ํ ๋ฐ ์๋น์ค์ ๋ํ ์ ๊ทผ์ฑ ์๊ตฌ์ฌํญ์ ์๋ฌดํํฉ๋๋ค.
- ์บ๋๋ค: ์จํ๋ฆฌ์ค์ฃผ ์ฅ์ ์ธ ์ ๊ทผ์ฑ๋ฒ(AODA)์ ์จํ๋ฆฌ์ค์ฃผ์ ์กฐ์ง์ด ์น์ฌ์ดํธ์ ๋์งํธ ์ฝํ ์ธ ๋ฅผ ์ฅ์ ์ธ์ด ์ ๊ทผํ ์ ์๋๋ก ๋ง๋ค ๊ฒ์ ์๊ตฌํฉ๋๋ค.
- ํธ์ฃผ: ์ฅ์ ์ฐจ๋ณ ๊ธ์ง๋ฒ(DDA)์ ์จ๋ผ์ธ ํ๊ฒฝ์ ํฌํจํ์ฌ ์ฅ์ ์ธ์ ๋ํ ์ฐจ๋ณ์ ๊ธ์งํฉ๋๋ค. ํธ์ฃผ ์ธ๊ถ ์์ํ๋ ์น ์ ๊ทผ์ฑ์ ๋ํ ์ง์นจ์ ์ ๊ณตํฉ๋๋ค.
- ์ผ๋ณธ: ์ผ๋ณธ ์ฐ์ ํ์ค(JIS)์๋ ์น์ฌ์ดํธ ๋ฐ ์ ๋ณด ๊ธฐ์ ์ฅ๋น์ ๋ํ ์ ๊ทผ์ฑ ํ์ค์ด ํฌํจ๋์ด ์์ต๋๋ค.
- ์ธ๋: 2016๋ ์ฅ์ ์ธ ๊ถ๋ฆฌ๋ฒ์ ๋์งํธ ์์ญ์ ํฌํจํ์ฌ ์ฅ์ ์ธ์ ์ ๊ทผ์ฑ๊ณผ ํฌ์ฉ์ ์ด์งํฉ๋๋ค.
์น ์ ๊ทผ์ฑ์ ์ํ ๋๊ตฌ ๋ฐ ๋ฆฌ์์ค
์ ๊ทผ์ฑ ์๋ ๋์งํธ ๊ฒฝํ์ ๋ง๋๋ ๋ฐ ๋์์ด ๋๋ ์๋ง์ ๋๊ตฌ์ ๋ฆฌ์์ค๊ฐ ์์ต๋๋ค.
- ์ ๊ทผ์ฑ ํ ์คํธ ๋๊ตฌ: WAVE, Axe, Siteimprove, Tenon.io
- ์์ ๋๋น ๊ฒ์ฌ๊ธฐ: WebAIM ์์ ๋๋น ๊ฒ์ฌ๊ธฐ, Accessible Colors
- ์คํฌ๋ฆฐ ๋ฆฌ๋: NVDA(Windows), VoiceOver(macOS ๋ฐ iOS), TalkBack(Android)
- WebAIM: ์น ์ ๊ทผ์ฑ ์ ๋ณด ๋ฐ ๊ต์ก์ ์ํ ์ ๋์ ์ธ ๋ฆฌ์์ค์ ๋๋ค.
- W3C ์น ์ ๊ทผ์ฑ ์ด๋์ ํฐ๋ธ(WAI): WCAG ๊ฐ๋ฐ์ ๋ด๋นํ๋ ์กฐ์ง์ ๋๋ค.
- Deque Systems: ์ ๊ทผ์ฑ ํ ์คํธ ๋๊ตฌ ๋ฐ ์ปจ์คํ ์๋น์ค๋ฅผ ์ ๊ณตํฉ๋๋ค.
- Level Access: ์ ๊ทผ์ฑ ์๋ฃจ์ ๋ฐ ์๋น์ค๋ฅผ ์ ๊ณตํฉ๋๋ค.
๊ฒฐ๋ก
์น ์ ๊ทผ์ฑ์ ๋จ์ํ ๊ธฐ์ ์ ์ธ ์๊ตฌ์ฌํญ์ด ์๋๋ผ, ํฌ์ฉ์ ๋์์ธ์ ๊ธฐ๋ณธ ์์น์ด์ ๋ ๊ณตํํ๊ณ ์ ๊ทผ์ฑ ์๋ ๋์งํธ ์ธ์์ ๋ง๋๋ ๋ฐ ํ์์ ์ธ ์ธก๋ฉด์ ๋๋ค. ์น ์ ๊ทผ์ฑ์ ์์ฉํจ์ผ๋ก์จ ์กฐ์ง์ ๋ ๋์ ์ฌ์ฉ์์ธต์ ๋๋ฌํ๊ณ , ๋ชจ๋๋ฅผ ์ํ ์ฌ์ฉ์ ๊ฒฝํ์ ๊ฐ์ ํ๋ฉฐ, ๋ฒ์ ์๊ตฌ์ฌํญ์ ์ค์ํ๊ณ , ์ฌํ์ ์ฑ ์์ ์ฆ์งํ ์ ์์ต๋๋ค. WCAG์ ์์น์ ์ดํดํ๊ณ ๊ตฌํํ๋ฉฐ, ๋ณด์กฐ ๊ธฐ์ ๋ก ํ ์คํธํ๊ณ , ์ ๊ทผ์ฑ ๋ฌธํ๋ฅผ ์กฐ์ฑํจ์ผ๋ก์จ, ๊ทํ์ ์น์ฌ์ดํธ์ ๋์งํธ ์ฝํ ์ธ ๊ฐ ๋ฅ๋ ฅ์ด๋ ์ฅ์ ์ ๊ด๊ณ์์ด ๋ชจ๋ ์ฌ๋์ด ์ฌ์ฉํ ์ ์๋๋ก ๋ณด์ฅํ ์ ์์ต๋๋ค. ์ ๊ทผ์ฑ์ ์ฐ์ ์ํ๋ ๊ฒ์ ๊ธ๋ก๋ฒ ์ํฅ์ ์ค์ํ๋ฉฐ, ์ ์ธ๊ณ ๊ฐ์ธ์๊ฒ ๊ธฐํ๋ฅผ ์ฐฝ์ถํ๊ณ ๊ถํ์ ๋ถ์ฌํฉ๋๋ค.