1.1 技术变迁和生态
发展历程
互联网（Internet，亦称因特网）发源于1969年，用来连接美国的国防计算机设备。 计算机是一个个信息孤岛，互联网充当信息高速公路把这些孤岛串联起来。 如今全球数十亿的设备通过互联网连接在一起，包括服务器、台式机、笔记本、平板、手机、电视、可穿戴设备和智能家居设备等。
有两个容易混淆的概念：互联网和万维网，实际上互联网是一个更大的概念。
万维网（World Wide Web，亦称WWW或W3）诞生于90年代初，是建立在互联网之上的全球性的、交互的、分布式图文信息系统。 它原本只是基于Internet的一种网络服务（除此之外还有邮件、新闻列表和即时通讯等服务），但Web的出现极大的推动了互联网的发展，也构成了互联网最主要的部分。
BAT是国内互联网行业三巨头，Baidu 连接是人和信息，Ali连接的是人和商品，腾讯连接的是人和人，而物联网连接是人和物。
技术变迁
互联网技术本质上是基于连接的技术，连接两端（客户端和服务器）形态的演进深刻的影响了软件开发技术（尤其是客户端）的发展，粗略来分有四个阶段：
- 桌面本地应用 Windows
- 网页应用 Browser
- 移动本地应用 Mobile Phone
- 响应式网页应用 HTML5
- 桌面应用为王
- 从90年代到2000年初，软件开发是以桌面本地应用(Windows Application，如Office套件）C/S（Client/Server）模式为主
- 网页应用
- 之后10几年大规模迁移到了基于万维网（World Wide Web）的B/S（Browser/Server）模式（各大网站如谷歌/百度/淘宝），软件产品乃至基础设施通过弹性分配的方式成为各种在线服务
- 移动互联网本地应用复兴
- 2009年后随着iPhone/Android智能手机的兴起，C/S模式在移动平台领域（Native APP)独领风骚
- 响应式网页应用
- 2014年年底HTML5标准得以最终确立，因应移动互联网的快速发展，建立了基于Web的跨终端跨平台的技术接口，可以想见未来移动应用也将逐步B/S化，迁移到移动网页应用（Mobile Web APP）的形态上来
软件行业一样奉行适者生存的丛林法则，技术的快速更新迭代广泛的影响着开发人员的职业生命。只有理解这种模式变迁背后的内在驱动，提高技术理解力，才能有效降低技术转型风险。
应用程序架构（C/S VS B/S）
无论C/S模式，还是B/S模式，只要是存在数据通讯，就需要连接客户和服务两端，服务器是数据生产方，客户端是数据消费方。 C/S桌面本地应用的开发技术包括VC++(MFC)/Java(Swing)/VC#(.NET)/Qt等，网页应用包括HTML/CSS/JavaScript/Flex以及PHP/JSP/Ruby/ASP等，移动本地应用包括Android（Java和C语言）和iPhone（Objective C和Swift）。 C/S和B/S的本质区别在于前者的客户端是基于本地操作系统，而B/S的客户端是基于Web浏览器。 所以对于前者开发人员主要关注的是操作系统提供的开放接口（API/SDK，比如微软的Windows SDK和苹果的Cocoa），而后者是要熟悉Web技术标准（HTML）。 根据客户端体量的大小，我们通常称呼C/S为胖客户端（Rich-client）模式，而B/S被称为瘦客户端模式。
对应于早期的C/S应用（如Windows Application），由于操作系统相关性，在产品发布时，需要提供适用于多个平台的软件包以及补丁程序， 软件商必须招募不同平台背景的程序员来制作不同的应用，开发成本高昂，软件的发布、升级和维护十分麻烦，在穿越广域网时会遇到防火墙麻烦。 其优点在于只需要传输业务数据（并通常使用二进制压缩格式），无需传输界面数据，从而节省网络流量；此外能最大限度地利用本地操作系统的功能，拥有丰富的本地化体验。
早期的软件发布方式是磁盘/光盘，现在结合互联网的软件下载和自动升级方式已缓解了这方面的矛盾，但依然不甚便利。
B/S的模式则恰恰相反，由于天然的平台无关性，使得开发商发布软件只需要在服务器端集中管理就好， 而客户端软件全面运行于Web浏览器中，遵循统一的技术标准，得以一次开发即可随处运行，用户免受升级干扰。而其缺点则是对本地设备的操作受限而导致产品体验不如本地应用以及流量消耗较大。
当然现实情况是由于商业利益，部分浏览器厂商并不会完全支持技术标准，导致开发人员需要额外解决浏览器兼容性问题。
透过纷繁的表象看本质，C/S和B/S模式取舍变迁的关键因素有两点：
1.开发成本（软件本身的成熟度和可移植性）2.流量成本（所依赖的网络环境速度、稳定性、费用）。
本地应用（即原生应用） VS Flash VS Silverlight VS HTML5
如上所述，C/S和B/S各有优缺点，为了融合两者的优点，Adobe公司给出的方案是Flash，微软给出的方案是Silverlight， W3标准化组织给出的解决方案就是新一代的HTML技术：HTML5（简称H5），多种技术方案彼此激烈竞争。 Flash是由Macromedia公司（后被Adobe收购）于96年推出，是一个跨平台的交互式矢量图和Web动画标准，在桌面系统得到广泛支持， 但由于Android/iPhone都不支持Flash而支持HTML5，导致FLASH事实上已经退出了移动互联网市场竞争。Silverlight基于.Net开发环境，平台支持有限。 HTML5不归属任何公司，而是开放的行业标准，注定会在竞争中胜出。 使用HTML5可以构建适应于各种设备（无论电脑、手机还是电视）的网页应用，拥有媲美PC/Android/iPhone本地应用的交互体验，在跨平台和用户体验之间达到很好的平衡。
前端 VS 后端
经常会遇到一个问题，就是我要精通网页开发是不是只要学好HTML就好了，当然不是，HTML只是网页开发技术的总称， HTML准确而言代表的是浏览器中最终呈现出来的网页文档的结构语法，除此之外还需要有网站原型、页面设计、文档样式（使用CSS），用户交互（使用JavaScript，简称JS），以及和后台数据或服务通讯（使用PHP/JSP/ASP等)。 其中原型设计、HTML/CSS/JS部分统称为前端开发，而PHP/Java/数据库以及服务器统称后端开发。后面的章节会对前端部分的CSS/JS进行详细介绍。
如果你是从其他编程领域转入HTML的，或许你曾独立思考过技术体系之间的差异，并能深入理解本节内容，如果你是新手，可能觉得有点茫然，没关系，可以等有一定经验积累后，回头再来阅读上述内容，看是否会有新的认识。