【CMS建站】写给大家看的网站制作教程03—零基础学网站制作的简单入门指南...

作者 | 杨小爱

来源 | web前端开发（ID：web_qdkf）

在上一篇《【CMS建站】写给大家看的网站制作教程02—网站制作的工具介绍与下载安装》文章中，我详细的讲解了关于制作一个在线网站需要用的工具。

今天我再来介绍一下，在我们正式开始制作一个网站时，我们需要的掌握的一些知识技能。

01、HTML/CSS/JS知识的学习

我们做一个网站，除了软件工具的学习外，其次就是代码知识的学习，对于一个网站，我们用到的代码知识，最基础的就是HTML、CSS、JavaScript了，而对于HTML、CSS、JavaScript的基础知识的学习，你可以到 www.w3school.com.cn 上学，可以边学边练，每章后还有小测试。

你也可以通过碎片时间到公众号的图文系列教程进行基础知识的学习，同时还可以购买一些建站的入门书籍来进行阅读。

因为我也是自学的建站知识，因此，我最开始学习这个知识，主要是在www.w3school.com.cn 和www.51zxw.net上进行学习，每天一边看一边练习，等到后来，我也购买了一些网络课程进行学习，这个课程就会比较系统，特别适合进行系统学习一门技能。同时，还阅读了一些关于HTML，CSS，JavaScript方面的图书。

直到我自己觉得练习也写得差不多了，我就开始去模仿写一些网站静态页面。

而JavaScript知识的学习，如果没有其他编程语言基础的话，学起来可能要费些力，但我还是建议你先在 w3school上学习。

如果自己能够坚持学下来，然后再考虑购买一些网络课程和图书，如果网站上的知识，你都没有办法坚持学下来，觉得它太枯燥了，那看书或者看课程，你也一样会觉得无趣，毕竟，很多基础理论的知识，都是比较枯燥的。

还有就是在学习JavaScript的时候，你也需要同时学点jQuery 的知识，这个可以帮助你提升学习信心。

jQuery 它是一个 JavaScript 库，jQuery 极大地简化了 JavaScript 编程，很容易学习。

例如，你引入库以后，可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素，可以实现元素的淡入淡出效果，可以在元素上创建滑动效果等等。

当然，如果到了后面，你的CSS知识学得比较扎实的话，建议能用CSS实现的，就不要用JavaScript 实现，这么做的目的主要是为了便于SEO优化。像二级菜单，图片轮播，鼠标滑动显示文字，排序等等效果，只要能够用CSS实现的，就尽量不要用JavaScript来写。

但是，你在学习的过程中，要尽量尝试用多种方式来实现。

另外，就是在学习中，遇到一些问题，这个是非常正常的，但是，你要学会先自己调试解决，如果解决不了，就上百度或者谷歌（谷歌需要梯子才可以上）搜一下，看看别人写的经验方法，也可以到w3school上查文档。

能自己解决的就自己解决，这样你会有印象，在看别人经验方法的同时，你还能增加印象，下次遇到这类问题就能迎刃而解。

02、重点学习一种CMS建站程序

既然，我们是学习怎么用CMS来构建自己的网站，所以在这个系列教程中，我们需要重点学会一种CMS建站程序。

在这个教程中，我会重点讲解帝国CMS，当我们学会了一种CMS后，我们再去学习其他的建站程序，我们也会感觉容易很多，对于其他CMS程序也会比较容易上手。

为啥我要在这个教程里推荐使用帝国CMS，主要是帝国CMS的安全性比较好，而且学习成本也会低很多，只要你会写静态页面了，你就可以把这个静态页面变成你的网站模板。

并且，帝国CMS，也是比较流行的一种建站程序，同时，也是很多站长和博主们比较喜欢使用的一种建站程序，网络上有大量的模板，以及问题的解决方案，当你遇到问题时，你可以通过网络来需求解决办法，而不用一个人独自在那里苦思冥想。

当然，除了帝国CMS外，目前比较流行的CMS也有很多，像Dedecms，WordPress，苹果CMS，这些CMS也是各有各的优势与劣势。没有说，那种最好，那种不好，主要还是看自己更加喜欢那种，或者说那种程序更加能够满足你的需求。

当你学会帝国CMS后，如果你还有兴趣的话，你也可以自行去研究一下其他就几种程序。

在我列举的这几款CMS里，我除了苹果CMS没有使用过外，其他几款都体验过，总体使用下来，还是觉得帝国CMS比较好用，这个也是我为什么会在这个教程里推荐学习帝国CMS的原因。

除此之外，我们还需要懂点美学，设计的知识。因为我们不仅要会做网站，我们还需要做得好看，毕竟，在这个看脸的时代里，颜值还是非常重要的，哪怕它只是一个网站，如果能够让它脱颖而出也是我们作为一个建站人需要考虑的问题。

03、多看各种漂亮的网站模板和案例

当我们学会了HTML、CSS、JavaScript 、jQuery这些技术后，我们就需要学以致用，练习写一些静态页面。在刻意练习写静态页面之前，我们需要多看一些漂亮的站点，看它的网页布局与网页源码。

因为我们写的每一个网页练习页面时，它都不是我们凭空想出来的，它都是有一些参考案例或者素材来源的。

其实，在我们的实际工作中，我们的网页设计师在设计一个网页时，也是需要收集大量的参考案例，把他们认为好的网页收藏起来进行参考，然后再根据需求做一些网页效果图。

而我们自己在写页面代码练习的时候，也是需要遵循这样一个过程，先做一个简单的网页效果图，哪怕你只是把一些你认为好看的网站页面进行截图保存下来，然后再到PS里进行拼接，也比你空想或者一边写一边想要来得高效快捷。

如果你不知道去那里找好看的页面进行练习，那就多看各个大公司的官方网站，其次，就是到花瓣网，酷站，dribbble等各大设计素材类网站上去找灵感。

04、刻意练习，模仿别人的站点，将页面实现还原

我们有了技能，也有了素材后，接着，我们就需要利用所学的知识技能进行刻意练习，开始写网站静态页面。

与此同时，我们还需要多看别人的实现源码以及网站布局。如果我们想做一个自己的个人博客的话，我们就需要去看各种各样的个人博客网站，看他们的页面布局，网站源码，以及网页色彩的搭配等等。

如果我们想写一个企业网站也是一样，先去看一下行业里其他企业的官网，然后根据自己的需求，进行写页面布局。

另外，网站页面的代码实现都是根据网页设计效果图来做的，如果你实在不想学习PS的话，觉得PS拼接效果图麻烦的话，又想节约学习时间，那我建议你就直接模仿别人的站点来进行页面布局代码的练习。

我这里说的模仿别人的站点，不是说让你鼠标右键另存为，或者用仿站工具，直接把别人的网站源码下载下来，照搬别人的代码，而是参考他人的页面设计效果，自己写HTML布局，写CSS样式，写JavaScript交互效果。

如果实在写不出来，你可以查看一下别人的源码，直接按键盘【F12】审查元素，看看别人怎么写的，千万不要复制别人的代码，一定要自己一行一行的敲出来，这样你才会有印象。

特别是对于想走前端开发路线的朋友来讲，真的特别重要。

我们采用刻意练习来模仿别人站点页面的目的，是为了帮助我们快速提高网站制作的学习效率。不是让大家去直接复制别人的网站，因为你不用去做页面设计图，从而也会节约大量时间。

但是，在实际工作中，大部分企业都会有专业设计师出设计效果图。而有的企业，就不一定了。有的时候，在某些企业，你接到了项目，还会要求出一个页面实现效果图。所以我建议你在学习网站制作的时候，一边学习网站代码的同时，也简单学习一下PS基础操作，这个对你肯定是非常有用的。

总结

在今天的内容中，我跟大家分享了学习制作网站这一技术的简单入门步骤以及需要学习的知识技能，因此，到这里，我们做一个网站的准备工作，就算基本介绍完毕了。

但是，在这里，我还是想简单总结一下今天的内容：

• HTML，CSS，JavaScript以及jQuery知识的学习。
  

• 帝国CMS网站程序的学习。

• 到设计网站上去多看好的网站布局效果图。
  

• 通过仿站进行网站代码的刻意练习。

今天的内容就先分享到这里，希望我今天的内容对你有所帮助，如果还有什么问题，可以在留言区给我留言进行交流分享。

下期内容，我将介绍HTML代码的基础知识，不会很难，主要是为做网站而准备的一些简单的HTML代码知识。

如果你想跟着我一起学做网站的话，请继续关注我。我是杨小爱，我们下期再见！

学习更多技能

请点击下方公众号