Web前端（概论)(1)

1-1（web前端开发叙述）

一、什么是Web前端开发？

Web指的是Web系统，web系统其实就是以网站的形式呈现出来，用户可以通过浏览器来访问，可以完成一定功能的这样的系统。

二、Web系统的例子（都是以网站的形式呈现）：

   1.电商网站：淘宝，京东

比如我们要购物，要登到电商网站

   2.综合门户网站：新浪，搜狐

比如我们要浏览新闻，，要登录到一些综合门户网站上

3.管理系统：内部管理系统

 比如，公司的管理系统；学生在学校内部也会遇到一些管理系统，比如说教务系统，学生选课系统等等

三、Web系统从开发人员角度分为前端和后端：

前端：网页上为用户呈现的部分，也就是用户可以接触到的部分

比如用户要浏览自己订单信息，登录后，由页面后端来进行数据库的交互

网页后端功能：在数据库里面查找到这个用户的订单信息，比如数据库里保存的是所有用户的订单信息，后端找到这个用户的信息之后，将他返回到前端，由前端来完成这个用户订单信息的一个呈现

后端：用户接触不到的部分，作用是跟数据库进行交互，完成数据存取功能的部分

注：对于一个系统来说，它里面的数据都存储在一个叫数据库的地方

四、Web系统前端的开发：

前端开发就是指要编写一些代码

Web前端开发是网站设计的一个组成部分

网站架构师：按照用户的需求将网站的整个架构设计出来

比如网站要包括首页，一些板块，每个版块负责不同的功能，当然每个版块下面又包含一些网页

网页美工人员：将每个页面设计出来一个效果图

前端开发人员：将效果图这样的图片转换成代码，也是通过编写代码（源代码）的方式形成一个网页文件，而这个网页文件，就是可以被浏览器解析和识别的网页文件

前端开发人员通过编写代码，也就是通过web的前端开发，将一个效果图可以转换为浏览器识别的解析的这样的一个网页

1-2（网站与网页的概念、页面元素、浏览器）

Web系统是以网站形式呈现出来的

前端是以网页形式呈现出来的

一、什么是网站，什么是网页

网站（web site）：互联网上用于展示特定内容的相关网页的集合

网页（web page）：网站中的一员，一个网站中的网页通过“超链接”的方式被组织在一起

比如书，网站是书页的一个集合，就是一本书，网页就是书中的每一页

主页（首页）（homepage）：进入到网站首先看到的第一个页面，主页文件名通常是index

二、网站的风格是由什么因素决定的？

最重要的因素是网站的主题

比如说新闻类的网站，他的主题就应该很严肃认真

化妆品网站，艺术性就应该很强

网页元素：对于每一个网页来说都有几部分构成？

 

1. 站标（logo）：也就是网站的标识，通常放在最左上角，简明扼要的代表了这个网站
2. 导航栏：超链接的集合，可以进入到这个网站的各个版块
3. 表单元素：用来采集或者说传递客户的信息

三、从开发者角度来分析什么是网站，什么是网页

其本质上网站就是文件夹，网页就是文件

小型网站的站点文件夹内容比较少

子文件夹：Images，存放了当前网站上面各个网页里面涉及到的图片的一个集合

做好的网站放在一个特殊的设备上（服务器端），用户可以通过浏览器使用自己的设备（客户端）来访问服务器端所提供的网站文件夹里面的网页

例：客户通过客户端请求访问百度网的首页，这个时候服务器端接收到这个请求，找到对应的页面之后返回给客户端

客户端：台式机，笔记本，PAD，移动设备手机等等

四、浏览器的主要作用

解析网页源代码，渲染网页

渲染网页：用浏览器解析网页文件里面的一些源代码然后将网页显示出来的过程

世界上主流的浏览器：

Chrome，Firefox,IE,Safari,Opera

Chrome浏览器：功能强大，可以调试代码

Firefox浏览器：有很多插件，也可以提供很强大的功能

IE浏览器：速度有点慢

1-3 Web前端开发技术

一、Web前端开发技术有哪些组成部分

最基础的三大基础的技术：

决定网页结构的技术：由HTML语言来构成的，也就是网页包括哪些内容，比如说有标题有段落还有图片还有表格等等部分

决定网页样式的技术：由CSS技术或者说CSS语言构成的，网页的样式，比如说字体字号，包括页面的布局，文本，图片要摆放到什么位置，是从美学的角度来考虑的，用于美化页面。

决定网页行为的技术：由JavaScript语言来决定的，JavaScript语言可以做一些页面的交互，由于有了页面的交互就可以提升用户的体验

比如想让车跑起来

网页的结构：首先做一辆车，车的结构是什么，有轮子，车架这样的部分组成，

网页的样式：小汽车可以做成外观不同的样式，

网页的行为特征：让小汽车跑起来，

纯的HTML语言所书写出来的网页，没有样式，只有网页的基本元素的构成，

二、每个部分所遵循的标准

前端技术的标准：是由W3C（World Wide Web Consortium 万维网联盟）这个组织来进行规定的

W3c有官方的网站：

网址：www.w3.org

HTML最新版本是5

CSS最新版本是3

JavaScript版本号比较复杂