Responsive Web Design

반응형웹은 쉽게 말해, 디바이스 화면의 크기에 따라 웹페이지의 레이아웃이 자동적으로 재조정 되는 것을 말합니다.

기존에는 PC와 모바일기기를 대응하기 위해 선별된 기기 유형에 따른 별도의 독립적인 템플릿 (각각의 *HTML, *CSS 소스)을 이용하였지만,

반응형웹은 미디어퀴리라는 CSS기법을 이용하여 하나 템플릿(HTML, CSS소스)만으로 다양한 환경에서 레이아웃이 변환되어 최적화된 환경을 사용자에게 제공합니다.

사용자 입장에서는 어느 기기에서든 같은 콘텐츠를 적절한 화면으로 볼 수 있고, 개발자 입장에서는 기기마다 따로 웹페이지를 개발하지 않아도 되므로 개발 비용을 절감할 수 있습니다.

*HTML(Hyper Text Markup Language) : 웹페이지를 만들기 위한 언어로 웹브라우저 위에서 동작하는 언어.

*CSS(Cascading Style Sheets) : HTML을 바탕으로 만들어진 문서를 꾸며주는 역할.

한 화면은 HTML로 구성되어 있으며 이 화면을 꾸며주기 위해서 CSS파일이 연결 되거나 안에 포함 되어 있다.

mediaquery

<link>

<style>

@import

css

The 960 Grid System

960 Grid System은 단순히 너비가 960px 인 Grid를 사용하여 웹사이트를 배치하는 방법이다.