모바일 용 메타 태그 – 사용해야합니까?

모바일 용 메타 태그 – 사용해야합니까?

---

메타 태그 "Viewport", "MobileOptimized"및 "HandheldFriendly"를 사용하여 적절한 형식의 HTML 콘텐츠를 모바일 장치에 제공 할 수 있습니다. 이 태그는 좋은 것입니까? 그들은 많은 경우에 꽤 플랫폼에 특화된 것처럼 보이며, 특정 플랫폼 (뷰포트)이 아니더라도 제대로 작동하려면 장치 별 속성이 필요한 것 같습니다.

사용해야합니까? 언제 어디서 사용하는 것이 적절합니까? 대안이 있습니까 (사용자 에이전트 인식 없음)?

참고 : 모바일 지원을 위해 CSS 미디어 쿼리를 사용해 왔지만 글꼴 크기를 최적화하려면 UAR이 필요합니다.

---

간단한 대답은 : viewport좋다, 나머지는 ... 덜 좋다.

뷰포트

viewportA는 널리 사실상의 표준 지원 오페라 모바일, 아이폰, 안드로이드, 아이리스, IE, 블랙 베리, Obigo, 파이어 폭스 : 원래 아이폰에 모바일 사파리 애플에 의해 만들어진, 그것은 거의 모든 다른 모바일 브라우저에 의해 채택 된 것 -

간단한 사용 사례 : 모바일에서 사이트를 전체 너비로 설정 :

<meta name="viewport" content="width=device-width, initial-scale=1.0"/> 

나머지 두 가지는 '피처 폰'에 대한 사실상의 오래된 '표준'으로 일반적으로 지원하기에 너무 오래되었습니다 viewport.

HandheldFriendly

이 태그는 원래 AvantGo 브라우저에서 모바일 콘텐츠를 식별하는 데 사용되었지만 모바일 웹 사이트 식별을위한 일반적인 표준이되었습니다. 그러나이 메타 태그를 지원하는 브라우저 범위는 알 수 없습니다.

<meta name="HandheldFriendly" content="true"/> 

모바일 최적화

이것은 결국 모바일 콘텐츠를 식별하는 또 다른 수단으로 사용되는 Windows 독점 메타 태그입니다. 이 태그의 단점은 특정 너비를 지정해야한다는 것입니다. 다시 말하지만,이 태그에 대한 지원이 무엇인지는 알 수 없습니다.

<meta name="MobileOptimized" content="320"/> 

요약

지원 viewport하지 않는 구형 피처 폰을 지원 해야하는 경우가 아니라면 사용하십시오. 이 경우 HandheldFriendly 및 MobileOptimized를 모두 사용 하십시오. 그러나 대상 장치를 테스트하고 .

사용해야합니까? 언제 어디서 사용하는 것이 적절합니까? 대안이 있습니까 (사용자 에이전트 인식 없음)?

일반적으로 사용할 기본 확대 / 축소를 지정하고 크기 조정을 제어하는 ​​등의 효과를 원할 때 사용해야합니다. 이것은 뷰포트를 사용하려는 이유에 대한 좋은 설명입니다. 예 : http : // davidbcalhoun.com/2010/viewport-metatag- 또한 뷰포트로 설정할 수있는 다른 속성과 그 기능을 나열합니다.

이러한 메타 태그를 사용하지 않고 이러한 효과를 달성하는 다른 방법은 펑키 JS 트릭을 사용하는 것입니다. 속도가 느려지고 스크립트로드가 필요하며 유지 관리가 어렵고 신뢰할 수 없습니다. 지원하지 않는 브라우저는 viewport뷰포트 관련 항목에 매우 버그가 많은 JS 인터페이스를 가지고있을 것입니다. 아래의 quirksmode 링크를 참조하십시오.

참고 문헌

• A에 대한 정말 이 모든 주제의 포괄적 인 설명을 참조 http://www.quirksmode.org/mobile/viewports.html & http://www.quirksmode.org/mobile/viewports2.html
• https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
• http://davidbcalhoun.com/tag/mobileoptimized
• http://www.quirksmode.org/mobile/ 및 http://www.quirksmode.org/mobile/tableViewport.html
• http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/

---

iPhone은 Safari를 브라우저로 사용합니다. 메타 태그 뷰포트를 사용할 때 몇 가지 정보를 제공 하는 개발자 페이지 가 있습니다.

예를 들어 웹 페이지가 980 픽셀보다 좁다면 웹 콘텐츠에 맞게 표시 영역의 너비를 설정해야합니다.

다음과 같이 사용됩니다.

<META name="viewport" content="width = 650" />

<META name="viewport" content="width = device-width" />

<META name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />

흥미로운 또 다른 기사는 A list Apart : " Put Your Content in My Pocket "입니다.

참고 URL : https://stackoverflow.com/questions/1988499/meta-tags-for-mobile-should-they-be-used