你们公司的官网被搜索引擎收录了吗？

高志小鹏鹏
1,413 阅读8分钟

1.jpg

前言

前段时间，我司的官网要改版。老板们手一挥，提出了以下几点需求

  • 网站要大气，炫酷，有科技感
  • 图片文字要高大上
  • 注重SEA、SEO优化，用户查找关键字后，我们公司的网站排名要显示在前列

为此，我们还专门买了一个SEO优化的课程，大张旗鼓的学习了一通。至于效果如何，1个月见分晓

那么如何编写 JavaScript 代码以有利于 SEO 和 SEA 呢？

下面仅展示被被谷歌搜索引擎收录的

SEA、SEO优化

保持好的网页结构

  1. 使用语义化的 HTML结构

HTML语义化是指使用恰当的HTML标签来描述网页内容的结构和含义，以提高网页的可读性、可访问性和搜索引擎优化。

  • header: 网站的页眉部分
  • nav: 定义网站的主要导航链接
  • main: 定义页面的主要内容区域，每个页面应该只有一个<main>标签
  • section: 定义页面中的独立区块, 例如文章、产品列表等
  • article: 定义独立的文章内容，通常包含标题、作者、发布日期等信息
  • aside: 定义页面的侧边栏或附属信息区域
  • footer: 网站的页脚部分
<header>
  <h1>官网</h1>
  <nav>
      <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">关于我们</a></li>
        <li><a href="#">联系我们</a></li>
      </ul>
  </nav>
</header>

<main>
  <div>欢迎来到我们的网站</div>
  <p>这里是网站的主要内容。</p>
</main>


<section>
    <h2>最新文章</h2>
    <article>
        <h3>文章标题</h3>
        <p>文章内容...</p>
    </article>
    <article>
        ...
    </article>
</section>


<aside>
  <h3>最新消息</h3>
  <ul>
    <li><a href="#">链接1</a></li>
    ...
  </ul>
</aside>

<article>
  <h2>消息1</h2>
  <p>文章内容...</p>
</article>


<footer>
  <p>版权所有 &copy; 2023</p>
  <p>联系我们：info@example.com</p>
</footer>
  1. 提供准确且吸引人的页面标题和描述

准确且简洁的标题和描述，有利于吸引访问者和搜索引擎的注意

  • 页面标题: Title
  • 页面描述: Meta Description
<head>
  <title>精美手工艺品——手工制作的独特艺术品</title>
  <meta name="description" content="我们提供精美手工艺品的设计与制作，包括陶瓷、木雕、织物等。每件艺术品都是独一无二的，以精湛的工艺和创造力打动您的心灵。欢迎浏览我们的作品集。">
</head>

标题要小于50个字符，描述要小于150字符

  1. 在关键位置使用关键字: 包括标题、段落文本、链接文本和图片的 alt 属性。

    • 段落文本: 自然的使用关键字，有助于搜索引擎收录
    • 链接文本: 使用描述性的链接文本，并在其中包含关键字，这有助于搜索引擎理解链接指向的内容
    • 图片的 alt 属性: 对于每个图像，使用描述性的 alt 属性来说明图像内容，并在其中包含关键字。这不仅有助于视力障碍用户理解图像，还可以提供关键字相关的图像描述给搜索引擎。
<h1>欢迎来到精美手工艺品网店</h1>
<p>我们提供各种精美手工艺品，包括陶瓷、木雕、织物等。每个艺术品都是由我们经验丰富的工匠手工制作而成，展现了精湛的工艺和创造力。</p>
<p>浏览我们的<a href="/products" title="手工艺品产品列表">产品列表</a>，您将发现独特的艺术品，适合作为礼物或收藏。</p>
<img src="product.jpg" alt="陶瓷花瓶 - 手工制作的精美艺术品" />

一个页面要保证有且只有h1标签

使用友好的 URL 结构

使用友好的URL结构是一个重要的优化策略，它可以提升网站的可读性、可维护性和用户体验

  • 使用关键字: 在URL中使用关键字，以便用户和搜索引擎可以更好地理解页面的主题和内容, URL中多个关键词使用连字符字符 "-"进行分隔。
  • 结构层次化: 层次化的URL结构来反映内容的结构和关系
  • 避免使用参数: 尽量避免在URL中使用过多的参数，特别是使用随机字符串或数字作为参数
  • 尽量使用永久链接: 尽可能使用永久链接，避免频繁更改URL
  • 尽量保持URL简洁: 避免过长的URL。短连接更易于分享和记忆
<!-- 不友好的URL -->
https://example.com/index.html?category=7&product=12345
https://example.com/qinghua/porcelain

<!-- 友好的URL -->
https://example.com/porcelain/qinghua
https://example.com/blog/friendly-urls
  1. 重要链接不要用JS

搜索引擎爬虫通常不会执行 JavaScript，并且依赖 JavaScript 的链接可能无法被爬虫正确解析和索引

使用标准的 <a> 标签进行跳转，避免使用 JavaScript 跳转

  1. 使用W3C规范

使用W3C规范是确保你的网页符合Web标准并具有良好可访问性的重要方式

不符合W3C的规范：

  • 未闭合的标签
  • 未正确嵌套的元素
  • 行内元素包裹块状元素
<!-- 未闭合的标签 -->
<p>This is a paragraph with no closing tag.
<!-- 未正确嵌套的元素 -->
<div><p>This paragraph is inside a div but not closed properly.</div></p>
<!-- 行内元素包裹块状元素 -->
<span><p>This paragraph is inside a div but not closed properly.</p></span>

响应式设计和移动优化

Google 现在使用了移动优先索引, 搜索引擎更倾向于优先索引和显示移动友好的网页。

使用响应式设计，使你的网页在各种设备上都能正确显示。

  1. 响应式设计：确保网页具有响应式设计，能够适应不同设备的屏幕尺寸
  2. 关注移动友好性：确保网页在移动设备上加载和显示良好

JavaScript使用和加载优化

搜索引擎爬虫通常不会执行 JavaScript，并且在抓取和索引页面时可能会忽略其中的动态内容

  1. 加载时间优化: 通过压缩和合并 JavaScript文件，减小文件大小，以及使用异步加载和延迟加载的方式，可以提高网页的加载速度

  2. 避免使用AJAX技术加载核心内容: 对于核心内容，避免使用 AJAX 或动态加载方式，而是在初始页面加载时就呈现。这样可以确保搜索引擎能够正确抓取和索引核心内容，提高网页的可见性和相关性。

  3. 减少懒加载、瀑布流、上拉刷新、下载加载、点击更多等互动加载: 这些常见的页面优化方式虽然有利于用户体验。但搜索引擎爬虫不会执行 JavaScript，并且在抓取和索引页面时可能会忽略其中的动态内容。

  4. js阻塞后保证页面正常运行: 确保网站在没有 JavaScript 的情况下仍然能够正常运行。这有助于搜索引擎爬虫能够正确索引你的网页内容。

性能和体验优化

  1. 提高网站加载速度: 搜索引擎和用户都更喜欢快速加载的网页，提高页面的转加载速度，会对搜索引擎排名产生积极影响。
  2. 优化移动体验: 在移动设备上，用户的粘性和耐心被放大，优化移动体验，减少用户的流失率，会对移动搜索排名产生积极影响。
  3. 无障碍: 在 Web 开发无障碍性意味着使尽可能多的人能够使用 Web 站点, 增加用户人群的受众，会提高搜索引擎排名

内容更新

  1. 内容持续更新: 搜索引擎比较喜欢新鲜的内容，如果网站内容长期不更新的话，搜索引擎就会厌烦我们的网站。反之，我们频繁的更新新闻、博客等内容，会大大的提高
  2. 网页数量尽可能的多： 尽可能的让网页超过15个，

频繁修改或调整网站结构的话就相当于修改了搜索引擎爬取网站的路径，导致网站即使更新再多的内容也难以得到收录

监测

索引

在浏览器中输入 site:你的地址（此方法仅适合谷歌，百度则直接搜索URL地址）

查看是否被索引

  1. 进入Google Search Console
  2. 进入URL检测工具。
  3. 将需要索引的URL粘贴到搜索框中。
  4. 等待谷歌检测URL。
  5. 点击“请求编入索引”按钮。

image.png

收录

点击网址检查: 如果页面被索引，那么会显示“URL is on Google（URL在谷歌中）”。

image.png

如何去收录

image.png

但是，请求编入收录索引不太可能解决旧页面的索引问题，并且这只是一个最原始的方式，提交链接不能确保你的URL一定被收录，尤其是百度。

参考11个让百度快速收录网站的奇思淫技

站点地图

一旦您的站点上线，您可以创建另一种站点地图，称为 XML 站点地图。这是一个对用户没有帮助的站点地图，但明确用于搜索引擎。当 Google读取您的 XML 站点地图时，它可以帮助他们非常快速地了解您的站点的层次结构以及页面之间的关系。

就其本身而言，XML 站点地图对您的排名没有帮助。但是，您越能帮助 Google 了解您的网站，效果就越好！我们在我们构建的每个站点上都包含 XML 站点地图，并且我们努力确保 Google 可以找到它们。

image.png

sitemap.xml要放在网站的根目录

优化

点击 核心网页指标，输入网页后进行性能优化

image.png

诊断性能问题一般有以下几点:

  • 图片加载太慢
  • 图片压缩太严重，导致模糊
  • 文字和背景颜色相近，需要提升对比度
  • 图片缺少width、height、alt属性
  • 改进无障碍阅读

我们只需要按照诊断报告，进行改进即可!

总结

持续的优化和监测是关键，以确保你的策略和实践符合不断变化的搜索引擎算法和用户需求。

期待一个月后见分晓啦！

参考文献

  1. 11个让百度快速收录网站的奇思淫技
  2. search
  3. JavaScript与SEO之间的藕断丝连关系
avatar
文章
阅读
粉丝