🤨 웹 디자인 추세
2023년이 다가오는 지금 데스크톱(PC)로 웹을 방문할 가능성보다 모바일로 방문할 가능성이 더 높다.
모바일 친화적 웹 디자인이 대세
😆 반응형 디자인이란?
감지된 화면크기에 따라 자동으로 재배치, 유동적 접근
(목적)
기기별 웹사이트를 별도로 만드는 것이 아니라 유연성과 시각적인 즐거움을 주기 위해 만들게 됨.
(장점)
모든 플렛폼에서 일관된 콘텐츠 경험
보편적이지 않은 화면 크기, 새로운 기기에서도 호환
(단점)
각 기기에서 웹사이트 렌더링 방식에 대한 통제 상대적 어려움
요소가 잘못된 순서 또는 크기로 재배치된 경우 시각적 계층구조 방해
디자인에 대한 더 저문 지식 필요, 플랫폼 간 테스트 및 디자인 조정 필요
동적 콘텐츠를 불러오는데 더 많은 작업 요구, 웹사이트 성능 저하🥸 적응형 디자인이란?
브라우저가 주어진 플랫폼에 맞춰 특별히 생성된 레이아웃을 불러오는 웹 디자인
감지된 기기 기반으로 미리 만들어진 정적인 레이아웃 불러오기
(목적)
각기 다른 새로운 웹 지원 화면에 본래의 탁월한 디자인 담기
(장점)
각 플랫폼 및 상황과 맥락에 맞춰 제공되는 완벽 맞춤화
원하는 기기에 맞춰 최적화된 디자인 고성능 작업
광고 및 타사의 통합 콘텐츠에 대한 간편 맞춤
(단점)
콘텐츠가 모든 기기에서 일관되지 않을 경우 SEO 에 부정적
(SEO란? "검색 엔진 최적화" 라함..)
❗️ 반응형 디자인은 적응형 디자인과 어떻게 다른가요?
둘다 서로 다른 뷰포트 사이즈, 해상도, 사용 컨텍스트, 제어 메커니즘 등을 조정하여 다양한 장치에 사용자에게 최적화 하도록 함
반응형 디자인은 유연성 원칙에 따라 작동 (어디 장치에서나 보기좋게)
미디어쿼리, 유연한 그리드 및 반응형 이미지를 사용하여 다양한 요인에 따라 유연하고 변화를 제공
동적이다.마치, 배우 한명이 여러가지 역할을 잘 수행하는 것과 유사.
적응형 디자인은 점진적 향상의 현대적 정의와 가까움
유연한 디자인 대신, 장치 및 기타 기능을 감지한 다음 사전 정의된 뷰포트 크기 및
기타 특성 세트를 기반으로 적절한 기능 및 레이아웃 제공
정적이다.마치, 각기 다른 배우들이 적합한 배역을 맡은것과 유사.
일단 한다