前端标签优化要点

Posted by

一般来说网站的开启速度是很多网站都面临的优化难题。其实市面上的诸多网站都没有进行刻意优化加载速度,使得网站的用户体验无法获得实质的提升。而关于网站的速度优化,除了服务器方面的问题外,很多都属于前端代码方面的优化。那么下面我们就来简要的说明一下。


一、前端代码的优化要点。
在前端代码开发时,CSS、JS以及HTML需分离开发,并做好代码的精简工作,从而使得搜索引擎更加利于抓取内容。而网站的目录结构一般不要设置过深,一般设置3层为最佳,这样能更利于蜘蛛的爬取。而关键词的设置的密度一般需设置在2%-8%为宜,而搜索引擎蜘蛛通常对于JS与flash的识别会比较困难,并且不会去爬取iframe里的内容。因此大家在这些方面要注意。
二、标签优化要点。
<br>标签的使用最好只用于文本内容的换行,而<caption>则应该使用表格标题标签,<img>图片标签由于搜索引擎蜘蛛无法识别图片,因此大家应注意添加alt属性。而<b>、<i>标签只是用于显示效果时使用,因此其在SEO优化中的作用比较有限。另外要将比较重要的内容的html代码放在最前面,从而优先让蜘蛛进行读取,这样可有效保证重要内容被抓取。而搜索引擎通常也会滤掉display:none的内容。
而<title>标签通常在搜索引擎中的权重是较高的,因此大家在编写时要特别注意。<meta description>标签的描述信息,建议字数需控制在300字左右,并且关键词的最核心词汇需出现在前150字内最佳。<meta keyword>biaoqian 页面的关键词,一般设置为3-5个最佳。在标签的语意化方面,应合理的利用好标签布局:nav、article、ul、li等,并且有些好的代码设置不会出现一个div标签。而<a>标签则需要加上title属性加以说明,而外链则最好加上nofollow属性,从而有效避免网站像其他网站输出权重。而<h1>标签由于其权重仅次于title,则最好只在页面出现一次。
三、CSS Sprites
用通俗的话说就是图片的合并,就是将网站中比较常用的小图片,合并到一张图片上,然后利用CSS技术来分别调用不同的部分,这样可大大减少HTTP的请求数量,且在网页加载时提升速度。
四、启用Keep-Alive属性。
该属性大家可以理解成长连接,在没有启动该属性时,浏览器向服务器请求的conncetion是时断时续的,其会在执行一次HTTP请求后马上断开这个连接,而在启用该属性后,这个连接通常可以保持一段时间,从而提升整个页面的加载速度。

Leave a Reply

电子邮件地址不会被公开。 必填项已用*标注