美文网首页Web 前端开发 让前端飞
献给前端er的各种小技巧

献给前端er的各种小技巧

作者: 京程一灯 | 来源:发表于2016-11-18 17:08 被阅读0次

写在最前面:前端学习要想有质的飞跃,必须长期坚持学习和积淀。

一些小技巧:

1.Firefox 的查看页面源代码功能,可以一眼发现未闭合的标签、未转义的HTML字符,另一种办法,提交页面代码到 http://validator.w3.org/ 来验证HTML、CSS。因为未闭合的标签比如div会造成排版混乱,面试要求上也时常可以看见能够书写符合W3C标准的代码。

2.web标准中,一个页面只能有一个h1标签。

3. 不要滥用

,HTML5提供很多语义化的新标签,如:等语义化的结构标签,与等语义化的表示带标题的图片等。这些语义化的标签对于搜索引擎极为重要。

4.尽可能不要设置元素的id如#main{}来设置元素css样式,而是用class方式.main{},另外应当绝对避免行内css样式,除非权重非常高。

5.尽量使用GIT与SVN,否则以后无休止的修改会让你崩溃。写代码时最好的习惯就是写注释!写注释!写注释!如果你提交给其他人使用也一定记得单元测试。同时要对分支合并以及打tags有很清晰的思路,这样能够帮助团队进行非常好的版本管理。

6.适当使用localStorage缓存HTML表单内容,防止浏览器崩溃、死机造成填丢。localStorage 只有对应的域名才可以读取;而且不是永久保存,在你操作表单时候,只是暂存入localStorage,在ajax确认表单提交成功后,要立即清除。

7.多列布局,不考虑低级浏览器可以使用CSS3的flex布局,可以做到比浮动更好控制,垂直、水平居中比起双飞翼可以很容易实现。

8.自学前端入门编辑器,建议用sublime或atom,社区也比较活跃。很多人从vim frontpage Dreamweaver 改变过来。

9.尽可能的把雅虎军规过一遍在自己能力范围内去实践。比如合并资源压缩资源等等。

10.尽可能使用iconfont,以及能用CSS绘制的尽量不要用图片。因为现在的浏览器屏幕都是retain。

11.装一个二维码生成当前网址的插件,尤其在测试微信内的页面时候,非常方便。

12.善用sublime插件,比如:emmet插件可以快速编码,提高开发速度。SublimeCodeIntel支持JavaScript,HTML,Node.js,,PHP等等语言的代码自动提;AutoFileName用于src引入文件地址提示,方便图片和文件插入。jshint/jslint代码错误提示。

一些其他建议:

- 尽量的脱离鼠标,使用键盘提高开发速度;

- 在可以多端同步的平台汇集自己的收藏,慢慢搭建知识索引库;

- 使用github ,坚持写博客,知识与心态都会有所改变。

更多技术好文,前端问题,面试技巧,请关注京程一灯(原一灯学堂)

微信搜索“一灯科技”或“jingchengyideng”,即可关注。

相关文章

  • 献给前端er的各种小技巧

    写在最前面:前端学习要想有质的飞跃,必须长期坚持学习和积淀。 一些小技巧: 1.Firefox 的查看页面源代码功...

  • 前端各种技巧收藏

    前端如何防止用户修改水印?[https://segmentfault.com/a/1190000040840891]

  • 前端小技巧

    1.让图文不可复制 这点应该大家 都很熟悉了, 某些时候【你懂的】为了快捷搜索答案,可是打死也不让你复制 -web...

  • 前端小技巧

    1.版权置底 2.图标变小手 3.页面跳转 4.设置全局变量

  • 前端小技巧

    作为前端新手,总结了一下自己在做项目中,遇到了问题,在这里记录一下解决办法。 计算文字的高度,展开收起 在工作中经...

  • 各种使用小技巧

    1.ARC和MRC混合编译: 如果一个工程为MRC,其中要添加ARC的文件: 选择target -> build ...

  • Linux 各种小技巧

    菜单中没有新程序? 以shotcut程序为例: 画png图标,放到 ~/local/share/icons/hic...

  • Python各种小技巧

    解决问题学到东西的过程是最开心的过程: 从昨天到今天,突然发现string里面有很多html的tag,然后想去除掉...

  • 前端开发小技巧之Postman

    专职前端开发也有很长一段时间(10 months) =.= 了 其中用到各种各样小技巧 小工具。 零零散散的,今天...

  • 小程序实现含有今天,明天,后天的日期组件

    前言 做过微信小程序的前端er都知道,小程序有个日期组件,叫picker,但是,需求方要求日期和时间都要显示的,用...

网友评论

    本文标题:献给前端er的各种小技巧

    本文链接:https://www.haomeiwen.com/subject/ashspttx.html