[HTML] 레이아웃의 종류와 크로스 브라우징, 웹 표준

웹 사이트 레이아웃의 종류

가. 정적 레이아웃

• 공간의 크기가 변하지 않는 고정 레이아웃
• 적응형이나 반응형 레이아웃이 등장 전까지 가장 많이 사용된 레이아웃
• 공간의 크기가 고정되어 브라우저 너비를 줄이면 가로 스크롤이 나타남
• 다양한 기기에서 접근했을 때 콘텐츠가 잘리거나 작게 출력되는 문제 발생

나. 동적 레이아웃

• 브라우저 너비와 상관없이 화면에 콘텐츠가 꽉 채워지도록 제작하는 방식
• 브라우저 너비를 늘렸을 때 일부 콘텐츠가 가로로 길게 나열되거나 줄였을 때 세로로 길게 나열되어 전체 레이아웃이 틀어지는 문제 발생

다. 적응형 레이아웃

• 브라우저 너비에 따라 레이아웃이 변경되는 방식
• 다양한 기기 화면을 지원
• 반응형 레이아웃보다 제작 시간이 적게 든다.

라. 반응형 레이아웃

• 브라우저 너비에 따라 공간의 크기가 달라지는 동적 레이아웃과 공간의 배치가 달라지는 적응형 레이아웃 방식을 결합한 레이아웃

---

크로스 브라우징

• 유저마다 사용하는 웹 브라우저가 다른데 웹 사이트를 다양한 브라우저와 버전에 대응할 수 있도록 제작하는 과정
• 내가 사용하는 개발 언어의 특정 기능을 어느 브라우저에서 어떤 버전부터 지원하는지 꼭 확인해야 한다.
• Can I use 에 접속하여 입력칸에 특정 태그나 명령어를 입력하면 지원하는 브라우저 버전을 알려준다.

---

웹 표준

• 웹 사이트의 유지 보수 및 인수인계 시 편의를 위해 웹 기술을 표준화해야 함
• 이때 등장한 조직 W3C(World Wide Web Consortium)이 개발한 가이드라인을 ‘웹 표준’ 이라고 부른다.

웹 표준의 장점?

• 구글과 같은 검색 사이트에 노출될 확률이 높아짐
• 웹 접근성이 좋아짐. 웹 접근성은 장애인과 비장애인 모두 웹 사이트를 편하게 이용할 수 있도록 제작하는 방식
• 웹 사이트 수정/관리가 쉬워져 유지 보수 비용/시간 감축

---

웹 표준의 규칙

• 보통 기본 메인 페이지는 index.html 파일에서 진행