Notice
Recent Posts
Recent Comments
Link
반응형
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 31 |
Tags
- Robo3T 글씨체 변경
- findIndex()
- ...점점점문법
- 객체의 밸류값만 찾기
- ubuntu타임존
- 문자열 인터폴레이션
- Robo3T 폰트 키우기
- 프론트엔드 스쿨
- 5.3.8 Modifying Queries
- lastIndexOf()
- indexOf()
- sql like연산자
- sql 문자열 패턴 검색
- search()
- 스프링 데이타 JPA
- 가상컴퓨터마법사
- 시퀄 문법
- 레디스 확인
- 객체를 배열로
- @Moditying @Query
- Robo3T 폰트변경
- 배열을 객체로
- ${변수}
- 리엑트블로거
- js 문자열을 문자배열로
- 객체의키값만 찾기
- Robo3T 글씨키우기
- 깃 토큰 만료
- 우분투 시간 변경
- 코딩 어?
Archives
- Today
- Total
코딩기록
HTML5 시멘틱 태그와 웹 표준을 지키는 이유 본문
728x90
' 시맨틱(semantic) ' - 의미의, 의미론적인
시맨틱 태그란 의미를 가진 html 태그란 뜻이다. <div>, <span> 같은 태그보단 <article>, <select>와 같은 특정 의미를 지닌 태그를 뜻한다.
' 웹 표준 ' - 웹 표준은 월드 와이드 웹(W3C)의 측면을 서술하고 정의하는 공식 표준이나 다른 기술 규격을 가리키는 일반적인 용어
HTML5 시멘틱 태그와 웹 표준을 지키는 이유
- HTML 문서의 가독성과 유지보수
- <header>, <nav>, <main>, <article>, <section>, <aside>, <footer> ... 등의 태그만 보더라도 어떤 내용을 담고 있는지 알 수 있으므로 문서의 가독성과 유지보수가 용이해진다.
- SEO
- 시맨틱 태그를 사용하면 검색 엔진은 콘텐츠의 의미를 더 잘 이해할 수 있는데, 이는 웹 페이지가 더 높은 순위로 나타날 수 있도록 도와준다.
- 웹 접근성 - ' 스크린 리더 '
- 음성으로 웹페이지를 읽을 수 있다.
- 크로스 플랫폼 호환성
- 웹 표준을 준수하면 다양한 브라우저와 기기에서 일관된 방식으로 웹 페이지가 표시될 수 있다.
시맨틱 태그를 사용하고 웹 표준을 치킴으로써 개발자들은 유지보수가 용이해지고 더 효율적이고 접근성 높은 웹 사이트를 만들 수 있고 사용자는 신체적, 환경적 제약 없이 다양한 디바이스와 환경에서 일관된 경험을 얻을 수 있다.
반응형
'프론트' 카테고리의 다른 글
css, scss)@mixin- 반복적인 scss를 함수처럼! 한줄로 말줄임, 텍스트 줄임 ... 표시 (0) | 2024.06.22 |
---|---|
css) a태그안에 img를 tab으로 접근시( :focus효과 ) 테두리 변경은 tabindex="0" !! / tab순서 정하는 방법 / 웹접근성 / 스크린리더 (0) | 2024.06.21 |
내가 가고 싶은 회사 (0) | 2024.06.12 |
리액트)1주차 학습 - SASS(SCSS 싸스) (0) | 2024.06.07 |
내가 생각하는 프론트엔드 개발이란? (0) | 2024.06.04 |
Comments