[web] 웹 표준과 접근성

웹 표준이란 W3C(World Wide Web Consortium)에서 권고하는 ‘웹에서 표준적으로 사용되는 기술이나 규칙’
출처: 코드스테이츠 자료

세상엔 다양한 웹 브라우저가 있고, 다른 웹 브라우저를 사용하더라도 같은 웹 사이트를 정상적으로 이용할 수 있도록 해야 한다. 웹 표준을 지켜 코드를 작성하면 최신 웹 브라우저들에서는 모두 웹 표준을 지원해주기 때문에 코드의 유지보수가 편리하고, 웹 호환성이 좋아진다. 또한 웹 표준에서 검색 효율성과 같은 내용도 제공하므로 html 태그 등을 적절하게 사용하여 검색 우선순위도 높이고 그에 따른 웹 접근성 향상에도 도움이 된다. 

 

크로스 브라우징(Cross Browsing)

이렇게 어떤 브라우저를 사용하든 같은 웹 사이트에 접근하여 동등한 화면과 기능을 제공받을 수 있도록 하는 것을 크로스 브라우징(Cross Browsing)이라고 한다. 브라우저마다 엔진이 다르기 때문에 완벽하게 같은(동일한) 사용을 할 수는 없지만, 같은 수준으로(동등한) 사용할 수 있다. 실제로 크로스 브라우징을 제공하는 사이트들의 경우 다른 브라우저로 접속하더라도 약간의 브라우저 사용법에 차이가 있을 뿐 거의 똑같이 웹 사이트를 이용할 수 있다. 

2022년 사라진 인터넷 익스플로러의 경우, 인터넷 익스플로러를 기준으로 만들어진 사이트를 다른 브라우저에서 사용할 수 없는 경우가 많았는데, 최신 스펙의 CSS, JavaScript 를 지원하지 않았고, ActiveX라는 인터넷 익스플로러 특유의 플러그인을 사용했기 때문에 다른 브라우저와의 코드 호환(크로스 브라우징)이 어려웠던 것이라고 한다.

 

Semantic HTML

특히 검색 효율성 증가 등의 이유로 적절한 의미를 포함하는 요소로 html을 작성하여 의미있는 html을 만드는 것을 Semantic HTML이라고 한다. 여기서 말하는 '의미를 포함하는 요소' 란 <div>, <span> 처럼 의미를 파악하기 어려운 태그가 아닌 <header>, <nav>, <main>,<article>,<footer> 등 보는 순간 바로 이 구조가 무엇을 시사하는지 알 수 있는 태그를 사용해 화면을 구성하는 것이다. 이러한 의미를 가진 태그는 개발자간의 소통을 원활하게 해 줄 뿐더러, 검색 엔진이 문서의 중요도와 우선순위를 파악할 수 있도록 하여 검색 효율성 증가에 도움을 준다. 또한 시각장애 등 신체적 문제로 컴퓨터를 사용하기 어려운 분들이나, 운전 등 컴퓨터를 사용할 수 없는 상황에 놓인 비장애인 분들이 도움을 받을 수 있는 확장 프로그램 스크린 리더 등의 보조장치가, 화면의 구조를 더욱 쉽게 파악하고 필요한 정보만 이용자에게 전달하게끔 해 웹 접근성을 높인다.

 

SEO(Search Engine Optimization, 검색 엔진 최적화)

On-Page SEO

페이지 내부에서 html을 적절하게 사용해 검색 노출 순위를 올리는 것

 

Off-Page SEO

페이지 외부에서 광고, 홍보, 백링크 등을 이용해 검색 노출 순위를 올리는 것

 

 

---

이 글은 코드스테이츠 블로깅 과제로, 배운 것을 정리한 글입니다.

 

 

참고자료

• 코드스테이츠 자료