当前位置: 首页 > news >正文

Web前端开发敲门砖 ——《Web前端工程师修炼之道》

随着多设备、浏览器和Web标准的演变革命,前端正在成为兼顾逻辑、性能、交互、体验的综合性岗位。

 

前端开发入门又相对容易,必须掌握的HTML+CSS+JS非常容易学习,如果你能再了解一定后端知识,对业务需求和架构设计有熟练运用,再能够兼顾技术和设计,很快就可以成为“以前端开发为主的全栈工程师”。

 

今天推荐一本Web前端的敲门砖!《Web前端工程师修炼之道》,这是一本完整的Web 设计和制作的入门指南。详解WEB前端基础知识,如HTML、CSS、JavaScript、Web图像制作等等。

你是否曾想过自己创建网页,但苦于没有经验?那么从这本书开始学习吧!本书由浅入深地讲解了Web设计的一些重要概念、基本原理,以及HTML、CSS和JavaScript的具体使用方法与技巧。当你读完本书后,将会掌握创建适用于移动设备的多列页面的技巧。

每章都提供了一些练习和小测验,帮助你了解不同的技术,巩固对重要概念的理解。

第5版进行了全面更新和修订,涵盖了Web前端开发所需的一切,无论对初学者还是对想提高已有技能的专业开发人员,本书都是理想的选择。

 

本书主要内容

●使用文本、链接、图像、表格和表单来构建HTML页面。

●使用CSS调整颜色、背景、页面布局以及格式化文本,甚至是实现简单的动画效果。

●学习JavaScript的工作原理及其在Web设计中的重要性。

●创建并优化Web图像,加快图像下载速度。

 

本版新增内容
  • 使用CSS Flexbox和网格实现复杂灵活的页面布局。

  • 学习自适应Web设计的细节,使Web页面在所有设备上看起来都很棒。

  • 熟悉现代Web开发者工具包中的命令行、Git和其他工具。

  • 了解SVG图像的超强能力。

 

本书的组织结构

本书分为六部分,每一部分都是Web开发的一个重要方面。

  • 第①部分:开始起步

第①部分为本书后面的学习奠定了基础。我从关于Web设计的一些重要信息开始讲述,包括你可能会扮演的各种角色,你可能会学到的技术和工具。你会学到HTML和CSS,并学习Web和网页一般如何工作。我也会介绍一些重要的概念,带你体会现代Web设计师的思想。

  • 第②部分:HTML结构

第二部分涵盖每个元素和属性的本质以及语义结构。我们将讨论如何标记文本、链接、图像、表格、表单和嵌入式媒体。

  • 第③部分:表现层的CSS

在第三部分,你会学习使用CSS来改变文本的外观,为页面创建多列布局,甚至添加基于时间的动画、交互等。该部分还介绍了自适应Web设计,以及作为现代开发人员工作流一部分的工具和技术。

  • 第④部分:JavaScript行为

在第四部分,Mat Marquis从JavaScript的语法开始讲解,带领你逐步学习变量、函数。你也会学到JavaScript的使用方式(包括DOM脚本),以及已有的JavaScript工具(如polyfill和库),即便你还没有准备好从头开始编写代码,这些工具也可以帮助你更快地使用JavaScript。

  • 第⑤部分:Web图像

第五部分介绍Web适用的各种图像文件格式,提供了将其作为自适应工作流的一部分进行选择的策略,而且描述了如何进行优化才能使文件尺寸尽可能小。此外,该部分还包括一个关于SVG图形的章节,这为自适应设计和交互式设计提供了极大的便利。

  • 第⑥部分:附录

第六部分包含参考资料,如测验答案、HTML全局属性列表和CSS选择器,还介绍了HTML5及其历史。

 

 

目录

【第一部分 开始起步7】

●第1章 Web设计入门9

从哪里开始9

它需要一个团队(网站创建角色)10

为Web设计做准备19

你学会了什么25

自我测验25

 

●第2章 Web是如何工作的26

互联网与Web26

提供你的信息27

关于浏览器27

网页地址(URL)29

网页结构31

小结36

自我测验37

 

●第3章 Web设计基本概念39

各种设备40

与标准一致41

逐步提高42

自适应Web设计43

可访问性:所有用户一个网站46

网站性能:连接速度的要求48

自我测验50

 

【第二部分 HTML结构53】

●第4章 创建简单网页55

创建网页的步骤55

启动文本编辑器56

第1步:从内容开始58

第2步:HTML文档结构化61

第3步:确定文本元素64

第4步:添加图像67

第5步:使用样式表改变外观70

当网页出错时72

验证你的文档73

自我测验74

元素回顾:HTML文档结构75

 

●第5章 标记文本76

段落76

标题77

主题中断78

列表79

更多内容元素82

组织网页内容85

内联元素综述91

泛型元素div和span100

使用ARIA提高可访问性104

字符转义107

小结109

自我测验112

元素回顾:文本元素112

 

●第6章 添加链接115

href属性115

链接到Web上的网页117

站内链接118

以新浏览器窗口为目标127

邮件链接129

电话链接129

自我测验130

元素回顾:链接131

 

●第7章 添加图像132

图像格式简介133

img元素134

添加SVG图像139

自适应图像标记146

小结158

自我测验158

元素回顾:图像159

 

●第8章 表格标记161

如何使用表格161

最小表结构162

表头165

合并单元格165

表格可访问性166

行和列组168

小结170

自我测验172

元素回顾:表格172

 

●第9章 表单174

表单如何工作174

表单元素176

变量和内容178

重要表单控件综述179

表单可访问性功能197

表单布局和设计201

自我测验202

元素回顾:表单203

 

●第10章 嵌入式媒体207

窗口中的窗口207

多用途嵌入器209

视频和音频210

画布219

自我测验223

元素回顾:嵌入式媒体223

 

【第三部分 表现层的CSS227】

●第11章 介绍层叠样式表229

CSS的优点229

样式表如何工作231

大概念235

CSS计量单位241

开发者工具就在浏览器中244

继续使用CSS246

自我测验247

 

●第12章 格式化文本248

基本字体属性249

使用CSS3的高级排版功能265

改变文本颜色267

更多选择器类型268

文本行设置274

下划线和其他“修饰”277

改变字母大小写278

空格279

文本阴影280

改变列表的数字编号284

自我测验286

CSS回顾:字体和文本属性288

 

●第13章 颜色和背景290

指定颜色值290

前景色297

背景色298

裁剪背景299

使用不透明度300

伪类选择器301

伪元素选择器306

属性选择器308

背景图像309

快捷背景属性323

渐变327

外部样式表334

小结339

自我测验339

CSS回顾:色彩和背景属性341

 

●第14章 盒子思想342

元素盒子342

指定盒子尺寸343

填充348

边框352

空白边362

分配显示类型365

盒子阴影368

自我测验369

CSS回顾:盒子属性369

 

●第15章 浮动与定位372

普通流372

浮动373

用CSS形状进行精美文本环绕383

定位基础390

相对定位391

绝对定位392

固定定位400

自我测验401

CSS回顾:浮动和定位属性402

 

●第16章 使用Flexbox和网格进行CSS布局403

使用CSS Flexbox的灵活盒子403

CSS网格布局432

自我测验463

CSS回顾:布局属性466

 

●第17章 自适应Web设计469

为什么要使用RWD470

自适应秘诀470

选择断点477

自适应设计481

关于测试492

更多的RWD资源494

自我测验495

 

●第18章 过渡、变换和动画497

CSS过渡497

CSS变换507

关键帧动画515

小结520

自我测验521

CSS回顾:过渡、变换和动画522

 

●第19章 更多CSS技术524

对表单设置样式524

对表格设置样式527

重置和Normalize.css530

图像替换技术532

CSS Sprite533

CSS特性检测535

小结539

自我测验539

CSS回顾:表格属性541

 

●第20章 现代Web开发工具542

熟悉命令行542

CSS的强大工具:处理器546

构建工具:Grunt和Gulp552

使用Git和Github进行版本控制554

小结560

自我测验561

 

【第四部分 JavaScript行为563】

●第21章 JavaScript简介565

关于JavaScript565

给网页添加JavaScript568

脚本剖析569

浏览器对象582

事件582

综合应用584

学习更多关于JavaScript的知识585

自我测验588

 

●第22章 使用JavaScript和DOM589

DOM简介589

polyfill597

JavaScript库599

小结603

自我测验603

 

【第五部分 Web图像605】

●第23章 Web图像基础607

图像来源607

格式简介610

图像尺寸和分辨率620

图像资产策略623

favicon627

小结630

自我测验630

 

●第24章 图像资产制作632

将图像保存为Web格式632

使用透明度637

自适应图像制作技巧640

图像优化650

自我测验660

 

●第25章 SVG661

使用XML绘图663

SVG作为XML的特性670

SVG工具675

SVG制作技巧677

自适应SVG681

SVG的进一步探索687

自我测验687

我们学完了688

 

【第六部分 附录689】

附录A 自我测验答案691

附录B HTML5全局属性705

附录C CSS选择器的第3级和第4级707

附录D 从HTML+到HTML5710

上下滑动查看

 

 

更多精彩回顾

书讯 | 12月书讯 | 年末上新,好书不断

资讯 | DB-Engines 12月数据库排名:  PostgreSQL有望获得「2020年度数据库」荣誉?

书单 | 机器人时代已来!推荐几本机器人学硬核好书

干货 | 基于中台架构的新业务建设原则

收藏 | 为什么Siri总是像个智障?智能助手背后的技术到底有多难?

上新 | 尴尬的游戏用户体验设计师

赠书 | 【第34期】如何成为一个软件架构师?

点击阅读全文购买

相关文章:

  • 8个Python高效数据分析的技巧
  • 为什么“蜥蜴书”是机器学习入门必读书?
  • 互联网消费金融行业从业者的实战指南
  • 中台的本质及中台建设的4点思考
  • 复杂的密码学也可以人人可懂
  • Python循环语句代码逐行详解:while、for、break和continue
  • 基于Vite搭建Electron+Vue3的开发环境
  • 国产首款——飞桨PaddlePaddle深度学习框架介绍
  • “MySQL Analytics Engine”来了
  • 【第35期】数字化转型到底该怎么做?
  • 详解华为12种数据采集技术及应用实践
  • JavaScript 25 岁了!
  • 43种机器学习开源数据集(附地址/调用方法)
  • 中国量子计算原型机“九章”问世,普通人怎样初识量子计算?
  • 中台“不火”了,企业数智转型如何破圈?
  • Docker 1.12实践:Docker Service、Stack与分布式应用捆绑包
  • Docker 笔记(1):介绍、镜像、容器及其基本操作
  • dva中组件的懒加载
  • Laravel Mix运行时关于es2015报错解决方案
  • PHP变量
  • QQ浏览器x5内核的兼容性问题
  • vuex 学习笔记 01
  • 电商搜索引擎的架构设计和性能优化
  • 分享几个不错的工具
  • 欢迎参加第二届中国游戏开发者大会
  • 基于MaxCompute打造轻盈的人人车移动端数据平台
  • 将回调地狱按在地上摩擦的Promise
  • 聊聊flink的TableFactory
  • 你真的知道 == 和 equals 的区别吗?
  • 前端性能优化——回流与重绘
  • 手写双向链表LinkedList的几个常用功能
  • 吴恩达Deep Learning课程练习题参考答案——R语言版
  • 用Python写一份独特的元宵节祝福
  • 原生 js 实现移动端 Touch 滑动反弹
  • 正则表达式
  • 正则与JS中的正则
  • 基于django的视频点播网站开发-step3-注册登录功能 ...
  • 没有任何编程基础可以直接学习python语言吗?学会后能够做什么? ...
  • ​LeetCode解法汇总2696. 删除子串后的字符串最小长度
  • ​LeetCode解法汇总307. 区域和检索 - 数组可修改
  • ![CDATA[ ]] 是什么东东
  • # 执行时间 统计mysql_一文说尽 MySQL 优化原理
  • #LLM入门|Prompt#1.8_聊天机器人_Chatbot
  • (1)(1.11) SiK Radio v2(一)
  • (2)MFC+openGL单文档框架glFrame
  • (delphi11最新学习资料) Object Pascal 学习笔记---第8章第5节(封闭类和Final方法)
  • (PWM呼吸灯)合泰开发板HT66F2390-----点灯大师
  • (附源码)springboot宠物管理系统 毕业设计 121654
  • (附源码)计算机毕业设计ssm-Java网名推荐系统
  • (简单) HDU 2612 Find a way,BFS。
  • (一)插入排序
  • (转)总结使用Unity 3D优化游戏运行性能的经验
  • .NET 回调、接口回调、 委托
  • .NET(C#、VB)APP开发——Smobiler平台控件介绍:Bluetooth组件
  • .NET大文件上传知识整理