Crap for Crappier

[Merlin]

I am changing the design of one of my crappy websites to another crappy designed website

This is the old: http://www.volunteerbrazil.com

This is the proposed new: http://volunteerbrazil.com/yellowtemp.html

OR this one: http://volunteerbrazil.com/yellowgreytemp.html

Opinions welcome…..

Havent got time to set up a poll…still trying to get some of my bets on

Just write…OLD, NEW YELLOW, or NEW GREY/WHITE

Fanks.

[Win2Win]

http://volunteerbrazil.com/yellowtemp.html

...and more women in little clothing :)

[vegyjones]

http://volunteerbrazil.com/yellowgreytemp.html

[Mavrick]

The middle one. It was a tough decision though.

[Jonny2621]

Middle :wink

[Win2Win]

Just write…OLD, NEW YELLOW, or NEW GREY/WHITE

If we write on our screens....are you buying us a new one? :)

[GlosRFC]

Some feedback:

1. The yellowgreytemp loads quicker on dialup if that's a consideration (although the old one is quicker than both)
2. Both of the new ones are a visual improvement on the old version.
3. Not sure about the fonts used for your links on both sites as they don't look very smooth.
4. The grey blocks on yellowgreytemp looks odd to me. A better choice would be the orange that you've used for the main navigation header.
5. Having said that, an even better choice would be blue - that ties in with the Brazilian national colours.
6. Consider whether to make the text on your links linkable too rather than just the buttons.
7. The buttons look huge on a low resolution screen so maybe think about making them a tad smaller.
8. The button/text/grey bar for the Apply link don't line up very well on both new sites. Look across the bottom of that row to see what I mean.
9. There seems to be a spacing issue with the text under the Families link.
10. Not sure if centred text is a good idea under each link - have you tried experimenting with normal left-justified text?
11. Can you not make the orange/brown bar at the bottom reach all the way across to the left of the screen? It kinda jars on the eyes.
12. Same thing with the grey bar above the News link. Not sure why that's there at all - it would be better without it.
13. It might be the grey bar but the bottom set of links (News, Current Offer, Apply) don't line up horizontally which also looks out of place.
14. Presumably you'll be changing the other pages to match whichever home page you come up with? At the moment they point to the old look site.
15. Logo looks good on both new sites but, again, the fonts don't look anti-aliased so they appear quite jaggy.

Hope that's all useful feedback Merlin.

[Win2Win]

Now that's picky

[GlosRFC]

Not being picky - at the end of the day Merlin is making changes to encourage more people to visit (and stay) on the site and all of the changes I've suggested are easy enough to implement.

If I was being picky I'd say that there really isn't enough difference between the two new sites. Both show most of the small problems I've pointed out and there really isn't anything to choose between them from a visual point of view - one has a yellow background and the other is white!

[Win2Win]

How about this one Glos http://www.soulwax.com/ :D

[GlosRFC]

It's colourfully revolting yet strangely magnetic....like driving past a road accident.

[Win2Win]

It gave my PC the BSOD

[GlosRFC]

Hahaha...that pleased me no end :D

[Merlin]

Thank you so much everyone....especially Glos....

I am aware that the old site is crap....but it still gets loads of visitors, notwithstanding, oddly, people say they like it......

The reason I want to change it is I know its crappy...and could get more clients with a better site.....besides, it was my first ever website...and it shows, too...

The thing is I (like many on the forum), have had no training in website design and am not even a techie person.....so basically, I try to get along with self learning, begging, stealing and borrowing....

But I do feel its time to change the site now, after 3 years......

Thanks again everyone......

[GlosRFC]

Begging, borrowing and stealing is okay for the technical side of things - but there's an art to good visual design. Try taking a look at kuler.adobe.com to get an idea of how to match colours. Also do a search on anti-aliasing to see if you can solve the jaggedness of your fonts. If you're using Photoshop to create the graphics, you can adjust the aliasing - again, a search of the help files will show you how. This site http://www.digital-web.com/articles/...les_of_design/ is also worth a read too.

[Merlin]

1. The yellowgreytemp loads quicker on dialup if that's a consideration (although the old one is quicker than both)

This is weird, Glos, as I thought the old one had more crappy code than the new one

6. Consider whether to make the text on your links linkable too rather than just the buttons.

How do I eliminate the outline resulting when linking to a gif image?

14. Presumably you'll be changing the other pages to match whichever home page you come up with? At the moment they point to the old look site.

Sure - I want to get the main page template right before changing everything...which will take me a couple of months, anyway....then change all the pages over in one session.....

Thanks Glos...if u get time to answer...

[GlosRFC]

1. Not sure why...maybe one of your pictures is a different size within the code? You can use the HTML code to resize them by adjusting the WIDTH and HEIGHT attributes, but it's best to resize them first for two reasons.
Say, for example, that you have a pic that's 400x200 at 200kb in size but you only want it shown 200x100. Because you're effectively reducing the physical size of the pic by half in each dimension, that has the same effect of reducing the filesize by a quarter so the 200kb becomes 50kb. Secondly, if you use HTML to resize the pic, the browser only applies the HEIGHT and WIDTH attributes after the pic has been downloaded. So your visitor will be downloading the 300kb, 400x200 pic even though it will actually be displayed at 200x100 size. Compared to the size of graphics, the amount of code being downloaded is pretty neglible...I bet the HTML code for all three pages isn't much more than a few bytes whereas the new sites have a lot more graphics within their pages (remember that each of the link titles is also a separate graphic that has to be downloaded each time).

6. That's easy - just include a border=0 within the IMG SRC= tag within your code. If you're using CSS, you can achieve the same effect by creating an img style within your main stylesheet, e.g.

img
{ border-style: none;
}


The benefit to the second approach is that it will apply to every image without the need to hunt through your code looking for IMG SRC tags. Save the stylesheet with a simple name such as mystylesheet.css then reference it within the HEAD section of your HTML code:

LINK HREF="/mystylesheet.css" REL="stylesheet" TYPE="text/css"/

Obviously you'll need to enclose it in angled brackets and note that the last / goes outside the quotes!

[Win2Win]

Some beginner's CSS info http://www.w3schools.com/css/css_intro.asp