您的网站,
跨屏了吗?



您的网站
得分是1分!(总分8分)

糟糕!

做得好!

您没有指定视口


视口标记告诉设备使网页适合设备的宽度(而不是缩小它)。

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

糟糕!

做得好!

您没有禁用缩放


在视口中使用最大比例和用户可伸缩选项确实是糟糕的形式,因为它控制了用户的控制。

<meta name="viewport" content="maximum-scale=1.0, user-scalable=no"/>

糟糕!

做得好!

您没有使用MOBILEOPTIMIZED标记


这告诉移动浏览器该网站最适合的移动宽度。 这是移动浏览器渲染的额外故障保护。

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

糟糕!

做得好!

您没有使用HANDHELDFRIENDLY标签


与MobileOptimized标签类似,这告诉Blackberrys等设备该网站针对移动浏览进行了优化。

<meta name="HandheldFriendly" content="True">

糟糕!

做得好!

你没有使用MODERNIZR


Modernizr 是一个开源JavaScript库,在旧版浏览器中为您提供类似媒体查询的功能。

<script src="modernizr.js"></script>

糟糕!

做得好!

您没有APPLE TOUCH图标


如果有人在他们的主屏幕上添加了您的网站,Apple Touch图标看起来会比缩小的屏幕截图好得多。

<link rel="apple-touch-icon" href="/images/apple-touch-icon.png" />

糟糕!

做得好!

你没有电话链接


在过去,手机用于呼叫人。 与潜在客户联系的最快方式是包含可点击的电话号码。

<a href="tel:your number">

糟糕!

做得好!

您还没有使用表格进行布局


表只应用于表格数据。 使用表格标签进行布局是顽皮的 - 它们不是语义的,它们会使用代码使您的网站膨胀。

<table>