These steps for creating a website for your clients are based on ideas I found online and my own experiences. These steps may not be the best strategy for creating a website, but they can lead you in the right direction and help you figure out what works best for you. Also, this web design tutorial assumes you have a basic understanding of HTML and CSS, two skills that are a must in web design.
Gather the Information
The first step to creating a website before you start the coding or the graphic design is getting all the information you need from the client. Giving the client a questionnaire to fill out is a good idea, this way you can get all the information you need. Then you will understand the main purpose of the site and know what is involved.
Questions to ask client
- What is the main purpose of the website?
- Is there a specific type of functionality needed?
- What is the client trying to achieve with the new website or redesign?
- What is the time-frame?
- Who will provide the photos and written content?
- What is your budget?
Other important steps to creating a website before you do anything else is choosing the domain name and web host.
Choose a Domain Name
Choosing a domain is an important factor since it sums up your website and represents your brand. Also make sure you have at least one keyword in your domain name for SEO purposes. For example, if the main keyword phrase is Rhode Island web design services, your domain could be webdesigncompany.com.
Choosing a Web Host
Mostly all web hosting companies offer the same services, but finding one that is fast, reliable, affordable and has good customer support is important. A web host that I recommend to everyone is bluehost.com, they are very affordable and easy to setup.
Plan
Once you know what is involved the next step is to start planning on how you are going to start creating the website. What tools are you going to use? Are you going to use WordPress or create a custom web design? At this point it is a good idea to research similar sites and see what tools they used. You can see who comes up first in Google and try to find out why. Brainstorm what colors to use, where to place certain elements, what kind of fonts to use, and other similar details.
Depending on the time-frame and budget it may be worth using a free or premium WordPress theme which servers the site’s purpose. If you have the time and the budget isn’t tight, then creating a custom web design may be best. You could also use WordPress and create your own theme, thus having control over the design and also having the opportunity to use WordPress plug-ins. This saves you much time and effort with writing additional code. If you are going to create a custom web design or WordPress theme some graphic design tools you could use are Photoshop and Illustrator. If you are creating a website from scratch without WordPress then you will need graphic design and programming skills, such as JavaScript and PHP. You may also need JavaScript library files such as Jquery, and Jquery plug-ins to display photos, such as fancybox. Also, knowing PHP and MySQL is essential if the client needs a login system.
Once you have an idea of what tools you are going to use, start planning the layout of the site. It is a good idea to first create a sketch on how the user will interact with the site. A sketch will typically start with the home page and show circles of user actions (which may eventually become pages), arrows showing how users will move around the site, and speech bubbles representing what the user is thinking at key places. Next, think of the pages that will be on your site by looking at the sketch. How will the pages be grouped? How will the user find them? Then create a sitemap, this will effectively merge all the views from your initial sketches into a structure that’s clear and economical. The next step would be to sketch a wireframe layout. When you create the wireframe think of how the navigation will be and play with different layouts.
Design
After you have done all the preliminary work of learning and planning, the next step is to create a mock up design of the site based on the answers from the client and your sketches. The mock up design should embody the personality and character of the brand. Everything has a brand; even if you don’t sell a product or service — for example, if you run a blog — your website still has a certain feel that makes an impression on your visitors. Decide what that impression should be based on information from the client. The beginning steps will make this step much easier and you won’t have to worry about the little details. You will also be able to focus on the more important things and not get too bogged down trying too many Photoshop layouts. When you create the design in Photoshop or illustrator do not forget about the sub-pages, which you will have to design as well. You will need to use proper navigation and a good plan on how to how to access these pages. At this stage it is important to seek feedback regularly to make sure all requirements have been met.
Code
After you the design mock up, the next step in creating a website is the HTML and CSS styling. If you use a custom WordPress theme or web design, be sure to use a CSS reset file so all browsers will be able to interpret your code the same way. Also use HTML5 Shiv to enable HTML5 elements in older web browsers. It is also a good idea to have some starter HTML5 files linked together and ready to go. Next, add in your title, descriptions, and Meta tags, or at least make a note of what they should be. Then add the other elements to the layout, such as the HTML, logos, photos, and written content. Avoid using too many div tags, for example you don’t need a div just to contain a logo or text.
CSS Reset
HTML5 Shiv
Programming
After the design, HTML, and CSS styling is all done the next step to creating your website would be the functionality or programming, if any is necessary, such as a login system, photo gallery, or password protected page. If you are using a free or premium theme for WordPress then all you need to do is download a plug-in to add the functionality you are looking for. If you are creating your own theme, then in this step you would have to add the WordPress codex PHP to your theme files and then download your plug-ins. Once all the programming has been done then you need to start testing out the website with different users. Get feedback from them as to whether or not the flow of the site works, if they have any problems finding things, or if they get any errors.
Launch
After the testing has been done it is time to launch the site, this could mean to make the site live for the first time, to start submitting it to search engines, or to start marketing it.
Conclusion
To get the best results when creating a website, it takes time and planning, especially if you want a good web design. A website is never really finished though; there is never a final version. You can always make improvements and updates to make the website more effective in serving its function.
