meta标签有哪些常用属性？

聊起这个，我得说meta标签真是网页里那种“润物细无声”的小部件。作为一个摸爬滚打20年的全栈老油条，我见过太多人忽略它，结果在SEO或者移动端适配时踩坑。这东西不复杂，但用对了能省不少事儿。

说白了，meta标签就是给浏览器和搜索引擎递小纸条的。它藏在head里，不直接显示内容，但能传递关键信息。常用的属性也就那么三四个，你记牢了就行。第一个是charset，定义字符编码，现在几乎清一色UTF-8，写法特简单：<meta charset="UTF-8">。这行代码能避免一堆乱码问题，我建议每个页面都把它放在最前面。

接着是name和content这对黄金组合。比如控制视口的：<meta name="viewport" content="width=device-width, initial-scale=1.0">，没了它，移动端页面可能就糊成一团。还有设置页面描述的：<meta name="description" content="这里是描述内容">，这个对搜索引擎抓取特别重要，算是SEO的基本功。有时候还会看到keywords，但现在主流搜索引擎不太看重了，不过你知道有这回事就行。

另一个属性是http-equiv，现在用得少了，但偶尔还能见到。比如用来重定向的：<meta http-equiv="refresh" content="5;url=https://example.com">，但说实话，这种操作最好用服务器端来做更优雅。

我随手写个常见的代码片段给你感受下：

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="这是一个关于前端技术的博客页面">

看，就这么几行。日常开发中，处理好这些meta标签的属性，能让你的页面更友好，无论在各种设备上显示还是搜索排名，都会顺畅不少。这东西就是细节，但老手都知道，细节往往决定体验。