1. 界面和用户体验

  • 注意,浏览器的实现标准是不一致的,请确保你的网站能够兼容所有主流的浏览器。最少需要测试的有 Gecko 引擎 (Firefox),WebKit引擎(Safari以及一些手机浏览器),Chrome,你所要支持的 IE 浏览器,以及 Opera。此外,你还需要了解不同系统下,浏览器是如何渲染网页的。
  • 考虑一下人们不使用主流浏览器的情况,如手机,屏幕阅读器和搜索引擎。一些可用的辅助信息:WAI 和 Section508,移动开发:MobiForge。
  • 阶段:如何在不影响用户的情况下部署更新。有一个或多个可以用来改变架构、代码或全部内容,并确保它们在可控范围内实现部署的测试或临时环境。有 一种自动化的方式把更新部署到线上网站。最有效的实现方式是结合使用版本控制系统(CVS、Subversion等)和自动构建机制(Ant、NAnt 等)。
  • 不要直接向用户显示不友好的错误信息。
  • 不要用纯文本的方式显示用户的电子邮件,因为他们可能会被垃圾邮件烦到死。
  • 为用户生成的链接添加 rel=”nofollow” 属性,以避免垃圾邮件。
  • 为你的网站建立周全的限制–这条也同时属于安全方面。
  • 学习如何进一步的提高。
  • POST 提交成功后进行重定向,以免刷新造成重复提交。
  • 别忘了考虑无障碍访问。这总是不错的,在某些情况下,这甚至是法律要求的。 WAI-ARIA 和 WCAG 2 里都有关于这方面很好的资源。
  • 不要让我思考。

2. 安全

  • OWASP开发指南 几乎覆盖了网站安全所有的内容。
  • 了解注入,尤其是 SQL注入,并学会如何阻止它。
  • 永远不要相信用户的输入,以及其他任何请求(包括Cookies和隐藏域的值)。
  • 使用盐值(salt)哈希密码,并对不同的行使用不同的盐值,防止攻击。使用哈希算法如 bcrypt 或 scrypt(更安全,但比较新)(1, 2)来存储密码。(如何安全的存储密码)。NIST也允许使用PBKDF2来加密密码。避免直接使用 MD5 和 SHA 等算法。
  • 不要企图拿出自己喜欢的认证系统。这是很容易出错的,并且是不可测的,甚至直到你被攻击了你才知道。
  • 了解信用卡处理规则。(也可查看该问题)
  • 在登录页和任何需要输入敏感数据的页面使用SSL/HTTPS
  • 防止 session 被劫持。
  • 避免跨站脚本(XSS)。
  • 避免点击劫持。
  • 保持系统更新到最新的补丁。
  • 确保数据库连接信息的安全。
  • 让自己了解最新的攻击技术和会影响你平台的漏洞。
  • 阅读谷歌浏览器安全手册
  • 阅读WEB应用黑客手册
  • 考虑最小特权原则,尽量使用非root用户运行服务器(以tomcat为例)。

3. 性能

  • 如果有必要的话,实现缓存,请正确理解和使用HTTP缓存。
  • 优化图片。不要使用20K的图片作为平铺背景。
  • 学习如何 gzip/deflate 内容(deflate效果更好)。
  • 合并样式表与脚本文件以减小浏览器链接数,同时提高 gzip 的压缩能力。
  • 浏览雅虎性能卓越的网站,以及大量的指南,其中包含提升前端性能和YSlow工具(需要安装Firefox, Safari, Chrome 或 Opera)。此外,Google page speed(浏览器扩展)也是一个性能分析工具,它同时可以优化你的图片。
  • 对于小的如工具栏图片,使用CSS Image Sprites(参考最小化HTTP请求)。
  • 访问量大的网站应该考虑跨域拆分组件。
  • 静态内容(如图片、CSS、JavaScript及不需要访问cookie的内容)应该放在一个单独的域下,因为域及其子域的每一个请求都会发送cookie。这里是使用内容分发网络(CDN)的一个很好的选择。
  • 减少浏览器渲染页面所需的HTTP请求的总数量。
  • 利用Google Closure Compiler及其他压缩JS的工具。
  • 确保网站根目录下有一个favicon.ico文件,即使在HTML中并没有提到它,浏览器也会自动加载它。如果你没有 /favicon.ico ,就会返回很多404错误,消耗服务器带宽。

4. SEO (Search Engine Optimization) 搜索引擎优化

  • 使用“搜索引擎友好”的URL,如 http://example.com/pages/45-article-title 而不是 http://ofexample.com/index.php?page=45。
  • 在动态内容中,把 # 改成 #! ,然后在服务器端使用$_REQUEST["_escaped_fragment_"]。换句话说 ./#!page=1 变成了 ./?_escaped_fragments_=page=1。此外,对于使用 FF.b4 或 Chromium 的用户,history.pushState({“foo”:“bar”}, “About”, “./?page=1″); 是一个非常棒的命令。因此,即使地址栏已经改变了,页面也不会刷新。
  • 不要使用“点击这里”这样的链接。你是在浪费一个搜索引擎优化的机会,而且它让使用屏幕阅读器人们更难阅读。
  • 有一个XML网站地图,最好在默认位置 /sitemap.xml。
  • 当有多个URL指向同一个内容的时候,使用 <link rel=”canonical” … /> ,这个问题可以通过 Google Webmaster Tools 来解决。
  • 使用 Google Webmaster Tools 和 Bing Webmaster Tools。
  • 安装 Google Analytics 或者其他开源分析工具如:Piwik。
  • 了解 robots.txt 及搜索引擎蜘蛛 是如果工作的。
  • 使用重定向(301)www.example.com 到 example.com(或者反过来),防止它们平分谷歌网站排名。
  • 要知道有 badly-behaved 蜘蛛的存在。
  • 如果你的网站有非文本内容,Tim Farley 的回答中有一些非常有用的信息。

5. 技术

  • 理解HTTP以及GET、POST、session、cookie以及“无状态”的意思。
  • 撰写XHTML/HTML和CSS要遵循W3C规范,并确保它们通过校验。这样做的目的是为了避免浏览器的怪癖模式,并且这使得非标准浏览器如屏幕阅读器和移动设备更加容易实现。
  • 理解浏览器是如何处理JavaScript 的。
  • 理解JavaScript 、样式表、以及页面使用的其他资源是如何加载的,并考虑它们对感知性能的影响。现在普遍认同的一种做法是把除分析代码等以外的脚本文件放在页面底部。
  • 了解JavaScript 沙箱是如何工作的,特别是当你想使用 iframe 的时候。
  • 需要注意到,JavaScript是可以被禁用的,因此AJAX只是一个扩展,而不是基准。虽然大部分用户并没有禁用它,但记住,NoScript正在变得越来越流行。并且,谷歌在索引你的网站时也不会运行JavaScript。
  • 学习 301 和 302 重定向之间的不同。
  • 尽可能多地了解你的部署平台。
  • 考虑使用 Reset Style Sheet 或 normalize.css。
  • 考虑使用JavaScript框架(如jQuery, MooTools, Prototype, Dojo 或 YUI 3),这可以避免很多使用JavaScript操作DOM时的差异。
  • 在考虑感知性能和框架的同时,考虑使用服务,如Google Libraries API,来加载框架,这样浏览器可以使用已经缓存的框架而不是从你的网站上下载。
  • 不要重复造轮子。在做任何事情之前,先搜索相关的组件或者实例。99%的可能别人已经实现了并发布出了开源的代码。
  • 在确定需求之前,尽量不要使用超过20个的库,这是非常不利的。特别是客户端WEB,保存轻便、快速、灵活是最重要的。

6. BUG修复

  • 要了解你花费20%的时间写代码而花费80%的时间来维护,因此写代码时一定注意。
  • 建立一个好的错误报告解决方案。
  • 建立一个别人可以提建议和批评的系统。
  • 为未来的支持人员和维护人员建立良好的文档。
  • 经常备份!Ed Lucas 的回答中有一些建议。有一个恢复策略,而不只是一个备份策略。
  • 使用版本控制系统,如 Subversion、Mercurial 或 Git。
  • 不要忘记验收测试。Selenium 等框架可以帮到你。
  • 请确保您有足够的日志记录的地方,可以使用框架如log4j, log4net 或 log4r。当网站出现问题的时候,你需要能够找到问题所在。
  • 日志要记录已处理异常和未处理异常。分析日志输出,因为它会显示出你网站的关键问题。

这里有些省略的东西并不是因为它们没用,而是因为它们过于详细或者超出了范围,或者说的太远了。当然,上面的内容可能也有一些遗漏或者错误。

WEB 开发者应该具备的 6 大技能?的更多相关文章

  1. 每个Web开发者必备的9个软技能

    对于一份工作,你可能专注于修炼自己的内功,会在不自觉中忽视软技能.硬技能决定你是否能得到工作,而软技能能够表明你是否适合这份工作和适应工作环境等.所有的公司都有属于自己的文化,并努力将这些文化传承下去 ...

  2. 详解Linux运维工程师应具备的十大技能

    Linux系统如果是学习可以选用Redhat或CentOS,特别是CentOS在企业中用得最多,当然还会有其它版本的,但学习者还是以这2个版本学习就行,因为这两个版本都是兄弟,没区别的,有空可以再研究 ...

  3. Web开发者需具备的8个好习惯

    优秀的Web开发人员工作效率更高,因为他们拥有丰富的经验和良好的习惯.作者Gregor Dorfbauer分享了用于Web开发中的8个好习惯,这些良好的工作习惯不仅能提高效率,还能让您创建更加优秀的应 ...

  4. Web 开发者易犯的5大严重错误

    无论你是编程高手,还是技术爱好者,在进行Web开发过程中,总避免不了犯各种各样的错误. 犯了错误,可以改正.但如果犯了某些错误,则会带来重大损失.遗憾.令人惊讶的是,这些错误往往是最普通,最容易避免. ...

  5. 每个Web开发者都需要具备的9个软技能

    对于一份工作,你可能专注于修炼自己的内功,会在不自觉中忽视软技能.硬技能决定你是否能得到工作,而软技能能够表明你是否适合这份工作和适应工作环境等.所有的公司都有属于自己的文化,并努力将这些文化传承下去 ...

  6. 每个Web开发者都需要具备的9个软技能--ZT

    本文原始链接:http://www.cnblogs.com/oooweb/p/soft-skills-every-web-developer-should-master.html 对于一份工作,你可能 ...

  7. 想转行做web前端工程师,必学这5大技能!知道是那些吗?

    web前端工程师是近几年才发展出来的新兴职业,也是目前火爆且高薪的职业. 大需求的市场环境下,出现了越来越多的人群转行做web前端工程师,如设计师.后台程序员.网虫.大学其他专业.策划.编辑等等. 要 ...

  8. Web开发者用什么编辑器?

    写在前面的话:从事web前端开发也有一段时间了,今天主要想分享的是文字(代码)编辑器.对于编辑器每个人都有自己的偏爱,也分不同语言的编码者,这里我就拿我接触过的来说说吧! Web开发者用什么编辑器? ...

  9. 21 步助你成为成功的 Web 开发者(激情不是被动的:它是一种对行动起来的追求)

    随着 Web 开发产业的爆发式发展,许多人会问这样的问题:我如何才能成为一名 Web 开发者?我认为这是一个错误的提问.问题应该是:我如何才能成为一名成功的 Web 开发者? 能提出这样的问题很重要, ...

随机推荐

  1. 盖房子(house)

    盖房子(house) 题目描述 FJ最近得到了面积为n*m的一大块土地,他想在这块土地上建造一所房子,这个房子必须膏形的.但是,这块土地并非十全十美,上面有很多不平坦的地方(也可以叫瑕疵).这些瑕疵十 ...

  2. RocketMQ源码 — 三、 Producer消息发送过程

    Producer 消息发送 producer start producer启动过程如下图 public void start(final boolean startFactory) throws MQ ...

  3. (转)个例子让你了解Java反射机制

    个例子让你了解Java反射机制   原文地址:http://blog.csdn.net/ljphhj/article/details/12858767 JAVA反射机制:   通俗地说,反射机制就是可 ...

  4. HDU 1176 免费馅饼(数塔dp)

    一开始被吓到了,后来再仔细一读发现就是一个数塔,没有那么复杂 #include<stdio.h> #include<string.h> #include<algorith ...

  5. Bootstrap登录样式

    样式1 <!--bs中所有的均应该包裹在其中.--> <div class="container"> <!-- row是珊栏系统的包裹容器--> ...

  6. Android4.2以后,多屏幕的支持 学习(一)

    前几天总结了Android的多用户支持,过几天准备再总结Android的多屏支持.Android支持3种类型屏幕:主屏幕(Primary Display).外屏幕(External Display)和 ...

  7. fixed定位与absolute定位

    相同点: 1.fixed定位和absolute定位都是绝对定位 2.fixed定位和absolute定位都脱离了标准文档流, 3.未设置偏移量时,都定位在父元素的左上角 tip:元素设置相对定位或绝对 ...

  8. hibernate--student_course_score

    学生, 课程,分数的设计. a)使用联合主键@EmbeddedId 使用Serializable接口 b)不适用联合主键 联合主键: 3张表, student: id, name course: id ...

  9. java 并发多线程异步

    http://www.cnblogs.com/dolphin0520/category/602384.html   并发 http://blog.csdn.net/column/details/con ...

  10. (中等) HDU 3335 , DLX+重复覆盖。

    Description As we know,the fzu AekdyCoin is famous of math,especially in the field of number theory. ...