Skip to content

step_webpage_basic

halida edited this page Dec 16, 2014 · 4 revisions

一个简单的入门

本课程统一使用chrome浏览器。这是最标准的网页浏览器,带有好用的调试功能,方便进行网站开发。

了解网站运行的基本原理

访问一个网站的详细过程图解:

  • 浏览器输入需要访问的网站网址,浏览器通过HTTP协议,发送页面获取请求到网站服务器
  • 网站服务器返回对应的网页文本(index.html文件)。
  • 浏览器根据网页文本,渲染出一个页面,同时根据文本中的信息,继续请求其他需要的文件(比如图片文件masthead.gif, spoon.gif)。
  • 网站服务器返回对应的文件。
  • 浏览器重新渲染页面,显示出来对应的图片。

其中:

  • HTTP协议是浏览器和网站服务器沟通的协议,这一块我们会在下一课中介绍,现在你只需要知道,这个协议可以让本地浏览器下载到网站服务器里面的各种文件。
  • HTML是网页数据的格式标准,index.html文件符合HTML标准,浏览器能够把这种类型的文件渲染显示成一个我们可以看懂的网页。
  • html是文本格式的文件,里面引用到其他的文件地址,比如图片,这样页面就可以显示出来图片,比如这个课程上面显示的图片。
  • html引用了一种格式名为CSS的文件,CSS文件定义了HTML里面各种页面元素的显示方法,比如本列表和上一个段落相比,有十几个像素的缩进。
  • html也引用了一种名为js的文件,它是一种叫javascript的编程语言,利用js,可以响应用户操作,动态修改页面元素,从而实现交互式的网页操作,这方面的内容我们下一步再介绍。

学习

走一遍课程:http://www.codecademy.com/en/skills/make-a-website/resume 本课程通过根据提示实际修改html,css文本的方式,来体会了解网页是如何渲染出来的。

熟悉基础知识

对html,css有了一定直观的了解之后,你需要对于他们有一个系统性质的了解。

  • 走一遍HTML教程。
  • 走一遍CSS教程。

达成目标

  • 了解网站是如何展示内容的
  • 这些内容如何编写
  • 自己可以编写简单的网页
Clone this wiki locally