늘 겸손하게

Frontend - 웹 표준 (Web Standards) 본문

Programming/Frontend

Frontend - 웹 표준 (Web Standards)

besforyou999 2022. 8. 5. 19:49

웹 표준 

 

브라우저의 종류와 버전이 다르더라도 호환이 되도록 제시한 표준

 

다른 기종 혹은 플랫폼에 따라 다르게 구현되는 기술을 동일하게 구현하도록 하여 특정 기종이나 플랫폼에 치우쳐지지 않도록 공통요소를 사용하여 웹을 개발하는 것을 말한다.

 

표준화 단체인 W3C(World Wide Consortium)가 권고한 표준안에 따라 웹 사이트를 작성할 때 이용하는 HTML, CSS, JavaScript 등에 대한 규정을 담고 있다.

 

웹 표준의 궁극적인 목표는 사용자가 다른 플랫폼 혹은 OS를 통해 웹 사이트를 접속하더라도 같은 사이트를 볼 수 있도록 하는것이다.

 

 

웹 표준 준수 이유

 

웹 표준을 준수하지 않을 경우 장애인, 노약자를 포함한 모든 사용자들이 웹 사이트에 접근하는데 제약이 발생 가능하므로 어떠한 OS나 브라우저를 사용하더라도 웹 사이트에 접속할 수 있도록 웹 표준을 준수해야 함.

 

 

웹 표준의 장점

 

1. 수정 및 운영관리 용이

 

    콘텐츠 구조화, CSS 시각표현 통일하여 페이지 수정, 관리 용이

 

2. 접근성 향상

 

    웹 표준을 통해 다양한 브라우저, OS에서도 웹 사이트에 접근 가능하여 접근성이 용이해짐

 

3. 검색 엔진 최적화 (SEO)

 

    구조화된 웹 페이지는 검색 엔진에 더 잘 노출될 수 있도록 최적화됨

 

4. File Size 축소, 서버 저장 공간 절약

 

    효율적인 소스 작성은 파일 크기와 서버 공간 절약

 

5. 효율적인 마크업

 

    CSS와 HTML 문서를 분리하여 제작할 경우 불필요한 마크업이 최소화되어 페이지 로딩속도 향상

 

6. 호환성 가능

 

    기존 IE 브라우저에서만 작동이 가능했던 요소들이 웹 표준을 준수함으로써 다양한 브라우저에서도 작동

 

웹 표준의 기술

 

 

 

HTML

 

HTML은 'HyperText Markup Language'의 약자로 웹 페이지의 구조가 되는 언어입니다.

 

 

XML

 

XML은 'eXtensible Markup Language'의 약자로 HTML과 매우 비슷한 문자 기반의 마크업 언어입니다. 사람과 기계가 동시에 읽기 편한 구조로 되어 있습니다. 

 

XML은 데이터를 저장하고 전달할 목적으로만 만들어졌습니다.

 

XML 태그는 사용자가 직접 정의할 수 있습니다.

 

 

CSS

 

'Cascading Style Sheets'의 약자로 웹 페이지의 스타일을 지정할 때 사용하는 언어입니다. HTML이나 XML과 같이 사용하여 요소들이 화면에 어떻게 배치되어야 하는지 지정할 수 있습니다.

 

 

DOM

 

'Document Object Model'의 약자로 HTML을 파싱 하여 사용자가 이해하기 편하도록 트리 구조로 구조화한 모델입니다.

 

 

ECMAScript 

 

Ecma International이 ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어

JavaScript 는 ECMAScript 사양을 따르는 스크립트 언어입니다

 

 

 

[ 출처 ]

http://www.tcpschool.com/xml/xml_intro_basic

https://wormwlrm.github.io/2018/10/03/What-is-the-difference-between-javascript-and-ecmascript.html

https://www.ecma-international.org/publications-and-standards/standards/ecma-262/

https://inpa.tistory.com/entry/WEB-%F0%9F%93%9A-%EC%9B%B9-%ED%91%9C%EC%A4%80%EC%9D%98-%EC%9D%B4%ED%95%B4#recentComments