Questions about modernising a theme....

[Lee]

I have ported a theme I made in approx 2009 to xenForo, but it is looking a little dated.

I would like to keep along similar lines, but am struggling to find ways to make the theme appear more moden.

Does anybody have any suggestions?

 

[adam]

With a more modern colour scheme, remove the gradient for a more impactful banner and making use of some bolder typography on titles then this will be well on its way!

You can check here for some colour inspiration:

LOL Colors - Curated color palette inspiration

www.webdesignrankings.com

Color Hunt - Color Palettes for Designers and Artists

Color Hunt is a free and open platform for color inspiration with thousands of trendy hand-picked color palettes

colorhunt.co

Coolors - The super fast color schemes generator!

Generate or browse beautiful color combinations for your designs.

coolors.co

 

[Lee]

You mean removing the header gradient?

Would you suggest replacing it with a solid colour, or doing away with the header gradient all together?

Thanks for the inspiration pages, I often suck at putting colours together.

 

[adam]

I think gradients like that look very dated but not all gradients give that impression. https://stripe.com/gb is a very modern site that uses them to good effect. They can be hard to pull off though, so solid might be better. Given your audience and theme of the site, I think a more classic look certainly isn't a bad thing though. Feels more reassuring.

 

[Lee]

Thanks for your input. I have modified the header now and changed the main page background colour to white. i think that helps massively. Also changed the typeface to Quicksand from Google - looks a lot better to me. Still feel it might be lacking in something slightly though.

I really like the colour combination I have now, and feel like the whole thing goes together much better.

 

[Lee]

What do you think now?

 

[adam]

Looking good! Only thing really jumping out at me is the left hand navigation is looking a bit flat and dull. Perhaps a bold font, some subtle dividers and icons would help?

 

[Lee]

Valid point. I'll add some icons and dividers.

The font becomes bold when the node is active :)

 

[Lee]

Here is hopefully final revision as a logged in user with admin privelages.

 

[adam]

Looking good Lee!

The pink text on the grey background is failing accessibility standards for contrast though. Normal text should be at least WCAG AA.

If you can change the pink link text to #DA0777 that passes great!

 

[Lee]

Looking good Lee!

The pink text on the grey background is failing accessibility standards for contrast though. Normal text should be at least WCAG AA.

View attachment 203

If you can change the pink link text to #DA0777 that passes great!

View attachment 204

Thank you! Changed. What tool is that?

 

[adam]

Awesome! That is looking much easier on the eye.

Tool here: https://webaim.org/resources/contrastchecker/

 

[Lee]

Thanks, Adam! Appreciate your help massively.