• Webwide.io has moved to Webwide.chat

    The Webwide.io forums are coming to a close but we hope you'll join us over on Webwide.chat! Thank you very much to all our wonderful members, please contact Adam for a free Webwide.chat membership.

Questions about modernising a theme....

Questions about modernising a theme....

Lee

Member
Local time
02:04
Joined
Aug 8, 2020
Messages
27

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?

3fgXgeA.png

 

adam

Mr. Webwide
Administrator
Community Team
Local time
02:04
Joined
Sep 24, 2019
Messages
1,264
Pronouns
he/him

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:

 

Lee

Member
Local time
02:04
Joined
Aug 8, 2020
Messages
27

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

Mr. Webwide
Administrator
Community Team
Local time
02:04
Joined
Sep 24, 2019
Messages
1,264
Pronouns
he/him

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.

 
Last edited:

Lee

Member
Local time
02:04
Joined
Aug 8, 2020
Messages
27

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.

LhZM4Xt.png

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

 
Last edited:

adam

Mr. Webwide
Administrator
Community Team
Local time
02:04
Joined
Sep 24, 2019
Messages
1,264
Pronouns
he/him

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

Member
Local time
02:04
Joined
Aug 8, 2020
Messages
27

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

The font becomes bold when the node is active :)

 

Lee

Member
Local time
02:04
Joined
Aug 8, 2020
Messages
27

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

FFrVMNN.png

 

adam

Mr. Webwide
Administrator
Community Team
Local time
02:04
Joined
Sep 24, 2019
Messages
1,264
Pronouns
he/him

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.

Screenshot 2020-08-19 at 04.31.03.png

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

Screenshot 2020-08-19 at 04.31.22.png

 

Lee

Member
Local time
02:04
Joined
Aug 8, 2020
Messages
27

Thanks, Adam! Appreciate your help massively.

 
Top