Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I work at an agency mostly focused in software development however sometimes a microsite is accessory to one of our solutions and we need to build it.

I'm trying to define a clear process for creating a website but I don't know in which order each task is commonly done and specially I'm trying to figure out at which point the static content is written.

I can think of some tasks like: writing static content, design, wire-framing, defining keywords and SEO, coding. but I'm not sure in which order tackle them.

How is this normally done?

What needs to be considered for creating a new website, and in what order?

share|improve this question
    
Sketching is the best start. –  SaturnsEye May 8 at 15:17
    
Do you want the outline a designer would take? If so I think Scott's answer is correct. Or do you want the outline you, as the client should take? If so I think there's a couple more points that could be mentioned. –  Ryan May 8 at 15:26

4 Answers 4

up vote 6 down vote accepted

For me many areas can overlap to an extent.

  • Define needs via sketching, wireframes, notes, discussions, budget, etc. (must come first)

  • Wireframing - Content can start to be written here or at least outlined. Rough ideas of size of the content will assist in wire framing, so really writing and wire framing can go somewhat together.

  • Wireframe approval

  • Finalize content - early design roughs can be started here but can't be finalized until static copy is complete.

  • Content approval

  • Finalize Design / Keywords / coding - keywords can be figured as the design is being fleshed out. Depending on work habits coding may be started in order to finalize the design.

  • Design approval

  • Finish Coding / SEO - coding and SEO can go hand in hand. You know, code with SEO in mind at the same time start planning external SEO strategies, etc.

  • Code approval

  • Ongoing SEO/maintenance.

share|improve this answer
1  
The overlaps are the best part of the process. If you're working with a team, wireframes and content can be developed at the same time, and coding and design can be begun (separately) as soon as the wireframes are complete. Content can be tweaked throughout, of course, but I would begin SEO even earlier, hand-in-hand with the evolving content. –  Blazemonger May 8 at 22:06

My project workflows generally work like this:

  1. Meet with client(s) to gather requirements (determine what they need)
  2. Determine which back-end strategies to use (programming language, platform, etc)
  3. Create wireframe to outline how the site or application will work and where the basic elements will go
  4. Review wireframe with client
  5. Design mockups - these may be HTML/CSS mockups or they may be images designed in Illustrator or Photoshop
  6. Review mockups with client
  7. Edit mockups based on client feedback
  8. Create working product

Ideally the clients get us real content as early in the process as possible, but the reality is that may come at a later point. I'll note that I create a lot of web-based applications so we determine the basic features at the requirements stage and design with those in mind.

share|improve this answer

I got some information from the Blog

http://sixrevisions.com/web-development/a-6-step-general-process-for-producing-a-website/

enter image description here

  1. Learn

    It shouldn’t surprise you that learning — discovering and understanding what you need to build in the first place — is the most important part of the entire
    website design process.

  2. The Creative Brief

    You should obtain this information in the way you and your clients are most comfortable with — but whatever you do, don’t skip the creative brief because it will become the lifeblood of your project.

What kind of questions should you ask in your creative brief? At the minimum, find out:

  • The client’s target audience
  • Their primary and secondary goals for the website
  • Current branding characteristics Budget
  • Deadlines they need to meet

3.Plan

Once you’ve learned what you need to build, it’s time to start planning how you are going to make it happen. Before you can start designing a website, you need to know exactly what, and how, to design it in the first place — and it all starts with creating a design strategy.

4.Design

Once you are ready to start designing, keep in mind that you need to design more than just a home page. You’ll need a design for the sub-pages of your site as well. It can sometimes be easy to design a home page concept, slice it up and start coding

5.Code

Once you have a killer design, you’ll need to turn it into a real, live website. A safe bet, no matter what content management system you are going to be working with, is to start with a generic HTML and CSS

6.Launch

When you’ve finally perfected the site, it’s time to release it to the public. Launching can mean different things to different people, mostly because there are various content management systems and development circumstances out there.

7.Maintain

During your planning phase, you should have determined who will be in charge of site maintenance

share|improve this answer
    
Yes as stated by User please site your references that you used or your answer may be downvoted by the community. –  Matt May 9 at 16:09
    
Thank you, good information. +1 :) –  user Jun 2 at 14:39

This may help. There are some good web design principles

google handbook web fundamentals

The handbook is a comprehensive resource for multi-device web development. Therefore it is split into 4 categories:

Multi-Device Layouts — Creating flexible, not fixed, layouts that provide a great experience no matter what device they are on

Images and Video — Incorporating images, audio or video then learn how you can make images responsive, add videos and provide alternatives for legacy platforms. Audio currently under development

Forms and User Input — Creating forms that use semantic input types and elements that respond to touch and other gestures.

Optimizing Performance — Learn how about the browser object model how it constructs the page from your HTML and CSS. There are other page rules and recommendations to optimize delivery of data

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.