网站建设资讯

零基础学网站制作系列教程-02

网站制作 2019-06-11 13:32:38 | 阅读:379

  零基础学网站制作系列教程-02

  01、网站制造东西

  做一个网站,其实有许多东西能够将其完结出来,可是在这里我将重点讲几个在我会运用到的东西。

  第一,FTP上传下载东西

  第二,代码编辑器东西,Sublime。这个东西,也是咱们后边做网站写代码时分,会一向用到的东西,也是我在整个教程中,会运用到的东西,我建议咱们能够装置一下,是Sublime东西下载地址

  第三,网页切片东西,Adobe Photoshop CC,这个东西,特别是在前端开发人员切图的时分,会运用到里边的切片东西这个功能,也不需求学多精深,由于咱们只是用到里边的一些根本功能,不会像专业设计师那样,要求精通。以下是Adobe Photoshop CC的下载地址:

  链接: https://pan.baidu.com/s/1OH8ZqcP1QGsHfmsMRmuagQ

  提取码: wwab

  关于这个破解版的装置教程,假如不会的话,我后边再单独写一篇文章来讲,这篇教程里就不详细讲解了。

  这三个东西,便是咱们后边运用频率比较高的东西,当然,做网站还有许多小东西会运用到,像IEtester,beyond compare,这些咱们目前用不到,咱们就先不说了,比及用到的时分,咱们再讲,可是,咱们能够略微了解一下。

  IEtester首要是在测验时,用来测验IE兼容性的,由于IE软件版别比较多,为了网站在各种IE版别下测验便利,而运用的一个小东西。

  beyond compare是一个代码比较软件,这个在大型项目,还有网页代码比较多的时分会用到。

  讲完了东西,接下来,便是网站程序了,这个也是做一个网站,非常重要的部分了,这个部分就如同咱们平时煮饭相同,咱们不仅需求准备米,咱们还需求知道怎样将米变成饭,而前面的东西内容,它就如同咱们煮饭用的电饭煲这个东西,所以接下来这个进程便是怎样把米做成饭的一个进程,当然也不难。

  在讲这个进程之前,咱们还需求再了解一下与其相关的几个问题。

  02、建站程序

  其实,建站程序,有许多种,比如咱们自己写的网站源码,也能够成为建站程序,还有一些开源的网站源码也是建站程序,例如,dedecms(也叫织梦CMS),wordpress(国外的一个博客体系),ecshop(一个购物商场体系),discuz,(一个论坛体系),这些都能够称之为建站程序,而且这些程序里,有付费,也有免费之分,像ecshop这个网站程序体系里边就有付费的部分,而其他几个根本都是免费的。

  其实,这个建站程序就如同咱们装置的微信,微博程序相同,是人人都能够下载装置的,可是装置完了,不是就表明网站已经做好了。

  咱们都知道,咱们装置的微信,微博,装置好今后,也是需求做些简单设置,比如,换个头像,设置一个好听的昵称等等。

  而建站程序也相同,装置完后,咱们每个人的程序都是相同的,也便是说,咱们每个装置了这个建站程序的网站,都是相同的风格,可是咱们为了凸显出自己网站的风格与调性,所以,咱们还需求对其进行修改。

  而在一个建站程序里,根本都会有许多风格能够选择,这个便是咱们接下来要提到的,网站模板。

  03、网站模板

  网站模板,便是一个网站的风格,相似咱们现在手机里皮肤风格,一个网站,只能用一个网站程序,可是你能够完结多种网站风格,也便是说,你能够用多种网站模板。

  关于网站模板,之前我在公众号上也分享过许多,有dedecms的网站模板,也有wordpress的网站模板,还有一些整站的网站模板。总归,便是学习资源仍是比较丰富的。

  在开端网站制造之前,你只需想好了用哪个网站程序来完结自己的网站,然后就能够在网上先找一些免费的网站模板来进行学习,比及自己学得差不多了。

  其实,你自己就能够写一些网站模板了,比如,你计划用dedecms这个网站程序来制造自己的网站,那你就能够先去学习一些dedecms做网站的相关常识,这个也比较有针对性,学习起来愈加简单上手,兴趣也会大点。

  讲完了网站程序,网站模板,咱们再来说一下网站里的网页,每个网站都是由不同的网页组合而成。网页又分为静态网页与动态网页。

  04、静态网页与动态网页

  简单讲,静态网页便是没有后台数据库交互的网页,咱们都把它成为静态网页,这个是相对于动态网页而言的,所以,动态网页便是有后台数据库交互的网页。

  像我的www.yangxiaoer.net这个站点里的网页都是静态页面,而且每一个页面的文件都是以xxxx.html,或许xxxx.html这样的文件格式呈现。

  而动态网页的文件后缀名,就比较多了,首要是根据开发网站后台的言语来的,例如,xxxx.php,xxxx.asp,xxxx.jsp等,而点后边的文件名,便是表明这个网站后台是用这个言语来开发的。像xxxx.php这个便是表明网站的后台程序是用php言语开发的。

  05、静态链接,伪静态链接与动态链接

  当咱们在翻开一个网站时,咱们会先输入它的链接网址,这个链接网址也叫做一致资源定位符,英文名,URL(Uniform Resource Locator)。

  而在咱们的网站里,一般会有三种网站链接类型,静态链接,伪静态链接,动态链接。

  静态链接便是存在网站空间上的一个独立静态网页文件所生成的一个静态地址。

  例如,http://www.yangxiaoer.net/contact.html,这个便是一个静态链接。当咱们拜访静态页面时,并不需求经过操作数据库,而是直接提取的静态网页,因此,拜访速度相对较快而且服务器的负载很小。

  对搜索引擎来说,同样能够节省大量的抓取时间。而这个也是最简单被搜索引擎录入的地址。

  而“伪静态”,它不是真的静态链接,只是从链接地址上看如同是静态链接,事实是在服务器上并不存在这个静态页面,这个页面可能是php,asp,jsp等网站后台言语的页面。

  咱们运用伪静态链接便是为了便利搜索引擎录入与抓取咱们的网站页面,能够让他人经过搜索引擎快速找到咱们,这个也是在SEO优化的时分,会常常运用的一种手法。

  动态链接便是咱们在拜访动态网页时,服务器程序需求调用数据库来提取网页内容,然后反应给咱们。链接地址里会常常呈现一个“?”的页面,例如,这个是一个微信的页面地址:https://mp.weixin.qq.com/s?__biz=MjM5MDA2MTI1MA==&mid=2649090640&idx=3&sn=a27aa58e1b45d91e4ba04d0db10960b3&chksm=be5bcdfd892c44eb6fbf72985f5fe0adc960da988eefba842a832250dcaa51493acfe24f502f#rd

  它便是一个动态的链接地址。

  简单点的了解便是,没有问号的链接地址一般都是静态地址,而地址里有问号呈现的链接地址便是动态链接地址,处在这两者之间的地址便是伪静态地址,这个大约先了解知道一下即可,首要是为了后边内容做准备的。

  06、从一个网页的诞生来学习HTML与CSS常识

  在前面已经讲了,网站都是由一个一个的网页组成,而网页便是由一个一个的HTML文件,所以,学习网站制造,其实便是学习怎样写HTML文件,当每个HTML文件写完今后,咱们经过一个标签就能够把各文件链接起来,于是就组成了一个网站。

  01)、什么是HTML

  HTML便是一种超文本标记言语,英文全称 Hyper Text Mark-up Language。

  学习网站制造一定要学会HTML的根本常识,否则没有办法开端后边的作业。

  02)、榜首个网页的诞生

  榜首步,翻开Sublime东西,点击【文件】-新建文件,或许按快捷键ctrl+n。

  第二步,写下下面这些代码

  第三步,点击【文件】-保存,或许按快捷键ctrl+s,文件名就为,inedx,文件后缀名就为,html。文件保存完后,咱们找到这个文件,你就会看到,如下文件:

  直接双击这个文件,就会在浏览器翻开,看到这个网页,而这个页面里的......的中心部分只要一内容:我是第一个网页。

  所以,在浏览器里看到的内容,也是这个内容。

  到目前为止,这榜首个网页,就算完结了。

  可是想在这个网页里加各种特效,色彩,图片等内容的话,其实都是在这个中心完结。

  第四步,翻开FTP东西,经过之前购买的网站空间,服务网供货商供给给你的,服务器地址,服务器FTP登录账户,服务器FTP暗码,然后登录后,上传刚刚写的那个网页,就能够经过网址来拜访其页面了。