Мета-теги для мобильных устройств-должны ли они использоваться?



мета-теги "Viewport", "MobileOptimized" и "HandheldFriendly" могут использоваться для предоставления соответствующим образом отформатированного HTML-контента для мобильных устройств. Являются ли эти теги хорошими вещами? Они кажутся довольно специфичными для платформы во многих случаях, и даже когда они не специфичны для платформы (видовой экран), они, похоже, требуют определенных атрибутов устройства для правильной работы.



должны ли они использоваться? Где и когда их целесообразно использовать? Есть ли альтернативы (без user-agent признание)?



Примечание: я использую запросы css media для достижения мобильной поддержки, но для этого требуется некоторый UAR, чтобы оптимизировать размер шрифта.

629   2  

2 ответов:

ответ прост: viewport - это хорошо, другие... не так хорошо.

просмотра

viewport - это широко поддерживается де-факто стандарт - первоначально созданный Apple для мобильного Safari на iPhone, он был принят почти всеми другими мобильными браузерами: Opera Mobile, iPhone, Android, Iris, IE, BlackBerry, Obigo, Firefox

простой пример использования: сделайте сайт полной ширины на мобильном телефоне:

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

два других являются старые де-факто "стандарты" для "функциональных телефонов" - которые, как правило, слишком стары для поддержки viewport:

HandheldFriendly

этот тег первоначально использовался для идентификации мобильного контента в браузерах AvantGo, но стал общим стандартом для идентификации мобильных веб-сайтов. Однако неизвестно, какой диапазон браузеров поддерживает этот мета-тег:

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

MobileOptimized

это Windows-проприетарный мета-тег, который также в конечном итоге стал использоваться как еще одно средство идентификации мобильного контента. Недостатком этого тега является то, что должна быть задана определенная ширина. Опять же, неизвестно, какова поддержка этого тега:

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

резюме

использовать viewport Если вы нужно для поддержки старых телефонов функции, которые не поддерживают его, в этом случае, вероятно, использовать как HandheldFriendly & MobileOptimized-но Проверьте свои целевые устройства и узнайте.

должны ли они быть использовали? Где и когда их целесообразно использовать? Существуют ли альтернативы (без распознавания агента пользователя)?

они должны быть использованы, когда вы хотите, чтобы эффекты, которые они создают - в общем, рассказывать телефонов, что масштаб по умолчанию, чтобы использовать, контролируя изменение размера и т. д. Это хорошее объяснение того, почему вы можете использовать viewport, например:http://davidbcalhoun.com/2010/viewport-metatag - в нем также перечислены другие свойства, которые вы можете установить с помощью viewport и что так и есть.

они только другой способ достижения этих эффектов, без использования этих метатегов, с фанки JS трюки - которые будут медленнее, требуют загрузки скрипта, трудно поддерживать и будет ненадежным. Браузеры, которые не поддерживают viewport вероятно, будет очень глючный интерфейс JS для просмотра связанных с ним материалов; см. ссылки quirksmode ниже.

ссылки

iPhone использует Safari в качестве браузера. У них есть страница разработчика что дает вам некоторую информацию, когда использовать метатег viewport:

например, если ваша веб-страница меньше, чем 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" />

еще одна статья, которая может быть интересен для вас список отдельно:" положите ваш контент в мой карман".

Comments

    Ничего не найдено.