티스토리 뷰

프론트엔드 깍두기/HTML5 조각

DAY03

최삐뚤빼뚤씨 2024. 7. 17. 20:14

시멘틱 태그(semantic tag)

- 의미가 있는 태그들로, html 문서 내의 가독성 개선과

외부 검색 엔진(SEO)에도 내 문서 내의 어떤 부분이 메인인지 보여줄 수 있도록

최적화 시켜줄 수 있는 부분을 담당한다.

또한 개발자의 유지보수 및 웹페이지를 시각적이 아니라, 음성으로 읽어주는

'스크린리더'를 이용하거나 웹 접근성에 유용하다.

 

시멘틱 태그의 종류

- header: 상단, 헤더를 의미한다.

- nav: 메뉴, 내비게이션을 의미한다.

- section: 여러 중심 내용을 감싸는 공간을 의미한다.

- main: 내용의 중심을 의미한다.

- article: 글자가 많이 들어간 부분을 의미한다.

- aside: 사이드에 위치하는 공간을 의미한다.

- footer: 하단, 푸터를 의미한다.

 

form 태그

- 폼은 사용자가 웹사이트에 데이터를 전송해주기도 하며

이 밖에도 웹페이지가 입력 데이터를 사용하기 위하여 사용할 수도 있다.

 

1. 속성(Attribute)이란?

- 태그에 추가로 정보를 제공하거나 태그의 동작이나 표현을 제어할 수 있도록 지정해주는 설정값

 

2. 속성의 사용 방법

- 속성명="속성값"

 

3. 표기법(Case)

- 카멜 표기법 : 낙타의 등을 본따 만든 표기법. clickToIncrease (Java, JavaScript)

- 케밥 표기법 : click-to-increase (html, css)

- 파스칼 표기법 : ClickToIncrease (Java의 클래스명&함수명, python의 클래스명)

- 스네이크 표기법 : click_to_increase (python)

 

공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/11   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
글 보관함