博客搜索引擎优化(博客优化优化之前优化优化优化＝＝ )

　　博客搜索引擎优化(博客优化优化之前优化优化优化＝＝

)

　　前言

　　刚开始建博客的时候，觉得挺好玩的，但是玩了半天，问题就渐渐出来了，就像谈恋爱了==。比如现在访问博客，感觉慢得要死。不可否认，使用hexo搭建服务器方便快捷，但由于使用github作为服务器，也会有速度稍慢的代价。既然不能放弃github，只好另寻出路。作为前端，我们在哪里可以自己优化呢？

　　注意：如果你想拥有自己的博客，你可以来这里。***

　　首先说一下我们在面试中经常遇到的一个问题。在浏览器中输入url打开页面怎么办？

　　分析

　　从上面的流程可以看出，其实大部分流程都是我们无法控制的。我们只能从浏览器端入手，寻找一些可以做的事情。所以，我们能做些什么？

　　优化前的博客优化

　　优化前可以用百度统计平台（界面太丑，但是功能还可以==）对你的网站做一些评测，比如测速，并给出优化建议，以下是我的测试结果：

　　

　　他还会告诉我们网站访问慢的原因，以便我们对症下药，如下图：

　　

　　使用 gulp 进行优化

　　从上图可以看出，慢是不能接受的，不优化是不能接受的。因此，我尝试做一些优化，主要是使用gulp及其一些插件来压缩js、css、img等文件。以下是我添加的 gulpfile.js 文件：

　　var gulp = require('gulp'),

uglify = require('gulp-uglify'),

rename = require('gulp-rename'),

cssmin = require('gulp-minify-css'),

imagemin = require('gulp-imagemin');

//JS压缩

gulp.task('uglify', function() {

return gulp.src('././public/js/*.js')

.pipe(uglify())

.pipe(gulp.dest('././public/js/'));

});

//public-fancybox-js压缩

gulp.task('fancybox:js', function() {

return gulp.src('././public/fancybox/jquery.fancybox.js')

.pipe(uglify())

.pipe(gulp.dest('././public/fancybox/'));

});

//public-fancybox-css压缩

gulp.task('fancybox:css', function() {

return gulp.src('././public/fancybox/jquery.fancybox.css')

.pipe(cssmin())

.pipe(gulp.dest('././public/fancybox/'));

});

//CSS压缩

gulp.task('cssmin', function() {

return gulp.src('././public/css/style.css')

.pipe(cssmin())

.pipe(gulp.dest('././public/css/'));

});

//图片压缩

gulp.task('images', function() {

gulp.src('././public/img/*.*')

.pipe(imagemin({

progressive: false

}))

.pipe(gulp.dest('././public/img/'));

});

gulp.task('build', ['uglify', 'cssmin', 'images', 'fancybox:js', 'fancybox:css']);

　　优化后

　　优化后，每次添加 文章 后，在编译和发布之间还需要一个命令来压缩这些文件。总而言之，细节如下：

　　hexo clean //清除public文件夹

hexo g //编译文章，生成public文件夹

gulp build //压缩js、css、img文件

hexo d //部署到github

　　最后测试一下网站的访问速度。可以看出，它比以前快了很多。截图如下：