적응형 웹 vs 반응형 웹

근본적으로 웹사이트가 모바일 기기와 다양한 화면 크기에서 원활한 정보를 제공하여 더 나은 모바일 사용자 경험을 제공하기 위한 방법입니다. 하지만 적응형 웹과 반응형 웹은 사이트 설계부터 구동까지 많은 차이가 있습니다.

---

적응형 웹

서버나 클라이언트에서 웹에 접근한 디바이스를 체크하여 그 다바이스에 최적화된 마크업을 호출합니다.

적응형 웹의 특징으로는 기존의 사이트를 재구축 할 필요가 없고 다양한 디바이스에 최적의 성능을 가져올 수 있다.

 

(장단점)

기존에 이미 데스트톱용 템플릿이 있었다면 처음부터 재구축 할 필요없이 다른 기기용 템플릿만 제작하면 되기 때문에 효율적이고,

사용자의 기기에 맞는 템플릿 및 CSS만 다운로드 하기 때문에 데이터 낭비 및 로딩 속도를 줄일 수 있습니다.

 

다만, 각 기기별로 별도의 템플릿을 제작 해야 하기 때문에 개발에 있어 번거로울 수 있습니다.

---

반응형 웹

미디어 쿼리를 사용하여 화면의 크기를 확인하고 유연한 이미지와 그리드로 화면 크기의 변화에 맞게 보여주는 방식입니다.

 

(장단점)

하나의 템플릿만 사용하여 다양한 사용자와 기기에 대응 할 수 있어 개발이 편하다는 장점이 있지만,

사용자는 단 하나의 기기로만 접속하지만 매번 모든 기기를 위한 CSS를 전부 다운로드 받아야 하기 때문에

데이터 낭비 및 로딩 시간이 길어진다는 단점이 있습니다.

 

또한 기존에 이미 운영 중이었던 데스트톱용 사이트가 있었다면 사이트를 재구축 해야 한다는 불편함도 있습니다.

---

TIL. 반응형 웹 vs 적응형 웹