以下内容来自于Stack Overflow的一个问答中，此问题的答案整理的非常的详细，且颇具启发性，整理出来和大家一起分享。由于英语不是很好，如果自身英语成绩比较好的，可以看原文。

问题：那些技术细节是需要程序员把站点开发给公众之前考虑的？像Jeff Atwood(Stack Overflow创始人)这样的都可以忘了使用HttpOnly cookies, sitemaps和cross-site request forgeries，还有哪些可能被遗忘的重要内容？

答案：从一个Web开发者的角度来看，网站的可用性和内容相比平台的稳定性、性能、安全或者被搜索引擎收录更加重要，开发人员需要保证的是做出来的网站不要太烂。以下是一些应该注意的点。

界面和用户体验

1、注意浏览器的实现标准上的不一致，确信让你的网站能够适当地跨浏览器。至少，你的网站需要测试一下下面的浏览器：

• 最新的 Gecko 引擎 (Firefox)，

• 一个 Webkit 引擎 (Safari, Chrome, 或是其它的移动设备上的浏览器)

• IE 浏览器 (测试IE的兼容性你可以使用微软IE的 Application Compatibility VPC Images)

• Opera 浏览器。

最后，你可以使用一下这个工具 来看看你的网页在不同的浏览器下是怎么被显示出来的(陈皓注：这个工具就是以前本站介绍过的在不同浏览器和平台上检查你的网站的兼容性)

2、除了浏览器，网站还有其他使用方式：手机、屏幕朗读器、搜索引擎等等。你应该知道在这些情况下，你的网站的运行状况。例如：一些Accessibility的东西： WAI 和  Section508。移动设备开发：MobiForge。

3、知道如何在基本不影响用户使用的情况下升级网站。通常来说，你必须有版本控制系统(CVS、Subversion、Git等等)和数据备份机制(backup)。 Ed Lucas的答案 可以让你了解一些(陈皓注：Ed说了一些如版本控制，自动化build(Ant, NAnt等), ，备份，回滚等机制)

4、千万不要直接给用户显示不友好的错误信息。

5、千万不要把用户的邮件地址以明文显示出来，这样会被爬虫爬走并被让用户的邮箱被垃圾邮件搞死。

6、为用户的链接加上 rel="nofollow" 的属性以 避免垃圾网站的干扰。(nofollow是HTML的一个属性，用于通知搜索引擎“这个链接所指向的网页非我所能控制，对其内容不予置评”，或者简单地说，该链接不是对目标网站或网页的“投票”，这样搜索引擎不会再访问这个链接。这个是用来减少一些特定垃圾页面对原网站的影响，从而可以改善搜索结果的质量，并且防止垃圾链接的蔓延。)

7、为网站建立一些的限制 - 这个属于安全性的范畴。(比如你在Google注册邮箱时，你一口气注册超过两个以上的邮箱，gmail要求给你发短信或是给你打电话认证，比如Discuz论坛的会限制你发贴或是搜索的间隔时间等等，更多的网站会用CAPTCHA来确认是人为的操作。 这些限制都是为了防止垃圾和恶意攻击)

8、学习如何做 Progressive Enhancement. (Progressive Enhancement是一个Web Design的理念，如：1)基础的内容和功能应该可以被所有的浏览器存取，2)页面布局的应该使用外部的CSS链接，3)Javascript也应该是外部链接还应该是 unobtrusive 的，4)应该让用户可以设置他们的偏好)

9、如果POST成功，要在POST方法后重定向网址，这样可以阻止用户通过刷新页面重复提交。

10、严重关注Accessibility。因为这是法律上的需求(Section 508是美国的508法案，其是美国劳工复健法的改进，它是一部联邦法律，这个法律要求所有技术要考虑到残障人士的应用，如果某个大众信息传播网站，如果某些用户群体(如残疾人)浏览该网站获取信息时，如果他们无法正常获得所期望的信息(如无法正常浏览)，那可以依据相关法规，可以对该网站依法起诉)。 WAI-ARIA 为这方面的事提供很不错的资源。

安全

1、在网上有很多关于安全的文章，但是 《OWASP开发指南》 涵盖了几乎所有关于Web站点安全的东西。(OWASP(开放Web应用安全项目- Open Web Application Security Project)是一个开放的非营利性组织，目前全球有130个分会近万名会员，其主要目标是研议协助解决Web软体安全之标准、工具与技术文件，长期 致力于协助政府或企业了解并改善网页应用程式与网页服务的安全性。OWASP被视为Web应用安全领域的权威参考。2009年下列发布的美国国家和国际立法、标准、准则、委员会和行业实务守则参考引用了OWASP。美国联邦贸易委员会(FTC)强烈建议所有企业需遵循OWASP十大WEB弱点防护守则。

2、了解什么是 SQL 注入攻击 并知道怎么阻止这种攻击。

3、永远不要相信用户的输入(包括Cookies，因为那也是用户的输入)

4、对用户的口令进行Hash，并使用salt，以防止Rainbow 攻击。使用慢一点的Hash算法来保存口令，如 bcrypt (被时间检证过了) 或是 scrypt (更强，但是也更新一些) (1, 2)。你可以阅读一下 How To Safely Store A Password。The NIST建议使用 PBKDF2 to hash passwords, 并且FIPS approved in .NET(具体什么意思我还是不太清楚，大家可以看这里的介绍here)。避免直接使用MD5 或 SHA。

5、不要试图自己去发明或创造一个自己的fancy的认证系统，你可能会忽略到一些不容易让你查觉的东西而导致你的站点被hack了。(陈皓注：我在腾讯那坑爹的申诉系统中说过这个事了，我说过这句话——“真正的安全系统是协同整个社会的安全系统做出来的一道安全长城，而不是什么都要自己搞”，当然，很遗憾不是所有的人都能看懂这个事，包括一些资深的人)

6、了解 处理信用卡的一些规则 . (这里也有一个问题你可以查看一下) (有两上vendor可以帮助你，一个是 Authorize.Net 另一个是 PayFlow Pro)

7、使用 SSL/HTTPS 来加密传输登录页面或是任可有敏感信息的页面，比如信用卡号等。

8、知道如何对付session 劫持。(请参看wikipedia的这Session Hijacking，)

9、避免 跨站脚本攻击(XSS)。

10、避免 跨站伪造请求攻击 cross site request forgeries (XSRF).

11、保持你的系统里的所有软件更新到最新的patch。

12、确保你的数据库连接是安全的。

13、确保你能了解最新的攻击技术，以及你系统的脆弱处。

14、阅读Google的《浏览器安全手册》(Browser Security Handbook)。

15、阅读《网络软件的黑客手册》(The Web Application Hackers Handbook)。

性能

1、只要有机会，就使用缓存机制，了解并合理地使用 HTTP caching 以及 HTML5 Manifest。

2、优化图片使用 ，不要把一个20KB的图片文件，作为重复出现的网页背景图案。 不要使用20KB图片来平铺网页背景。

3、学习如何用gzip/deflate压缩内容(deflate方式更可取)。

4、将多个样式表文件或脚本文件，合为一个文件，这样可以减少浏览器的http网络连接数，以及减小gzip压缩后的文件总体积。

5、学习一下 Yahoo Exceptional Performance 这个网站上的东西，上面有很多非常不错的改善前端性能的指导，以及 YSlow 这个工具。 Google page speed 是另一个用来做性能采样的工具。这两个工具都需要安装 Firebug 。

6、如果你的网页用到大量的小体积图片(比如工具栏)，就应该使用CSS Image Sprite，目的是减少http请求数。

7、大流量的网站应该考虑将网页对象分散在多个域名。(比如有专门的图片服务器——图片相当耗带宽，或是专门的Ajax服务器)

8、静态内容(比如图片、CSS、JavaScript、以及其他cookie无关的网页内容)都应该放在一个不需要使用cookie的独立域名之上。因为域名之下如果有cookie，那么客户端向该域名发出的每次http请求，都会附上cookie内容。这里的一个好方法就是使用”内容分发网络”(Content Delivery Network，CDN)。

9、使用单个页面的HTTP请求数最小化。

10、使用Google的Closure Compiler压缩JavaScript文件，YUI Compressor亦可。或是 其它压缩工具。(Google的这个工具甚至还可以帮你优化你的代码)

11、确保网站根目录下有favicon.ico文件，因为即使网页中根本不包括这个文件，浏览器也会自动发出对它的请求。所以如果这个文件不存在，就会产生大量的404错误，消耗光你的服务器的带宽。(服务器返回404页面会比这个ico文件可能还大)

SEO(搜索引擎优化)

1、使用 “搜索引擎喜欢的” URL，如：使用 example.com/pages/45-article-title 而不是 example.com/index.php?page=45

2、如果你的动态页面要使用 # ，那么请把其改成 #! ，而在服务端，你需要处理$_REQUEST["_escaped_fragment_"] 这是Google搜索引擎需要的。换句话说，./#!page=1 会被Google搜索引擎转成 ./?_escaped_fragments_=page=1。 (陈皓注：通常来说URL中的#后的东西都不会被传到服务器上，所以，为了要让Google可以抓取AJAX的东西，你需要使用#!，而Google会把“#!”转成“_escaped_fragment_”来向服务器发请求，Twitter的大量的链接者是#!的，比如：https://twitter.com/#!/your_activity)。另外，用户也许会使用Firefox 或 Chromium， history.pushState({"foo":"bar"}, "About", "./?page=1"); 是一个很不错的命令。所以，就算是我们的地址栏上的地址改变了，页面也不会重新装载。这可以让你使用 ? 而不是 #! 也能无刷地保住当前的动态的页面，这可以让AJAX的请求被浏览器记住。

3、不要使用”点击这里”之类的超级链接，因为这样等于浪费了一个SEO机会，而且降低了”屏幕朗读器”(screen reader)的使用效果。

4、创建一个XML sitemap文件，它的缺省位置一般是/sitemap.xml(即放在网站根目录下)。(这个文件可以让搜索引擎了解你的网站地图)

5、当你有多个URL指向同一个内容时，在网页代码中使用<link rel=”canonical” … />。可以使用 Google Webmaster Tools 来查看相关的问题。

6、使用Google的Webmaster Tools和Yahoo的Site Explorer。

7、从一开始就使用Google Analytics(或者开源的访问量分析工具Piwik)。

8、了解 robots.txt 和搜索引擎爬虫是如何工作的。

9、重定向请求 (使用 301 重定向网站) ，如果你要把 www.example.com 定向到 example.com(或是其它的变更) 这样可以防止Google的rank因为域名的变化发生改变。

10、知道并不是所有的爬虫都是好的，有些爬虫的行为并不好。(比如向你的网站发大量的请求导致服务器性能低下)

11、如果你的网站有非文本的内容(比如视频、音频等等)，你应该参考Google的sitemap扩展协议。Tim Farley的答案，可以让你看到很多有价值的东西。

技术

1、理解HTTP协议，以及诸如GET、POST、sessions、cookies之类的概念，包括”无状态”(stateless)是什么意思。

2、让你的 XHTML/HTML 和 CSS 符合 W3C 规范，使得它们能够通过检验。这可以使你的网页避免触发浏览器的古怪行为(quirks mode)，并且可以让其更容易地能和非标准的浏览器工作，比如读屏器或移动设备。

3、理解浏览器是怎么处理 JavaScript 的。

4、理解网页上的JavaScript文件、样式表文件和其他资源是如何装载及运行的，考虑它们对页面性能有何影响。在某些情况下，可能应该将脚本文件放置在网页的尾部。

5、理解JavaScript沙箱(Javascript sandbox)的工作原理，尤其是如果你打算使用iframe。

6、请注意 JavaScript 可能会被禁止，这样会让你的AJAX失效。就算是大多数用户都开启了Javascript功能，但是也可能在一些情况下脚本是不被运行的，比如移动终端上，搜索引擎抓网页的时候也并不会执行你的脚本。

7、了解301重定向和302重定向之间的区别(这也是一个SEO相关问题)。

8、尽可能多地学习你的部署平台。(比如：操作系统，Web Server：Apache/Nginx，防火墙，数据库，等等)

9、考虑使用样式表重置(Reset Style Sheet)。

10、考虑使用JavaScript框架(比如jQuery、MooTools、Prototype)，它们可以使你不用考虑浏览器之间的差异。

11、把视觉效果和JS框架合在一起讨论，考虑使用一个Service，如：Google Libraries API 来装载框架，这样可以让浏览器可能早就把这个JS框架已经cache了而不需要再从你的网站上下载了。

12、不要重新发明轮子。在做任何事之前寻找一个现有组件或例子。你有99%的机会找到别人已经发布的开源版本。

13、不要一开始就做非常多的功能和组件，特别是在客户端的Web上，你需要保持系统是轻量级，快速，灵活的。

Bug 修复

1、明白你会花20%的时间写代码，而80%的时候在维护，所以你要小心编码。

2、建立一个有效的错误报告机制。

3、建立某些途径或系统，让用户可以与你接触，向你提出建议和批评。

4、为你开发的东西形成文档，解释清楚系统是怎么运行的，这样可以让后来的人容易维护你的软件和系统。

5、频繁备份(也可确保你的这些备份功能正常) Ed Lucas 的回答 有一些忠告。你还需要有一个恢复策略，而不只是一个备份策略。

6、使用一个版本控制系统来保存你的代码，如： Subversion 或 Git.

7、别忘了做Acceptance Testing，使用 Selenium 能帮到你。

8、确保你有足够的日志，你可以使用 log4j, log4net 或者 log4r.。如果出了问题，这是可以让你快速找到问题的方式。

9、当你写日志的时候，确保你记录了你捕获了处理和未处理异常。报告和分析日志可以让你知道你网站的问题。

这里有多的东西被省略了，并不是因为那些可能不是有帮助的答案，而是因为那些东西都太细节了，超出了这个问题的范围，因为这本来就是一个Web开发需要了解东西的Overview。

原文链接：http://programmers.stackexchange.com/questions/46716/what-should-every-programmer-know-about-web-development

建议继续学习：

1. 程序员技术练级攻略    (阅读：31906)
2. 再次写给我们这些浮躁的程序员    (阅读：15704)
3. 给程序员新手的一些建议    (阅读：11956)
4. 给年轻程序员的建议    (阅读：9909)
5. 在西方的程序员眼里，东方的程序员是什么样的？    (阅读：8826)
6. 做个懂产品的程序员    (阅读：8737)
7. 每个程序员都应该有张木桌    (阅读：8037)
8. 再谈“我是怎么招聘程序员的”    (阅读：7400)
9. 如何在面试中发现优秀程序员    (阅读：7114)
10. 架构师给程序员的一封信    (阅读：6792)