前端开发如何做好SEO优化的工作

前端开发工程师不仅需要要跟视觉设计师、交互式设计师配合,完美还原设计图稿,编写兼容各大浏览器、加载速度快、用户体验好的页面。现在还需要跟SEO人员配合,调整页面的代码结构和标签。

一些成熟的平台,在开发初期并没有考虑优化问题,所以做出来的页面,就算是效果很炫,功能很强,但是对搜索引擎非常的不友善。任何一个成熟的网站,后期页面都是动辄几百万的,到这个时候再来调整结构,既费时又费力,最怕的还是会影响到排名和收录。

所以说与其在后期碰到问题再来调整,还不如把问题解决在源头。我本人也是从事前端开发工作的,下面把我工作过程中,积累的几个开发过程中就需要做好的SEO优化技巧,分享给大家。

1、简化代码结构,更利于搜索引擎分析抓取有用内容:页面尽量采用DIV+CSS,当然,表格展现模式用table还是比div方便很多的;所有js、css采用外联方式,图片采用css精灵,减少请求次数。看下下面同样的内容,用div和talbe布局的代码比较,显而易见用div简便的多。

 

2、重要内容优先加载(第一个链接最好是网站主关键词,不刻意要求),可以用css来处理,索引一篇文章的长度也是有限制的,一定要把最重要的内容,优先展现给蜘蛛,这方面你可以通过查看一些比较大的网页快照来求证。

 

3、每个页面只能出现一次H1标签,H2标签可以多次:H1权重很高,普遍认为仅次于title,一般资讯详情页的标题、商品详情页的标题,都放在H1里。

 

4、图片一定要添加alt属性,title属性可选:蜘蛛不认识图片上的内容,只能通过alt属性来判断,如果是商品列表页,所有商品都加了alt和title的话,容易造成堆砌关键词,所以我一般是只加alt属性。

 

5、图片大小声明:如果图片大小不做定义的话,页面需要重新渲染,就会影响到速度。

6、链接可根据实际需求添加title属性以及nofllow值;非特殊性链接,链接地址一定要写入herf属性,有些前端开发人员为了省事,直接用div加个click事件当链接,在视觉上和使用上确实是实现了链接效果,但是做过SEO优化的人员都知道,蜘蛛目前对于js的支持很差,基本无法读取里面的链接地址。所以说用click事件是绝对不允许的,特别是一些重要的导航链接。

 

7、页面内容尽量不要做成flash、图片、视频,这些东西蜘蛛是抓不到的,就算是必须的,也要生成相应的静态页面。有很多企业站看着很炫,全站flash,老板看着是爽了,做SEO优化的人员就要抓狂了,全站没一个链接。

8、除首页外别的页面最好要加上面包屑型导航,导航结构一定要清晰。

 

9、做好404页面,一般会加首页链接及错误提示,并测试其返回状态码为404:1、用户体验友好,可以留住用户,不至于直接关闭页面;2、蜘蛛友好,可以返回抓取其他页面。

 

10、网站结构呈扁平状树型,目录结构不宜过深,每个页面离首页最多点击不超过3次,过深不利于搜索引擎的抓取。

转载于:https://www.cnblogs.com/jessiecaisme/p/3256501.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/493862.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

支持向量机学习

与逻辑回归和神经网络相比,支持向量机,或者简称 SVM,在学习复杂的非线性 方程时 供了一种更为清晰,更加强大的方式 如果我们用一个新的代价函数来代替,即这条从 0 点开始的水平直线,然后是一条斜 线,像上图。那么,现在让我给这两个方程命名,左边的函数,我称之为cost1(z),同时,…

中国安防行业十年报告:产值增涨四倍!双巨头全球称雄

来源:智东西近年来,安防是一个快速增长的行业, 过去十年, 复合 17%的行业增长率证明了行业的持续性,龙头份额提升持续获得超越平均的增速。 根据历史数据, 2008 年至 2017 年, 十年内中国安防行…

从零开始:iOS(三)

整理一些Objective-c相关知识. c#与objective-c对照着看,一步一步来.重点在oc上. 1:新建类. /*C#*/public class Person{private string name;public string GetName(){return name;}public void SetName(string value){name value;}public static void SayHello(){ /*print h…

聚类算法学习

聚类是一种非监督学习方法 在一个典型的监督学习中,我们有一个有标签的训练集,我们的目标是找到能够区分正 样本和负样本的决策边界,在这里的监督学习中,我们有一系列标签,我们需要据此拟合一 个假设函数。与此不同的是,在非监督学习中,我们的数据没有附带任何标签,我们拿到…

斯坦福大学:极限工况下的无人驾驶路径跟踪|厚势汽车

来源: 同济智能汽车研究所责任编辑:啜小雪文章译自 2017 年美国控制年会的会议论文原标题:Path-Tracking for Autonomous Vehicles at the Limit of Friction原作者:Vincent A. Laurense, Jonathan Y. Gohand J. Christian Gerdes…

SQLite DBHelp

c#连接SQLite SQLite这个精巧的小数据库,无需安装软件,只需要一个System.Data.SQLite.DLL文件即可操作SQLite数据库。SQLite是一个开源数据库,现在已变得越来越流行,它的体积很小,被广泛应用于各种不同类型的应用中。S…

手写数字识别实现

本文主要实现手写数字识别,利用多类逻辑回归与神经网络两种方法实现 Multi-class Classification 数据源 There are 5000 training examples in ex3data1.mat, where each training example is a 20 pixel by 20 pixel grayscale image of the digit. Each pixe…

Science:若DTC基因检测达2%成年人群,几乎所有人的身份或将无所遁形

来源:测序中国摘要:直接面向消费者(DTC)的基因检测不仅仅是有趣那么简单,它的有用性随着样本数据库的积累,会逐渐显露出来。消费级基因检测,即直接面向消费者(DTC)的基因…

QT 获取屏幕尺寸的法子

#include "QDesktopWidget" QDesktopWidget* desktopWidget QApplication::desktop(); QRect deskRect desktopWidget->availableGeometry(); //可用区域 QRect screenRect desktopWidget->screenGeometry(); //屏幕区域 int w screenRect.width(); int …

降维算法学习

降维的动机 首先,让我们谈论降维是什么。作为一种生动的例子,我们收集的数据集,有许多, 许多特征,我绘制两个在这里。 假设我们未知两个的特征 x1:长度:用厘米表示;X2,是用英寸表示同一物体的长度。 所以,这给了我们高度冗余表示,也许不是两个分开的特征 x1 和 X2,这两个…

年龄大了学Java是爱好还是转型?

年龄大了学Java是爱好还是转型? 一、前言 35岁,好像年龄也不小了,工作也有十年多了,一直搞编程,也已经做过几年研发管理。较多使用的是Delphi语言,对这门语言曾经一度的情有独钟。那是我十年前的一…

人类为什么更聪明 | 人脑神经元关键结构差异被揭示

来源:DeepTech深科技人脑中,数以千计的神经元间电信号交替传送不断,而长短不一的树突(神经元胞体延伸)在神经元信息整合中起到了关键作用,由此我们的大脑细胞才能正常反应运作。而这次,MIT 的神…

机器学习之异常检测

问题的动机 什么是异常检测呢?为了解释这个概念,让我举一个例子吧: 假想你是一个飞机引擎制造商,当你生产的飞机引擎从生产线上流出时,你需要进行 QA (质量控制测试),而作为这个测试的一部分,你测量了飞机引擎的一些特征变量,比如引擎 运转时产生的热量,或者引擎的振动等等。…

美国《科技与未来城市报告》对中国智慧城市建设的启示

作者:王波、甄峰、卢佩莹来源:科技导报在全球范围内,美国一直引领信息通信技术等科技领域的发展。2008 年全球金融危机后,美国IBM 公司在《智慧地球:下一代领导人议程》主题报告中首次提出“智慧地球”理念&#xff0c…

SVM实现邮件分类

首先学习一下svm分类的使用。 主要有以下步骤: Loading and Visualizing DatajTraining Linear SVM Implementing Gaussian KernelTraining SVM with RBF Kernel 选择最优的C, sigma参数 画出边界线 线性keneral实现 C 1; model svmTrain(X, y, C, linear…

机器学习之推荐系统

我们从一个例子开始定义推荐系统的问题。 假使我们是一个电影供应商,我们有 5 部电影和 4 个用户,我们要求用户为电影打分。 基于内容的推荐系统 在一个基于内容的推荐系统算法中,我们假设对于我们希望推荐的东西有一些数据,这 些数据是有关这些东西的特征。 在我们的例子…

低潮过后,未来医疗可穿戴市场将如何发展?

来源:资本实验室在过去几年中,以智能手表为代表的可穿戴设备市场从快速爆发,并吸引全球厂商趋之若鹜;到如今平缓发展,众多厂商黯然离场,经历了一轮过山车般的炒作周期。但可穿戴设备市场难道只是看上去很美…

js控制文本框中的字符数

function checkLength(which,remainderNum,maxChars) {if (which.value.length > maxChars)which.value which.value.substring(0,maxChars);var curr maxChars - which.value.length;document.getElementById(remainderNum).innerHTML curr.toString(); } 转载于:https:…

大规模机器学习

如果我们有一个低方差的模型,增加数据集的规模可以帮助你获得更好的结果。我们应 该怎样应对一个有 100 万条记录的训练集? 以线性回归模型为例,每一次梯度下降迭代,我们都需要计算训练集的误差的平方和, 如果我们的学习算法需要有 20 次迭代,这便已经是非常大的计算代价。 …

中国半导体:存储器能否打破海外垄断?

来源:中金公司摘要:根据WSTS的统计,全球存储器行业营收2017年达到1319亿美元,占半导体行业收入的30.1%,过去五年(2012-2017)年复合增长率高达37%。▌全球市场概览:千亿美金市场,寡头竞争,IDM模式…