前端的水有多深?

  但凡从事互联网的人基本都会写几行 html,用过 Word 的人用 Dreamweaver 也能做出规整的页面,所以大部分人会很自然地认为“前端开发没什么技术含量,so easy”。当然从业者也有很多疑惑:做前端页面实现,没问题;兼容性,也还好;图片集成,貌似也还行……还能有什么问题?瓶颈啊、天花板啊、转行啊、出路啊、前景啊就在从业者中广泛讨论。是不是真的没什么问题了呢?页面开发还有哪些要求,还要做些什么,这里面的水到底有多深呢?

  在不同的时期对前端的看法似乎是不同的。在互联网早期的时候,小车还是比房子贵的,烧饼和粉丝还只是用来吃的,菊花还只是用来泡茶的。那时的页面设计风格相对单一,对应的页面需求也比较简单,并且当时的浏览器也基本是 IE6 的天下,javascript 也只是网页特效的代名词,HTML 页面本身没有引起太多人的关注,似乎只要能用 table 加 css 辅助把图片定好位,把页面内容预留好就 OK 了,并且这种观念存在了很长一段时间。随着页面内容的丰富,设计风格的发展,交互复杂性的增加,AJAX 的应用,浏览器的更新换代,让大家重新对最基本的页面重视起来。然后被广泛讨论的是浏览器的兼容性,css hack,是不是的骂一骂坑爹的IE6、7、8……,然后开始寻找出路。下面我们就从这个阶段开始说起。

  实现效果图是最基本的工作

  把视觉稿通过页面代码的方式表现出来包含了两个基本诉求:1.能够真实反映视觉稿;2.能够通过浏览器的兼容。这两个诉求的达成需要我们有注重细节的态度和一定的页面功底,但这就代表着我们可以胜任页面开发的工作了吗?不,这才刚刚开始!

  与设计师的沟通和项目的参与

  沟通很重要。先抛出几个问题:我们有没有和设计师探讨过某些效果对低端浏览器渲染效率影响比较大?有没有探讨过部分效果可以用 css3实现从而使得结构更加简洁清晰?前端页面的开发面向用户,编写的代码也直接作用在浏览器上,我们有义务对页面的稳定性和渲染效率负责。我们也经常碰到项目在总体进度压力下导致的设计与前端开发同步进行,这时更有必要尽量多地获取项目信息,了解我们还要做些什么,这些可以帮助我们充分考虑重用和框架拓展。

  良好的页面结构

  页面结构的编写好比盖房的地基建设,其好坏会直接影响到 CSS 代码的质量、js 开发、后台开发还会影响到以后的页面拓展和页面调整。拿到视觉稿后,不要忙着动手开始,多观察思考。先分析布局,划分框架,然后规划结构,编写代码。特别在大型项目中,合理使用模块化的开发不论从整体进行还是拓展维护都有相当大的好处。

  关于 hack

  很多同学在页面开发时上网搜索最多的就是 hack 了,是否我们完全要依赖 hack 来实现页面兼容性,答案是否定的。大部分情况下可以通过变换思路调整 HTML 结构,或使用一些虽然无法解释但相对安全的 css 或者使用兼容性较好的jquery来干掉 hack。谁都无法预计使用 hack 什么时候会让我们栽一个大跟头。

  优美的代码

  现在很多 web 项目功能复杂,代码规模也会变得很庞大,如何更好地进行协同开发和维护是我们面临的一个问题。需要考虑完善统一的规划,还有要养成良好的代码开发习惯才会在面临各种情况时游刃有余。翻阅页面代码,看到合理的标签使用、良好的注释、清晰的代码结构、用意准确的 css 不仅犹如欣赏一个艺术品,更为下游开发和协同开发降低了不小的沟通成本,我们有什么理由不去这么做呢?举个反面例子:div 滥用是现在比较典型的一个问题。数数看自己使用的标签有多少个呢?不同的语义都该使用对应的标签代码,特别是 HTML5 提供了更丰富的语义化标签。

  保障效率

  作为项目开发中比较靠前的一环,页面开发可能需要尽早完成为项目争取时间,这就需要我们尽可能地提高效率。“工欲善其事,必先利其器”,除了实战经验和代码习惯的形成可以帮助我们提高效率外,想要提高对自己开发的进度掌控能力,还有很多辅助工具可以帮助我们进行页面开发。比如使用 Less 或 Sass 可以帮助我们拓展和组织 CSS,大大提高 CSS 的编写效率增加了可维护性。比如在是用sublime text2/3编辑器时可以通过其丰富的插件来提高开发效率。当然了,还是得找一款适合你自己的编辑器。编辑器这么多,总有一款适合你。

  针对服务器的优化

  页面开发也需要了解服务器的优化,尽量减小服务器负担。比如 css sprite 就是一个典型减小服务器请求数的例子。对 class 名进行了混淆压缩避免命名过长的冗余;应用 base64 减少请求数量等等措施。这些都是综合权衡的结果,需要考虑各个方面整体优化。因为当页面访问量达到一定的数量级时,再小的一点优化都会达到可观的效果

  拥抱 HTML5

  这是一个充满机会的时代,HTML5时代的来临伴随着移动互联网的兴起创造了更大的机会,还有太多的东西值得我们去学习去发现。 HTML5 提供了丰富的 JS API 接口,需要我们去研究;CSS3的绚丽吸引了足够多的眼球,需要我们去研究;移动设备上如何开发更加适配的页面,需要我们去研究……

  一大波javascript框架袭来。

  jQuery、AngularJS、AngularJS2、Vue.js、React、Node.js

  

  这些还不够,一个合格的前端还需掌握这些知识,并不要求所有,当然多多益善啦。

  主流的服务器端知识也是不少。

  PHP、Python、Python3、java等等

  数据库也得会一些,起码的增删改查得会吧!

  SQL、Mysql

  学得越多,发现自己不懂的也越多。哎,一入前端深似海啊!

时间: 2024-10-07 18:28:52

前端的水有多深?的相关文章

页面前端的水有多深?再议页面开发

但凡从事互联网的人基本都会写几行html,用过Word的人用Dreamweaver也能做出规整的页面,所以大部分人会很自然地认为"页面 的开发没什么技术含量,很简单".不仅有这种普遍的认知,对从业者来说也有很多疑惑:做页面前端实现,没问题:兼容性,小case:图片集成,一直都在 用--还能有什么问题?瓶颈啊.天花板啊.转型啊.出路啊就在从业者中广泛讨论.是不是真的没什么问题了呢?网易邮箱前端技术中心也设立好几年了,似乎有 着讨论不完的话题,也经常会有一些新的想法让大家为之一振.那么页面

韩国整容业,水实在太深了!

韩国整容业,水实在太深了!有免费咨询平台提供参考,避免盲目整形---欢迎咨询 不知道大家对整容是什么态度,这几年微整形很流行,早妈身边不少朋友都稍微动了动脸,割双眼皮.纹眼线.纹眉--在网络上,也出现了整容的"网红脸",大家都稀松平常,对整容见怪不怪. 作为整容大国,韩国吸引着中国很多爱美女性去整容.早妈一直觉得,韩国的整容业这么大有名气,应该会比国内的整形机构靠谱. 然而,原来并不是这样,韩国整容业背后是各种黑暗! 上面这个新闻里的女主角在韩国整容失败后,选择赴韩维权.谁知,竟被抓紧

Python爬虫开发的3大难题,别上了贼船才发现,水有多深

写爬虫,是一个非常考验综合实力的活儿.有时候,你轻而易举地就抓取到了想要的数据:有时候,你费尽心思却毫无所获. 好多Python爬虫的入门教程都是一行代码就把你骗上了"贼船",等上了贼船才发现,水好深-比如爬取一个网页可以是很简单的一行代码: r = requests.get('http://news.baidu.com') 非常的简单,但它的作用也仅仅是爬取一个网页,而一个有用的爬虫远远不止于爬取一个网页. 一个有用的爬虫,只需两个词来衡量: 数量:能否抓全所有该类数据 效率:抓完所

腾讯影业拟投资20亿,娱乐帝国之水有多深?

[阅读原文] 作者:楠沨 腾讯影业创立于 2015 年9月,归属于腾讯互娱,与腾讯视频下的企鹅影业同属腾讯集团.腾讯影业以迪士尼+漫威的模式作为标杆,侧重于打造明星 IP,曾投资电影版<魔兽世界>和即将上映的<金刚:骷髅岛>.而企鹅影业则依托腾讯文学.动漫及游戏的自有 IP 资源进行内部孵化培育. 据知情人士透漏,腾讯影业今年对国内外电影项目投资约 10 亿元人民币,而到 2017 年这一数字将大幅增长.这些项目仅涉及融资计划,并不包含购买 IP 和内容生产.自去年成立电影制作公司

上周热点回顾(6.26-7.2)

热点随笔: · .NET C#转Java没那么难,开发环境篇(RabbitYi)· Vuejs技术栈从CLI到打包上线实战全解析(万里秋山)· 神奇的深度图:复杂的效果,不复杂的原理(慕容小匹夫)· .NET Core 2.0 Preview2 发布汇总(Savorboard)· 利用单片机快速实现家庭智能控制平台(小五义)· 前端的水有多深?(江峰★)· [博客园皮肤]-超简洁美观-css源码分享(Nirvana_zsy)· 神奇的 conic-gradient 圆锥渐变(ChokCoco)·

jQuery学习之开篇

吐槽 最近比较烦,对于一个前端白痴来说,工作方向突然转向前端这块着实让人蛋疼无比.前段时间简单的学习了下EasyUI,算是对其有一个简单的认知了吧.EasyUI的研究过程中发现,如果没有掌握JS.JQuery想要进行后续的开发会非常困难.得,又得学下JQuery,一种蛋蛋的忧伤.一直认为前端的水非常的深这段时间算是见识到了,哎,不过工作还的继续,吐槽完了,卯足干劲充电吧! 前言 某前端白痴一个,会点html+css+js.JQuery的学习书籍看的是<锋利的JQuery>,先入门看了两章,感觉

从游戏开发到产品创新

[慕客访谈]阿当技术漫谈之(二):从游戏开发到产品创新       本期人物:阿当 前端工程师         背景介绍:   在上一期对资深Web技术专家阿当的访谈中,他详细解读了前端发展的三个阶段.在知识深度与广度方面的二八原则以及如何做好敏捷开发(相关阅读:阿当技术漫谈之(一):从前端领域到敏捷开发),本期访谈中他将继续和大家分享技术驱动创新.学习技巧以及职业建议等,从具体的读书技巧到保持自身竞争力,相信仍然会让你受益匪浅.       导读:         ◎挑战游戏开发       

WEB前端经验之谈(没有速成,只有不断积累。)

2013年8月25日,我人生中的第一份正式工作开始了,第一份工作做的是当时学习的asp.net,用的是C#语言. 到第一家公司上班是公司是做一个OA系统,不过我去的时候大部分都已经完成了,剩下的都是细节和BUG处理,而就在第一份工作3个月后,我就走上了自己的路,准确的说,我是从2014年才开始自己真正的前端之行. 2014年3月初,辞职,休息了一个月,因为离职原因是我想转方向,从后端转到前端,我现在还记得当时主管签我的离职协议说的那句话:“不就签个字嘛,这个很简单的.”,确实,对已经走到主管这个

前端开发必知的7大技能

随着互联网快速成为日常工作生活的一部分,对于从事互联网的职业也有了更加清晰的定位:设计, 前端开发 ,后端,编辑,运营等等. 随着互联网快速成为日常工作生活的一部分,对于从事互联网的职业也有了更加清晰的定位:设计,前端开发,后端,编辑,运营等等.在这里我们以前端开发的人员的角度来看看应该掌握哪些技能. 大部分人会很自然地认为" 页面的开发没什么技术含量,很简单 " .不仅有这种普遍的认知,对从业者来说也有很多疑惑:做页面前端实现,没问题:兼容性,小 case :图片集成,一直都在用 -