About a year ago, I wrote an article for the main site that outlines The 6 Phases of the Web Site Design & Development Process. As part of my business web site, the article is slanted to how I personally help clients through the process of creating a web site.
Here, however, I wanted to create a more generalized post. Same basic idea, however this version can be utilized by anyone, regardless of who they hire to design their web site.
I hope this helps when considering building your own site!
The Web Site Design and Development Process
There are numerous steps in the web site design and development process. From gathering initial information, to the creation of your web site, and finally to maintenance to keep your web site up to date and current.
The exact process will vary slightly from designer to designer, but the basics are generally the same.
- Information Gathering
- Planning
- Design
- Development
- Testing and Delivery
- Maintenance
Phase One: Information Gathering
The first step in designing a successful web site is to gather information. Many things need to be taken into consideration when the look and feel of your site is created.
This first step is actually the most important one, as it involves a solid understanding of the company it is created for. It involves a good understanding of you - what your business goals and dreams are, and how the web can be utilized to help you achieve those goals.
It is important that your web designer start off by asking a lot of questions to help them undersand your business and your needs in a web site.
Certain things to consider are:
- Purpose
What is the purpose of the site? Do you want to provide information, promote a service, sell a product… ? - Goals
What do you hope to accomplish by building this web site? Two of the more common goals are either to make money or share information. - Target Audience
Is there a specific group of people that will help you reach your goals? It is helpful to picture the “ideal” person you want to visit your web site. Consider their age, sex or interests - this will later help determine the best design style for your site. - Content
What kind of information will the target audience be looking for on your site? Are they looking for specific information, a particular product or service, online ordering…?
Phase Two: Planning
Using the information gathered from phase one, it is time to put together a plan for your web site. This is the point where a site map is developed.
The site map is a list of all main topic areas of the site, as well as sub-topics, if applicable. This serves as a guide as to what content will be on the site, and is essential to developing a consistent, easy to understand navigational system. The end-user of the web site - aka your customer - must be kept in mind when designing your site. These are, after all, the people who will be learning about your service or buying your product. A good user interface creates an easy to navigate web site, and is the basis for this.
During the planning phase, your web designer will also help you decide what technologies should be implemented. Elements such as interactive forms, ecommerce, flash, etc. are discussed when planning your web site.
Phase Three: Design
Drawing from the information gathered up to this point, it’s time to determine the look and feel of your site.
Target audience is one of the key factors taken into consideration. A site aimed at teenagers, for example, will look much different than one meant for a financial institution. As part of the design phase, it is also important to incorporate elements such as the company logo or colors to help strengthen the identity of your company on the web site.
Your web designer will create one or more prototype designs for your web site. This is typically a .jpg image of what the final design will look like. Often times you will be sent an email with the mock-ups for your web site, while other designers take it a step further by giving you access to a secure area of their web site meant for customers to view work in progress.
Either way, your designer should allow you to view your project throughout the design and development stages. The most important reason for this is that it gives you the opportunity to express your likes and dislikes on the site design.
In this phase, communication between both you and your designer is crucial to ensure that the final web site will match your needs and taste. It is important that you work closely with your designer, exchanging ideas, until you arrive at the final design for your web site.
Then development can begin…
Phase Four: Development
The developmental stage is the point where the web site itself is created. At this time, your web designer will take all of the individual graphic elements from the prototype and use them to create the actual, functional site.
This is typically done by first developing the home page, followed by a “shell” for the interior pages. The shell serves as a template for the content pages of your site, as it contains the main navigational structure for the web site. Once the shell has been created, your designer will take your content and distribute it throughout the site, in the appropriate areas.
Elements such as interactive contact forms, flash animations or ecommerce shopping carts are implemented and made functional during this phase, as well.
This entire time, your designer should continue to make your in-progress web site available to you for viewing, so that you can suggest any additional changes or corrections you would like to have done.
On the technical front, a successful web site requires an understanding of front-end web development. This involves writing valid XHTML / CSS code that complies to current web standards, maximizing functionality, as well as accessibility for as large an audience as possible.
This is tested in the next phase…
Phase Five: Testing and Delivery
At this point, your web designer will attend to the final details and test your web site. They will test things such as the complete functionality of forms or other scripts, as well last testing for last minute compatibility issues (viewing differences between different web browsers), ensuring that your web site is optimized to be viewed properly in the most recent browser versions.
A good web designer is one who is well versed in current standards for web site design and development. The basic technologies currently used are XHTML and CSS (Cascading Style Sheets). As part of testing, your designer should check to be sure that all of the code written for your web site validates. Valid code means that your site meets the current web development standards - this is helpful when checking for issues such as cross-browser compatibility as mentioned above.
Once you give your web designer final approval, it is time to deliver the site. An FTP (File Transfer Protocol) program is used to upload the web site files to your server. Most web designers offer domain name registration and web hosting services as well. Once these accounts have been setup, and your web site uploaded to the server, the site should be put through one last run-through. This is just precautionary, to confirm that all files have been uploaded correctly, and that the site continues to be fully functional.
This marks the official launch of your site, as it is now viewable to the public.
Phase Six: Maintenance
The development of your web site is not necessarily over, though. One way to bring repeat visitors to your site is to offer new content or products on a regular basis. Most web designers will be more than happy to continue working together with you, to update the information on your web site. Many designers offer maintenance packages at reduced rates, based on how often you anticipate making changes or additions to your web site.
If you prefer to be more hands on, and update your own content, there is something called a CMS (Content Management System) that can be implemented to your web site. This is something that would be decided upon during the Planning stage. With a CMS, your designer will utilize online software to develop a database driven site for you.
A web site driven by a CMS gives you the ability to edit the content areas of the web site yourself. You are given access to a back-end administrative area, where you can use an online text editor (similar to a mini version of Microsoft Word). You’ll be able to edit existing content this way, or if you are feeling more adventurous, you can even add new pages and content yourself. The possibilities are endless!
It’s really up to you as far as how comfortable you feel as far as updating your own web site. Some people prefer to have all the control so that they can make updates to their own web site the minute they decide to do so. Others prefer to hand off the web site entirely, as they have enough tasks on-hand that are more important for them to handle directly.
That’s where the help of a your web designer comes in, once again, as they can take over the web site maintenance for you - one less thing for you to do is always a good thing in these busy times!
Other maintenance type items include SEO (Search Engine Optimization) and SES (Search Engine Submission). This is the optimization of you web site with elements such as title, description and keyword tags which help your web site achieve higher rankings in the search engines. The previously mentioned code validation is something that plays a vital role in SEO, as well.
There are a lot of details involved in optimizing and submitting your web site to the search engines - enough to warrant it’s own post. This is a very important step, because even though you now have a web site, you need to make sure that people can find it!
Note to self… write post on SEO/SES. 
The Bottom Line
All in all, your web designer should work closely with you on a very similar process to this one. A good working relationship with your designer, including an open line of communication, is important to ensure they are creating a successful web site that will help your business grow.
Shameless Plug
I’ve personally been designing and developing web sites for a full decade now. So… if you’re ever in need of a web site and happen to like my design style, please don’t hesitate to contact me! You can also read more on the specific details of my own personal web design process on the FAQ page.
By the way… if you found this article helpful - and I hope you have! - please subscribe to this blog, because there are more informative posts on the way!
译文:
网站设计开发的六个步骤
大约一年前，我写了篇关于主站建设的文章，题为“网站设计与开发的六个阶段”。作为我商业网站的一部分，文章侧重介绍我个人如何帮助用户完成网站创建。现在，我想重写一篇更通俗的文章，和上一篇表达的意思是一样，只是这篇对每个人都实用，不管他有没有请人设计网站。
在您考虑建一个自己的网站时，希望本文能有所帮助。
网站设计和开发
网站设计和开发过程包括了很多步骤——从基本信息收集到站点创建，直到网站维护和内容更新。
这个过程各个设计者做起来可能会有些不同，但基本步骤是一样的。
步骤一：信息收集
要成功设计网站的第一步是信息收集，很多东西都需要考虑，比如你要建的网站给人的视觉感受。
第一步确实是最重要的。在这个步骤里，要对需建站的公司有深入了解。也包含对你的想法有很好理解——你的商业目标和理想是什么，网站怎样帮你实现这些目标。你的网站设计师做设计前应该通过问很多问题来帮助他们理解你的企业和建站目的，这是非常重要的。
需要考虑的方面：
-
目的 网站的目的是什么，你想提供信息，还是推广服务，或者卖一件商品？
-
目标 你想通过建站来达到什么目的。一般网站是为了赚钱和共享信息。
-
目标用户 是否有一个具体的客户群来帮助你达到目标。描述出访问你网站的理想用户是非常 重要的。他们的年龄，性别和兴趣都要考虑到，这将会帮助你在以后的阶段选定最佳的网站风格。
-
内容 你的目标用户想在你的网站上找什么信息？是某种具体详细的信息吗？一件特殊的产品吗？还是服务？或是在线订购呢？
步骤二： 计划
有了步骤一里收集到的信息。现在该把他们集中到一块来做网站计划了，这是设计网站地图切入点。网站地图是一组网站所有主标题的列表，也包括子标题。如果实用的话，这将成为网站内容的导航。它对开发出一个持久易用的导航系统非常重要。在设计网站时，你得想着网站的终端使用者——即你的客户，是要了解你的服务还是买你的商品。一个好的用户界面会给网站导航提供便利，也是网站的根基。
在计划阶段，你的网站设计师也会帮你选定实现网站的技术。在做网站计划时，互动窗口、电子商务，flash等都要讨论。
步骤三：设计
收集的信息要在这个阶段用了，是时候考虑看到你的网站的视觉效果了。目标用户是考虑的重要因素。举例来说，网站使用者如果是青少年，看起来应该和金融机构网站有很大差别。把公司标志和颜色纳入网站设计的部分，是很重要的，这将增强公司在网站的标识性。
你的网站设计师会建一个或几个网站的原型设计——这是一个网站成品摸样的jpg文件。在你偶尔收到附带网站模板的邮件时，其它的设计师已经捷足先登，让你进入他们网站的实际区域，这对用户来说是看看工作中的作品。再者，你的设计师应该允许你看到整个设计和开发阶段的项目，这样做的目的是让你有机会提出对网站满意和不满意的地方。这个阶段，你和设计师之间的交流，关系到网站最终是否满足你的要求和品味。在网站最终设计完成之前，和你的设计师加强工作联系，交流想法是非常重要的。
那么可以开始开发了。。。
步骤四：开发
开发阶段就是网站的自身建设。这时，你的网站设计师会从网站模型中撤走所有的单独的图片元素。最先开始做的是主页——套着其它内页的“壳”。这个“壳”是作为一个站点内容页的临时框，它将包括网站主要的导航结构。一旦“壳”被建立，你的设计者就用你的内容，填充到网站各个合适的地方。
这个阶段也要实现互动窗，flash动画制作，或者电子商务购物车的功能。整个阶段，你的设计者将继续让你看到网站开发的效果，那样你好提出想做的变更。
在技术前端，一个成功的网站要求对网站前后端的都要了解。这包括编写符合时下网络标准的动态XHTML/CSS代码，最大化的实现功能，尽可能让所有用户（不受操作系统，浏览器的影响）都能正常访问网站。
这将在下一阶段测试。。。
步骤五：测试和发布
这个阶段，网站设计师将参与最后的细节测试和站点测试。他们将测试各个窗体的功能以及其它的脚本语言，最后测试兼容性（网页不同的浏览器显示的区别），保证网页用最近几个版本的浏览器都能正常打开。
一个好的网站设计师应该精通目前的网站设计和开发标准。现在使用的基本技术是XHTML和CSS，作为测试的一部分，你的设计师应该检查网站的所有代码是不是都生效了。有效的代码意味着你的网站符合现在的网络设计标准，这对刚才提到的不同浏览器兼容性是有用的。
在你对设计师做最后的认可时，就该发布网站了。一个FTP(文件传输协议)被用来将网站文件上传到服务器。大部分的网站设计师会提供域名注册和网站寄存服务。一旦这个账号被启用，你的网站上传到服务器，网站就进入了最后通过的阶段。这只是一个预防措施——来确保所有文件都被正确上传，网站能持续的发挥它的功能。
这标志着你的网站正式启用，现在它对公众开放了。
步骤六：维护和更新
即使到了现在，网站的开发还没有结束。要给网站带来回头客的一个方式就是持续规律的更新内容和产品信息。大部分的网站设计者会很乐意继续与你合作——更新网站信息。一些设计者会提供一组价格低廉的维护套餐，这由你期待的网站更新频率决定。
如果你喜欢自己动手更新网站内容，可以试试CMS（内容管理系统）的工具，它可以帮助你管理网站内容。这些就是在网站计划阶段要做的事。有了CMS，你的设计师会用在线软件开发一个数据库支持网站。
用CMS驱动的网站，将让你学会自己编辑网站内容模块。这下可以通过在线文档编辑器（类似写字板）进入后台管理区，用这种方式你就能编辑已有的内容，或者你想来点刺激的——甚至可以自己添加新页面和内容。这有无限可能。
你想更新网站轻松些或者自己辛苦些，都是由你决定的。有的人更希望拥有所有的控制权，他们什么时候想更新了，就自己去更新。其它人则把整个网站都托管，他们有更多比管理网站重要的事要自己亲自处理。这就是网站设计师再次回来的原因，他们可以为你接管网站。在繁忙的时候，多一事不如少一事。
另一个网站维护内容是SEO(搜索引擎优化)和SES（搜索引擎提交）。这是个网站优化工具，包括了标题，描述和关键字标签。刚才提到的代码有效性检测也在SEO里起着重要的作用。
在优化和提交网站到搜索引擎的过程里，包括了很多细节——这对网站的展示是非常重要的。这是非常重要的一步，虽然你现在有了一个网站，但你需要确保人们能找到它（在茫茫网海里）。
提醒，要在SEO/SES里填写哦
最终话
总之，你和设计师应该有一个类似以上过程的密切合作。和设计师有良好的合作关系，包括开诚布公的谈话，这对保证他们建立一个成功的网站，帮助你改善企业，是很重要的。
毫不羞涩的推荐
我个人从事网站设计开发已经十余年了，所以。。。如果你一直都需要个网站，并且碰巧也喜欢我的设计风格，请毫不犹豫的联系我，你在FAQ下可以学到更多我个人设计网站的细节。
顺便说一句，如果你觉得这是篇文章有用的话-我希望你拥有它，请订阅这篇博客吧，因为通过这种方式，你可以了解到更多信息的文章。