Whilst On The Phone Tonight

Posted by Bobbi-lee - July 13th, 2007

“Did you move house again?”

“…No, why? ”

“Just last time I read on your blog you said you were moving”

“Mum, I told you not to go on my blog anymore!”

“I wasn’t”

“But you just said you did…”

“Well everyone in Hedland is reading it, like (proceeds to list a lot of names of people I do and do not know)”

crickets chirp

“Besides what about the rest of the world”

“What?”

“The rest of the world is reading your blog, do you like strangers from all over the world reading your ‘personal’ blog? You put it on the internet, it’s out there for everyone else to read”

“But it doesn’t mean you can!”

I suppose she has a point, I just don’t like people who actually know me to read this, especially my own mother, but thats what my portfolio blog is for. I am almost tempted to put this whole website on private, or at least post protected.

Five Mistakes ‘Web Designers’ Make.

Posted by Bobbi-lee - July 1st, 2007

I tried my hand at writing an article. This is my first and although I chose a pretty easy subject, I hope it is easy to read and understand, and maybe even help someone.

Five Mistakes ‘Web Designers’ Make.

With the ever-expanding number of personal websites and blogs appearing all over the web, in conjunction with the amount of bad tutorial sites out there, it is no wonder many of these “web designers” make mistakes. These are simple mistakes you can circumvent. I have collated an article on five things to avoid so you can improve your overall website look and usability, as well as increase visitor traffic. The following five examples are not in any particular order, each is as important as the next, and these are certainly not the only mistakes that are made.

1. Colour Schemes
Colour choice is a big factor in web design. A good use of colour and contrast is imperative to a website, so the visitor can easily distinguish between the text and the background. The most common colour use is the contrast between black and white, such as a white background and black text. Other colours can be used, such as a light pink background with a darker text colour, but make sure the colours do not clash and make text unreadable. Use a colour wheel if in doubt about the colours, but try to make sure you don’t use complimentary (opposite) colours such as red and green because the contrast clashes.
Contrast between text and background
Colour scheme isn’t just restricted to the contrast between text and background, but also to the images and the CSS. Keep all colour schemes minimal with a maximum of 5 colours, some designers can pull off more than 5 colours, but seldom do. Keep all colours in the CSS relevant to the header image or logo of your website. If you have a header image with your website title written in dark blue on a light sky blue background, with say a bit of pink in the image, keep the colour palette to those three colours. An example of a mistake is having the said blue and pink header with a red background, some green font and then some orange links. None of the colours will match and your website will look like a mess.

2. Images
Just like colour choice matters in your CSS and overall layout, the images on the website should go together, and not have too many colours that conflict. So when making a header image for a website, try not to have too many colours all at once, keep it minimal but still stylish. Try not to use too many images on one page at a time, and make sure the images are gifs, jpegs or png unless absolutely necessary. Image optimisation is integral for your website, as it reduces slow loading times which in turn caters for a wider variety of visitors to your site, whom may not have the fastest broadband. Optimising an image is basically reducing the file size to as small as possible, without any conspicuous loss of quality.
Don’t use images that are of text, when it can be typed out instead. An example of using images of text would be the use in navigation links. Sometimes the designer would like a decorative ‘bevelled edges’ or ‘drop shadow’ link to direct visitors where to go because they don’t like the standard web fonts available. There is nothing wrong with using image links, but if your page is too image heavy the loading time will dramatically increase. Instead of using images for your navigation links, make use of CSS. There are plenty of examples of using CSS instead of images for navigation, with equally good effects available on the internet.
In addition, it is also very important to use alt attributes with your images. Make sure the alt text is descriptive and unique, the keyword here being unique. If you have a gallery with 100 different pictures of the same subject, such as kittens, don’t just name each image “kitten1” or “kitten2”, provide a unique description of each image such as “kitten playing with yarn” and “kitten sleeping on bed”. Keep the descriptions small yet informative, don’t fill it with long paragraphs or 20 keywords. Keep it down to about 5-7 words per image, but don’t repeat the words such as “kitten sleeping kitten kitten cat”.
Make sure you give your images a title as well, in the case that someone visiting your website has images disabled, can they still navigate your site easily? When a search engine such as Google trawls your website, it is blind and sees no images, so it indexes images based on their alt attributes and title tags. If you have no alt attributes, Google, and other search engines will see your page as image-free and won’t index the images, consequently decreasing the amount of traffic you could have gained.

3. Navigation
Navigation should always be near the top of the page, or at the very least within the main view without having to scroll down. If a visitor to your website cannot find the navigation easily, they will leave. With a personal website the links are usually something along the lines of “Home, Webmaster, Website, Visitor Content” and so on. Try to keep the names similar to that, whether the “about” link is named “Webmiss, about me, me, girl” etc, the name is still familiar and immediately understandable about what the link leads to. Don’t name the “about” page something absurd like “whore” (I have seriously seen this) or some random word like “reality” which has nothing to do with the actual subject matter. Don’t confuse your visitors with these names, otherwise they will just click on links trying to find out where it leads and makes them annoyed, or they wont bother in the first place and leave your site. Also don’t replace the names with simple numbers 1,2,3 or even with little ‘x’s, I just do not see the point of this and it will make visitors irritated, especially the web-illiterate.
Another no-no is image maps. Image maps can look good, but only when used in an obvious way that there are actually links there. Back in the day when I had a freewebs website, all my layouts were of big blends with image mapped links. Once I sent a “normal” (web-illiterate) girl my link, and she asked me “What do I do with it?” I told her she could click the links, read the content etc and tell me what she thought. She told me she couldn’t see any links. I explained to her the links were the words “me, you, visitor, home” in the picture, and she replied saying she did not know that nor did her sister. I have since learnt my lesson and have never used image maps, unless they were extremely noticeable as actual navigation links. Besides, you ca achieve almost the exact same effects you want with some CSS.
Another important unwritten law for navigation is to not have advertisements near it, not even the really small Google Ads, as immediately this is proving to the visitor that your site is not that important, and that they can simply leave whenever they want by clicking on said ads. Furthermore, don’t use JavaScript for your navigation, quite simply put, Google will not index JavaScript and will ignore your links, in turn reducing incoming clicks. Secondly, not everyone has JavaScript enabled on their browsers, so when someone without JavaScript visits they will not see your navigation at all and will depart your site once they get bored of the main page.

4. Frames and Iframes
I do not need to go about the reasons not to use frames or Iframes. The only reason people use Iframes is because they think it is the easiest way to update their site quickly. These people are also the same people who use chroma colour to make “transparent” Iframes, that blind visitors on another browser other than IE. These people need to learn there is something more easier, something much more accessible, and something super easy to learn. Introduce PHP Includes.
With frames, search engines may not index your site at all, or worse if a visitor comes to your website via a search engine, they may come to one frameset without the surrounding content and navigation, hence making it difficult to navigate and use your website to its full potential.
Search engines have a tough time with frames. Using frames either prevents them from finding pages within a web site, or it causes them to send visitors into a site without the proper frame “context” being established. Source
Bookmarking a framed page within a website generally won’t work either, because only the main page will be bookmarked (the inside frame will be lost). Say for instance my website relied on frames and the main page is the URL http://intotherain.org but my content is in a page called ‘content.html’ inside the frame. If someone wanted to bookmark the content page they will bookmark it, only to come back to the site later and find they have only bookmarked the main page, losing the content page they originally wanted to revisit. Also if the visitor clicks an external link on your website, they could get “stuck” in your frame, with the new website displaying within the frame of your website. This can be avoided by right-clicking and opening in a new tab/window, but for a lot of web newbie’s they will not know what to do and more than likely be confused as to why this has happened.

5. Outdated Information
Keeping a website alive and well means updating often. I don’t mean you need to update every day, but at least once a fortnight (for personal websites/blogs) is generally good. If you know you are going to be away from your site for a while, have an open hiatus. Nobody wants to go to a ‘dead’ website and see that the owner’s last blog was written 7 months ago, and promises to update soon. No one likes to go to a website that proudly displays “last updated on __” in the sidebar when the answer to that is October 2002. Keeping your website up to date, adding relevant news, updating information, making sure links aren’t broken and looking after your website are your duties. It is crucial to attracting new visitors, and keeping those visitors. The most successful websites always have returning visitors, not someone who just stops by to look, or at the least say ‘hello‘, and never come back. Even if your website is not a personal site and is something like a portfolio website, keep material fresh; add new artwork, or update contact information.

So in conclusion, if you follow these simple suggestions you can improve your website and gain more hits, and more returning visitors.

I probably could have made the list longer, but this is already a long article so I will leave it at that. Anyway please let me know what you think of this article honestly, and if anything I have written is incorrect. I did my best to research everything and make sure everything was relevant. I will finish with some related links to some very good articles.

Jems Top Five SEO Tips
The Value Of Your Visitors
Top 10 Biggest Web Design Mistakes
Common Mistakes Among Web-Designers
Web design 101

Layout Trouble

Posted by Bobbi-lee - June 15th, 2007

I can’t help being a perfectionist when it comes to my layout. Even though my site is all validated and looks good in most browsers, I really need help on the following things

  1. The space/padding between the sidebar and the content is a huge gap on higher resolutions. How do I make the two closer together and not so stretched?
  2. I want the title and comment link to be in the same sort of style div like the date format above. Like this example. I managed to get it very close, but then when you click on the comment link only the comments show without the blog. Then when I changed it around a bit, it showed the blog but no comments or comment form. I am really confused how to do this.
  3. Anything else to make my site look “normal” on all browsers.

Thanks if anyone can help, or give me any tips.

previous   next

Search

Pages Recent Posts Categories Blogroll
Valid CSS Wordpress Valid XHTML Hosted by Calm Banana