[HTML] Semantic.

2022. 3. 9. 23:31

Semantic ์ด๋ž€

HTML5์˜ ๊ฐ€์žฅ ํฐ ํŠน์ง• ์ค‘ ํ•˜๋‚˜๋กœ, ์‚ฌ์ „์ ์ธ ์˜๋ฏธ๋กœ๋Š” '์˜๋ฏธ๊ฐ€ ํ†ตํ•˜๋Š”' ์ด๋ผ๊ณ  ํ•  ์ˆ˜ ์žˆ๋‹ค.

์‚ฌ์ „์  ์˜๋ฏธ์™€ ๊ฐ™์ด ํŠน์ • tag๋กœ ํ•ด๋‹น tag๊ฐ€ ์–ด๋–ค ์˜๋ฏธ๋ฅผ ๊ฐ–๋Š”์ง€ ์•Œ ์ˆ˜ ์žˆ๊ฒŒ ํ•˜๋Š” ๋ฐฉ์‹์„ ๋งํ•œ๋‹ค.

์ด ๋ฐฉ์‹์„ ํ†ตํ•ด ๊ธฐ๊ณ„๊ฐ€ ์‰ฝ๊ฒŒ ํ•ด์„ํ•˜๊ณ  ๋ถ„์„ ํ•  ์ˆ˜ ์žˆ๊ฒŒ๋˜์–ด, ์›น์‚ฌ์ดํŠธ๋ฅผ ๊ฒ€์ƒ‰์—”์ง„์ด ์ข€ ๋” ๋น ๋ฅด๊ฒŒ ๊ฒ€์ƒ‰ํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•œ๋‹ค.

 

Semantic tag ์ข…๋ฅ˜

tag ์„ค๋ช…
<header> ํ—ค๋”(๋จธ๋ฆฌ๋ง) ์ง€์ •.
<nav> ๋ฌธ์„œ ๊ฐ„์˜ ๋„ค๋น„๊ฒŒ์ด์…˜(์ƒ๋‹จ ๋ฉ”๋‰ด) ์ง€์ •.
<aside> ๋ณธ๋ฌธ ์ด์™ธ์˜ ๋‚ด์šฉ ํ‘œ์‹œ.
<section> ๋ณธ๋ฌธ์˜ ์—ฌ๋Ÿฌ ๋‚ด์šฉ(article)์„ ํฌํ•จ.
<article> ๋ณธ๋ฌธ์˜ ์ฃผ ๋‚ด์šฉ์„ ํฌํ•จ
<footer> ์ œ์ž‘์ •๋ณด์™€ ์ €์ž‘๊ถŒ ํ‘œ์‹œ๋“ฑ ํฌํ•จ.

 

HTML5 ๊ตฌ์กฐ

728x90

'HTML,CSS,JavaScript' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

[JS] Promise  (0) 2022.05.04
[CSS] ์„ ํƒ์ž  (0) 2022.03.09
[HTML] <img>, <a> ํƒœ๊ทธ  (0) 2022.03.03
[HTML] <ul>, <ol> ๋ชฉ๋กํ˜• ํƒœ๊ทธ  (0) 2022.03.03

BELATED ARTICLES

more