Website text font, size and colour

[shpangle]

Hi,

I have managed to fumble together my website over the last few months and I am very unhappy with the text look and content of the home page.

I don't need a review but are there any recommendations of text font/size/colour for descriptions on the home page ? Bearing in mind that I will be keeping a background colour of light grey.

Your thoughts would be most appreciated.
Thanks
http://www.shpangle.co.uk

[JamesCartwright]

I would recomend picking just one font and sticking to it. It appears that you are using three quite different fonts on your site. Sometimes it's OK to use more than one (for example Verdana for headings and Arial for body text), but you're using too many different ones.

Also, it may look better if the main body text is black and not in bold. Maybe a bit smaller font size too.

The grey background looks good, but not in the center of the page (where the content is). I think you should chage it to white. It just makes it easier on the eyes and more usable.

It's a good site though. I like the layout and especially the top (with the heading and links bar). Well done! Hope my advice helps.

Good luck with the business - hope it goes well!

James.

[shpangle]

Hi James,

Many thanks for some very useful advice !

You are very right about my use of fonts. lol ! I have a habit of tweeking things almost on a daily basis and today I took a step back with fresh eyes and was shocked !

I am a crafter and my business is mainly through craft stalls. I did this website for a bit of fun and for my own self fulfilment and don't expect too much in the way of sales. Its more of a portfolio !

I would like to get it right though and the moment it is a bit like myself. I bit all over the place !

Thanks again. I will give your comments a try tonight.

[fisicx]

No doubt there will be a whole raft of ideas but the most important consideration is to keep ypur visitors happy.

So the #1 rule is, don't use pixel or point font sizes. A good starting point is to set your base (body) font to 100% or 1em and then relate everything else to this. Each site is different so you need to test, try changing the base font size and see if visitor behaviour changes. Also remember that not everyone has the same screen resolution so what looks good to you may well be tiny for someone else. Generall recommendation is for about 12 words per line so this may well determine your font size but don't forget the fog index (http://en.wikipedia.org/wiki/Gunning-Fog_Index) as well

Serif fonts are easier to read if you have narrow coloumns and sans serif fonts are preferrable if you have technical information (it slows the reader down). Again it's personal preference but stick clear of lots of bolds and itallics. and don't use anything except the standards: times new roman, arial, helvetica, verdana and a few others. Just because you have a particular font installed doens't mean everyone else does. You also need to consider your line height as some combinations of font faces, heights and page widths require different line heights, again you need to experiment and test.

I've always loved this site for it's brilliant advice: http://ilovetypography.com/2008/04/04/on-choosing-type/

Colours should really be high contrast. Your orange on grey is really difficult to read, in fact and colour on grey is going to be awkward so think about your visitors, bite the bullet and stick with black on white for the main text and a bit of colour for the headers.

[shpangle]

Blimey ! It didn't realise there was so much to it ! I had never heard of the fog index ! Thankyou so much for some great advice..sounds like black text on a white background is the way to go.

Is there a recommendation as to how much text should be on the home page. Some people say loads of text for search engines and some people say keep it to the minimum.

Thanks again..

[fisicx]

Just say what you need to say. Build your site for people not the search engines, so if you can cover everything in 50 words then that's enough. If it takes 200 then don't try to cut it down. What you do need to do is break up the prose. People tend to scan pages rather than read so use headers, lists and images to break up large chunks of text in to bite sized pieces.

Take a look at the Web Style Guide, it will take you a few weeks to absorb everything but it's a very comprehensive introduction to the subject: http://webstyleguide.com/

And make sure you investigate websafe colours as well, some combinations are almost unreadable for those with colour perception problems and remember that the subtle shade you see on your £1000 widescreen monitor can look ugly on my £10 second hand CRT.

[NuBlue]

I like the gray you have used for the news nsippet on the left hand side. It would look neat I think if you made all your main text this colour (and size) and then maybe use the orange colour for all your links so it is clear what is text and what is a link. Like you have on this page:

http://www.shpangle.co.uk/index.php?pr=About_Us

No real rule for how much text to use on your home page, depends on what your visitors expect really. If you want a very un-scientific rule of thumb though then I would go for around 150-200 wrods. Enough for the Search Engines to have something to read without looking too wordy for peopl who stumble across it and want the gist of what you do.

I think it looks good. You can go to town on accessibility and standards etc... but unless you have lots of time to dedicate to it (or money) I would concentrate on making it look neat and clear.

[fisicx]

I think it looks good. You can go to town on accessibility and standards etc...

I agree, but following a few basic guidleines can make all the difference between getting a conversion and the visitor leaving with their eyes out of focus. This is why testing is so important. Using CSS it's easy to make the changes and getting a few friends round with a bottle of wine may be all the testing time you need.

[NuBlue]

Using CSS it's easy to make the changes and getting a few friends round with a bottle of wine may be all the testing time you need.

lol, I wish we were allowed to use this testing strategy, I'd be happy to test stuff all day :)

I agree though, get the basics right and your visitors will thank you for it.

[JDX_John]

The top of your page is very nice. "About Us" page is also good, as is the Gallery and Shop.

The only part I think is bad (and it is quite ugly) is the main part of your home page. The font is way too big and 'fat', my personal taste is that the rest of your site has quite nice text.

[fisicx]

lol, I wish we were allowed to use this testing strategy, I'd be happy to test stuff all day :)

Keep this technique for sign offs. Take the client out to lunch then when they can't even see the screen proffer the invoice for the FrontPage special you knocked up using a free template.

[JamesCartwright]

You're welcome, I'm happy to help. When you make some changes, please tell us and we can help some more!

[J-Wholesale]

The font and line spacing you're using on your contact page is perfectly acceptable, though you should remove the italics. I would use this font throughout your site, possibly with a white background as someone else mentioned. Your text should ideally be as unnoticeable as possible. This may differ from a lot of advice out there, but our experience running an online jewellery business is that no one is interested in what you say, or in reading your copy, they just want to see pictures.

[GoPrivateDetective]

The site also seemed quite slow to load compared to other websites. I don't know if any of your images are over large or if it just a slow hosting package you are using.

Agree with everyone else about too many fonts and italics.

[sirearl]

I would say around 500 words is a minimum for effective SEO.

Earl

[graham_snakey]

stikcing to a similar theme throught helps users feel relaxed on the site

[Wilkoa]

Hi
Optimise your title tags, meta descriptions and keyword info for SEO to ensure you get found by the search engines. Most important keywords go at the beginning of your title tag.

Join google webmaster tools and add a site map too.

Orange is not a good colour to use for text! Also it is probably worth increasing the size of the spacing between the lines to make it easier to read.

Hope that's useful info!

[shpangle]

Hi,

Well, I have just finished hacking (sorry crafted) my website home page and in my opinion its a step in the right direction....well until next week when I change my mind again !