你有没有试过在浏览器地址栏输完网址，还没点回车，下面就已经跳出一串简介和小图标？或者发链接到微信、QQ，别人点开时显示的不是乱码，而是标题+一段描述+缩略图？这些，都离不开网页里藏着的一小段代码——meta标签。
meta标签在哪？长啥样？
它就躲在网页最开头的 <head> 里，不直接显示给用户看，但浏览器、搜索引擎、社交平台全靠它“读懂”这个页面。比如：
<meta name="description" content="教你快速看懂网页meta标签的作用，用大白话讲清楚title、keywords、viewport这些常用标签怎么用">
<meta name="keywords" content="meta标签,网页优化,SEO入门,电脑入门">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:title" content="网页meta标签是干啥的？电脑小白也能看懂的作用解释">几个最常用的meta标签，都是干啥的？
• <meta name="description">
相当于网页的“自我介绍”。搜索引擎结果页里那行灰色小字，基本就来自这里。写得好，别人一眼就明白这页讲啥，点击率能高不少。比如搜索“怎么清空浏览器缓存”，搜出来第一条写着“三步清空Chrome、Edge、Firefox缓存（附截图）”，比“缓存操作页面v1.2”靠谱多了。
• <meta name="viewport">
手机上看网页不放大缩小、不左右滑动，全靠它。没有这句，很多老网站在手机上会挤成一条细线，得不停捏合放大才能看清字——这就是 viewport 没设好。
• <meta charset="UTF-8">
防止中文变问号、乱码的“保命符”。以前用 GB2312 编码的老站，遇到生僻字或emoji就崩，现在统一用 UTF-8，基本不会翻车。
• Open Graph 标签（og:xxx）
微信、微博、抖音分享链接时显示的标题、图片、描述，就是靠 og:title、og:image、og:description 这些标签告诉平台的。没加？那分享出去可能只有一堆网址，连标题都没有。
别瞎填 keywords，现在真没啥用
早年大家狂塞“电脑,笔记本,Win11,装系统,教程,下载,免费,最新版……”这种关键词，指望靠它提升排名。现在主流搜索引擎（百度、谷歌）基本不认这个标签了——填了不如不填，还占地方。真想被搜到，老老实实把标题写清楚、正文内容写扎实，比堆关键词管用十倍。
说白了，meta标签不是炫技的花架子，它是网页和外部世界沟通的“翻译官”：告诉浏览器怎么渲染，告诉搜索引擎这是啥，告诉微信该展示哪张图。懂一点，建个人博客、做个小网店、甚至改自己公司官网，都不至于一上来就被卡在第一关。