반응형 웹 디자인 / 적응형 웹 디자인

 

 

반응형 웹 디자인

Responsive Web Design (RWD)

 

웹사이트는 데스크톱, 태블릿PC, 스마트폰과 같은 다양한 기기에서 사용하여 볼 수 있다.

웹페이지는 기기에 관계없이 보기 좋고 사용하기 쉬워야 하며 모든 내용을 기기에 맞춰서 조정해서 보기 좋게 만들어야 한다.

반응형 웹 디자인은 하나의 웹사이트의 내용을 그대로 유지하면서 PC, 태블릿 PC, 스마트폰 다양한 화면의 크기에 맞게 자동으로 변하도록 만든 웹페이지 접근 기법을 말한다.

웹사이트를 PC용과 모바일용으로 각각 별개로 제작하지 않고 하나의 웹사이트를 만들어 다양한 디바이스에 대응할 수 있다. 

HTML과 CSS에서만 사용하며 프로그램이나 자바스크립트가 아니다.

 

 

 

🎈 반응형 웹사이트

 

장점

하나의 웹 사이트로 PC, 모바일 등 모든 디바이스에 최적화 되어 보여지며 효율적으로 사용할 수 있다. 

사이트 유지 관리가 쉽다. 웹 페이지 내용을 수정할 경우 하나의 페이지만 수정하면 모든 기기에서 동일하게 반영된다. 

 

단점

미래 지향적 기술로 하위 버전의 브라우저 사용자를 고려할 수 없다. 

다양한 레이아웃 디자인의 한계가 있다.

 

반응형 웹 핵심 기술

가변 그리드 Fluid Grid

미디어 쿼리 Media Query

유연한 디자인 Flexible 

 

 

적응형 웹 디자인

Adaptive Web Design

 

고정된 크기의 웹페이지 디자인  

각각의 디바이스(PC, 모바일)에 최적화해서 별도의 웹사이트를 제작하는 방법이다.