๋ฉํ ํ๊ทธ๋ ์นํ์ด์ง์ HTML ๊ตฌ์กฐ์์ ์ค์ํ ์ญํ ์ ํ๋ ์์์
๋๋ค. ์ด ํ๊ทธ๋ ํ์ด์ง์ ๋ํ ํต์ฌ ์ ๋ณด๋ฅผ ์ ๊ณตํ๋ฉฐ, ๊ฒ์ ์์ง ์ต์ ํ(SEO)์ ์ฌ์ฉ์ ๊ฒฝํ ํฅ์์ ํฌ๊ฒ ๊ธฐ์ฌํฉ๋๋ค.
๋ฉํ ํ๊ทธ์ ๊ธฐ๋ณธ ๊ฐ๋
๋ฉํ ํ๊ทธ๋ HTML ๋ฌธ์์ head ์น์
์ ์์นํ๋ฉฐ, ํ์ด์ง ์์ฒด์๋ ํ์๋์ง ์์ต๋๋ค. ์ด ํ๊ทธ๋ ์นํ์ด์ง์ ๋ํ ๋ฉํ๋ฐ์ดํฐ, ์ฆ ํ์ด์ง์ ํน์ฑ์ด๋ ๋ด์ฉ์ ๊ดํ ์ ๋ณด๋ฅผ ๋ด๊ณ ์์ต๋๋ค.
์ฃผ์ ๋ฉํ ํ๊ทธ ์ ํ
1. ๋ฉํ ํ์ดํ (Title)
๋ฉํ ํ์ดํ์ ํ์ด์ง์ ์ ๋ชฉ์ ๋ํ๋ด๋ฉฐ, SEO์ ๋งค์ฐ ์ค์ํ ์ญํ ์ ํฉ๋๋ค. ์ด๋ ๊ฒ์ ๊ฒฐ๊ณผ ํ์ด์ง์์ ๋งํฌ ํ
์คํธ๋ก ํ์๋๋ฉฐ, ์ฌ์ฉ์์ ํด๋ฆญ๋ฅ (CTR)์ ์ง์ ์ ์ธ ์ํฅ์ ๋ฏธ์นฉ๋๋ค.
2. ๋ฉํ ๋์คํฌ๋ฆฝ์
(Description)
ํ์ด์ง ๋ด์ฉ์ ๊ฐ๋ตํ๊ฒ ์์ฝํ๋ ํ๊ทธ๋ก, ๊ฒ์ ๊ฒฐ๊ณผ์์ ํ์ดํ ์๋์ ํ์๋ฉ๋๋ค. ํจ๊ณผ์ ์ธ ๋ฉํ ๋์คํฌ๋ฆฝ์
์ ์ฌ์ฉ์์ ํด๋ฆญ์ ์ ๋ํ๋ ๋ฐ ์ค์ํ ์ญํ ์ ํฉ๋๋ค.
3. ๋ฉํ ํค์๋ (Keywords)
๊ณผ๊ฑฐ์๋ SEO์ ์ค์ํ์ง๋ง, ํ์ฌ๋ ๊ทธ ์ค์์ฑ์ด ๋ง์ด ๊ฐ์ํ์ต๋๋ค. ๊ทธ๋ฌ๋ ์ผ๋ถ ๊ฒ์ ์์ง์์๋ ์ฌ์ ํ ์ฐธ๊ณ ํ ์ ์์ต๋๋ค.
4. ๊ธฐํ ๋ฉํ ํ๊ทธ
charset: ๋ฌธ์์ ๋ฌธ์ ์ธ์ฝ๋ฉ์ ์ง์
viewport: ๋ชจ๋ฐ์ผ ๊ธฐ๊ธฐ์์์ ํ์ด์ง ๋ ๋๋ง ๋ฐฉ์ ์ค์
robots: ๊ฒ์ ์์ง ํฌ๋กค๋ฌ์ ํ๋ ์ง์
๋ฉํ ํ๊ทธ์ ์ค์์ฑ
1. ๊ฒ์ ์์ง ์ต์ ํ(SEO): ๋ฉํ ํ๊ทธ๋ ๊ฒ์ ์์ง์ด ํ์ด์ง ๋ด์ฉ์ ์ดํดํ๊ณ ์ ์ ํ ์ธ๋ฑ์ฑํ๋ ๋ฐ ๋์์ ์ค๋๋ค.
2. ์ฌ์ฉ์ ๊ฒฝํ ํฅ์: ๊ฒ์ ๊ฒฐ๊ณผ์์ ์ ํํ๊ณ ๋งค๋ ฅ์ ์ธ ์ ๋ณด๋ฅผ ์ ๊ณตํจ์ผ๋ก์จ ์ฌ์ฉ์์ ํด๋ฆญ๋ฅ ์ ๋์ผ ์ ์์ต๋๋ค.
3. ์์
๋ฏธ๋์ด ์ต์ ํ: Open Graph์ ๊ฐ์ ํน์ ๋ฉํ ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ฌ ์์
๋ฏธ๋์ด์์ ๊ณต์ ๋ ๋ ํ์ด์ง๊ฐ ์ด๋ป๊ฒ ํ์๋ ์ง ์ ์ดํ ์ ์์ต๋๋ค.
4. ๋ชจ๋ฐ์ผ ์ต์ ํ: viewport ๋ฉํ ํ๊ทธ๋ฅผ ํตํด ๋ชจ๋ฐ์ผ ๊ธฐ๊ธฐ์์์ ํ์ด์ง ํ์ ๋ฐฉ์์ ์ต์ ํํ ์ ์์ต๋๋ค.
๋ฉํ ํ๊ทธ ์์ฑ ํ
1. ๊ฐ ํ์ด์ง๋ง๋ค ๊ณ ์ ํ๊ณ ๊ด๋ จ์ฑ ์๋ ๋ฉํ ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ธ์.
2. ๋ฉํ ํ์ดํ์ 60์ ์ด๋ด, ๋ฉํ ๋์คํฌ๋ฆฝ์
์ 160์ ์ด๋ด๋ก ์์ฑํ๋ ๊ฒ์ด ์ข์ต๋๋ค.
3. ํต์ฌ ํค์๋๋ฅผ ์์ฐ์ค๋ฝ๊ฒ ํฌํจ์ํค๋, ๊ณผ๋ํ ์ฌ์ฉ์ ํผํ์ธ์.
4. ์ฌ์ฉ์์ ๊ด์ฌ์ ๋ ์ ์๋ ๋งค๋ ฅ์ ์ธ ๋ฌธ๊ตฌ๋ฅผ ์ฌ์ฉํ์ธ์.
๋ฉํ ํ๊ทธ๋ SEO(๊ฒ์ ์์ง ์ต์ ํ)์ ์ค์ํ ์ํฅ์ ๋ฏธ์นฉ๋๋ค.
์ฃผ์ ์ํฅ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค:
1. ๊ฒ์ ๊ฒฐ๊ณผ ํ์ ๊ฐ์
๋ฉํ ํ์ดํ๊ณผ ๋ฉํ ๋์คํฌ๋ฆฝ์
์ ๊ฒ์ ๊ฒฐ๊ณผ ํ์ด์ง์ ์ง์ ํ์๋์ด ์ฌ์ฉ์์ ํด๋ฆญ๋ฅ (CTR)์ ์ํฅ์ ์ค๋๋ค.
๊ด๋ จ์ฑ ์๊ณ ๋งค๋ ฅ์ ์ธ ํ์ดํ๊ณผ ์ค๋ช
์ ๋ ๋ง์ ํด๋ฆญ์ ์ ๋ํ ์ ์์ต๋๋ค.
2. ํ์ด์ง ์ฃผ์ ๋ฐ ๋ด์ฉ ์ ๋ฌ
๋ฉํ ํ๊ทธ๋ฅผ ํตํด ๊ฒ์ ์์ง์ ํ์ด์ง์ ์ฃผ์ ์ ๋ด์ฉ์ ๋ช
ํํ ์ ๋ฌํ ์ ์์ต๋๋ค.
์ด๋ ๊ฒ์ ์์ง์ด ํ์ด์ง๋ฅผ ์ ์ ํ ์ธ๋ฑ์ฑํ๊ณ ๊ด๋ จ ๊ฒ์์ด์ ๋
ธ์ถ์ํค๋ ๋ฐ ๋์์ด ๋ฉ๋๋ค.
3. ํค์๋ ์ต์ ํ
๋ฉํ ํ๊ทธ์ ํต์ฌ ํค์๋๋ฅผ ํฌํจ์์ผ ๊ฒ์ ์์ง์ด ํ์ด์ง์ ์ฃผ์ ๋ฅผ ์ดํดํ๋๋ก ๋์ต๋๋ค.
๋จ, ๊ณผ๋ํ ํค์๋ ์ฌ์ฉ์ ์คํธ์ผ๋ก ๊ฐ์ฃผ๋ ์ ์์ด ์ฃผ์๊ฐ ํ์ํฉ๋๋ค.
4. ๋ชจ๋ฐ์ผ ์ต์ ํ
viewport ๋ฉํ ํ๊ทธ๋ฅผ ํตํด ๋ชจ๋ฐ์ผ ๊ธฐ๊ธฐ์์์ ํ์๋ฅผ ์ต์ ํํ ์ ์์ต๋๋ค.
5. ์์
๋ฏธ๋์ด ์ต์ ํ
Open Graph ๋ฉํ ํ๊ทธ๋ก ์์
๋ฏธ๋์ด ๊ณต์ ์ ํ์ด์ง ํ์๋ฅผ ์ ์ดํ ์ ์์ต๋๋ค.
6. ๊ฒ์ ์์ง ํฌ๋กค๋ง ์ ์ด
robots ๋ฉํ ํ๊ทธ๋ก ๊ฒ์ ์์ง์ ํฌ๋กค๋ง ๋ฐ ์ธ๋ฑ์ฑ ๋ฐฉ์์ ์ง์ ํ ์ ์์ต๋๋ค.