Online marketing is one of the most important parts of any marketing strategy today and websites form an integral aspect of online marketing. Websites are an excellent way to showcase your business online. An informative, well designed website is therefore a necessity. Customer, suppliers and even investors form an opinion of the company based on the web presence and website.
1. Own Your Project: It's your site, your investment on the line. Be prepared to lead and keep the momentum heading towards a realistic launch date. Be patient but firm and keep directing the flow towards your end goal. If you don't have the time to manage the construction of the site, hire someone who does.
2. Choose Your Color Scheme and Layout: Search the web and choose a few sites featuring the colors and layouts you like and a few sites with colors and layouts you don't like. Otherwise, you might be presented with a design or color scheme that is not what you had in mind and that will be force a major delay in your site launch date while you start from scratch again.
3. Decide on Theme and Images: Choose your images with a common theme in mind and make sure your concept is easy to understand. Run it by your friends and family, if they don't get the idea immediately, you need to go back to the drawing board. There are lots of great images you can purchase on the web, however, make sure that the theme and the backgrounds of the images are consistent. Merging light and dark backgrounds can make the best images look out of place. You can find a great variety of royalty free images on Fotosearch.com.
4. Plan Your Site Structure: Write your site structure down on paper or use an excel spreadsheet; otherwise, it might get out of control. Keep it simple but scalable so you can continue to add pages as the need or demand arises.
5. Hire a Search Engine Optimization (SEO) Firm: Your developer should have SEO experience or be working with an SEO firm. You want your links and content developed around keywords and phrases that customers are actually using to search for your products not industry insider terms that your customers are not familiar with. An SEO firm will guide you through the process. You can find top SEO firms advertising on Searchenginewatch.com or go to Google and type in search engine optimization and visit some SEO sites.
6. Meet Suggested Deadlines: A good web design firm will give you target dates for images, content, keyword development and site structure. Be prepared to meet the proposed deadlines at the agreed time or you will be put on the sidelines while the developer works with a client that has their act together.
Pay special attention to the title of the page when designing the web site. The title should be relevant to the website and should be able to clearly and completely represent the site. The tag itself should be able to reflect the gist of your business and the website in a precise form. Keywords should be used in the title for best results on the search engine.
The 960 Grid System
The 960 grid system is an effort to streamline web design by providing commonly used dimensions based on a standard 960 pixel width. There are 2 variants: 12 and 16-column format which can be used together or independently. There is also a 24-column format if you're doing something really funky.
The 960 Grid System is delivered as a standard CSS file you can include on your website and contains all the code necessary to effortlessly place content the way you sketched it out on the printed 960 grid. You can download and print the grid for the 960 Grid System (PDF format) and use it to sketch your website layout, there are also Adobe Photoshop grids you can download too
With the printed grid, you can easily trace your elements and position them the way you see fit. The process of converting these sketches to code becomes extremely easy since you now know exactly how many columns-wide each element is and already have all the spacing and formatting done for you.
Converting Sketches to Code
So you've printed your 960 grid, sat down with the client and ran through some ideas and came up with a great looking layout - now what?
In this example, we first defined that we are working with a 12-column layout by specifying the parent container class as "container_12″ - a container with 12 columns.
We then specify our first child container with the class "grid_4″ - in other words a container 4-columns wide (4/12 = 1/3 of the total width). We repeat that a couple more times for the neighboring containers.
We finish with 2 more containers 6-columns wide by specifying "grid_6″ as the class name for those containers. grid_6 being 6 columns wide, 6/12 = 1/2 of the total width of the page.
That's It, Really
There is nothing else to worry about. The CSS magic will take care of everything else; margins, positioning, etc.
There are some other neat classes you can include with your containers for even more control, but we won't get into that right now.
The idea is that if you are looking for an efficient way to sketch on paper website layouts and be able to easily code the layout than I strongly recommend you look into the 960 Grid System.
1. Own Your Project: It's your site, your investment on the line. Be prepared to lead and keep the momentum heading towards a realistic launch date. Be patient but firm and keep directing the flow towards your end goal. If you don't have the time to manage the construction of the site, hire someone who does.
2. Choose Your Color Scheme and Layout: Search the web and choose a few sites featuring the colors and layouts you like and a few sites with colors and layouts you don't like. Otherwise, you might be presented with a design or color scheme that is not what you had in mind and that will be force a major delay in your site launch date while you start from scratch again.
3. Decide on Theme and Images: Choose your images with a common theme in mind and make sure your concept is easy to understand. Run it by your friends and family, if they don't get the idea immediately, you need to go back to the drawing board. There are lots of great images you can purchase on the web, however, make sure that the theme and the backgrounds of the images are consistent. Merging light and dark backgrounds can make the best images look out of place. You can find a great variety of royalty free images on Fotosearch.com.
4. Plan Your Site Structure: Write your site structure down on paper or use an excel spreadsheet; otherwise, it might get out of control. Keep it simple but scalable so you can continue to add pages as the need or demand arises.
5. Hire a Search Engine Optimization (SEO) Firm: Your developer should have SEO experience or be working with an SEO firm. You want your links and content developed around keywords and phrases that customers are actually using to search for your products not industry insider terms that your customers are not familiar with. An SEO firm will guide you through the process. You can find top SEO firms advertising on Searchenginewatch.com or go to Google and type in search engine optimization and visit some SEO sites.
6. Meet Suggested Deadlines: A good web design firm will give you target dates for images, content, keyword development and site structure. Be prepared to meet the proposed deadlines at the agreed time or you will be put on the sidelines while the developer works with a client that has their act together.
Pay special attention to the title of the page when designing the web site. The title should be relevant to the website and should be able to clearly and completely represent the site. The tag itself should be able to reflect the gist of your business and the website in a precise form. Keywords should be used in the title for best results on the search engine.
The 960 Grid System
The 960 grid system is an effort to streamline web design by providing commonly used dimensions based on a standard 960 pixel width. There are 2 variants: 12 and 16-column format which can be used together or independently. There is also a 24-column format if you're doing something really funky.
The 960 Grid System is delivered as a standard CSS file you can include on your website and contains all the code necessary to effortlessly place content the way you sketched it out on the printed 960 grid. You can download and print the grid for the 960 Grid System (PDF format) and use it to sketch your website layout, there are also Adobe Photoshop grids you can download too
With the printed grid, you can easily trace your elements and position them the way you see fit. The process of converting these sketches to code becomes extremely easy since you now know exactly how many columns-wide each element is and already have all the spacing and formatting done for you.
Converting Sketches to Code
So you've printed your 960 grid, sat down with the client and ran through some ideas and came up with a great looking layout - now what?
In this example, we first defined that we are working with a 12-column layout by specifying the parent container class as "container_12″ - a container with 12 columns.
We then specify our first child container with the class "grid_4″ - in other words a container 4-columns wide (4/12 = 1/3 of the total width). We repeat that a couple more times for the neighboring containers.
We finish with 2 more containers 6-columns wide by specifying "grid_6″ as the class name for those containers. grid_6 being 6 columns wide, 6/12 = 1/2 of the total width of the page.
That's It, Really
There is nothing else to worry about. The CSS magic will take care of everything else; margins, positioning, etc.
There are some other neat classes you can include with your containers for even more control, but we won't get into that right now.
The idea is that if you are looking for an efficient way to sketch on paper website layouts and be able to easily code the layout than I strongly recommend you look into the 960 Grid System.
About the Author:
Learn more about montreal social media. Stop by William John Smith's site where you can find out all about keyword #2 and what it can do for you.
