Mobile Web, 적응형 웹, SEO

Mobile Web

• 구축 방법 : 반응형웹, 적응형웹

  반응형웹 : PC, 테블릿, 모바일 기기 별 화면 크기(분기점)를 측정해서 기기별로 반응해서 달라지는 것

  적응형웹 : 모바일 웹, PC 웹 별도로 제작. 단순히 기기별 화면에 반응하는 것이 아니라 모바일 화면에 최적화된 화면을 만들기 위함. 모바일 사용성 측면에서 반응형보다 장점이 있다고 볼 수 있다.

장단점

• 반응형웹

  장점 : 기존 웹 소스 하나로 관리 되기 때문에 한 파일에서 핸들링이 가능. 그래서 유지보수가 쉽다는 장점이 있다.

  단점 : 하나의 소스에서 2가지 구현이 한번에 관리되기 때문에 소스가 복잡해지고 전체 소스의 양이 늘어나게 된다. 이렇게 되면 프로젝트 규모에 따라 비례적으로 속도에 안좋은 영향을 끼칠 수 있다.

• 적응형 웹

  장점 : 반응형(미디어 쿼리?)으로 표현하기 어려운 레이아웃 또는 사용자의 편의성을 위해 모바일에 최적화된 화면을 만들 수 있다. User와 Interaction 측면에서 반응형 보다 더 디테일하고 사용성을 최적화 시킬 수 있다는 장점이 있다.

  단점 : PC 웹, Mobile 웹 추가로 태블릿 웹 까지 다룬다면 벌써 2~3가지의 소스를 핸들링 해야 한다. 즉, 유지보수가 매우 힘듬. 그리고 하나의 서비스(콘텐츠?)가 여러 개의 소스로 관리 되고 있다는 것. 그것은 그것대로 중복되는 콘텐츠가 된다. 이는 검색엔진 입장에서 매우 골치 아픈 일이 될 수 있다.

SEO 최적화...?

• 하나의 URL을 사용한다.

PC, Mobile 둘 다 하나의 URL을 사용하기 때문에 검색엔진이 색인할 때 자원이 덜 들어가 골치 아플 일이 없다.(모바일과 PC URL이 다르면 다른 도메인으로 인식함)

• 중복 콘텐츠 방지

중복 콘텐츠는 검색엔진 입장에선 매우 골치아픈 일이 될 수 있다. 기껏 색인화 시켰는데 사본(중복 콘텐츠)이 여기저기 돌아다니면 검색결과로 어디를 알려줘야 할지도 혼동될 우려가 있다. 그래서 Canonical URL이라는 meta 태그를 설정해서 “내가 진본이야 ~~ 여기로 와~”하는 식으로 명시할 수 있다. 그러나 그전에 모바일 웹, PC웹에 이중 콘텐츠가 있으면 색인화가 어렵기 때문에 하나의 URL에 모바일 웹 PC웹이 있으면 검색엔진 최적화에 효율적이다.

• html 메타 정보나 키워드를 최적화 시키는 것이 전부가 아니다.

검색 엔진 최적화는 사용성을 극대화 시킨 웹사이트에게 가점을 주는 방식으로 동작한다.

참고문서 - NXT #반응형 홈페이지 제작 포스트 참고

https://www.next-t.co.kr/blog/homepagemade_04

• 정보 : URL 입력 시 테크니컬 검색엔진 최적화 점수 체크 가능

구글 SEO 최신 트렌드, 지침

[https://developers.google.com/search/mobile-sites/mobile-seo/responsive-design](https://developers.google.com/search/mobile-sites/mobile-s
eo/responsive-design)