Ⅰ 前端如何提升用户体验
AJAX
看到这里肯定有人忍不住笑出声，的确这已经不算什么新技术，但要让我站在用户的角度来评价网站技术上的变化中给访问者带来最大友好性的一项，我肯定会选AJAX。
记得在我刚刚开始学会上网时候，不管是注册页面还是登录都是我最烦的，那时候网速又不快，打开一个注册页面就要几秒时间，然后从上往下有几十个选项要全部填满，比如其中有一项让我填写“密码保护问题”，这个设计简直让人想吃电脑，因为很多人一看这种问题应该都会和我一样随便写几个数字就提交，然后等几秒加载完网页提示“密码保护问题”不允许有数字，同时之前填写的十几项数据全部清空需要重新再来一遍，再花几分钟写完之后提交又提示不允许有字母，再来一遍，有时候还会提示字符太短太长有空格超时之类，总之如果你第一次注册这种页面，至少要花掉十几分钟，而且还是在重复做一件事。从网站运营者角度来看这也很烦，重复十几分钟填写表单很容易就失去很多潜在用户。
在AJAX的异步请求出现之后，这种情况明显的改善，给用户的体验感最明显。用户并不知道何时已经提交请求，就拿刚才表单的例子来说，如果每填写一项都会在当前表单的最后提示具体错误类型(在用户未点击时已经异步提交了请求并且用返回数据更新部分页面)，这就给用户很直观的提示，这种即时的互动让访问者能够很直观的感受到这是一个友好的网站。(当然用javascript也能做到部分表单验证，这只是举一个例子)。在不重新加载整个页面，通过操作DOM来改写小部分数据这点上也能给访问者带来极大的交互感，现在流行的微博就是最好的例子，在发送微博/评论/转发之后用户会发现不用刷新等待整个页面加载，操作之后立刻会有小部分的页面发生变化，虽然看起来微不足道，但对一个访问者来说，这足以让他们欣喜。
网页字体
网站中所有的文字内容表达方式都是通过字体，合理的字体无疑会给用户更好的体验感。在业内来说豆瓣可能是对字体研究最多的一个网站，拿豆瓣读书都来他们用Helvetica和Arial这两种差别非常小的字体，这种非衬线字体很容易让人一目了然同时富有一些科技感，豆瓣本身就是以图片加上简短语句组成，让人能够从字体中快速找到重心是设计的目标所在。
有人担心非衬线用作正文对阅读体验有影响，实际上不难发现国外很多网站都用非衬线字体来处理正文，当然也不排除他们可能考虑的更多是英文。其实我还是非常喜欢非衬线体，它们看起来更富美感，而且如今大量的文字在互联网上比较少见，一些活泼具有现代感的非衬线字体也逐渐被更多的开发者认同而且使用。
除去这些，字体还可以在选择上再细分一些，记得曾经看过一篇统计，不同的字体会影响用户对站点权威性的信赖程度。比方说在一个公司网站上大量使用类似于幼圆、Cursive一类字体，很容易让访问者不信任网站，当然如果是以娱乐为主的网站也不能过于严肃和简朴，在使用时既要考虑到大众用户的接受程度，也要知道自己的网站是什么定位，当然技术性的问题也不能忽略，像是火狐比IE区分sans-serif要更模糊一些，有的字体“O”和“0”、“L”和“1”容易让人难以区分(代码较多的站点需要考虑)等等，这样综合对比选择得到的字体无疑能让网站更有魅力，从而留下更多的用户。顺便一提，在使用字体时注意版权。
加载速度
很多用户在还未见到你出色的设计和内容之前就已经离开了页面，这是因为网站加载时间实在是太长，已使访问者失去耐心。其实很多的访客不关心脚本和图片的加载顺序，他们只要看到网站的整体结构能够迅速的加载出来就可以开始浏览，即便是其他元素逐渐加载也可以接受，基于这点，我们可以使用很多延时加载的方法来使用户更快的见到页面。除此之外还有很多因素可能会对加载速度造成影响，也有逐一优化的办法，这里就不再细述。
结构设计
不知道大家发现没有，近来很多网站都喜欢把菜单fixed在顶部，只要这个菜单选择项不是太多，访客对这样的固定菜单接受程度还是很高的，这只是设计中的一个小例子，相类似的有很多，比如在表单中以深浅颜色区分每一行，以提高可阅读性;在激活窗口时为当前控件添加一个边框，使用户能够更建议的分辨自己在操作哪个窗口等等。很多的设计与排版方式都已经得到了大众认可，可以作为网站设计时的参考。
网站结构设计的好看不好看对访客来说虽然有影响，但也不至于立刻离开，而且即便是非常精致的页面却对用户不怎么友好，想必也不会有多少人愿意访问。
举个例子，以前我用好搜(360搜索)的时候总感觉怪怪的，没有google和网络顺手，研究了一段时间之后才发现好搜的的主页搜索框比网络和google要低一些，Google到顶部固定菜单的距离是286px，网络是192px(未登录238px)，而好搜则是328px。相比之下，好搜的搜索框更趋向于屏幕中间，而网络与Google则是在屏幕中上方，对于已经常年习惯了网络和Google搜索的用户来说，想要改变这个习惯来适应好搜多少有些困难，除此之外搜索框还有结果页也有几个问题不一一细述，360这样做无外乎两点，一个是不在乎/不知道/不关心用户体验，一个就是故意有所不同，想要培养自己的用户习惯。(在我看来也不怎么成功)
细节决定成败
乔布斯的父亲是个木匠，曾经教给乔布斯一个理念，就是橱柜的背面里层也要细致处理甚至是打磨光滑，即便用户看不见。在理想主义的伟大试验品“麦金塔”出世之后，有人甚至感叹，就连电路板上的电路图都能当作艺术品，的确如此，乔布斯就曾经开除一个对电路图美学设计不满的员工。一个伟大产品的诞生并不是一蹴而就的，必然经过了长期的沉淀积累与琢磨，但仅此依旧不能称之为伟大，只能算成功。一个产品细节上的最后润色可能才是决定它价值的关键。对于WEB开发者来说，更是如此。
Ⅱ 怎么学习前端开发求推荐学习路线
基础知识
1、
HTML + CSS 这部分建议在线教程 上学习，边学边练.
之后可以模仿一些网站做些页面。在实践中积累了一些经验后，可以系统的读一两本书，推荐《Head First HTML 与 CSS
中文版》，这本书讲的太细了，我没能拿出耐心细读。你可以根据情况斟酌。
2、Javascript 要学的内容实在很多，如果没有其他编程语言的基础的话，学起来可能要费些力，建议看《Javascript语言精粹》，JS是一门很混乱的语言，这本书能够帮助你区分哪些是语言的精华，哪些是糟
粕，对于语言精华，应该深入学习。糟粕部分能看懂别人写的代码就行，自己就不用尝试了。
有了以上基础，就可以进行一般的静态网页设计，不过对于复杂的页面还需要进一步学习。
1、CSS。必看《精通CSS》，看完这本书你应该对：盒子模型，流动，Block，inline，层叠，样式优先级，等概念非常了解了。作为练习可以看下《CSS艺门之匠》这本书，它对标题，背景，圆角，导航条，table，表单等主题都有详细的介绍。
2、Javascript。上面提到内容还不足以让你胜任JS编程。在有了基础之后，进一步学习内容包括：
a） 框架。
推荐jQuery，简单易用，上手jQuery即可完成一些简单的项目。学习方法也很简单，照着产品文档做
几个页面就行了，不用面面俱到，以后遇到问题查文档就行了。框架可以帮你屏蔽浏览器的差异性，让你能更专注与Web开发学习的精髓部分。补充： 可以使用
Codecademy 学习 Javascript，jQuery，用户体验真的很好（感谢 TonyOuyang ）。
b） Javascript 语言范式
。这个名字可能并不恰当，只是我找不到可以描述“面向对象”，“函数式”这个两个概念的概念。Javascript不完全是一个面向对象的语言，它的很多
设计理念都有函数编程语言的影子，甚至说如果你不用面向对象，完全可以把它理解成一门函数式编程语言。
Javascript的很多语言特性，都是因为他具有函数式语言的特点才存在的。这部分推荐先学习面向对象的基本理论，对封装，继承，多态等概念要
理解，维基网络，网络会是你的帮手，另外推荐《Object Oriented
Javascript》，应该有中文版。对与函数式编程我了解的也不系统，不好多说，可以自己网络一下。
c） Javascript 语言内部机制。必须弄清如下概念：JS
中变量的作用域，变量传递方式，函数的定义环境与执行环境，闭包，函数的四种调用方式（一般函数，对象的方法，apply，call），以及四种调用方式
下，‘this’指向的是谁。这部分内容你会在《Javascript语言精粹》中详细了解。另外，你必须理解 json。
d） dom编程，这个Web前端工程师的核心技能之一。必读《Dom编程艺术》，另外《高性能 Javascript》这本书中关于dom编程的部分讲的也很好。
e） Ajax编程，这是另一核心技术。Ajax建议在网上查些资料，了解这个概念的来龙去脉，网络，维基网络上的内容就足够了。真正编程是很容易的，如今几乎所有框架都对Ajax有良好的封装，编程并不复杂。
f） 了解浏览器差异性。这部分包括CSS和js两部分，浏览器差异内容很多，建议在实践中多多积累。另外对于浏览器的渲染模式，DOCTYPE等内容应该系统学习。
3、HTML5和CSS3 。HTML5规范已经于2014年10月28日发布了，移动端HTML5和CSS3已经得到了非常广泛的使用，必知必会呀。
再进一阶 · 代码层面：
有了以上知识，对于大多数小型网站，你应该已经可以写出能够工作的代码了。但要想成为更专业的前端，你还需继续努力。更高的要求大概还有四方面：1）易维护，2）可测试，3）高性能，4）低流量（移动端）。
1）易维护。对于页面你该理解‘样式’，‘数据’，‘行为’三者分离，对应的当然就是CSS,HTML,js。对于js代码，你最好了解设计模式，重构，MVC等内容。
2）可测性。
3）高性能。必读《高性能Javascript》
4）低流量。移动端关注比较多。
5）对于想要学习前端的同学，尤其是自学的伙伴，自学并非永久的，假如没有定力的还是找个培训机构吧。
再进一阶 · 工程层面：
前端项目同样面临软件生命周期的各个环节，首先是代码管理，你必须学会使用Svn和Git。其次是代码的构建，如今前端代码构建已经不是简单的压缩一下了，需要进行依赖管理、模块合并、各种编译，比需要学会使用Grunt、Gulp等前端构建工具。
Ⅲ 大家来说说自己的经验:写一个web前端页面要多久时间,比如豆瓣网的首页.
自已写的话，可能需要一周时间，如果拷贝的话，可能需要1-3个小时吧。
Ⅳ 前端开发好找工作吗
一、学习前端这一块，找工作怎么样？
目前前端这一块市场需求还是很大的，薪资待遇水平也很不错的，最后涉及到找工作这一块，有些同学会说，为什么学前端工作不好找呢？首先对于这个问题，根据相关数据调查显示，这个问题不仅仅是前端行业有这个问题，各行各业都有这个问题，很多人其实对前端都是一知半解，仅仅学习了一个皮毛，基本什么也不会，连个像样的小项目都做不出来，你们觉得这样的水平好找工作吗？换做是你当老板，你会乐意雇佣什么也不会的员工吗？
企业需要的是召之即来，来之能用的人才，而不是一半瓶子不满，半瓶子晃悠的人。反观我们看一下那些真正有前端技术的同学，很多企业都是抢着要，把自己做的项目，放那一演示，证明自己很牛，公司的求着找你，你的境遇由你的实力决定，不要把自己的无能怪罪于前端这个行业怎么样，任何行业都是一样的，有本事的人才能走的更远，当然那些前端水平一般的同学，不要纠结，尽管你现在的前端水平有点差，但是你可以通过不断的学习，来提升自己的水平啊，水平是动态的，是可以不断的变化的，学习可以改变一切。
对于如何学习WEB前端，或者在学习WEB前端过程中遇见问题自己无法解决，可以到这个WEB前端裙，里面有最新的学习路线和教程，可以跟着学，有什么不懂的地方可以随时在里面问，后面就是这个WEB前端裙：网页链接。
二、别把自己停留在对前端的迷茫上，学习，提升，才是硬道汪吵理。
很多想学前端的同学，总是停留在一个徘徊观望的层面，内心充满了纠结和迷茫，觉得选这行对吗？怎么才能一步登天呢？我想说的是，任何一个行业都不容易，都需要你付出努力用心思考坚持，吃苦耐劳才能赢得未来，不要总想走捷径，没有，也别把自己当成时代的幸运儿，用一颗平常心，踏踏实实学习，踏踏实实提升自己，才是王道。
一些同学会问我，想学前端，但是不知道应该从哪里入手？老话说的好，只有站在巨人的肩膀上，才能看的更高更远，聪明的同学永远都知道，借鉴别人的精华，迅速的提升自己，所以好的开始，就是跟前端高手学习，因为他们有经验，有实力，怎么学，怎么提升，他们很有经验，我认识一位前端高手，他每天都在网上做前端免费直播课，我也经常去听，学到很多东西，讲差清的给人一种醍醐灌顶的感觉，别自己摸索学习强多了，学习前端不仅仅是知识层面的提升，还有思维层面的提升。希望同学们做一个聪明的人，一个善于学习的人，一个懂得如何不断强大自己在这个现实的社会中生存的更好的人，只有你自己的努力才能给自己更强大的未来，而不是抱怨等待犹豫，这只是堕落者的表现。
三、关于自学前端好找工作吗？
自学前端，很多人虚陵前学不好的，还没学到找工作的阶段，在学习的阶段很多同学就已经放弃了。而且我们发现一个问题，很多自学出来的学生，前端的开发水平是很弱的，知识点掌握不扎实，也缺乏前端思维，没有对这方面的深入理解和思考，缺乏与时俱进的东西，有一种思维被框限的感觉。靠自学即便找到工作，由于水平不高，也很容易造成工资不高，在公司里和专业的出来的有差距，后期晋升也不是太容易。
四、你必须知道的学好前端的六点建议。
（1）夯实基础,
要成为一名年薪30W的前端工程师，基础一定要掌握牢固，基础知识一问三不知，岂不是要贻笑大方。css，js基础知识一定要掌握得很熟练，你能使用css实现斑马条纹背景，毛玻璃效果吗？能给图片实现滤镜效果，能实现所有自适应布局效果吗？原型，原型链，闭包是实现设计模式的必备知识，你真的弄懂了吗？闭包导致内存泄漏的原因是什么，你弄明白了吗？ajax跨域的解决方案你可以说几种？你还是只告诉我jsonp吗？mit记录中查看编程思想和逻辑的进化过程，就是一场与大神直接的面对面交流，是一场绝妙的学习之旅。
现在网络课程也十分丰富，有很多技术大牛的课程让我们直接通过视频生动的讲解快速地学习技术，这何尝不是一种向大神快速学习的方式呢。
（5）良书益友
虽然现在网络上各种文档、博客文章已经很丰富了，但是对工作经验不足，基础薄弱的同学来说，随手拿起书，时时能学习也是一种很好的方法，查漏补缺，完整地夯实基础。
（6）紧跟潮流
现在的前端技术体系更新十分迅速，想着要不要尝试用下Vue的事仿佛还在昨天，今天一觉醒来就看到尤雨溪宣布要开发Vue3.0了。
前端体系中这两年SPA已经不是新名词，PWA，SSR，小程序愈发流行，前端微服务化的趋势也应运而生，RN,electron在移动端，桌面端的使用也越来越多，ES10标准的发布也没几个月了。所以最重要的是突破当前岗位需求的设限，对各种技术融会贯通，创造新的技术框架，做技术的领头羊，适应时代发展。技术人成长不能再单打独斗，要学会与人交流，学会将别人的知识为自己所用。
Ⅳ 如何帮助前端新人入门和提高
第一个月主要让他们对一些专业术语和前端整体的知识体系做了概览（包括html、css、js、dom、bom等），当然这里必须要去了解的是W3C的诞生以及它的发展历程，还有各大浏览器厂商的发展历程以及当今不断变化的市场格局。前半个月对html所有的标签做一个系统的学习，并对常用的标签(div\p\h1-h6\span\img\ul\dl\ol\li)做重点的理解和DEMO书写，这里我特别传达了语义化的概念给他们希望他们合理的使用标签，而不是根据自己的心情随意的使用标签。后半个月对css的所有属性做通览，并对常用的CSS属性做重点理解和实战，这里我没有让他们对所有的CSS属性做很详细的了解（有些CSS属性可能我们自己一辈子都不会用到，以后遇到的时候学会查API即可）。这过程中还传达了hack这个概念给他们，以及对待hack的态度和常用实例。
第二个月主要是JS的学习（话说一个月学习JS真的是太难太难了，虽然是个脚本语言但要注意的地方特别多），首先对JS基础的一些东西的学习（词法结构、数据类型和值、变量、表达式和运算符、语句等等一些基础知识），在学JS期间我发现他们明显比第一个月学习html和css来的烦躁，但好得他们有学过编程，有些基础。基础学好之后，就是客户端的一些知识的学习，dom\bom等等，如何对dom操作，关于性能这方面的东西暂时没有传达给他们，等他们达到一定知识程度上我希望他们学习如何优化。后半个月就是让他们接触一个JS框架，并学会高效快速的写出页面交互代码。
第三个月基本就是实战，html+css+js，每周基本都要写好几个页面，然后我会带他们一起去review，并指出所存在的问题，顺便让他们自己记录下，总结，下次再写页面时避免。