SEO์ ์ฝ๋ฉ: ์ ๋ณด ์ด ๋ฒ๋ ์๋, ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ ์์กด์ ์ํ ์ ๋ต
SEO ์ฝ๋ฉ์ผ๋ก ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ ์์กด ์ ๋ต์ ์์ฑํ์ธ์. Core Web Vitals ๊ฐ์ ์ ์ํ HTML/CSS ์ต์ ํ ๋ฐฉ๋ฒ๊ณผ ๋กฑํ ์ผ ํค์๋ ์ ๋ต์ ์์ธํ ๋ค๋ฃน๋๋ค.
์ ๋ณด๊ฐ ๋ด๋ฌผ์ฒ๋ผ ์์์ง๋ ์ ๋ณด ์ด ๋ฒ๋ ์๋, ๋ธ๋ก๊ทธ๋ ๋จ์ํ ๊ธ์ ์ฐ๋ ํ์๋ฅผ ๋์ด์ ์ ๋ต์ ์น ๋ง์คํฐ๋ง์ ์์ญ์ด ๋์์ต๋๋ค. ๊ณผ๊ฑฐ, ์ ๋ณด์ ํฌ์์ฑ ์์ฒด๊ฐ ๊ฐ์น์๋ ์์ ์๋ ๋ ์ ์ ์ธ ์ง์์ด๋ ๊น์ด ์๋ ๊ฒฝํ๋ง์ผ๋ก๋ ๋ ์๋ฅผ ๋์ด๋ค์ผ ์ ์์์ต๋๋ค. ํ์ง๋ง ์ค๋๋ , ChatGPT์ ๊ฐ์ ์์ฑํ AI๋ ์๋ง์ ์ฝํ ์ธ ๋ฅผ ์์๊ฐ์ ์์ฝํ๊ณ ์ฌ๊ตฌ์ฑํ์ฌ ๊ฐ์ฅ ๋น ๋ฅด๊ณ ์ ๋ ดํ ํํ๋ก ๋ ์์๊ฒ ์ ๊ณตํฉ๋๋ค.
์ด๋ฌํ ํ๊ฒฝ์์ ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ(ํฐ์คํ ๋ฆฌ, ์๋ํ๋ ์ค, ๊ตฌ๊ธ ๋ธ๋ก๊ทธ ๋ฑ)์ ์ฑ๊ณต์ ์ ์ ์ผ๋ก ๊ฒ์์์ง์ ๋ํ ์นํ์ฑ์ ๋ฌ๋ ค ์์ต๋๋ค.
๊ฒ์์์ฅ์ ๊ฐ์ฅ ์ ์ ๋น์ฉ(์๊ฐ๊ณผ ๋ ธ๋ ฅ)์ผ๋ก ์ํ๋ ์ ๋ณด๋ฅผ ์ป๊ณ ์ ํ๋ ์ง๊ธ, ๋ธ๋ก๊ทธ ๊ฒ์ ์ต์ ํ(SEO, Search Engine Optimization)๋ ์ฐ๋ฆฌ์ ์ฝํ ์ธ ๊ฐ "์ฌ์ฉ์์๊ฒ ๊ฐ์ฅ ๋น ๋ฅด๊ณ , ์ ํํ๋ฉฐ, ๋ณด๊ธฐ ํธ์ํ ์ ๋ณด"์์ ์ฆ๋ช ํ๋ ์ตํ์ ์๋จ์ ๋๋ค. ๊ทธ๋ฆฌ๊ณ ์ด ์ฆ๋ช ์ ๋จ์ํ ์ข์ ๊ธ๋ง์ผ๋ก๋ ๋ถ๊ฐ๋ฅํ๋ฉฐ, HTML ๊ตฌ์กฐ ์ดํด์ ์ฝ๋ฉ ์ต์ ํ๋ผ๋ ๊ธฐ์ ์ SEO(Technical SEO) ์ญ๋์ ํตํด์๋ง ์๋ฒฝํ๊ฒ ์ด๋ฃจ์ด์ง ์ ์์ต๋๋ค.
์ด ๊ธ์ ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ ์ด์์๋ผ๋ฉด ๋ฐ๋์ ์์์ผ ํ SEO ์ ์ฉ ์ ๋ต๊ณผ ์ด๋ฅผ ๋ท๋ฐ์นจํ๋ ์ฝ๋ฉ ๊ธฐ๋ณธ ์ง์์ ํ์์ฑ์ ๋ค๋ฃจ์ด, ๊ฒ์ ๊ฒฐ๊ณผ์ ์์ ๋ ธ์ถ์ ๋์ด ๋ธ๋ก๊ทธ์ ์ง์ ๊ฐ๋ฅํ ์ฑ์ฅ์ ์ํ ๋ก๋๋งต์ ๊ณ ๋ฏผํด ๋ด ๋๋ค.
ํ๋ซํผ ์ ํ์ ๊ธฐ๋ก: ํ์ํ๊ณผ ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ์ ์ด๋ช
1. ๋ค์ด๋ฒ ๋ธ๋ก๊ทธ: ์ฝํ ์ธ ์ง์คํ 'ํ์ํ' ์ํ๊ณ
๋ง์ฝ SEO๋ HTML ์ฝ๋ฉ์ด๋ผ๋ ๋จ์ด๊ฐ ๋ถ๋ด์ค๋ฝ๊ฒ ๋๊ปด์ง๋ค๋ฉด, ๋ค์ด๋ฒ ๋ธ๋ก๊ทธ๋ก์ ์ด์ ์ ์ง์งํ๊ฒ ๊ณ ๋ฏผํด๋ณด๋ ๊ฒ์ด ํ์ค์ ์ผ ์ ์์ต๋๋ค. ๋ค์ด๋ฒ ๋ธ๋ก๊ทธ๋ ํ๊ตญ ์ฌ์ฉ์์๊ฒ ์ต์ ํ๋ ํ์ํ ํ๋ซํผ์ผ๋ก, ์์ฒด ๊ฒ์ ์ํ๊ณ(C-Rank, D.I.A.) ๋ด์์ ์ฝํ ์ธ ์ ๊ฐ์น๋ฅผ ํ๋จํ๊ณ ๋ณด์ํฉ๋๋ค.

- ์ฅ์ : ๋ณต์กํ ๊ธฐ์ ์ SEO๋ ์ฝ๋ฉ์ ์ ๊ฒฝ ์ธ ํ์ ์์ด ์ค์ง ์ฝํ ์ธ ์ ์์๋ง ์ง์คํ ์ ์์ต๋๋ค. ๋ค์ด๋ฒ ๊ฒ์ ๊ฒฐ๊ณผ์ ๋น ๋ฅด๊ฒ ๋ ธ์ถ๋ ์ ์์ต๋๋ค.
- ๋จ์ : ๋ค์ด๋ฒ ๊ฒ์ ์ธ ๊ตฌ๊ธ, ๋ค์ ๋ฑ ์ธ๋ถ ๊ฒ์ ์ ์ ์ ํ๊ณ๊ฐ ์์ผ๋ฉฐ, ๋ธ๋ก๊ทธ ํ๋ซํผ ์ ์ฑ ๋ณํ์ ๋ฏผ๊ฐํฉ๋๋ค.
2. ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ: ๊ธ๋ก๋ฒ ๊ฒ์ ์์ฅ์ ๊ท์น '๊ธฐ์ ์ SEO'
๋ฐ๋ฉด, ํฐ์คํ ๋ฆฌ, ์๋ํ๋ ์ค, ๊ตฌ๊ธ ๋ธ๋ก๊ทธ์ ๊ฐ์ ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ ํ๋ซํผ์ ๊ธ๋ก๋ฒ ๊ฒ์ ์์ง์ ๊ท์น์ธ ์น ํ์ค(Web Standards)์ ๋ฐ๋ฆ ๋๋ค. ์ด ๋ธ๋ก๊ทธ ํ๋ซํผ๋ค์ ๊ตญ๋ด์ธ ๋ ์ ๋ชจ๋์๊ฒ ์ ์ฌ์ ์ธ ์ ๊ทผ์ฑ์ ์ด์ด์ฃผ์ง๋ง, ๊ทธ ๋๊ฐ๋ก ๊ธฐ์ ์ SEO๋ฅผ ํ์๋ก ์๊ตฌํฉ๋๋ค.
| ๊ตฌ๋ถ | ํ๋ซํผ ์์ | ๊ฒ์ ์ํ๊ณ | SEO ์๊ตฌ ์ฌํญ |
|---|---|---|---|
| ํ์ํ | ๋ค์ด๋ฒ ๋ธ๋ก๊ทธ | ์์ฒด ์ํ๊ณ(๊ตญ๋ด ํ์ ) | ์ฝํ ์ธ ํ์ง(์ฃผ์ ์ ๋ฌธ์ฑ) |
| ๊ฐ๋ฐฉํ | ํฐ์คํ ๋ฆฌ, ์๋ํ๋ ์ค, ๊ตฌ๊ธ ๋ธ๋ก๊ทธ | ๊ธ๋ก๋ฒ ๊ฒ์ ์์ง(Google, Bing) | ๊ธฐ์ ์ SEO (์ฝ๋ฉ/HTML ์ต์ ํ) ํ์ |
๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ์์ HTML ๊ตฌ์กฐ์ ์ฝ๋ฉ ์ต์ ํ๋ฅผ ์ดํดํ๋ ๋ฅ๋ ฅ์ ๋จ์ํ ๋์์ธ ๊ฐ์ ์ ๋์ด, ๊ฒ์์์ง ํฌ๋กค๋ฌ(Crawler)์๊ฒ ๋ด ์ฝํ ์ธ ๊ฐ ๋ฌด์์ ๋ค๋ฃจ๊ณ ์๋์ง ์ ํํ ์ธ์ํ๊ฒ ๋ง๋๋ ํต์ฌ ์ด์ ๊ฐ ๋ฉ๋๋ค. ์ด๋ ๊ณง ๊ฒ์ ์์ฅ์์ ๋ด ์ฝํ ์ธ ์ ๊ฐ์น๋ฅผ ์ธ์ ๋ฐ๊ธฐ ์ํ ์ต์ํ์ ๋ ธ๋ ฅ์ ๋๋ค.

์ ์ฝ๋ฉ(HTML/CSS)์ด ๋ธ๋ก๊ทธ ์ฑ๊ณต์ ์ ๋ต์ ๋ฌด๊ธฐ์ธ๊ฐ?
"๋ด๊ฐ ๊ฐ๋ฐ์๋ ์๋๋ฐ ์ ์ฝ๋ฉ์ ํด์ผ ํ๋?"๋ผ๋ ์๋ฌธ์ด ๋ค ์ ์์ต๋๋ค. ํ์ง๋ง ๋ธ๋ก๊ทธ๋ฅผ ๊ตฌ์ฑํ๋ HTML/CSS ๊ตฌ์กฐ๋ ๊ฒ์์์ง์ด ์ฝํ ์ธ ๋ฅผ ์ฝ๋ '์ค๊ณ๋'์ ๊ฐ์ต๋๋ค. ์ด ์ค๊ณ๋๋ฅผ ์ต์ ํํ๋ ๊ฒ์ด SEO ์ฝ๋ฉ์ ํต์ฌ์ด๋ฉฐ, ์์ ๋ ธ์ถ์ ๋ณด์ฅํ๊ธฐ๋ณด๋ค๋ ์ฝํ ์ธ ์ ๊ฐ์น๋งํผ์ ์ธ์ ๋ฐ์ ์ ์๋ ์ต์ํ์ ์กฐ๊ฑด์ ์ถฉ์กฑํ๋ ์์ ์ ๋๋ค.
1. ์น ํ์ค์ฌ์ฉ์ ๊ฒฝํ์ ํต์ฌ: Core Web Vitals (์ฝ์ด ์น ๋ฐ์ดํ) ํ๋ณด
๊ตฌ๊ธ(Google)์ด 2021๋ ๋ถํฐ ๋ญํน ์์๋ก ๊ณต์ ์ฑํํ Core Web Vitals (CWV) ์งํ๋ ์ฌ์ฉ์ ๊ฒฝํ(User Experience, UX)์ ์ธก์ ํ๋ ํต์ฌ ๊ธฐ์ค์ ๋๋ค. CWV๋ ๊ธฐ์ ์ ์ธ ์์๋ฅผ ๋ค๋ฃจ๋ฏ๋ก, HTML๊ณผ CSS์ ๋ํ ์ดํด ์์ด๋ ์ด ์งํ๋ฅผ ๊ฐ์ ํ๊ธฐ ์ด๋ ต์ต๋๋ค.
โ LCP (Largest Contentful Paint) - ๋ก๋ฉ ์๋ ์ต์ ํ
LCP๋ ํ์ด์ง์์ ๊ฐ์ฅ ํฐ ์ฝํ ์ธ ์์๊ฐ ๋ก๋๋๋ ๋ฐ ๊ฑธ๋ฆฌ๋ ์๊ฐ์ ์ธก์ ํฉ๋๋ค. ๊ฒ์์์ง์ ๋น ๋ฅธ ํ์ด์ง ๋ก๋ฉ ์๋๋ฅผ ์ ํธํฉ๋๋ค.
์ฝ๋ฉ ์ ์ฉ ์ ๋ต:
- ๋ถํ์ํ CSS/JavaScript ์ ๊ฑฐ: ์ฌ์ฉํ์ง ์๋ ์ฝ๋๋ ํ์ด์ง ๋ก๋ฉ ์๋๋ฅผ ๋ฆ์ถฅ๋๋ค.
- ๊ด๊ณ ๋ฐ ๋ฏธ๋์ด ์ง์ฐ ๋ก๋ฉ (Lazy Loading): ํ๋ฉด์ ๋ฐ๋ก ๋ณด์ด์ง ์๋ ์ด๋ฏธ์ง, ์์, ๊ด๊ณ ์คํฌ๋ฆฝํธ์๋
loading="lazy"์์ฑ์ ์ ์ฉํ์ฌ ์ด๊ธฐ ๋ก๋ฉ ๋ถ๋ด์ ์ค์ ๋๋ค. - ์๋ฒ ์๋ต ์๊ฐ ๋จ์ถ: ํธ์คํ ํ๊ฒฝ ๋ฐ ์บ์ฑ(Caching) ์ค์ ์ ์ต์ ํํด์ผ ํฉ๋๋ค.
โก CLS (Cumulative Layout Shift) - ๋ ์ด์์ ์์ ์ฑ ํ๋ณด
CLS๋ ํ์ด์ง ๋ก๋ฉ ์ค ์ฝํ ์ธ ๊ฐ ์์์น ๋ชปํ๊ฒ ์์ง์ด๋ ์ ๋๋ฅผ ์ธก์ ํฉ๋๋ค. ์ฝํ ์ธ ๊ฐ ์์ง์ด๋ฉด ์ฌ์ฉ์๊ฐ ์๋ชป ํด๋ฆญํ๊ฑฐ๋ ํผ๋์ ๊ฒช๊ฒ ๋์ด UX๋ฅผ ์ฌ๊ฐํ๊ฒ ์ ํดํฉ๋๋ค.
์ฝ๋ฉ ์ ์ฉ ์ ๋ต:
- ์ด๋ฏธ์ง/๋น๋์ค ํฌ๊ธฐ ๋ช
์:
imgํ๊ทธ์width์height์์ฑ์ ํ์๋ก ๋ช ์ํ์ฌ ๋ก๋ฉ ์ ๋ธ๋ผ์ฐ์ ๊ฐ ๊ณต๊ฐ์ ๋ฏธ๋ฆฌ ํ๋ณดํ๊ฒ ํฉ๋๋ค. - ๊ด๊ณ /์์ ฏ ๊ณต๊ฐ ํ๋ณด: ๋์ ์ผ๋ก ๋ก๋๋๋ ๊ด๊ณ ๋ ์์ ฏ์๋ CSS๋ฅผ ์ด์ฉํด
min-height๋ฑ์ ์์ฑ์ผ๋ก ์ต์ ๊ณต๊ฐ์ ํ๋ณดํด์ผ ํ๋ฉด ๋ฐ๋ฆผ ํ์(Layout Shift)์ ๋ฐฉ์งํ ์ ์์ต๋๋ค.
โข INP (Interaction to Next Paint) - ์ํธ์์ฉ ๋ฐ์ ์๋ (FID ๋์ฒด ์งํ)
๊ธฐ์กด FID(First Input Delay)๋ฅผ ๋์ฒดํ๋ INP๋ ์ฌ์ฉ์์ ์ฒซ ์ํธ์์ฉ(ํด๋ฆญ, ํญ ๋ฑ)๋ถํฐ ๋ธ๋ผ์ฐ์ ๊ฐ ์๊ฐ์ ํผ๋๋ฐฑ์ ์ ๊ณตํ๊ธฐ๊น์ง ๊ฑธ๋ฆฌ๋ ์๊ฐ์ ์ธก์ ํฉ๋๋ค. ์ด๋ ๋ฉ์ธ ์ค๋ ๋(Main Thread)์ ํจ์จ์ฑ๊ณผ ์ง๊ฒฐ๋ฉ๋๋ค.
์ฝ๋ฉ ์ ์ฉ ์ ๋ต:
- ๊ณผ๋ํ JavaScript ๋ถ๋ฆฌ ๋ฐ ๋น๋๊ธฐ ์ฒ๋ฆฌ: ์ฉ๋์ด ํฐ JavaScript ํ์ผ์
async๋๋defer์์ฑ์ ์ฌ์ฉํ์ฌ ๋น๋๊ธฐ์ ์ผ๋ก ๋ก๋ํ๊ฑฐ๋, ์ค์ํ์ง ์์ ์ฝ๋๋ ์คํ์ ์ง์ฐ์์ผ ๋ฉ์ธ ์ค๋ ๋ ๋ถ๋ด์ ์ต์ํํฉ๋๋ค. - CSSOM ์์ฑ ์ต์ ํ: ๋ธ๋ผ์ฐ์ ๊ฐ ์คํ์ผ์ ์ฝ๋ ์๊ฐ์ ์ค์ฌ ์ด๊ธฐ ๋ ๋๋ง์ ๋น ๋ฅด๊ฒ ํฉ๋๋ค.
2. ์ฝํ ์ธ ์ ๊ตฌ์กฐ์ ์ดํด๋ ์ฆ์ง: ์๋งจํฑ HTML๊ณผ ์ ๊ทผ์ฑ
๊ฒ์์์ง์ ๋จ์ํ ํ ์คํธ ๋ฉ์ด๋ฆฌ๊ฐ ์๋, ๊ตฌ์กฐํ๋ ์ ๋ณด๋ฅผ ์ ํธํฉ๋๋ค. ์ฝ๋ฉ์ ์ฝํ ์ธ ์ ์๋ฏธ(Semantics)๋ฅผ ๋ถ์ฌํ์ฌ ๊ฒ์์์ง์ ์ดํด๋๋ฅผ ์ฆ์ง์ํต๋๋ค.
HTML ์๋งจํฑ ํ๊ทธ ํ์ฉ:
- ์ ๋ชฉ ํ๊ทธ(H1 ~ H6):
H1ํ๊ทธ๋ ํ์ด์ง๋น ํ ๋ฒ๋ง ์ฌ์ฉํ์ฌ ๊ธ์ ๋ฉ์ธ ์ฃผ์ (ํต์ฌ ํค์๋)๋ฅผ ๋ช ํํ ํด์ผ ํฉ๋๋ค. ๊ณ์ธต ๊ตฌ์กฐ๋ฅผ ์ ํํ๊ฒ ์ค์ ํด์ผ ๊ฒ์์์ง์ด ์ฃผ์ ์ ์ค์๋์ ํ๋ฆ์ ์ฝ๊ฒ ํ์ ํฉ๋๋ค. pํ๊ทธ,ul/olํ๊ทธ: ๋ณธ๋ฌธ ๋จ๋ฝ๊ณผ ๋ชฉ๋ก์ ๋ช ํํ ๊ตฌ๋ถํ์ฌ ๊ฐ๋ ์ฑ๊ณผ ์ ๋ณด ๊ตฌ์กฐํ๋ฅผ ๋์ ๋๋ค.article,section,nav,footerํ๊ทธ: ๋ฌธ์์ ๊ฐ ์์ญ์ ์๋ฏธ๋ฅผ ๋ถ์ฌํ์ฌ ๊ฒ์์์ง์ด ์ฝํ ์ธ ์ ๋งฅ๋ฝ์ ๋์ฑ ์ ์ดํดํ๋๋ก ๋์ต๋๋ค.
์ด๋ฏธ์ง ๋์ฒด ํ ์คํธ(alt ํ๊ทธ):
- ์ด๋ฏธ์ง๋ ์๊ฐ์ ์ ๋ณด๋ง ์ ๊ณตํ๋ฏ๋ก,
altํ๊ทธ๋ฅผ ์ฑ์ ๋ฃ์ด ๊ฒ์์์ง์ด ์ด๋ฏธ์ง๋ฅผ ์ดํดํ๋๋ก ๋๊ณ , ์๊ฐ ์ฅ์ ์ธ ๋ ์๋ฅผ ์ํ ์น ์ ๊ทผ์ฑ์ ํ๋ณดํด์ผ ํฉ๋๋ค. ํต์ฌ ํค์๋๋ฅผ ์์ฐ์ค๋ฝ๊ฒ ํฌํจํ๋ ๊ฒ์ด ์ข์ต๋๋ค.
SEO ํค์๋ ๋ฐ ์ฝ๋ฉ ์ค์ ์ ๋ต: ๋กฑํ ์ผ๊ณผ ๊ตฌ์กฐํ ๋ฐ์ดํฐ
๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ์ ์ฑ์ฅ์ ์ํ ์ค์ ์ ๋ต์ ๋จ์ํ ๊ธฐ์ ์ ์์๋ฅผ ์ถฉ์กฑ์ํค๋ ๊ฒ์ ๋์ด, ํค์๋ ์ ๋ต๊ณผ ๊ตฌ์กฐํ๋ ์ ๋ณด ์ ๊ณต์ ํตํด ๊ฒฝ์๋ ฅ์ ๋์ด ๋ฐ ์์ต๋๋ค.
1. ์ ๋ต์ ํค์๋ ๋ฐฐ๋ถ ๋ฐ ๋กฑํ ์ผ ํค์๋ ํ์ฉ
๋ฉ์ธ ํค์๋๋ง์ผ๋ก๋ ๊ฒฝ์์ด ์น์ดํ์ฌ ์์ ๋ ธ์ถ์ด ์ด๋ ต์ต๋๋ค. ๋กฑํ ์ผ ํค์๋(Long-Tail Keyword)๋ ๊ฒ์๋์ ์ ์ง๋ง ๊ฒ์ ์๋๊ฐ ๋ช ํํ ํค์๋ ์กฐํฉ์ผ๋ก, ์ ํ์จ์ด ๋๊ณ ๊ฒฝ์์ด ๋ฎ์ ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ๊ฐ ์ง์คํด์ผ ํ ํต์ฌ ์ ๋ต์ ๋๋ค.
| ๋ฉ์ธ ํค์๋ (SEO, ์ฝ๋ฉ) | ์ ์ฌ ํค์๋ (์น ๋ง์คํฐ๋ง, ์น ํ์ค) | ๋กฑํ ์ผ ํค์๋ (๊ฒ์ ์๋, ํ๋ซํผ ํน์ ) |
|---|---|---|
| SEO | ๊ฒ์ ์์ง ์ต์ ํ, ์น ๋ง์คํฐ๋ง, ์์ ๋ ธ์ถ ์ ๋ต | ํฐ์คํ ๋ฆฌ SEO ์ต์ ํ ๋ฐฉ๋ฒ, ๊ตฌ๊ธ ๊ฒ์ ์์ ๋ ธ์ถ ํ (๋ฐฉ๋ฒ๋ก ) |
| ์ฝ๋ฉ | HTML, CSS, Core Web Vitals, ์น ํ์ค | ๋ธ๋ก๊ทธ LCP ๊ฐ์ ์ฝ๋ฉ, HTML alt ํ๊ทธ ์ฌ์ฉ๋ฒ (๊ธฐ์ ์ ์ฉ) |
| ๋ธ๋ก๊ทธ ์์กด | ๋ธ๋ก๊ทธ ์ฑ์ฅ, ์ฝํ ์ธ ๋ง์ผํ , ๋ฐฉ๋ฌธ์ ๋๋ฆฌ๊ธฐ | ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ ์ด๋ณด ๊ฐ์ด๋, ์๋ํ๋ ์ค ๊ธฐ์ ์ SEO (์ด๋ณด/ํ๋ซํผ ํน์ ) |
์ ์ฉ ๋ฐฉ๋ฒ:
- ์ ๋ชฉ(H1)๊ณผ ๋ฉํ ๋์คํฌ๋ฆฝ์ (Meta Description)์ ํต์ฌ ํค์๋๋ฅผ ๋ช ํํ๊ฒ ํฌํจํฉ๋๋ค.
- ์์ ๋ชฉ(H2, H3)์๋ ๋กฑํ
์ผ ํค์๋๋ฅผ ์ ๋ต์ ์ผ๋ก ๋ถ์ฐํ์ฌ ๋ค์ํ ์ ์
๊ฒฝ๋ก๋ฅผ ํ๋ณดํฉ๋๋ค. (์:
h3Core Web Vitals ๊ฐ์ ์ ์ํ HTML/CSS ์ฝ๋ฉ ํ/h3) - ๋ณธ๋ฌธ(p) ๋ด์์ ํค์๋๋ฅผ ์์ฐ์ค๋ฌ์ด ๋น๋๋ก ์ฌ์ฉํ๋, ์ค๋ณต(Keyword Stuffing)์ ํผํ๊ณ ์ ์ฌ ํค์๋๋ฅผ ํ์ฉํ์ฌ ์ ๋ณด์ ๊น์ด๋ฅผ ๋ํฉ๋๋ค.
2. ์ฝ๋ฉ์ ํตํ ๊ตฌ์กฐํ ๋ฐ์ดํฐ(Schema Markup) ์ ์ฉ
๊ตฌ์กฐํ ๋ฐ์ดํฐ(Structured Data)๋ ๊ฒ์์์ง์ด ์ฝํ ์ธ ๋ฅผ ๋์ฑ ์ ํํ๊ฒ ์ดํดํ๋๋ก ๋๊ธฐ ์ํด HTML ์ฝ๋์ ์ถ๊ฐํ๋ ํน์ ํ์์ ๋งํฌ์ ์ ๋๋ค. ์ด๋ฅผ ํตํด ๊ฒ์ ๊ฒฐ๊ณผ์ ๋ฆฌ์น ๊ฒฐ๊ณผ(Rich Snippets) ํํ๋ก ๋ ธ์ถ๋ ์ ์์ด ํด๋ฆญ๋ฅ (CTR)์ ํฅ์์ํฌ์ ์์ต๋๋ค.
๋ํ์ ์ธ ๊ตฌ์กฐํ ๋ฐ์ดํฐ ์ ํ:
Article(๊ธฐ์ฌ/๋ธ๋ก๊ทธ ํฌ์คํธ): ๊ธ์ ์ ๋ชฉ, ์ ์, ๊ฒ์์ผ ๋ฑ์ ์ ๋ณด๋ฅผ ๋ช ํํ ํฉ๋๋ค.FAQPage(์์ฃผ ๋ฌป๋ ์ง๋ฌธ): ๊ธ ๋ง๋ฏธ์ Q&A ์น์ ์ ์ ์ฉํ๋ฉด ๊ฒ์ ๊ฒฐ๊ณผ ํ์ด์ง์ ์ง๋ฌธ๊ณผ ๋ต๋ณ์ด ๋ฐ๋ก ๋ ธ์ถ๋ ์ ์์ต๋๋ค.BreadcrumbList(๊ฒฝ๋ก ํ์): ์ฌ์ดํธ ๋ด์์ ํ์ฌ ํ์ด์ง์ ์์น๋ฅผ ๊ฒ์ ๊ฒฐ๊ณผ์ ํ์ํ์ฌ ์ฌ์ฉ์์๊ฒ ๋ช ํํ ๋ด๋น๊ฒ์ด์ ์ ๋ณด๋ฅผ ์ ๊ณตํฉ๋๋ค.
์ ์ฉ ๋ฐฉ๋ฒ: JSON-LD ๋ฐฉ์์ ์ฌ์ฉํ์ฌ script type="application/ld+json".../script ํํ๋ก HTML head ๋๋ body ํ๊ทธ ๋ด์ ์ฝ์
ํฉ๋๋ค. ์ด๋ ์ฝ๋ฉ์ ๋ํ ๊ธฐ๋ณธ์ ์ธ ์ดํด๋ฅผ ์๊ตฌํฉ๋๋ค.
SEO ์ฝ๋ฉ์ ๊ถ๊ทน์ ํจ๊ณผ: ๋น์ฉ ํจ์จ์ ์ฑ์ฅ์ ๊ทน๋ํ
SEO ์ฝ๋ฉ ์ต์ ํ๋ ๋จ์ํ ๊ฒ์ ์์๋ฅผ ์ฌ๋ฆฌ๋ ๊ธฐ์ ์ ์์ ์ด ์๋๋ผ, ๋ธ๋ก๊ทธ ์ด์์ ๋น์ฉ ํจ์จ์ฑ์ ๊ทน๋ํํ๋ ์ฅ๊ธฐ์ ํฌ์์ ๋๋ค. ์ด๋ ์น์ดํ ์ ๋ณด์ ํ์ ์์์ ๋ธ๋ก๊ทธ๊ฐ ์ง์์ ์ผ๋ก ์ด์๋จ๊ธฐ ์ํ ์ต์ํ์ ๋ฐฉ์ ๋๋ค.
1. ํฌ๋กค๋ง ๋น์ฉ ์ ๊ฐ ๋ฐ ์์ฐ ํจ์จํ
๊ฒ์์์ง์ ํ์ ๋ ์์(ํฌ๋กค๋ง ์์ฐ)์ ์ฌ์ฉํ์ฌ ์น์ฌ์ดํธ๋ฅผ ํ์ํฉ๋๋ค. ๋ถํ์ํ ์ฝ๋๊ฐ ๋ง๊ฑฐ๋ ๋ก๋ฉ ์๋๊ฐ ๋๋ฆฐ ํ์ด์ง๋ ํฌ๋กค๋ฌ๊ฐ ์ ๋ณด๋ฅผ ์์งํ๋ ๋ฐ ๋ ๋ง์ ์๊ฐ์ ์๋ชจํ๊ฒ ๋ง๋ญ๋๋ค.
- ์ต์ ํ ํจ๊ณผ: HTML/CSS ์ฝ๋ฉ์ ์ต์ ํํ๊ณ ๊ฒฝ๋ํํ๋ฉด, ํฌ๋กค๋ฌ๋ ๋ ์ ์ ๋น์ฉ(์๊ฐ)์ผ๋ก ๋ ๋ง์ ํ์ด์ง๋ฅผ ํ์ํ ์ ์์ต๋๋ค. ์ด๋ ๊ณง ์๋ก์ด ๊ธ์ ์์ธ(Index) ์๋๋ฅผ ๋์ฌ ์ฝํ ์ธ ๋ ธ์ถ ์์ ์ ๋จ์ถ์ํค๋ ํจ๊ณผ๋ก ์ด์ด์ง๋๋ค.
robots.txt๋ฐsitemap.xmlํ์ฉ: ์ฝ๋ฉ ์ง์์ ํ์ฉํ์ฌ ์ด ํ์ผ๋ค์ ์ ํํ๊ฒ ์ค์ ํ๋ฉด, ๊ฒ์์์ง์ด ๋ถํ์ํ ํ์ด์ง๋ฅผ ํฌ๋กค๋งํ๋ ๊ฒ์ ๋ง๊ณ ํต์ฌ ์ฝํ ์ธ ์ ํฌ๋กค๋ง ์์ฐ์ ์ง์ค์ํฌ ์ ์์ต๋๋ค.
2. ์ ๋ฃ ๋ง์ผํ ๋น์ฉ ์ ๊ฐ ๋ฐ ROI ๊ทน๋ํ
SEO๋ฅผ ํตํด ์ป๋ ๊ฐ์ฅ ํฐ ์ฌ์ ์ ๊ธ์ ํจ๊ณผ๋ ๊ด๊ณ ๋น(SA, Search Advertisement)๋ ๋ง์ผํ ๋น์ฉ์ ๋ค์ด์ง ์๊ณ ๋ ๊ฒ์ ํ๋ซํผ ์์ฒด์ ํ์ผ๋ก ์ ์ฌ ๋ ์๋ฅผ ๊พธ์คํ ์ ์ ์ํฌ ์ ์๋ค๋ ์ ์ ๋๋ค.
- SEO ํธ๋ํฝ์ ํน์ง: ๊ฒ์ ์๋๊ฐ ๋ช ํํ ์ฌ์ฉ์๊ฐ ์ ์ ๋๋ฏ๋ก, ์ ์ ๋ ์์ ์ง์ด ๋๊ณ , ๊ตฌ๋ ์ด๋ ์ ํด ๋ง์ผํ ์ ํ์จ์ด ๋์์ง๋๋ค.
- ROI (Return On Investment) ๊ทน๋ํ: ์ง์์ ์ธ ๋ฌด์ ํธ๋ํฝ์ ์ป์ ์ ์์ผ๋ฏ๋ก ๋ธ๋ก๊ทธ ์ฑ์ฅ ๋ฐฉ์ ์ค ๊ฐ์ฅ ๋์ ํฌ์ ๋๋น ์์ต๋ฅ ์ ๋ณด์ฅํฉ๋๋ค.
| ์ฅ์ | ์์ธ ์ค๋ช (ํ์ฅ๋ ์ ๋ณด) | ์ฝ๋ฉ/SEO ์ญํ |
|---|---|---|
| ๊ฒ์ ๋ ธ์ถ ์ฆ๋ | ๋กฑํ ์ผ ํค์๋ ๊ธฐ๋ฐ์ ๋ช ํํ ๊ฒ์ ์๋ ์ถฉ์กฑ ๋ฐ ๋ค์ํ ์ ์ ๊ฒฝ๋ก ํ๋ณด. | H ํ๊ทธ ๊ณ์ธต ๊ตฌ์กฐ, ๊ตฌ์กฐํ ๋ฐ์ดํฐ, ๋ฉํ ํ๊ทธ ์ต์ ํ. |
| ์ฌ์ฉ์ ๊ฒฝํ ๊ฐ์ | Core Web Vitals ์งํ ๊ฐ์ ์ผ๋ก ๋ก๋ฉ ์๋, ์์ ์ฑ, ๋ฐ์ ์๋ ๊ทน๋ํ. | CSS ๊ฒฝ๋ํ, JS ๋น๋๊ธฐ ์ฒ๋ฆฌ, ์ด๋ฏธ์ง ํฌ๊ธฐ ๋ช ์. |
| ์ด์ ํจ์จ์ฑ | ํฌ๋กค๋ง ์์ฐ ์ ๊ฐ ๋ฐ ์๋ก์ด ์ฝํ ์ธ ์ ๋น ๋ฅธ ์์ธ ์ ๋. | robots.txt, sitemap.xml ์ค์ , ํด๋ฆฐ HTML ๊ตฌ์กฐ. |
| ์ฌ์ ์ ์ด๋ | ๊ด๊ณ ๋ฐ ๋ง์ผํ ๋น์ฉ ์ต์ํ ๋ฐ ๊ฒ์ ํธ๋ํฝ์ ๋์ ์ ํ์จ ํ๋ณด. | ์ฅ๊ธฐ์ ์ธ ์์ ๋ ธ์ถ์ ํตํ ์ง์ ๊ฐ๋ฅํ ์ฑ์ฅ ๊ธฐ๋ฐ ๊ตฌ์ถ. |
๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ ์ด์๋จ๋ ๋ฒ
๋ค์ด๋ฒ๊ฐ ์๋ ํฐ์คํ ๋ฆฌ, ์๋ํ๋ ์ค, ๊ตฌ๊ธ ๋ธ๋ก๊ทธ์ ๊ฐ์ ๊ฐ๋ฐฉํ ๋ธ๋ก๊ทธ๋ฅผ ์ด์ํ๋ฉฐ ์ฑ์ฅ์ ๊ฟ๊พผ๋ค๋ฉด SEO๋ ๋ ์ด์ ๋จ์ํ '์ ํ'์ด ์๋ ์์กด์ ์ํ ํ์ ์ ์ ์กฐ๊ฑด์ ๋๋ค.
์ด๋ฌํ ํ์ ์กฐ๊ฑด์ ๋ณต์กํ ๊ฐ๋ฐ์ ์์ค์ ์ฝ๋ฉ ์ง์์ ์๊ตฌํ๋ ๊ฒ์ด ์๋๋๋ค. ํต์ฌ์ ๋ด ์ฝํ ์ธ ๋ฅผ ๊ฒ์ ์์ง์ ๊ฐ์ฅ ์น์ ํ๊ฒ ์๋ดํ๋ ์ต์ํ์ HTML/CSS ๊ตฌ์กฐ๋ฅผ ์ตํ๊ณ , ์ด๋ฅผ ํตํด ์ฌ์ฉ์์๊ฒ ์ต์์ ๊ฒฝํ์ ์ ๊ณตํ๋ ์ ๋ต์ ์น ๋ง์คํฐ์ ๋ง์ธ๋๋ฅผ ๊ฐ์ถ๋ ๊ฒ์ ๋๋ค.
์์ง๋ ๋ธ๋ก๊ทธ ์คํจ ํธ์ง ํ๋ฉด์ด๋ HTML ์ฝ๋๊ฐ ๋๋ ค์์ผ๋ก ๋ค๊ฐ์จ๋ค๋ฉด, ์ง๊ธ์ด๋ผ๋ ํ๋ซํผ ์ด์ ์ ๊ณ ๋ คํ๋ ๊ฒ์ด ํ๋ช ํ ์ ์์ต๋๋ค. ํ์ง๋ง ๊ธ๋ก๋ฒ ๋ ์ ์ ์ ๊ณผ ์ง์ ๊ฐ๋ฅํ ์ฑ์ฅ์ด๋ผ๋ ์ด๋งค๋ฅผ ์ํ๋ค๋ฉด, ์ค๋๋ถํฐ ๋ธ๋ก๊ทธ์ HTML ๊ตฌ์กฐ๋ฅผ ๋ค์ฌ๋ค๋ณด๋ ์์ ์ฉ๊ธฐ๊ฐ ํ์ํฉ๋๋ค.
๊ทธ ์ฉ๊ธฐ๋ ๊ณง ๋น์ ์ ๋ธ๋ก๊ทธ๋ฅผ ๊ฒฝ์์ด ์น์ดํ ๊ฒ์ ๊ฒฐ๊ณผ ํ์ด์ง์์ ๊ฐ์ฅ ๋น ๋ฅด๊ณ ์ ํํ ์ ๋ณด์์ผ๋ก ๋ง๋ค์ด, ๊ถ๊ทน์ ์ผ๋ก ๊ฒ์ ๊ฒฐ๊ณผ ์ต์๋จ์ผ๋ก ์ด๋ ์ ์๋ ๊ฐ์ฅ ๊ธฐ๋ณธ์ ์ด๋ฉฐ ๊ฐ๋ ฅํ ์์
์ด ๋ ๊ฒ์
๋๋ค. ์ง๊ธ ๋ฐ๋ก ๋ธ๋ก๊ทธ ์ค์ ์ HTML/CSS ํธ์ง ๊ธฐ๋ฅ์ ์ด๊ณ , ๊ฐ์ฅ ๋จผ์ H1 ํ๊ทธ๊ฐ ํ๋์ธ์ง, ์ด๋ฏธ์ง ํ๊ทธ์ width์ height๊ฐ ๋ช
์๋์ด ์๋์ง ํ์ธํ๋ ๊ฒ๋ถํฐ ์์ํ์ญ์์ค.
FAQ: SEO์ ์ฝ๋ฉ ๊ด๋ จ ์์ฃผ ๋ฌป๋ ์ง๋ฌธ
Q1. HTML/CSS ์ฝ๋ฉ์ ๋ชจ๋ฅด๋๋ฐ, ์๋ํ๋ ์ค ํ๋ฌ๊ทธ์ธ(Yoast, Rank Math ๋ฑ)๋ง ์ฌ์ฉํด๋ ์ถฉ๋ถํ๊ฐ์?
ํ๋ฌ๊ทธ์ธ์ ์ฝํ ์ธ SEO(Content SEO)์ ๊ธฐ์ ์ SEO์ ๊ธฐ๋ณธ์ ์ธ ๋ฉํ ํ๊ทธ ์ค์ ์ ์ฝ๊ฒ ํด์ฃผ๋ ๊ฐ๋ ฅํ ๋๊ตฌ์ด์ง๋ง, Core Web Vitals(CWV)์ ๊ฐ์ ํ์ด์ง ์ฑ๋ฅ ์ต์ ํ์๋ ํ๊ณ๊ฐ ์์ต๋๋ค. CWV ๊ฐ์ ์ ํ ๋ง์ ๋นํจ์จ์ ์ธ CSS/JS ๊ตฌ์กฐ๋ฅผ ์ต์ ํํ๊ฑฐ๋ ๊ด๊ณ /์์ ฏ ๋ก๋ฉ ๋ฐฉ์์ ์์ ํ๋ ์คํจ/ํ ๋ง ์ฝ๋ฉ ์์ ์ด ํ์์ ์ ๋๋ค. ์ฆ, ์ฝ๋ฉ ์ง์์ด ์๋ค๋ฉด ํ๋ฌ๊ทธ์ธ๋ง์ผ๋ก๋ ์ต์์๊ถ ๊ฒฝ์๋ ฅ์ ํ๋ณดํ๊ธฐ ์ด๋ ต์ต๋๋ค.
Q2. SEO ์ต์ ํ์ ์ฌ์ฉ๋๋ ์ฝ๋ฉ์ ์ด๋ ์์ค๊น์ง ๋ฐฐ์์ผ ํ๋์?
์ ๋ฌธ์ ์ธ ์น ๊ฐ๋ฐ์ ์์ค์ด ์๋, 'ํ๋ก ํธ์๋ ๊ฐ๋ฐ ์ ๋ฌธ' ์์ค์ด๋ฉด ์ถฉ๋ถํฉ๋๋ค. ํต์ฌ์ ๋ค์ ์ธ ๊ฐ์ง๋ฅผ ์ดํดํ๋ ๊ฒ์ ๋๋ค.
- HTML: ์๋งจํฑ ํ๊ทธ(H1, H2, article, section), ์ด๋ฏธ์ง(alt, width/height), ๊ตฌ์กฐํ ๋ฐ์ดํฐ(JSON-LD์ ๊ฐ๋ )์ ์๋ฏธ์ ์ ํํ ์ฌ์ฉ๋ฒ.
- CSS: ๋ ์ด์์ ์์ ์ฑ์ ์ํ
min-height์ง์ , ๋ถํ์ํ ์คํ์ผ ์ ๊ฑฐ, ๋ฏธ๋์ด ์ฟผ๋ฆฌ(๋ฐ์ํ ์น์ ๊ธฐ๋ณธ)์ ๊ฐ๋ . - JavaScript:
defer,async์์ฑ์ ์ด์ฉํ ์ง์ฐ ๋ก๋ฉ์ ๊ฐ๋ ๊ณผ, ๊ณผ๋ํ ์ธ๋ถ ์คํฌ๋ฆฝํธ๊ฐ ๋ฉ์ธ ์ค๋ ๋์ ๋ฏธ์น๋ ์ํฅ ์ดํด.
Q3. Core Web Vitals ๊ฐ์ ์ด ๊ฒ์ ์์ ์์น์ ์ง์ ์ ์ธ ์ํฅ์ ์ฃผ๋์?
๋ค, ๊ตฌ๊ธ์ CWV๋ฅผ ํ์ด์ง ๊ฒฝํ(Page Experience) ์์์ ํต์ฌ์ผ๋ก ๊ณต์ ์ธ์ ํ๊ณ ์์ต๋๋ค. CWV ์ ์๊ฐ ์ข๋ค๋ ๊ฒ์ ์ฌ์ฉ์๊ฐ ํ์ด์ง๋ฅผ ์ดํํ ๊ฐ๋ฅ์ฑ์ด ๋ฎ๋ค๋ ๊ฒ์ ์๋ฏธํ๋ฉฐ, ๊ตฌ๊ธ์ ์ฌ์ฉ์ ๋ง์กฑ๋๊ฐ ๋์ ํ์ด์ง์ ๊ฐ์ฐ์ ์ ๋ถ์ฌํฉ๋๋ค. ๋ค๋ง, CWV๊ฐ ์ฝํ ์ธ ํ์ง๋ณด๋ค ์ฐ์ ํ๋ ๊ฒ์ ์๋๋ฏ๋ก, ์์ง์ ์ฝํ ์ธ ์ ์ฐ์ํ CWV ์ ์๊ฐ ๊ฒฐํฉ๋ ๋ ์ต์์ ์๋์ง๋ฅผ ๋ฐํํ์ฌ ๊ฒ์ ์์ ์์น์ ๊ธ์ ์ ์ธ ์ํฅ์ ์ค๋๋ค.