【前端进阶学习】了解 SEO 基础,掌握提高网站的访问量小妙招~

158 阅读3分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第1天,点击查看活动详情

HTML + CSS + JavaScript 耳熟能详的前端三剑客。是入门的内容,但是需要了解的内容也不少,其中我们在上一阶段的时候看过三剑客的基础学习知识,那我们今天就来先仔细查漏补缺一下,关注一个要点:SEO基础!

SEO 全称:Search Engine Optimization,它是一种通过分析搜索引擎的排名规律,了解各种搜索引擎怎样进行搜索、怎样抓取互联网页面、怎样确定特定关键词的搜索结果排名的技术

前端要关注SEO的好处: 搜索引擎采用易于被搜索引用的手段,对网站进行有针对性的优化,提高网站在搜索引擎中的自然排名,吸引更多的用户访问网站,提高网站的访问量,提高网站的销售能力和宣传能力,从而提升网站的品牌效应。

优化SEO的两类方式

  • 黑帽:相对让用户不爽,不推荐了解~
  • 白帽:遵循搜索引擎的接受原则,一般是为用户创造内容。易于被搜索引擎机器人索引、并且不会对搜寻引擎系统有不好的影响

网站设计者在设计或构建他们的网站时出现失误以致该网站排名靠后时,白帽方法可以发现并纠正错误,譬如机器无法读取的选单、无效链接、临时改变导向、效率低下的索引结构等

实现步骤

//第一步:meta标签添加keywords、description

<meta name="keywords" content="欢迎一起学习前端进阶内容~"></meta>
<meta name="description" content="我是一位正在努力学习的产品同学,欢迎一起学习前端进阶内容~"></meta>

第二步:排名较高的网站中,挂上想要的网站链接
//建议:使用一些语义化标签,使得网络架构层次尽可能清晰

<head>
   <meta name="keywords" content=""></meta>
   <meta name="description" content=""></meta>
   <meta charset="utf-8">
    <title>test</title>
</head>
<body>
< header>
  <nav></nav>
</header>
<section>
  <aside></aside>
</section>
<footer></footer>
<body/>
</html>

来自各位大佬们的建议

  • 搜索引擎搜索时间短的情况:静态网页不具备交互功能,即单纯的信息介绍,而且准确,所以愿意收录,排名结果比较好。所以网站要尽量使用静态网页,减少使用动态网页~
  • 网站导航要清晰化:网站的导航需要便于蜘蛛程序进行索引收录,制作网站地图sitemap.html,在网页地图中列出网站所有子栏目的链接,并将网站中所有的文件放在网站的根目录下。网站地图可增加搜索引擎友好度,可让蜘蛛程序快速访问整个站点上的所有网页和栏目

写在最后

重新开始更文啦!最近忙了一段时间,终于继续可以学习!感谢大家的支持!我会继续努力坚持学习!养成了好习惯,每天必定会抽出时间多多少少学习前端知识~

以上习题&笔记从大佬们的论坛学习而来,特感谢大佬们的知识分享~ (学习技术知识,果然要看大佬们的技术博客,大家有好的推荐也欢迎指引我这个小白哈,感恩!)

附上学习链接,感谢这些大佬出题和解答: