Planning a website

Summary

Common steps to planning a website before you start coding.

The normal process behind planning a website is:

1. Have an idea for the site’s content. Sorry, but we can’t help here.
2. Wireframe the site’s layout
3. Start designing the site
4. Build the site’s front-end
5. Give the site a backend if-needed.
6. Test the application
7. Launch!

Wireframing

What is wireframing?

Wireframing is the part of web design where you build a very basic outline of the site’s layout. This helps figure out where to place things. You should think about starting here if your site is going to target desktop or mobile users; it is very important that responsive design begins here if you are going to target both.

Some tools to help wireframe are:

• Pencil (Mac, Linux, Windows - Free)
• Draw.IO (WEB - Free)
• Balsamiq (Mac, Linux, Windows, WEB - Paid)
• Axure (Mac, Windows - Paid)
• Visio (Windows - Paid)
• iProtz (Web - Paid)
• PenUltimate(iPad - Paid)
• OmniGraffle(Mac, iPad - Paid)
• Gliffy(WEB - Paid)
• JustProto(WEB - Paid)
• FlairBuilder(Window, Mac - Paid)
• HotGloo(WEB - Paid)
• iPhone Mockup(WEB - Free)

Designing your site

This part involves quite a bit of thought to how users will see and interact with your website and/or application.

This goes in the process of designing

Graphic Design

Users Compability

Available Technology

Future Proofing

Responsiveness

Building the front-end

Once your site is designed and you know what you want, it is time to start building it. If you have no experience in web design then you should start with our beginners tutorial to get you started.

Giving the site a backend

A lot of sites use some kind of administration backend like a Content Management System. If your site needs one of these, then you should put your design into their template style and use one. Otherwise, your site should be ready to go.

Test the application

One of the important tasks post development is to test the application. Testing helps confirm that the end product meets requirement we set out with. Often during the process of development we have to make adjustments which deviate the end product from what was originally intended. In addition, there are errors, bugs etc. that creep-in during the development process and these need to be corrected in order to have a useful product. Testing especially very useful in critical software products like those used by your stock trading company, medical research, airline operations etc. where lives are at stake (or huge amount of money!).

Launch!

Once your site is ready, put it on a web host and point a domain at it! Once the DNS resolves, your site will be online for all to enjoy.

Spreading the word

You need to make sure people hear about it, if it is a type that needs visitors. To do that. There are something things you can do: 1. Ask bloggers, industry related magazines, newspapers and anywhere to do a review of your site. 2. Start a Social Contest for actual prizes on Facebook, Twitter, & Google+. 3. Advertise. 4. Optimize for quality and thus Search Engines. Some tips on Seo Submit to search engines. Maintain Clear structure of the site. Provide Alt definitions of pictures. Do not spam. Blog about it.

Maintain

Launching is half the process though. You need to fix the problems that will for sure come up. And also updating and improving site thoroughly from time to time to meet the user’s needs and to not be outdone by the competition it is necessary.