Here are a few things to think about when designing your site.
The design is where you can express the personality of your site. It’s your site and you can make it look however you want. Some people will try to tell you that your site has to look a certain way. For example, you may hear that the navigation bar has to be at the top of the page or to the left of the page. No it doesn’t. You can put those navigation links right in the middle of the page if you want. There is only one hard rule and then a couple of suggestions for designing your site.
The hard rule is about resolution. Your monitor can only “see” or show you 72 pixels per inch, so you should build your graphics at that resolution. Open a new file in your graphic program and make sure the resolution is set for 72 pixels per inch. I’m using Adobe Photoshop so my options may look different than what is available in your program.
Consult the help file of the graphic program you are using if you have questions about where to adjust the resolution of a file.
Why should you care if you keep the resolution at 72 you ask? Because if you build your graphic images at, let’s say, 300 pixels per inch then you are sending excess information through the Internet that will make your website take a lot longer to load. To better visualize this, picture that the Internet connection coming into your house is the width of an average drinking straw. Graphic files at the correct resolution of 72 pixels per inch will travel through that straw as easily as a spitball can travel through the straw. Okay, that is an icky example, but you know what I mean—it will move right through there with no problem. A graphic file with the resolution of 300 pixels per inch would be like trying to shove a ping-pong ball through the straw. The straw would have to be made of stretch fabric—of course it can get through, but it will take a while.
Okay, I know what you are thinking. If a file with the resolution of 72 pixels/inch will travel quickly through the Internet then a file with the resolution of 50 pixels/inch will travel even faster. Technically that’s true, but don’t go down that road. Your monitor is always going to see 72 pixels/inch so if it’s pulling up a file that only has 50 pixels/inch then the monitor is going to make up the other 22 pixels to get it to 72. This will cause your pictures or graphics to look bad, blurry or just like there is something wrong with them. So are we straight? 72 is 72 is 72…
Now let’s move on to a few design suggestions.
Keep it simple and to the point. A person viewing the main page of your site should know within 3 seconds what your site is about. This is especially important if you are building a business site. If a customer doesn’t know what you are about or what you are selling then they will leave your site. They will also leave your site if they have to wait too long for the page to load.
Make the navigation obvious. As I stated at the beginning of this little rant, you can design your site any way you want, but you should make it easy to get around in. That means making the navigation logical and in plain site. Have you ever been looking around in a site and felt like you were lost? Well, I have and it just makes me mad at the site.
All right, let’s move on. Just design the main page for now. Sketch out your design on a piece of paper first if that helps you. Consult the site diagram that we talked about earlier to make sure that you are including all the links to your pages correctly. Then get on with building it in your graphic program. Next time we meet I’ll show you how to break apart that design so you can reassemble it into your web page building software.
See you next time,