1802
0自适应网站
对于自适应网站，可在文档的标头添加以下元标记，向浏览器表明网页会自行调整以适应所有设备：<meta name="viewport" content="width=device-width, initial-scale=1.0">
视口元标记（viewport）可以提示浏览器如何根据设备的宽度来调整网页的尺寸和缩放比例。如果没有视口元标记元素，在默认情况下，移动设备浏览器会根据桌面设备屏幕的宽度（通常约为 980 像素，但因各种设备而异）来呈现网页。此外，为了尽可能使内容看起来更加美观，移动设备浏览器还会放大字体，并缩放内容的比例以适应屏幕的尺寸，或仅显示可在屏幕内显示部分内容。
|
要点： 使用 meta name="viewport" 标记告知浏览器如何调整内容。 |
动态提供内容
采用动态提供内容设置时，服务器会根据请求相应网页的User Agent，通过同一网址提供不同的 HTML（和 CSS）。采用这种设置时，服务器通过Vary HTTP 标头发出一个提示，让移动设备的 Googlebot 抓取相应的移动版本的网页。
|
要点： 使用 Vary HTTP 标头根据用户代理表明您所做的更改。 正确检测User Agent的字符串。 |
独立移动页面
在此配置中，每个移动版网页都具有一个和PC站网页对应的不同的网址，用于提供针对移动设备进行优化的内容。常见设置为：为桌面设备用户提供的内容放在www.example.com子域上 ，为移动用户提供的内容放在 m.example.com 上，对应页面的路径可以是相同的，也可以有所不同。
|
要点： 通过包含 rel="canonical" 和 rel="alternate" 元素的标记表明两个网址之间的关系。 检测用户代理字符串并正确地对它们进行重定向。 |
版权归netconcepts所有，特此声明，转载请注明出处。