网站元数据meta标签的含义和用法

news/2024/5/19 9:47:01/文章来源:https://blog.csdn.net/weixin_30390075/article/details/95077615



 

随着HTML5的流行和Web技术的不断演变,Meta标签队伍也越来越壮大,从Windows XP的IE6到如今Windows 7、Windows 8的IE9、IE10、IE11,对Html5的支持越来越好,html meta标签的功能作用也越来越强大。


首先,先说一下最初产生的一些常用meta标签。从Meta标签的定义说起。

Meta标签是HTML语言中HEAD区的一个辅助性标签,它位于HTML文档头部的<head>标记 和<title>标记之间,它提供用户不可见的信息。META标签有两个重要的属性:HTTP标题信息(HTTP-EQUIV)和页面描述信息(name)。

name属性是描述网页的,对应于content(网页内容),以便于搜索引擎机器人查找、分类,目前几乎所有的搜索引擎都使用网上机器人自动查找meta值来给网页分类。

Meta标签的name属性语法格式:<meta name="参数" content="具体参数值">

1. Keywords (关键字)
说明:告诉搜索引擎你网页的关键字是什么。
用法:<meta name="keywords" content="SEO优化,SEO优化教程,网站优化,搜索引擎优化教程">

2. Description (网页描述)
说明:Description用来告诉搜索引擎你的网页主要内容。
用法:<meta name="description" content="学习研究搜索引擎优化网提供专业的SEO优化教程,收集整理SEO优化文章、SEO优化工具,为网络营销贡献出自己的一份力量。" />

3. Robots (机器人向导)
说明:Robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。Content的参数有all、none、index、noindex、follow、nofollow。默认是all。
用法:<meta name="robots" content="All|None|Index|Noindex|Follow|Nofollow">
all:文件将被检索,且页面上的链接可以被查询;
none:文件将不被检索,且页面上的链接不可以被查询;(和 "noindex, no follow" 起相同作用)
index:文件将被检索;(让robot/spider登录)
follow:页面上的链接可以被查询;
noindex:文件将不被检索,但页面上的链接可以被查询;(不让robot/spider登录)
nofollow:文件将不被检索,页面上的链接可以被查询。(不让robot/spider顺着此页的连接往下探找)

4. Author (作者)
说明:标注网页的作者或制作组
用法:<meta name="author" content="mycodewind,mycodewind@qq.com">
注意:Content可以是:你或你的制作组的名字,或Email

5. Copyright (版权)
说明:标注版权
用法:<meta name="copyright" content="本网站版权归CSDN所有">

6. Generator (编辑器)
说明:编辑器的说明
用法:<meta name="generator" content="PCDATA|FrontPage|">
注意:Content="你所用编辑器"

7. Revisit-after (重访)
说明:通知搜索引擎多少天访问一次
用法:<meta name="revisit-after" content="7 days" >

从IE9开始引入了固定网站功能,对用户来说这是一种只需在任务栏上单击图标即可直接访问网站的简单方式。固定网站还易于实现,仅需要非常少的代码。以下的元数据标签只在IE9+生效。如Windows Vista,Windows 7系统上。官方文档地址http://msdn.microsoft.com/zh-cn/library/ie/gg491732%28v=vs.85%29.aspx 。所有元素都是可选的。包括:

针对安装的元数据:下面的 meta 元素控制如何在“开始”菜单和 Windows 7 任务栏上创建固定站点快捷方式。 所有这些元素都是可选的,但是强烈建议对页面起始处、页面名称、更好的辅助或识别功能以及启动时的自定义大小具有更多控制。
安装元数据元素仅在用户固定网站时使用。此后,对这些值的更改将不会对固定网站造成任何影响。因此,以下 meta 元素有时候被称为“安装时”值:

  • application-name
  • msapplication-tooltip
  • msapplication-starturl
  • msapplication-window



运行时元数据:与安装时值不同,在用户每次启动固定网站时将读取以下元数据。因此,网站开发人员可使用这些值不断修改用户体验。控制对这些值的更改的最佳方法是在固定网站的起始 URL 中定义它们。

  • msapplication-navbutton-color
  • msapplication-task
  • msapplication-task-separator


8.application-name
说明:"application-name" 元数据定义固定网站应用程序实例的名称。当光标悬停在 Windows 7 任务栏的固定网站按钮上时,此名称将出现在工具提示中。该应用程序名称还将附加到固定网站应用程序实例的窗口标题中。
用法:<meta name="application-name" content="8783手游网" />

9.msapplication-tooltip
说明:"msapplication-tooltip" 元数据提供其他工具提示文本,当光标悬停在 Windows 的“开始”菜单中或桌面上的固定网站快捷方式上时,将会出现这些文本。
用法:<meta name="msapplication-tooltip" content="8783手游网" />

10.msapplication-starturl
说明:"msapplication-starturl" 元数据包含应用程序的根 URL。起始 URL 可以是完全限定或相对于当前文档的。只允许 HTTP 和 HTTPS 协议。如果缺少此元素,则改为使用当前页的地址。
用法:<meta name="msapplication-starturl" content="./" />
补充:"msapplication-starturl" 元数据创建你的网站的公共入口点。当存在此元数据时,固定网站会启动起始 URL 而不是最初拖动到任务栏的页面。更重要的是,起始页中声明的运行时元数据将在每次启动网站时重新定义导航按钮颜色和静态跳转列表任务。(有关详细信息,请参阅运行时元数据部分。)

作为如何使用 "msapplication-starturl" 的示例,请考虑一个提供多个类型的计算器仿真器的站点:一个具有标准布局,一个具有科学布局,一个具有统计函数。如果没有起始 URL,用户可能只将科学计算器固定到任务栏,从而无法轻松地访问集合中的其他计算器。通过添加起始 URL,网站开发人员可以声明网站的公共入口点。

<meta name="msapplication-starturl" content="./CalculatorHome.html" />

通过将安装时元数据添加到仿真程序页面,网站开发人员可控制用户访问网站的方式。通过在起始页中添加跳转列表元数据,网站开发人员可以更轻松地控制用户选择要使用的计算器样式的方式。有关详细信息,请参阅向跳转列表添加任务。
处理服务器重定向

如果你的起始 URL 重定向到其他网页,请确保声明提供给客户端的网页中的所有运行时元数据。如果服务器重定向到新路径,则你的起始 URL 必须包括该路径和结尾反斜杠 (/)。

例如,如果 "http://contoso.com/" 重定向至 "http://www.contoso.com/Home/",则起始 URL 必须包括新路径和结尾反斜杠,如下所示:

<meta name="msapplication-starturl" content="http://www.contoso.com/Home/" />
OR
<meta name="msapplication-starturl" content="/Home/" />

11.msapplication-window
说明:"msapplication-window" 元数据设置固定网站首次启动时的初始窗口大小。但是,如果用户调整了窗口大小,则再次启动固定网站时,该网站将保留新的尺寸。
下表说明了构成 meta 元素的 content 特性的两个部分。这两个部分都是必需的,且必须用分号隔开。
部分    说明
width    以像素表示的窗口宽度。最小值为 800。
height    以像素表示的窗口高度。最小值为 600。
用法:<meta name="msapplication-window" content="width=1024;height=768" />

12.msapplication-navbutton-color
说明:"msapplication-navbutton-color" 元数据定义固定网站浏览器窗口中的“后退”和“前进”按钮的自定义颜色。任何命名颜色或十六进制颜色值均有效。有关颜色名称的完整列表,请参阅颜色表(访问http://msdn.microsoft.com/zh-cn/library/ie/ms531197%28v=vs.85%29.aspx)。
用法:<meta name="msapplication-navbutton-color" content="#FF3300" />
补充:如果没有此 meta 元素,则默认颜色将基于网站图标(即,favicon)的调色板。若要了解如何为你的网站选择自定义图标,请参阅自定义站点图标(访问http://msdn.microsoft.com/zh-cn/library/ie/gg491740%28v=vs.85%29.aspx)。

13.msapplication-task
说明:它能够将一个网站如同程序固定在 Windows Vista 和 Windows 7 的任务栏中,并且在点击图标后显示一个相关网站的列表。与其他网站元数据一样,可使用 meta 元素定义静态任务。下一个任务向跳转列表(访问http://msdn.microsoft.com/zh-cn/library/ie/gg491725%28v=vs.85%29.aspx)添加任务说明了如何执行此操作。
用法:<meta name="msapplication-task" content="name=8783手游网;action-uri=http://www.8783.com;icon-uri=../static/8783.ico" />

转载于:https://www.cnblogs.com/liusiqi/p/4039901.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_781927.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

tornado+bootstrap急速搭建你自己的网站

bootstrap既然是这么的流行又能省很多的事为什么不用他呢&#xff1f;再加上牛X的produced by FB的tornado简直如虎添翼了&#xff01; 1. 安装配置 安装所需要的库等内容。这里没什么需要多讲的。tornado直接用easy_install或者pip。bootstrap直接下下来就OK了。当然还需要下载…

网站前端_Bootstrap.基础入门.0001.模版标准/样式标准/脚本标准入门?

简单介绍:1. Bootstrap于2010年Twitter开源将常见的CSS布局小组件和JS插件进行了封装,大大规范且提高了代码质量及开发效率.2. Bootstrap包含完整的基础CSS插件,丰富的预定义样式表,基于JQuery的JS插件集,非常灵活的响应式删栏系统,支持跨平台,且完全支持自定义.注意: Bootstra…

IT老鸟带你解决银行招标网站[金采网]无法注册供应商问题

目录 一、金采网介绍 二、背景及问题 三、分析思路 四、解决办法 五、扩展解决思路 六、最后感想 一、金采网介绍 金采网(http://www.cfcpn.com)是中国金融学会金融采购专业委员会对外的工作平台&#xff0c;是国内唯一的、专业服务金融行业采购业务的权威网站平台。 金…

QA小课堂:一个网站或者APP开发要多少钱

经常遇到朋友问我&#xff1a;“开发一个京东商城需要多少钱&#xff1f;开发一个滴滴打车需要多少钱&#xff1f;”类似这样的需求&#xff0c;就连我这样一名伪开发者都不愿意去骗客户或者朋友&#xff0c;因为这种问题是很难回答出来的。为什么这么说呢&#xff1f;要知道类…

selenium测试https网站

为什么80%的码农都做不了架构师&#xff1f;>>> 当访问一个https的网站&#xff0c;通常浏览器会收到一份证书&#xff0c;该证书包含了服务器的公钥以及CA的签名 服务器的公钥 服务器一般会生成一对密钥&#xff0c;公钥和私钥 服务器把公钥放在证书中请求CA的签名…

给你的网站添加支付宝即时到帐按钮

前言 大家都知道PayPal有一个非常使用的「一键转账」功能&#xff0c;但是自从支付宝的个人收款主页停止服务后&#xff0c;支付宝已经无法实现该功能了&#xff0c;那有我天朝人民想不到的办法呢&#xff1f;今天博猪就来教大家使用一个极其简单的 form 标签经过 POST 可以一键…

网站安全狗IIS版、服务器安全狗Windows版

2019独角兽企业重金招聘Python工程师标准>>> 2016年11月2日&#xff0c;云安全服务与解决方案提供商安全狗升级发布网站安全狗Windows_IIS版本&#xff0c;版本号为 V4.0.15716正式版&#xff0c;该版本优化了多个功能服务&#xff0c;目前安全狗官网http://www.saf…

hexo的next主题个性化教程:打造炫酷网站

注意下面那些图床失效了&#xff0c;可以在这里看http://shenzekun.cn/hexo%E7%9A%84next%E4%B8%BB%E9%A2%98%E4%B8%AA%E6%80%A7%E5%8C%96%E9%85%8D%E7%BD%AE%E6%95%99%E7%A8%8B.html 看到有些next主题的网站很炫酷&#xff0c;那么是怎么配置的呢&#xff1f;接下来我会讲一讲…

《网站设计 开发 维护 推广 从入门到精通》——1.2 网页美工常用工具

本节书摘来自异步社区《网站设计 开发 维护 推广 从入门到精通》一书中的第1章&#xff0c;第1.2节&#xff0c;作者&#xff1a; 何新起 , 娄彦杰 更多章节内容可以访问云栖社区“异步社区”公众号查看。 1.2 网页美工常用工具 制作网页第一件事就是要选定网页制作软件。虽然…

LVS(负载均衡)+keepalived(HA)+Nginx(反向代理)+Web(动静态网站服务器)

考虑到LVS和Nginx的缺点&#xff08;由于LVS采用的是同步请求转发策略而Nginx采用的是异步转发策略&#xff0c;结合两者的缺点:作为负载均衡服务器的Nginx和LVS处理相同的请求时&#xff0c;所有的请求和响应流量都会经过Nginx服务器&#xff0c;但是使用LVS时&#xff0c;仅请…

快播CEO认罪,成人网站对技术的要求有多高?

快播涉传播淫秽物品案昨日在海淀法院开庭审理。快播公司、王欣、张克东、牛文举均表示认罪悔罪。吴铭表示快播公司犯罪成立。 庭前法院委托鉴定机关&#xff0c;对涉案的四台缓存服务器的硬盘数据是否受到改写污染问题进行了鉴定。鉴定结论是&#xff1a;未发现硬盘中的视频文件…

收录高的网站关键词一定要这么布局

随着互联网的高速发展&#xff0c;网站几乎成了每一家企业后者公司不可缺少的一部分&#xff0c;网站也成了公司或者企业的第二个基地——线上展示。这个在网站建设的时候需要先给网站定位好&#xff0c;因为需要提前做好关键词的布局准备&#xff0c;虽然行业千千万&#xff0…

提供在线linux的网站,谁能提供一个在线免费学习Linux的网站?

楼主发表于:2008-04-21 19:46:20求一个可以在线学习LINUX 并且可以在线练习很多常用命令的网站 就是不用装linux 也可以练习linux的网站 谢谢。 对我有用[0]丢个板砖[0]引用举报管理TOP 回复次数:8 fox000002(糊糊。。楼主发表于:2008-04-21 19:46:20求一个可以在线学习LINUX 并…

为hexo 网站加上live2d看板娘

为网站加上live2d看板娘hexo-helper-live2d看板娘终极进化&#xff0c;可换装hexo-helper-live2d 下载hexo-helper-live2d github地址 这是官网效果 好了虽然上面已经给出官网地址 但是还是给你讲解一下 打开dos命令 切换到你博客目录执行 npm install --save hexo-helper-…

为你网站添加上评论系统

为你网站添加上评论系统想想你看过next后你会发现hexo有很多评论系统1.多说 2.网易云跟帖 3.畅言 4.来必力&#xff08;LiveRe&#xff09; 5.Disqus 6.Hypercomments 7.valine 等等等~~~~~~很多 但是我都看了一遍都贼麻烦只有这一个比较简单 首先开启valine 打开next的配置文件…

hexo网站使用next主题

hexo网站使用next主题网站使用next主题准备网站使用next主题 上一篇我记录了怎么使用hexonext搭建GitHub的个人网站&#xff0c;飞机票 准备 首先我们要下载安装next 如何下载这里给两个方法&#xff0c;https://github.com/iissnan/hexo-theme-next这个github地址进去之后直…

网站地图(站点地图)详细介绍以及如何制作

原文链接 什么是网站地图 网站地图&#xff0c;又叫站点地图&#xff0c;它就是一个列出了你网站上所有页面地址的清单文件&#xff0c;一般来说分为2种&#xff0c;一种是给搜索引擎看的&#xff0c;一种是给用户看的&#xff0c;前者帮助搜索引擎更好地收录你的网站&#xff…

docker-compose管理Hexo急速建站-Hexo建站(二)

上回介绍了如何在 Linux 服务器上急速建站 本节主要介绍使用 docker 作为容器 docker-compose 进行容器编排达到快速建站的目的. 以下是这套建站方案带来的其它优点: docker 容器优秀的隔离性, 能让我们的服务器环境更加整洁docker-compose 方便在服务器迁移、硬盘损坏等意外情…

nginx 代理 hexo 及域名配置-Hexo建站(三)

先前我们将 Hexo 通过 docker-compose 成功将 hexo 部署进了我们的服务器, 拥有域名的同学一定不希望他人在访问 Hexo 时还使用http://<host>:4000这种形式. 这一节, 主要演示使用阿里云控制台购买的域名并配置 nginx 代理实现域名访问 Hexo Blog 的实战 安装条件 生产环…

Hexo 安装 Next 主题-Hexo建站(四)

安装条件 生产环境(Linux服务器): hexo 未安装 hexo 的同学可以参考前两节的内容. 将 hexo 部署起来 安装步骤 注意: 以下工作空间根目录为 Linux 服务器 hexo 安装路径根目录 下载 Next 主题 这里我选择的是最后一次发布的主线版本. cd <your_hexo_path> mkdir t…