Archived topic
My new landing page
56 replies · Started by Chris on September 4, 2018
I struggle with the question of what the best color is on a white background. And of course the best font and size. Do you have an answer for me? It is for my new landing page: https://www.beurstrading.nl/informatie-trading-systeem/
Hi there,
it really is down to personal preference and design, but some 'standards' do exist.
Generally do not use pure white #fff or black #000 - tone both down a touch just reduce high contrast. Font size for body: minimum 16px, a lot of people go for 18px.
If you're not into 'designer type' then golden ratio works well:
https://pearsonified.com/typography/
Just add the font size and container width - leave the CPL blank. On the output hover over the font and it will provide the Ratios for your headings etc.
Thank you Dave! Do you have a suggestion for me for the white background color and the black text color?
This site uses #1b212b for the black. The white i would just reduce it down to FAFAFA or if you want a cool grey then F6F7F8 is nice :)
Thanks David!
You're welcome :)
Hi David, I see something strange.
The text of a page is slightly less black and thicker.
All settings are the same.
How is that possible?
This is the page: https://www.beurstrading.nl/informatie-trading-systeem/
And this is a normal page: https://www.beurstrading.nl
Flush your Autoptimize cache and then let me know.
Done!
Can you flush them again and then switch off autoptimize so i can see where the stye os coming from. And maybe we can exclude it from optimization.
Done! 😁
You have a Tooltipster plugin (?) running on that page that is injecting font-aliasing to the head. Hence the change in appearance.
David, I do not understand anything about this! Can I give you access to the website?
One of the plugins, i think it is the Ninja Tables is adding font smoothing to that page. Put this CSS in your Additional CSS:
html {
-webkit-font-smoothing: subpixel-antialiased;
}
Oke, now I understand! (I think 😁) First I will remove the table to check!