前端之SEO搜索引擎优化

简介: 前端之SEO搜索引擎优化

什么是SEO

SEO(search engine optimization)搜索引擎优化

SEO是端开发人员在网站设计和开发过程中,通过优化HTML、CSS、JavaScript等前端代码,以及网站结构、页面布局、内容结构、URL等方面,来提高网站在搜索引擎中的排名和可见性。

通过优化网站结构,可以提高网站的可用性和导航性,从而更容易为搜索引擎蜘蛛抓取和索引网站内容。

SEO 优化的方法

  • 合理的title、description和keywords

title:只强调重点,重要关键词出现不要太多,每个页面title要不一样。

description:相当简述自己的重要内容,长度要合理,每个页面description要不一样。

keywords:描述出几个重要关键词

亿点小知识:以上的三个方法 不要过多堆关键词,反而会适得其反合理突出即可

语义化书写HTML代码,符合W3C标准

万维网联盟(外语缩写:W3C)标准不是某一个标准,而是一系列标准的集合。

网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)。对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript等。这些标准大部分由W3C起草和发布。

合理的使用标签H1、H2、a、header、nav、nav等标签

<h1>标题</h1>
<h2>副标题</h2>
<a scr=''>链接</h2>
  • 为图片加上alt属性
    alt 属性可以在图片未成功显示时候,使用文本来代替图片的呈现,使爬虫可以抓取到这个信息。
  • icon 图标
  • 后缀.ico的图标格式
<link rel="shortcut icon" href="log.ico" type="image/x-icon">

保留文字效果

利用CSS截取字符

提升网站速度

为图片设置高度和宽度,可提高页面的加载速度

为静态资源文件增加过期时间,让用户通过本地缓存来更快的访问网站

减少大改版的频率

压缩、格式化代码

使用CDN 网络,可加快用户访问速度

启用GZIP压缩,浏览速度变快,搜索引擎的蜘蛛抓取信息量也会增大

做 404 页面,不仅提高蜘蛛体验,也提高用户体验

服务端渲染需要SEO的HTML页面

扁平化网站结构

扁平结构是与树状结构对立的一种网页结构,网页之间并没有明显的层级关系,在栏目或组织结构已明确的情况下,通过减少管理层次的组织结构。

简单来说就是少量的栏目层级划分,并直接已内容页层级进行展现,有利于提高信息的快速传递,使尽快的发现信息所展示的问题

结尾

SEO优化其实重要的是内容质量、网站速度、高质量的外部链接和适度的优化,才是网站的曝光和流量的根本

2023年6月6日,百度官方宣布了一项重要的收录新规则:

1.收录质量要求更高:百度将进一步提升收录质量要求,对于内容质量低下、存在严重问题的网站将不再收录。

2.收录速度更快:百度将加强爬虫效率和数据处理能力,提高收录速度。

3.收录深度更大:百度将逐步提升对网站深层次内容的收录能力,进一步提高搜索结果的全面性和准确性。

以上就是前端之SEO搜索引擎优化感谢大家的阅读

如碰到其他的问题 可以私下我 一起探讨学习

如果对你有所帮助还请 点赞 收藏谢谢~!

关注收藏博客 作者会持续更新…

相关文章
|
6月前
|
前端开发 搜索推荐 UED
前端需要注意哪些 SEO (详细)
前端需要注意哪些 SEO (详细)
|
8月前
|
前端开发 搜索推荐 JavaScript
前端SEO优化的实用指南
前端SEO优化的实用指南
230 0
|
11月前
|
搜索推荐 前端开发 JavaScript
前端SEO的知识,你get到了吗
seo是前端工程师需要掌握的一些知识,但是现在都是前后端分离开发,客户端渲染,而国内百度的搜索引擎又不太能打,因此,对这方面没怎么深入,后来因为学习了一些服务端渲染框架next/nuxt,才重新进行了一些了解
|
数据采集 JavaScript 前端开发
前端面试题Vue 项目如何进行 SEO 优化
前端面试题Vue 项目如何进行 SEO 优化
344 0
|
8月前
|
Web App开发 前端开发 JavaScript
前端学习笔记202307学习笔记第五十七天-模拟面试笔记react-fiber解决了什么问题
前端学习笔记202307学习笔记第五十七天-模拟面试笔记react-fiber解决了什么问题
95 0
|
8月前
|
前端开发 定位技术
前端学习笔记202305学习笔记第二十三天-地图单线程配置
前端学习笔记202305学习笔记第二十三天-地图单线程配置
65 0
前端学习笔记202305学习笔记第二十三天-地图单线程配置
|
8月前
|
前端开发 API
前端学习笔记202307学习笔记第五十七天-模拟面试笔记react-react-redux的工作流程
前端学习笔记202307学习笔记第五十七天-模拟面试笔记react-react-redux的工作流程
55 0
|
8月前
|
前端开发
前端学习笔记202306学习笔记第五十一天-工厂模式4
前端学习笔记202306学习笔记第五十一天-工厂模式
34 0
|
8月前
|
前端开发
前端学习笔记202305学习笔记第二十八天-数组结构之列表拖拽改变顺序4
前端学习笔记202305学习笔记第二十八天-数组结构之列表拖拽改变顺序4
32 0
|
4月前
|
前端开发 JavaScript
《Webpack5 核心原理与应用实践》学习笔记-> 构建微前端应用
《Webpack5 核心原理与应用实践》学习笔记-> 构建微前端应用
41 1