前端 - 亿夏网

Hi,world!

结构层：HTML

表示层：CSS -- bootstrap、sass/less

行为层：JS -- Jquery

框架 -- nodejs | angular、vue、react

tools

1."关注点分离"（separation of concerns）

HTML 语言：负责网页的结构，又称语义层
CSS 语言：负责网页的样式，又称视觉层
JavaScript 语言：负责网页的逻辑和交互，又称逻辑层或交互层
结构层表示层行为层

HTML HTML JS

2.面试题

资源网站

http://hao.jobbole.com/

https://www.cnblogs.com/cate/web/

https://www.csdn.net/

https://www.zhihu.com/

https://github.com/

https://gitee.com/

https://www.jianshu.com/

https://www.liaoxuefeng.com/

http://www.ruanyifeng.com/

https://developer.mozilla.org/zh-CN/

https://segmentfault.com/

https://www.imooc.com/

http://api.map.baidu.com/lbsapi/creatmap/(百度地图代码生成器)

Event Loop JavaScript采用单线程的一种运行机制

•渐进增强 progressive enhancement：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。

•优雅降级 graceful degradation：一开始就构建完整的功能，然后再针对低版本浏览器进行兼容。

区别：优雅降级是从复杂的现状开始，并试图减少用户体验的供给，而渐进增强则是从一个非常基础的，能够起作用的版本开始，并不断扩充，以适应未来环境的需要。降级（功能衰减）意味着往回看；而渐进增强则意味着朝前看，同时保证其根基处于安全地带。

“优雅降级”观点

“优雅降级”观点认为应该针对那些*、最完善的浏览器来设计网站。而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段，并把测试对象限定为主流浏览器（如 IE、Mozilla 等）的前一个版本。

在这种设计范例下，旧版的浏览器被认为仅能提供“简陋却无妨 (poor, but passable)”
的浏览体验。你可以做一些小的调整来适应某个特定的浏览器。但由于它们并非我们所关注的焦点，因此除了修复较大的错误之外，其它的差异将被直接忽略。

“渐进增强”观点

“渐进增强”观点则认为应关注于内容本身。

内容是我们建立网站的诱因。有的网站展示它，有的则收集它，有的寻求，有的操作，还有的网站甚至会包含以上的种种，但相同点是它们全都涉及到内容。这使得“渐进增强” 成为一种更为合理的设计范例。这也是它立即被 Yahoo! 所采纳并用以构建其“分级式浏览器支持 (Graded Browser Support)”策略的原因所在。

那么问题来了。现在产品经理看到 IE6,7,8 网页效果相对高版本现代浏览器少了很多圆角，阴影（CSS3），要求兼容（使用图片背景，放弃 CSS3），你会如何说服他？（*发挥

渐进增强

渐进增强是指在 web 设计时强调可访问性、语义化 HTML 标签、外部样式表和脚本。保证所有人都能访问页面的基本内容和功能同时为高级浏览器和高带宽用户提供更好的用户体验。核心原则如下:

所有浏览器都必须能访问基本内容

所有浏览器都必须能使用基本功能

所有内容都包含在语义化标签中

通过外部 CSS 提供增强的布局

通过非侵入式、外部 javascript 提供增强功能

优雅降级

6.兼容 yu 比较

以妓会友，评赞走起

结构层	表示层	行为层
HTML	HTML	JS

前端

Hi,world!

相关推荐