前端需要注意和了解的SEO

2023-11-05

SEO的基本了解

1.什么是SEO?

SEO(Search Engine Optimization又叫做搜索引擎优化。是一种方式:利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名

2. 前端怎么理解SEO?

对于SEO引擎,在前端需要的是做出来的网站,页面,能快速被搜索引擎搜索,提升搜索时候网页的排名

看看一些例子(百度搜索引擎为例)

当我们在搜索框输入: seo

  进入第一个链接查看源代码

可以明显看到,网站的title,keywords等里面都含有seo相关的内容

3.前端在实现优化seo需要注意些什么

1. 合理的title, description, keywords (搜索对三项的权重是在逐个减小,title只需要强调重点,重要的关键词写在前面,且不要超过两次;每个页面的title要有所不同;description要长度合适;keywords列举出重要关键词即可)

2. 多使用语义化标签(header等),符合W3C的规范;语义化的标签会让搜索引擎更容易理解页面

3. 重要的内容放在前(搜索引起抓取是从上到下的,有的搜索引擎对抓取会有一定的长度限制)

4. 需要被搜索的不要用js输出(搜索引擎不会执行js获取的内容)

5. 少用iframe(搜索引擎不会抓取iframe的内容)

6. 非装饰性的图片加上alt

7. 提高网站速度(网站速度也是搜索引擎排序的一个重要指标)

其他注意点:

1. 例如前端如果是用vue框架写的,利用路由控制页面显示,只会爬取到首页index.html的内容,对搜索引擎是及其不友好的,如果是要想搜索引擎好,可以使用vue的服务器端渲染框架

2. 如果对引擎非常在意,也可以直接对接搜索引擎团队,他们会给出关键词啊各种的方案

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

前端需要注意和了解的SEO 的相关文章

  • 深入解析 YAML 配置文件:从语法到最佳实践

    一 认识YAML YAML YAML Ain t Markup Language 是一种人类可读的数据序列化语言 它的设计目标是使数据在不同编程语言之间交换和共享变得简单 YAML采用了一种简洁 直观的语法 以易于阅读和编写的方式表示数据结
  • 【前端】canvas图片加文字

    注释标记了操作步骤 import React Component createRef from react class CertifyImgRender extends Component bgRef createRef
  • Google 机器人使用 HTML5 模式路由在 AngularJS 网站上爬行

    我们有一个使用 HTML5 路由的 AngularJS 网站 我刚刚做了一些测试 Fetch as Google 运行 结果有点令人困惑 在获取选项卡上 我看到我们的网站在查看源代码中的样子 其中包含所有前端绑定 但并非所有呈现的 HTML
  • Microdata/Schema.org/SEO:如何正确设置 ContactPoint

    将微数据添加到页面后 我通常会转到 https developers google com webmasters structed data testing tool https developers google com webmaste
  • 如何处理 mod_rewrite 中查询字符串中的“#”?

    I asked 这个问题 https stackoverflow com questions 1640977 how to redirect old ugly urls to seo friendly ones关于将旧的 丑陋 链接重写为搜
  • 使用 slug 而不是 id 获取链接以成为 SEO 友好的 URL。将 Prismic io 与 Angular js 集成

    https github com heshamelmasry77 javascript angular starter https github com heshamelmasry77 javascript angular starter
  • Umbraco 7 SEO 标签

    我想在 Umbraco 中创建 SEO 标签的网站 我想知道它是如何做到的 有没有最佳实践文件或建议 我不是 SEO 专家 但希望下面的代码片段可以帮助您入门 Metadata 在页面上我添加了一些属性 如果您按照文档类型 通过继承或通过组
  • 谷歌索引页面加载后通过ajax或javascript检索的文本

    几个谷歌问题 1 谷歌是否有机会 看到 使用ajax检索的文本 用户从一系列选择框中进行选择 然后显示数据库中的一些文本 2 如果我使用javascript更改页面标题 在HEAD区域之外 谷歌会索引修改后的标题吗 抱歉 如果这些是琐事问题
  • 对重复内容不显示是否会影响 SEO/语义?

    重复内容上的 Display none 是否会影响 SEO 语义 假设您正在构建一个移动优先的响应式网站 在较小的断点处 您选择显示页面的标题标语 h1 在主要英雄横幅中 但是 稍后您希望在同一位置显示公司徽标 并在子横幅中显示您的口号 例
  • 限制 Wordpress 中现有和新的永久链接 slugs 的大小以进行 SEO

    我在 Google 上读到一篇文章 其中提到为了良好的 SEO 最好将 URL 中的 slug 大小限制为 5 个单词 当我使用 WordPress 时 链接会自动分配给文章标题 要仅用 5 个字重做所有链接 我必须花费数月时间来编辑博客上
  • Google 如何确定将页面索引为讨论页面? [关闭]

    Closed 这个问题是无关 help closed questions 目前不接受答案 我正在自己建立一个问答网站 我想让这个网站被Google索引为问答网站或论坛 可以在使用Google中的 讨论 时检索到 根据我的个人经验 当我想获得
  • 是否可以使用 javascript 或 jQuery 进行 301 重定向?

    我正在运行 Apache 2 0 我只是想知道是否可以使用 JavaScript 或 jQuery 进行 301 重定向 我有一个 a a 标记为href到指定位置 当我单击该链接时 系统会要求我进行 301 重定向 这是为了 SEO 我正
  • rel-canonical 还应该包括协议 (http/https) 吗?

    我正在将我的网站从 http 迁移到 https 尽管它仍然支持通过 http 访问 目前我的所有页面都在 HTML 中设置了准确的 rel canonical 元标记 但显然它们都指向规范的 http url 我现在是否也应该将它们更新为
  • 什么是“友好 URL”? [关闭]

    Closed 这个问题是与编程或软件开发无关 help closed questions 目前不接受答案 我最近 在本网站和其他地方 阅读了大量有关 友好 URL 的讨论 但我不确定究竟是什么使 URL 变得 友好 以及为什么我们真正关心
  • SEO 友好的 URL 真的会影响页面的排名吗? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 如今 SEO 友好的 URL 非常流行 但它们实际上对 Google 和其他搜索引擎中的页面排名产生有意义的影响吗 如果是这样 为什么 如
  • URL 重写查询数据库?

    我试图了解 URL 重写的工作原理 我有以下链接 mysite com profile php id 23 我想用用户的名字和姓氏重写上面的网址 mysite com directory liam gallagher 然而 根据我读到的内容
  • 搜索引擎可以读取 CSS 吗?

    我用标签来表示句子的重要性 然而 它破坏了页面风格的一致性 所以我用CSS把它改回来 结果是 对于访问者来说是相同的 但对于搜索引擎 SE 来说 显然是不同的 这正是SE们所烦恼的 所以我的问题是SE们能否读取CSS 并用它进一步判断整个页
  • mysql 查询从给定的表结构创建 SEO 友好的 url

    我正在尝试使用下表创建 SEO 友好的 URL 类别表 http sqlfiddle com 2 c474a 4 页表 http sqlfiddle com 2 c474a 5 我正在尝试编写一个 mysql 查询 该查询将使用产生以下输出
  • 对于 SEO 而言,.html 扩展名是否比 .php 和 .aspx 更好?

    对于 SEO 而言 html 扩展名是否比 php 和 aspx 更好 或者少扩展名的 url 比全部更好 该扩展对排名和所有 SEO 影响不大 您页面的扩展名可能不一定表明内容是如何生成的 PHP 或 ASPX 虽然通常具有动态内容 但始
  • 谷歌如何知道你正在伪装?

    我似乎找不到任何有关谷歌如何确定您是否是的信息你的内容 从技术角度来看 您认为他们是如何确定这一点的 他们是否发送了 googlebot 之外的其他内容并将其与 googlebot 结果进行比较 他们有人类团队进行比较吗 或者他们可以以某种

随机推荐

  • Qt中的焦点事件

    在应用程序中 都会有一个当前窗口 即当前获得焦点事件的窗口 这个窗口可以接受键盘的输入 当应用有多个窗口时就要使用焦点事件了 Qt中有很好的焦点事件管理 我在这里抛砖引玉了 一个空间要先设置它焦点事件的模式 即窗口如何接受焦点事件 通过鼠标
  • vue-phone-preview实现鼠标移至图片上显示遮罩层

    vue phone preview实现鼠标移至图片上显示遮罩层 1 将遮罩层html代码与图片放在一个div 我是放在 img div里 div class img div img src images paella dish jpg a
  • x-www-form-urlencoded 如何处理

    x www form urlencoded 是post 提交方式的一种 请求方法 getData 对象格式转换 var formData new FormData formData append id this propsData id l
  • 汽车保养项注意

    汽车型号 发动机 EA211 车型 New Lavida FL 1 6L AQ160 Trendline csra是发动机具体型号ea211是统称 前置前驱 Front engine Front wheel drive layout FF
  • (转)多媒体通话杂谈:SBC设备(边界会话控制器)全面剖析讲解

    地址 http blog sina com cn s blog 4ca9ceef0102xoaz html SBC概述 Session Border Controller 即会话边界控制器SBC已经逐渐成为NGN和IMS网络的标准配置产品
  • 简单的个人健康记录系统(Android+Web)

    开发工具及环境 Eclipse SQL Server JDK JRE Android SDK ADT 前期工作准备 1 搭配Java开发环境 2 配置Android开发环境 3 在Eclipse里安装ADT插件 开发的个人健康记录系统是个什
  • prototype.js开发者手册全集

    Prototype 是一个开源的 javascript 开发框架 里面封装了大量可以加快开发速度的方法 例如使用 div 代替getElementById div 封装了xmlhttprequest等 许多语言的开发框架如 Ruby on
  • 认识泛型和通配符

    一 泛型 1 泛型的概念 泛型是指多种数据类型 是将数据类型参数化 例如将整形 字符型 字符串类型 引用类型 浮点型 自定义类型等作为参数来传输 在了解泛型之前我么先看一个案例 实现一个类 类中包含一个数组成员 使得数组中可以存放任何类型的
  • 从30岁到35岁:为你的生命多积累一些厚度

    你所有不曾料想过的问题 都会随着时间的推移而与你不期而遇 你所有曾经潇洒的随遇而安 同样也会随时间流逝而让你承担那些似乎命中已经注定的代价 在这 个世界上 唯一不可阻挡的是时间 它像一把利刃 无声地切开了坚硬和柔软的一切 恒定地向前推进着
  • Uncaught ReferenceError: process is not defined

    最近在搞老项目升级 将Vue2 6 11里的vuecli5 0 8升级到vite最新版本4 4 9 中间遇到不少问题 有机会以后做记录 遇到问题 把所有的工作就搞好项目也成功的跑起来 页面一片空白 打开控制台 Uncaught Refere
  • Ubuntu18.04+CUDA10.2 深度学习开发环境配置指南

    深度学习 Author louwill Machine Learning Lab 搞深度学习环境永远是第一步 显卡与服务器等硬件设备装机完成后就需要配置本机环境 本篇配置主要包括Nvidia驱动安装 CUDA安装和深度学习与Python环境
  • profibus 主站软件_S7-1500作为DP从站连接到第三方DP主站的方法

    要将S7 1500自动化系统作为PROFIBUS DP从站接入到第三方自动化系统的DP主站系统中 必须使用CM 1542 5或CP 1542 5并设置PROFIBUS 相关参数 才能实现S7 1500与第三方自动化系统的数据交换 本文通过一
  • 解决QT Creator交叉编译提示make:arm-linux-g++:Command not found 命令找不到

    解决QT Creator交叉编译提示make arm linux g Command not found 命令找不到 初学QT 用QT Creator写了一个小程序 使用ubuntu 11 编译工具使用arm none linux gnue
  • Vue实现多文件上传

    一 需求说明及展示 通过vue和element实现多文件上传 二 实现步骤 代码片
  • 最基本的Linux下C++的编译和make

    1 g 的简单用法 维护过一段时间的Linux下的C 项目 makefile等都是自动生成的 印象中这个makefile比较短小精干 会引用其他的makefie 以及加些编译的路径 我也能写项目的心需求 或改项目的bug 不过不是很明白它具
  • DIP及CV代码练习(1):图像16倍下采样

    下采样和上采样是图像处理中经常碰到的操作 所以对这部分代码的熟悉应该是基本功中的基本功 上采样的基本原理是插值 实际开发中由于受限于性能和耗时的需求 还是线性的插值用得比较多 与上采样相比 下采样的基本原理更为简单 以16倍下采样为例 相当
  • AIGC-Stable Diffusion Webui-AI作画初体验

    一 项目地址 传送门 github stable diffusion webui 二 安装方式 本地安装 or Google Colab 下文介绍中关于安装的部分均以本地安装为例 本地安装 1 git 2 python 推荐3 10 8 3
  • chunk 15 [mini-css-extract-plugin],加载顺序错误导致的警告

    项目运行时 mini css extract plugin 警告 注意看这两个文件 在项目中找到引用的位置 交换一下顺序 重新运行即可
  • 一个阿里巴巴码农的六年回眸

    原文地址 http kb cnblogs com page 160480 本文由淘宝开放平台技术产品负责人 放翁 文初撰写 它讲述了一个个冷冰冰产品背后的活生生的人了 也在讲述着一个码农的六年心路历程 技术耐得住寂寞 低谷积累高峰冲刺 主动
  • 前端需要注意和了解的SEO

    SEO的基本了解 1 什么是SEO SEO Search Engine Optimization又叫做搜索引擎优化 是一种方式 利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名 2 前端怎么理解SEO 对于SEO引擎 在前端需要的是做出