大家好和你们分享个好玩的事情：网页元信息！这是什么鬼？简单来说，它能帮我们描述和定义网页中的重要内容，还能提升咱网站在搜索引擎里的排名。这个小细节就在文档头顶上，看起来不起眼但很有用哟~
好嘞，这玩意儿到底能干嘛呀？其实它就是让手机上也能看到网页的东东！你知道吗，手机屏幕比电脑小很多，所以苹果想办法搞来了webkit这货，能把大带宽的“假窗户”缩到小小的手机屏上去看。要知道，这样的“假窗户”刚开始设计成980像素宽（很多网站都这么设置），但到了手机上得变成适合的大小。就是说，我们打开网页时，webkit先铺开用980像素去加载，最后缩小成490来适应手机屏。记住咯，这个缩小可不是光缩浏览器窗口那么简单，整个页面对应到的所有元素都会跟着变小一点儿。
<meta id="viewport" name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1; user-scalable=no;">
怎么调整那个小小的视窗？其实很简单，为了让网页在各种设备上都能用，我们通常会把它设定成device-width。但也有两个小细节别忘了，第一个就是initial-scale，这就是我们打开新网页的时候的缩放程度喽。然后是minimum-scale，这个，决定了能不能随便放大缩小。如果你想自由调节，就选“Yes”；如果不想弄来弄去，就用默认的“No”。
关键词在搜索引擎那儿挺重要的，它能帮我们找东西更准确。网页制作时，别忘了考虑把关键词加进去，这样才能更好地服务搜索引擎。而且，描述也别忘了，简单说说你网站有哪些主要内容就行了，这样搜索引擎明白点儿之后，自然会给你好好排队。
咱们聊聊format-detection这事儿。它干嘛？就相当于检查HTML里有没有错误的格式，就好像手机上看网页的时候，手残点击了数字还能变成拨号链接似的。不过放心，只要在html里面把电话号码设为“no”，数字就不会变成链接。当然，如果你愿意的话，直接开启这个功能也是可以的，那就不用加元标签，默认就是开启状态！
想跟大家分享个超好用的小诀窍！就是在网上看到某个邮箱地址时，iPhone会悄悄地帮你识别出来并直接带你过去。超级省事儿！还有，就算不想要，还可以设置为email=no不让它自动跳成邮箱呐！
meta name="format-detection" content="telephone=no" meta name="format-detection" content="email=no" meta name="format-detection" content="adress=no"
看这儿！把网页拉到底部设置为主屏幕就能全屏了！你还可以把烦人的系统工具栏关掉，只需在链接里加个”apple-mobile-web-app-capable”。再往下看，Content这个属性你加入”yes”会显示，加入”no”则是隐藏哟。炫酷又实用！
哎呦，说的有点儿绕，那这些元信息能干啥用？别急，让我给你解释一下，其实，它们有不少好处哩！比如说，咱们平时用的搜索引擎里，关键词和说明就像是个指南针，帮助快速找到想要的东西；还有，你知道吗，对于手机用户而言，Viewport控制可以让网页根据各种屏幕自适应大小；再比如，你开邮箱或打电话时，格式检查能让操作变得更顺畅简便所以说，在搞网站设计的时候，这些小细节可千万别忽略了！今天就说到这里，下次再见咯。如果有什么不懂的地方，尽量问我，还请大家看后赞一下，转发一下希望跟各位多多交流沟通！
评论0