静态网站制作教程
第一步:制作一个静态网页之前,我们需要先制作一个网页1:1的效果图,又称静态网页效果图。制作静态网页效果图可以使用Photoshop CS4破解中文版制作。
第二步:将制作好的静态网页效果图进行PS切片。通过PS切片可将一张大的效果图切成多张小图片,以后可直接用在网页上。
第三步:使用HTML5和CSS3进行网页布局
WordPress生成HTML静态化网站
之前,写过一个“WordPress的静态化方法”,使用的是一个名为cos-html-cache的插件实现。
这个插件非常简洁小巧,直接在原网站上生成首页和文章页的html文件,不过,这个插件只支持文章静态化,不支持页面、标签和分类的静态化,之后也再没有过更新。
后来,我想到过利用WordPress插件导出全静态化网站的方法,用这个方法,对于少量文章挺方便,但文章数量一旦多了,就经常出错。
后来,我看到有人在cos-html-cache插件的基础上又开发了一个插件,名叫Super Static Cache,我用了一下,发现其BUG较多,但Rewrite模式是可以正常使用的,在这个模式下,可以将首页、文章页、单页、分类页、Tag页都生成静态化文件,并保存在一个名为super-static-cache的目录下,直接复制这个目录即可得到一个静态化网站。
因此,一个更简单的生成静态化网站的方法来了,先在网站安装Super Static Cache,之后运行一个抓取网站的工具,这类工具很多,例如wget、sitemaps生成器之类的,把整个网站抓一遍(wget还能多生成一份),即可在super-static-cache的目录获取到网站的静态化Html文件。
wget在Windows、Linux、Mac都有,用wget下载网站的命令是:
wget -m 网站地址