HTML

<시맨틱 태그>

- 검색엔진 최적화

- 웹접근성(음성, 키보드로도 웹사이트 접근 용이하도록)

- 직관성, 유지보수성

 

<header> 브랜드, 로고

<nav> 메뉴

 

<main> 주요 내용

<article> 독립적으로 고유한 정보를 사용할 때

<section> ariticle 안 / main 안에서 - 서로 연관 있는 내용들을 묶어주고 싶을 때

<aside>

 

<footer> 회사, 웹사이트에 대한 정보

 

<em> 강조하는 이탤릭체

<i> 시각적 이탤릭체

 

<strong> 정말 중요한 볼드체

<b> 시각적 볼드체

 

<ol> 순서가 있는 목록

<ul> 순서가 없는 목록

<dl> <dt> <dd> 단어, 설명을 나타낼 수 있음(정의, 설명 목록)

 

<button> 특정한 액션 시

<a> 어디론가 이동할 시

 

<table> 행*열 데이터

 

<hr> 수평선

 

<span></span> 태그는 <div></div> 태그처럼 특별한 기능을 갖고있지 않고, CSS와 함께 쓰인다.

<div> 태그와의 차이점은 display속성이 block이 아닌, inline이라는 점인데, 이는 CSS display 항목에서 세부 정보를 알 수 있다.
이 둘의 차이를 쉽게 설명하자면, <div>는 줄 바꿈이 되지만, <span>은 줄 바꿈이 되지 않다는 점이다.

 

#MDN 사이트에서 찾아보는 것이 가장 좋은 공부방법임을 잊지말자

 

The W3C Markup Validation Service - HTML 유효성 검사를 실행할 수 있는 서비스