Web Design Custom Search

Web & Graphic Design Newbie 101 Tips:
Prepare to have a great website

Be sure to view our links on the left.

Newbie 101: Learn the do's and don'ts of design such as how to build, market, design, and optimize a perfect site. We see so many web sites out there that are good, but never get visitors because the designer did not know how to properly introduce the website to the world. The first advice is If you do not properly optimize your web pages then you can just forget about traffic. There are steps one must take to have a successful website, and you can get started by putting things into perspective.



The Rules and Order of Web Design:
Website Design ideas must be thought out first

If you do not follow rules, and directions you are likely to fail. Once we ignore those rules we invite problems into our lives, and the same rule applies to your website's.

Then of course we also have an "order" in our lives. We have to follow steps in a certain order so that we can successfully complete a project we are working on. What happens if you do not follow a set of step by step directions in "order"? The answer is pretty simple. You end up with something that is unstable. Rules, patterns, and a certain order certainly apply to web design and the search engines. Do you want to invite problems to your domain, and would you like to also get lost in the search engines along the way? Would you head out to the open sea with a hole in your ship, no compass, maps, or radio? No, of course not so lets not enter out into the web design and search engine world without making sure we have what we need to survive out there.

SEO Web Design Micheles Paint Shop

Before you even start working in your editor:
You must have a draft on paper and other ideas in your head

Below you will find some information on what you need to do before you even begin building a website. It is best to get a website down on paper first. Grab a notebook and follow the links below (icons) to learn more.

 

Putting things into perspective means organizing the key areas of web design belowWeb Design Tips and Steps Choosing a web site subjectSite Subject Articles TutorialsImage Resize and Optimize Paint Shop Pro Website Link StructureKeywords and Phrases
Also see our page about designing a website for multiple screen resolution settings and sizes


Free Graphic Resources
Now for the fun part of designing website's. Finding great graphic resources

You can design your website with graphics from free resources on the Internet. There are many great resources out there that offer fantastic graphics. Sometimes they come with rules, and these rules typically are the do not want you to direct link to the graphics on their server. Believe it or not there are people out there that love to design, share, and are proud to have you use their graphics.

I highly suggest you visit the website bellsnwhistles.com as they offer free animated and non animated pictures, bullets, icons and other graphics, Cut-n-paste javascript, backgrounds, links, resources, and other information to design a great website. Their site is a large collection of tools for web designers.

Using free resources to design your website is a time saver which allows you to spend more time on the more important areas of web design. You will learn that having a well designed, well thought out website with great content pays off in the end.




Make your visitors say WOW
Smooth and clean website's

The visitors coming to your website will stay and look around if the site itself is visually appealing and easy to navigate. There are so many areas within web design that one needs to consider when building a web page. Did you know it can take a professional web designer over seven days to just come up with a flattering design just for you and your business? Did you know it can take a few days just to make the text is placed in special areas so the search engines find them? There is so much to consider when it comes to web design and knowing some of these tips before you get started making your own site is important. The same goes if you have decided to hire a design team to do it for you. This knowledge goes a very long way.

 

Fast Loading Web Pages:
Fast Loading Web Page DesignThe 10 second website rule is STRICT


The second most important thing to consider is your web page loading times. If you page does not load completely within the first 10 to 15 seconds the viewer is likely to click the back button and never see your page. We all would like a visually appealing website, but we must not go overboard with graphics and scripts. These can slow down your website to a slow crawl, and that will have a negative impact on your website traffic. You need to optimize your web pages and everything within it. The question is how? Below are a few areas that you should consider when optimizing and the tools needed to do it.

Do you want to lay at the bottom of the search engine result pages? Read on to make sure your website design choices are good enough for your viewers.

Horrors of Colors and Fonts:
To see or not to see?


Bad Web Page color and font choicesThe colors, fonts, and sizes you choose could be the death of your website!

How many times have you visited a website that had a royal blue background and their text was in a bright red color? I have and I can tell you right now that it hurt my eyes and I left their site quickly. I am actually amazed that the designer could actually see what they were reading. I know that people that are color blind they tend to prefer the brighter colors and maybe that is why some design with those color choices. However, when designing a website we must consider that 10% of our population is color blind. Red/Green color blindness is by far the most common form, about 99%, and causes problems in distinguishing reds and greens. Another color deficiency Blue/Yellow also exists, but is rare. With this said you should consider the 10% that are color blind.

Here are some examples of the big NO NO's:

Bad Web Design Color Choices Bad Web Design Color Choices Bad Web Design Color Choices

Here are some examples of better choices:

Better web design color choice example Better web design color choice example Better web design color choice example

I am not saying the better choices are ideal, but what I am showing you is that muted and softer colors please the eyes and make it easier for us to read text on a web page.

 

Mystery Navigation

 Bad Design Mystery Website Navigation Example Image

How many times have you went to a website and had to guess what and where the links were? I've visited many website's that have these mystery links, and I call them this because I did not know what the icon represented. I felt lost, and I just left the site. I am sure the website owner thinks their navigation is great, but did they consider their visitors at all? The same goes for those that are visually or hearing impaired when you do not add the proper information in the alt tags they may never know what they are truly looking at.

Example this image above has an alt (alternate text) that reads "Mystery Website Navigation Example Image."
Code sample is <img src="images/mystery-navigation.gif" alt="Bad Design Mystery Website Navigation Example Image" />

Also consider using title tags within your links such as this sample <a href="index.php" target="_top" title="Newbie 101 Web Design">Newbie 101 Home</a> These tags will help the visual and hearing impaired. The above set of buttons represents my impression of a bad set of website navigation icons. I have placed a question mark on them because I have no clue what they represent. Some web sites use this type of navigation and it is a major design mistake.

Please be considerate to everyone that visits your website. Make sure you clearly label your alt & title tags and do not spam them with keywords. The best link navigation you could use is text and that is because you can use keywords as your anchor text and the link will be relevant to the destination.



If you found this page helpful please recommend it to others, and bookmark this page. Add to Favorites


Graphics on site: This web sites graphics were all made by me using the Corel Paint Shop Professional program. We are currently working with software by Corel, and you can buy Corel Software directly from official site Corel.com . All animations are typically made with Corels Animation Shop 3. Animation Shop 3 Download (11.2 MB)


Newbie 101 Tutorials & Podcasts
Podcast Tutorials PSP Paint Shop ProWeb Design & Graphic Tutorials

Paint Shop Pro - Animation Shop - Flash

  • PSP X2 EPS Coloring Book Basics
    Sunday, May 25, 2008
  • Animation Basics
    Wednesday, June 18, 2008
  • Text on Curve
    April 22, 2008
  • Pixel Lineart Coloring w/ Effects
    March 22, 2008
  • Resize Multiple Pictures in PSP x2
    August 16, 2008
  • Podcast Tutorials PSP Paint Shop ProWeb Design & Graphic Tutorials

    Dreamweaver - HTML - CSS

  • Dreamweaver Rollover Buttons
    Saturday, June 21, 2008
  • CSS SPRY Menu Editing Basics
    Sunday, May 25, 2008
  • Avatar Tutorial PSP X2 Layers
    Thur, Oct 16, 2008
  • Eye Animation Tutorial
    Oct 31, 2008
  • PSP Basic Color Makeover
    Nov 05, 2008
  • Podcast Tutorials PSP Paint Shop ProWeb Design Graphics Optimization

    SEO - Marketing - PPC - Affiliates

  • Search Engine Optimization Basics
    Sunday, May 25, 2008
  • Pay Per Click Basics
    Sunday, May 25, 2008
  • Lined Notebook Paper Tutorial
    Tuesday, Nov 18, 2008
  • Custom Calendar Tutorial
    Sunday, Nov 22, 2008

  • Date 00, 2008