UserInterface(반응형, 적응형, 웹표준, 크로스 브라우징)

[young-02]

UserInterface 개발

반응형 ?

데스크탑, 랩탑, 태블릿, 모바일 기기와 같은 다양한 디바이스들의 화면 크기에 맞게 웹페이지가 반응하여 변환되는 것

장점

• 유지보수, 운영 비용 절감
• 하나의 UR을 유지하므로 검색엔진최적화를 향상 시킨다.

  단점

• 디자인 - 개발 - 테스트 단계에서 많은 시간과 비용이 들게 된다.
• 모든 디바이스 대응하기 위한 코드를 다운 받아야 하므로 초기 로딩 시간이 길어지게 된다.

  적응형 ?

  사용자가 어떤 디바이스로 접속 했는지 확인하여 해당 디바이스에 대응하는 웹 페이지를 보여준다. 테스트탑, 랩탑 / 태블릿 모바일 각각의 url을 다르게 보여준다.

  장점

• 모든 디바이스 대응하지 않기 때문에 초기 로딩 속도 빠름
• 데이터가 많은 웹페이지를 구축할 때는 반응형보다 적응형이 적합함.

  단점

• 페이비별로 템플릿을 따로 작성해야 함
• 기기마다 일관되지 않은 데이터로 검색엔진 최적화가 다소 떨어진다.
• 수정 사항이 요구 될 경우 각 기기 마다 페이지 따로 수정 해줘야 함.

  웹표준 ?

  어떠한 운영체제나 브라우저를 사용하여도 동일한 컨텐츠를 볼 수 있도록 웹에서 표준적으로 사용되는 기술이나 규칙

  장점

• 검색엔진 최적화 (시멘틱태그를 사용)
• 개발자가 이해하기 수운 코드
• 구조와 표현의 분리 (html, css 를 분리하여 유지보수에도 용이해짐)

  웹접근성?

  웹 표준은 웹접근성을 높인다. 장애인이나, 노인분들이 모두 개인의 능력에 상관없이 웹페이지의 정보에 접근할 수 있도록 보장하는 것 시각장애인 - 스크린리더

  웹 접근성을 높이는 방법

• 명암 민감도 및 글꼴 크기 와 확대할수 있는 방법 제공
• 시멘틱 태그 사용

  크로스 브라우징

  웹 표준에 따라 서로 다른 OS 또는 플랫폼에 대응하는 것을 말한다. 브라우저별 렌더링 엔진이 다른 상황 등 어떠한 상황 속에서도 문제 없이 동작하는것.

• 적용 기능의 지원 브라우저 파악 또는 Tool 사용 (lambdaTest, Experitest)
• 브라우저 표준에 맞게 스타일 지원