简介
限于早期 Web 浏览器的定位与功能，20 世纪 90 年代 Web 诞生至 21 世纪初，网页主要用于展示，最常见的方式是使用HTML(HyperText Markup Language, 超文本标记语言)将文字,图片,影音资源组织在一起进行展示, 并使用JavaScript, CSS(Cascading Style Sheets, 层叠样式表)完成一些更高级的功能。后期，Flash 等浏览器增强插件平台曾以引入外部可执行组件的方式大大丰富了网页的能力和表现力，一度成为网页开发的主流。但目前已被逐渐淘汰, 不被主流浏览器支持(如Chrome已不支持)。
评判标准
前端开发是通过创建网页页面或App等前端可视界面呈现给用户的过程，通过各种技术，来呈现用户最直接感受的画面。 简单来说，任何肉眼看到的、可以交互的界面，都可以说成前端页面，甚至游戏的画面，都可以说成是前端画面。抽象一点，你即使用的是DOS命令，输入的全是文字指令，这个界面也可以称之为前端。但是随着技术的发展，前端的定义也越来越趋于模糊，因为现在很多的前端框架都可以实现深度的交互甚至是逻辑。有些逻辑的处理甚至只用前端技术就可以实现繁杂的页面交互。比如angluar框架等等。 随着时代的发展，前端开发也出现了自动化、工程化、模块化等新的定义。
种类
现代网页开发大量使用 JavaScript 来增强用户体验，逐渐从「网页设计」转变为「应用开发」，网页开发进入了一个全新的时代，浏览器成为了新一代的通用客户端平台，JavaScript 社区快速发展，从简单的辅助性交互脚本摇身一变成为几乎所有 Web 应用的基础，相关的框架层出不穷，代表性的有 Vue、React、Angular。
因现代网页自由度高、迭代方便、跨平台能力较强，不少应用采用网页和原生客户端代码混合的方式开发，甚至衍生出了相关平台，如小程序等。
限于早期 Web 浏览器的定位与功能，20 世纪 90 年代 Web 诞生至 21 世纪初，网页主要用于展示，此时的网页目标在于以各种方式展示多媒体内容，最常见的方式是通过 Photoshop、Fireworks、Dreamweaver 等软件精心排版，并辅助以一些基本的 JavaScript 片段来完成一些简单的交互效果。由于当时网页开发的一些局限，当时网页开发从业者大量重复切割设计稿图片并使用 HTML 和 CSS 拼接，故一度被称为「切图仔」。在这一阶段的后期，Flash、Silverlight、Java Applet 等浏览器增强插件平台曾以引入外部可执行组件的方式大大丰富了网页的能力和表现力，一度成为网页开发的主流。Flash 更被民间称为「网页开发三剑客」之一，至今仍有一部分网站依然在使用 Flash 来增强用户体验，虽然这些做法事实上已经过时。
自谷歌的 Chrome 浏览器发布以来，现代网页开发大量使用 JavaScript 来增强用户体验。以 Gmail 为代表，现代的网页开发逐渐从「网页设计」转变为「应用开发」，网页开发进入了一个全新的时代，浏览器成为了新一代的通用客户端平台，因此「网页开发」近些年来有了新的名字「前端开发」，与网站后端数据和业务逻辑开发相对应。JavaScript 社区快速发展，JavaScript 语言从简单的辅助性交互脚本摇身一变成为几乎所有 Web 应用的基础，相关的框架层出不穷，目前流行的框架中，逻辑相关的流行框架有 Vue、React 与 Angular，UI 组件库类框架有 Bootstrap、Foundation 等，各个逻辑框架亦有各自较大的组件库。
大量原先的「客户端」「桌面应用」等亦广泛在其中采用现代网页，因现代网页自由度高、迭代方便、跨平台能力较强。不少应用采用网页和原生客户端代码混合的方式开发，甚至衍生出了相关平台，如小程序等。
单页应用SPA
单页Web应用（single page web application，SPA），就是只有一张Web页面的应用，是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。此类网页更接近原生手机应用程序。浏览器一开始会加载必需的HTML、CSS和JavaScript，之后所有的操作都在这张页面上完成，这一切都由JavaScript来控制。因此，单页Web应用会包含大量的JavaScript代码。
基于Vue、React 与 Angular等前端开发框架。开发者可以组件化的开发网页的各个部分，最后拼装到一起。这样的开发逻辑，与原生APP更加相似。
相关技术
- ajax：一种从前端向后端发送、请求数据的方式。页面上的数据都需要通过AJAX同步、提交。
- 路由：在URL中采用#号来作为当前视图的地址,改变#号后的参数，页面并不会重载。
常见单页应用
- Gmail
- Evernote
- Trello
工作流程
- 由产品确认页面功能与大概的页面格式(页面原型)。
- 由UI 的设计人员根据原型设计出每个页面的每个控件样式、颜色和布局
- 前端程序员根据设计用HTML 写出网页的所有下拉菜单、导航栏等控件以及文字内容
- 前端程序员根据设计使用样式层叠表（CSS）
- 前端程序员根据设计使用JavaScript 使页面动起来
- 前端程序员与后端程序员进行共同以确认网站前后端的交互
- 前后端结合，测试上线
组织结构
部门分工
人员分工
经营设计
- 根据用户需求 UI设计师设计其相应的页面交给前端程序员
- 根据市场需求制作相应需求的画面及设计
需求分析
- 根据用户需求，制作各个页面相应板块功能。
- 据相应市场，制作需求的功能 如：阅读，放大，保存，转发等类
目标界定
- 由PC端浏览器展示的前端web网页
- 由移动端浏览器展示的web网页，基于安卓与iOS有偏差，部分UI设计师会制作不同页面效果
- 自适应式web前端页面，该页面能良好的适应不同PC端分辨率及移动端分辨率，展示良好的页面效果
总体结构设计
详细结构设计
参数设计
设计实施
工具
图形编辑 & 原型制作：Photoshop、墨刀、Axure、Mockplus、Pixate、INVISION 等
代码编写：Visual Studio Code、Sublime Text、WebStorm、Visual Studio、Atom、HBuilder、Adobe Dreamweaver 等
代码托管：GitHub、GitLab 、Azure DevOps 等
版本控制系统: 最通行的解决方案为 Git。网页开发行业几乎不选用其他版本控制系统。
主要语言
网页的编写通常都是由HTML（超文本标记语言）、CSS（层叠样式表）、JavaScript（一种弱类型的解释型脚本语言），这三种语言编写完成的。按照业内开发规则通常是HTML负责网页的框架，CSS负责样式，而JavaScript负责网页的相关逻辑。现如，html文件选用html5的规范进行编写，CSS也是使用CSS3的规范，JS的语法也是在逐年的更新，如ES6、ES7等。TypeScript作为一门诞生于JS的语言扩展集，既继承了JS的优点，同时也在此基础上有了改进，稳定性和严谨性都有了提升，使用TS来开发也是未来发展的趋势。
HTML
HTML 是用来描述网页的一种语言。
- HTML 指的是超文本标记语言 (Hyper Text Markup Language)
- HTML 不是一种编程语言，而是一种标记语言 (markup language)
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
HTML标签是由尖括号包围的关键词，比如<html>，一般是成对出现开始和结束标签也被成为开放标签和闭合标签，比如<p></p>，标签中可以存放页面元素和相关内容。 HTML文档就是网页，浏览器通过解析HTML文档渲染出整个网页的内容，并以我们熟悉的网页形式显示出来。
CSS
CSS是美化网页的一种样式表
- CSS 指层叠样式表 (Cascading Style Sheets)
- 样式定义如何显示 HTML 元素
- 样式通常存储在样式表中
- 把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题
- 外部样式表可以极大提高工作效率
- 外部样式表通常存储在 CSS 文件中
JavaScript
HTML+CSS就能写出一个静态的网页样式，但很难仅通过这两种语言来写出一个动态的网站。JavaScript脚本语言的出现能够改变HTML的属性，动态的对HTML，CSS进行修改，主要目的是给HTML网页增加动态功能。通常JavaScript脚本是通过嵌入在HTML种来实现自身的功能的。
- JavaScript是一种解释性的脚本语言(其代码不需要进行预编译)
- 跨平台支持，可以支持绝大多数的浏览器、操作系统
- 可以直接嵌入HTML代码中，也可以单独写成一个js文件
JavaScript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。JavaScript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。
设计和规划
一、UI设计师根据产品需求分析文档，对产品的整体美术风格、交互设计、界面结构、操作流程等做出设计。负责项目中各种交互界面、图标、LOGO、按钮等相关元素的设计与制作。
位置与环境
投资与评估
规模与功能
风格与形式
成本
税费
金融成本
原材料成本
房租成本
能耗成本
人工成本
设备折旧
收益管理
消费曲线
时间分布
空间分布
目标群体
容量控制
风险控制
行业
o2o、社交、教育、智能硬件、游戏、生活服务、自媒体等。
国内市场
产量
消费量
国际市场
产量
消费量
主要公司
国内
腾讯(深圳)、百度(北京)、阿里巴巴(杭州)、京东(北京)、小米(北京)、网易(杭州)、拼多多(上海)、趣头条(上海)
标准
这里存放条目相关的国家标准 网页开发实际为前端开发中WEB开发，网页开发标准遵循W3C(World Wide Web Consortium万维网联盟)网页开发标准；
文档
这里存放于条目相关的其他文档
- MDN Web Docs ：https://developer.mozilla.org/zh-CN/
- W3C 官方网页开发教程以及规范地址：https://www.w3school.com.cn/
- JavaScriptES6 学习教程：http://es6.ruanyifeng.com/
- frontend-dev-bookmarks ： https://github.com/dypsilon/frontend-dev-bookmarks
- ECMAScript 标准: https://tc39.es/ecma262/
- 腾讯网静态资源公共库https://libs.qq.com/
- Vue.js中文官网：https://cn.vuejs.org/
编辑成员
24 人
BOOK-BLOG STUDIO, quanee, 福尔摩松, 宇不点, daly, Amani, Pooh, Qnner, 阿白, Nan.南城, 王大白, 良绅, 木又, UxieKong, 华南, AP0STR0PH3, laosb, 秋山骏, 李大强, 杀不死, Jackie, 梅花落满了南山, 风清怜宥凉, zhshch
| 1 | 2 |
评论(7)