1. Toy模板网首页
  2. > Toy博客

《前端与SEO》—— 第二章：站点地图 （sitemap）

10月前 作者：杰~JIE 分类：Toy博客 阅读(35) 违法举报

这篇具有很好参考价值的文章主要介绍了《前端与SEO》—— 第二章：站点地图 （sitemap）。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

什么是sitemap

顾名思义，sitemap就是网站的地图。这张“地图”描述的是网站中各个网页、图片、视频或其他文件的有关信息,甚至还可以说明这些内容之间的关系。sitemap以文件的形式存放在域名根路径下。需要注意的是，这张“地图”并不是给用户看的，而是专为搜索引擎抓取工具1: 设计的。搜索引擎会让抓取工具爬取sitemap文件，以便更高效的收录网站的网址。

为什么需要sitemap？

搜索引擎的工作原理：

当搜索引擎获取的一个 URL，就会尝试去访问并解析该URL的网页。在解析的过程中，如果遇到新的URL同样会去访问解析。

搜索引擎的工作机制是由点及面。只要搜索引擎获取到网站的任意一个网页地址，它就有可能收录网站全部的页面。但是！这是在理想条件下能达到的效果。所以上面写的是”可能“，而不是”一定“。理想条件有主要两点：

  1. 必须保证：无论搜索引擎从那个页面进入网站，都能有一条路径可以访问到网站的任意页面。（这个路径可以通过多次跳转来实现）

  2. 路径的嵌套层次不能太深，即入口网页到目标网页中间跳转次数不能太多。因为搜索引擎的深度遍历访问的深度是有限制的。嵌套太深，搜索引擎就可能访问不到了。

除开上面两点，还有非常重要的一点是：必须保证每个网页都允许浏览器抓取。

之所以没有在上面列举出来，是因为如果网页不允许搜索引擎抓取，做什么优化都没用。

如果我们能保证理想条件的成立，网站可以不需要sitemap。

其实，许多网站都会在footer 部分把网站的全部页面列举出来，这其实算是一种sitemap。不过这个方法对于规模较大的网站就不太友好了。因为大量的列举网页必定会导致 footer 部分篇幅过大大，会影响页面整体的效果。所以这个做法外，部分网站还会创建一个单独的网页，用来专门把全部的网页列举出来。这样就避免了对页面展示效果的影响。

这时可能人就觉得：“在 footer 部分放用户用不到的链接会不会不太好“。

确实会有这个弊端！

那通过 CSS 隐藏起来，不让用户看的是不是可以呢？理论来说可以。但是会违反部分搜索引擎的“质量指南”。

“这也不行，那也不行“，就没有一劳永逸的方法吗？

上面的方法比较简陋且存在影响页面效果，维护成本较高，不灵活的弊端。

因此人们就设计出了”sitemap“这一利器。sitemap是专门为搜索引擎设计的，它是一个文本文件，存放在域名根路径。正常情况下，用户不会去主动访问。搜索引擎抓取工具在访问一个域名时会优先抓取sitemap。此外，sitemap列举项不仅仅局限于网页地址，还可以列举多媒体资源。

相较于【在页面上罗列地址】的方法，sitemap有诸如以下的优点：

  • 独立于页面，不影响页面效果
  • 涵盖信息更加全面，如优先级、更新时间、抓取频率、网址
  • 种类更加丰富，出了列举网址，还可以列举多媒体资源
  • 维护更加简单，可随时更新，无需担心影响用户体验
  • ……

注意：

sitemap仅仅是一个辅助手段。一般来说，在sitemap列举的网址，抓取工具都会去访问。但那些未在sitemap列举出来的网址，并不意味着其不会被收录。如果你不想要搜索引擎收录某个网址，不应该通过sitemap来限制，它并不能实现你的目的。你应该使用 robots.txt。

sitemap的文件格式

上面有提及到sitemap除了可以列举网页地址外，还可以列举网站中的多媒体资源。因此sitemap的文件格式也是多样的。

以 Google 为例，支出的格式有：

  • TXT
  • XML
  • RSS、mRSS 和 Atom 1.0

TXT

TXT 格式的sitemap是最简单的一种形式，如果你的sitemap只包含网页网址完全可以采用 TXT 格式。例如：

http://www.example.com/file1.html
http://www.example.com/file2.html

注意：每一行只能包含一个网址。

XML

相对于 TXT，XML 除了可以列举网页网址外，还可以对网页补充一些描述信息。例如：

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   <url>
      <loc>http://www.example.com/</loc>
      <lastmod>2005-01-01</lastmod>
      <changefreq>monthly</changefreq>
      <priority>0.8</priority>
   </url>
</urlset>

字段说明：

属性 描述
<urlset> 必填 封装文件并引用当前协议标准。
<url> 必填 每个 URL 条目的父标记。其余标记是此标记的子项。
<loc> 必填 页面的网址。此 URL 必须以协议（如 http）开头，并以尾部斜杠结尾（如果您的 Web 服务器需要）。此值必须小于 2048 个字符。
<lastmod> 自选 上次修改页面的日期。此日期应采用 W3C 日期时间格式。如果需要，此格式允许您省略时间部分，并使用 YYYY-MM-DD。请注意，必须将日期设置为上次修改链接网页的日期，而不是生成sitemap的日期。另请注意，此标记与服务器可以返回的 If-Modified-Since （304） 标头是分开的，并且搜索引擎可能会以不同的方式使用来自这两个源的信息。
<changefreq> 自选 页面可能更改的频率。请注意，此标记的值被视为提示，而不是命令。
<priority> 自选 此网址相对于您网站上其他网址的优先级。有效值范围为 0.0 到 1.0。此值不会影响您的网页与其他网站上的网页的比较方式，它只会让搜索引擎知道您认为哪些网页对抓取工具最重要。页面的默认优先级为 0.5。由于优先级是相对的，因此它仅用于在网站上的URL之间进行选择。

上面的只是简单的示例。建议访问 sitemaps.org 做详细的了解。

RSS、mRSS 和 Atom 1.0

此外，google 还支持 RRS、mRSS、Atom 1.0 来充当sitemap。

Google 说明如下：

如果您的博客有 RSS 或 Atom Feed，那么您可以将该 Feed 的网址作为sitemap提交。 大多数博客软件都能为您创建 Feed，但请注意，此类 Feed 只会提供关于近期网址的信息。

  • Google 支持 RSS 2.0 Feed 和 Atom 1.0 Feed。
  • 您可以使用 mRSS（媒体 RSS）Feed 向 Google 提供有关您网站上视频内容的详情。

看个例子 mRSS 例子：

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/" xmlns:dcterms="http://purl.org/dc/terms/">
<channel>
<title>Example MRSS</title>
<link>http://www.example.com/examples/mrss/</link>
<description>MRSS Example</description>
  <item xmlns:media="http://search.yahoo.com/mrss/" xmlns:dcterms="http://purl.org/dc/terms/">
    <link>http://www.example.com/examples/mrss/example.html</link>
    <media:content url="http://www.example.com/examples/mrss/example.flv" fileSize="405321"
      type="video/x-flv" height="240" width="320" duration="120" medium="video" isDefault="true">
      <media:player url="http://www.example.com/shows/example/video.swf?flash_params" />
      <media:title>Grilling Steaks for Summer</media:title>
      <media:description>Get perfectly done steaks every time</media:description>
      <media:thumbnail url="http://www.example.com/examples/mrss/example.png" height="120" width="160"/>
      <media:price price="19.99" currency="EUR" />
      <media:price type="subscription" />
    </media:content>
    <media:restriction relationship="allow" type="country">us ca</media:restriction>
    <dcterms:valid xmlns:dcterms="http://purl.org/dc/terms/">end=2020-10-15T00:00+01:00; scheme=W3C-DTF</dcterms:valid>
    <dcterms:type>live-video</dcterms:type>
  </item>
</channel>
</rss>

可以看到，有点像 XML。其实，RSS、mRSS、Atom 1.0 都是基于 XML 扩展出来的 Web 网络数据交互规范。

RSS、mRSS、Atom 1.0 的异同:

  • 相同点：用于发布站点更新的 XML 文档格式
  • 不同点：
    • 格式不一样
    • RSS 用于经常更新资料的网站，例如博客、新闻的网摘;
    • mRSS 是用于整合多媒体文件的 RSS 扩展项。它对内容的描述比 RSS 标准要详细得多;
    • Atom 是一个相对较新的规范，比RSS更强大，功能更丰富。

多媒体的sitemap

部分搜索引擎还支持为网站中的多媒体资源设置sitemap，有助于搜索引擎收录抓取工具可能无法爬取到的多媒体资源。（例如，通过 JavaScript 添加的图片）

图片sitemap

图片sitemap使用的是 XML 格式。如下：

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:image="http://www.google.com/schemas/sitemap-image/1.1">
  <url>
    <loc>http://example.com/sample1.html</loc>
    <image:image>
      <image:loc>http://example.com/image.jpg</image:loc>
    </image:image>
    <image:image>
      <image:loc>http://example.com/photo.jpg</image:loc>
    </image:image>
  </url>
  <url>
    <loc>http://example.com/sample2.html</loc>
    <image:image>
      <image:loc>http://example.com/picture.jpg</image:loc>
    </image:image>
  </url>
</urlset>

视频sitemap

视频sitemap支持 XML 格式以及 mRSS。

XML 示例如下：

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
   <url>
     <loc>http://www.example.com/videos/some_video_landing_page.html</loc>
     <video:video>
       <video:thumbnail_loc>http://www.example.com/thumbs/123.jpg</video:thumbnail_loc>
       <video:title>Grilling steaks for summer</video:title>
       <video:description>Alkis shows you how to get perfectly done steaks every
         time</video:description>
       <video:content_loc>
          http://streamserver.example.com/video123.mp4</video:content_loc>
       <video:player_loc>
         http://www.example.com/videoplayer.php?video=123</video:player_loc>
       <video:duration>600</video:duration>
       <video:expiration_date>2021-11-05T19:20:30+08:00</video:expiration_date>
       <video:rating>4.2</video:rating>
       <video:view_count>12345</video:view_count>
       <video:publication_date>2007-11-05T19:20:30+08:00</video:publication_date>
       <video:family_friendly>yes</video:family_friendly>
       <video:restriction relationship="allow">IE GB US CA</video:restriction>
       <video:price currency="EUR">1.99</video:price>
       <video:requires_subscription>yes</video:requires_subscription>
       <video:uploader
         info="http://www.example.com/users/grillymcgrillerson">GrillyMcGrillerson
       </video:uploader>
       <video:live>no</video:live>
     </video:video>
   </url>
</urlset>

mRSS 示例：

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/" xmlns:dcterms="http://purl.org/dc/terms/">
<channel>
<title>Example MRSS</title>
<link>http://www.example.com/examples/mrss/</link>
<description>MRSS Example</description>
  <item xmlns:media="http://search.yahoo.com/mrss/" xmlns:dcterms="http://purl.org/dc/terms/">
    <link>http://www.example.com/examples/mrss/example.html</link>
    <media:content url="http://www.example.com/examples/mrss/example.flv" fileSize="405321"
      type="video/x-flv" height="240" width="320" duration="120" medium="video" isDefault="true">
      <media:player url="http://www.example.com/shows/example/video.swf?flash_params" />
      <media:title>Grilling Steaks for Summer</media:title>
      <media:description>Get perfectly done steaks every time</media:description>
      <media:thumbnail url="http://www.example.com/examples/mrss/example.png" height="120" width="160"/>
      <media:price price="19.99" currency="EUR" />
      <media:price type="subscription" />
    </media:content>
    <media:restriction relationship="allow" type="country">us ca</media:restriction>
    <dcterms:valid xmlns:dcterms="http://purl.org/dc/terms/">end=2020-10-15T00:00+01:00; scheme=W3C-DTF</dcterms:valid>
    <dcterms:type>live-video</dcterms:type>
  </item>
</channel>
</rss>

此外，Google 也支持创建新闻sitemap，可通过以下链接做详细了解：

  • 图片sitemap
  • 视频sitemap和替代方案
  • Google 新闻sitemap

sitemap的创建

sitemap的创建有三种常用方式：

  1. 手动创建sitemap
  2. 通过 CMS 平台创建sitemap
  3. 通过工具自动生成sitemap

手动创建sitemap

手动创建是最直接的的方式，如果要创建的站点地地图规模比较小，可以选择这种方式。只需要在文本编辑器按所要求的格式编写站点即可。

通过 CMS 平台创建sitemap

如果网站是通过 CMS 平台创建的，那 CMS 平台可能提供sitemap的创建功能，或者已经自动生成了。

CMS 平台：

CMS 平台（content management system，即内容管理系统平台）是一款可以让我们轻松管理内容和创建网站的软件。CMS 平台允许我们在不编写代码的情况下制作网站。

常用的 CMS 平台有：WordPress、Wix 或 Blogger

关于 CMS 更多知识，推荐阅读：2021 年 15 个最佳和最受欢迎的 CMS 平台（比较）

通过工具自动生成sitemap

对于规模比较大的网站，建议通过工具来自动生成。不过需要注意的是，自动生成工具也是通过链接爬取的形式来生成sitemap的。所以，那些抓取工具无法访问到的网址，照样是不会出现在生成的sitemap中。这就需要我们手动对生成的sitemap进行二次编辑了。

拆分较大的sitemap

如果sitemap文件过大（如大于 50M），那就需要对sitemap做拆分，然后创建一个sitemap索引文件来引导搜索引擎。

sitemap索引文件是一个 XML 文件，使用以下 XML 标记：

  • sitemapindex - 文件头尾的父标记
  • sitemap - 文件中列出的每个sitemap的父标记（sitemapindex 标记的子级）
  • loc - sitemap的位置（sitemap 标记的子级）

例如：

<?xml version="1.0" encoding="UTF-8"?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <sitemap>
    <loc>http://www.example.com/sitemap1.xml.gz</loc>
  </sitemap>
  <sitemap>
    <loc>http://www.example.com/sitemap2.xml.gz</loc>
  </sitemap>
</sitemapindex>

sitemap的注意事项

最后，列举一下sitemap的一些注意事项：

以下注意事项参考了 Google 文档，对其做了一些删减，抽取出比较通用的部分。

Google 文档地址：sitemap一般指南

  1. 使用一致且完全限定的网址。 例如，如果网站位于 https://www.example.com/，请勿将网址指定为 https://example.com/（缺少 www）或 ./mypage.html（相对网址）。
  2. sitemap可以发布在网站上的任何位置，但是sitemap只影响父级目录中的下级目录。
  3. 请勿在sitemap中包含网址的会话 ID。这样可以减少对这些网址的重复抓取。
  4. 采用 UTF-8 编码
  5. 将较大的sitemap拆分成数个较小的sitemap
  6. 仅列出规范网址。
  7. 请注意，sitemap用于向 Google 建议您认为重要的网页，Google 不承诺会抓取sitemap中的每个网址。

  1. 搜索引擎抓取工具是一种由搜索引擎公司开发的自动访问网站并收录网站的脚本机器人。俗称爬虫。 ↩︎文章来源地址https://www.toymoban.com/news/detail-495952.html

到了这里，关于《前端与SEO》—— 第二章：站点地图 （sitemap）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处： 如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：
领支付宝红包 赞助服务器费用

相关文章

  • 第二章 变量和引用

    第二章 变量和引用

    目录 2.1. 深入认识变量 2.1.1. 什么是变量 2.1.2. 变量的名称 2.1.3. 变量的类型 2.1.4. 变量的定义 2.1.5. 自定义变量 2.1.6. 环境变量 2.1.7. 位置变量 2.2. 变量赋值和作用域 2.2.1. 显示赋值：变量名=变量值 2.2.2. read 从键盘读入变量值 2.2.3. 变量和引号 2.2.4. 变量的作用域 变量是在程序

    2024年02月20日
    浏览(54)
  • 第二章 编程基础

    第二章 编程基础

    内容框图 单行注释: 快速注释： 多行注释: 使用+号拼接 使用拼接函数 列表 列表是一个有序的序列结构，可以存放不同数据类型的数据。 列表每一个元素有一个索引。 列表可以进行一系列操作，添加，删除，修改元素。 元组是一个有序的序列结构，基本结构和列表类似。

    2024年02月06日
    浏览(65)

  • 第二章：基本概念（下）

    人们往往将信号称为**“软件中断”**。进程收到信号，就意味着某一事件或异常情况的发生。 信号的类型很多，每一种分别标识不同的事件或情况。采用 不同的整数 来标识各种信号类型，并以SIGxxxx 形式的符号名加以定义。 内核、其他进程（只要具有相应的权限）或进程自

    2024年02月08日
    浏览(48)
  • 信息系统安全（第二章）

    信息系统安全（第二章）

    2.1.1基本概念 在网络开放环境中，信息系统易遭受各种各样的攻击，例如消息窃听，身份伪装，消息伪造与篡 改，消息重放等。这种入侵行为的实施相当一部分建立在入侵者获得已经存在的通信通道或伪装身 份与系统建立通信通道的基础上。因此，在信息系统中，用户在登

    2024年04月09日
    浏览(88)
  • 第二章 翻译

    第二章 翻译

    Section Ⅲ Translation Directions: In this section, there is a text in English. Translate it into Chinese. Write your translation on ANSWER SHEET 2. (15points) “Sustainability” has become a popular word these days, but to Ted Ning, the concept will always have personal meaning. Having endured a painful period of unsustainability in his own life made it

    2024年02月08日
    浏览(66)
  • 第二章 进程管理

    第二章 进程管理

    目录 2.1  进程的引入 2.1.1程序的顺序执行 1.程序的顺序执行 2．程序顺序执行时的特征 2.1.2  程序的并发执行及其特征 1．并发执行的概念 2．程序并发执行时的特征 2.1.3  进程的定义与特征 1．进程的定义 2．进程的特征 2.1.4  进程的基本状态及转换 1．进程的三个基本状态

    2024年02月04日
    浏览(59)

  • 操作系统——第二章

    一.单选题（共30题,60.0分） 1 （）是指从作业提交给系统到作业完成的时间间隔 （2.0分） A、 周转时间 B、 响应时间 C、 等待时间 D、 运行时间 正确答案： A 2 引入多道程序设计技术之后，处理器的利用率（） （2.0分） A、 有所改善 B、 极大提高 C、 降低 D、 无变化 正确答

    2023年04月08日
    浏览(52)
  • 第二章-算法

    第二章-算法

    算法是解决特定问题求解步骤的描述，在计算机中表现为指令的有限序列，并且每条指令表示一个或多个操作。 算法有五个基本特征：输入、输出、有穷性、确定性和可行性。 输入：算法具有零个或者多个输入。 输出：算法至少有一个或多个输出。 有穷性：算法在执行了有

    2024年02月14日
    浏览(40)
  • 第二章 re模块

    第二章 re模块

    在处理字符串时，经常会有查找符合某些复杂规则的字符串的需求。正则表达式就是用于描述这些规则的工具。换句话说，正则表达式就是记录文本规则的代码。 Python 提供了 re 模块用于实现正则表达式的操作。在实现时，可以使用 re 模块提供的方法，如search()、match()、fi

    2024年02月09日
    浏览(39)
  • 第二章 集合

    第二章 集合

    提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加 例如：第一章 Python 机器学习入门之pandas的使用 提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档 HashSet 底层就是基于 HashMap 实现的。两者主要区别： 线程是否安全： HashMap 是非

    2024年02月02日
    浏览(60)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包，优惠每天领

二维码1

领取红包

二维码2

领红包