Use inverted white logo for index page

[wenzeslaus]

This uses a single color inverted logo in white (the grass plant is transparent, its background is white, everything else is white too).

The mission text is in bold font used for headings and is white and little smaller. It does not have to use the background box for contrast anymore.

The grass photo in the background is not covered in gradient to white, but with transparent dark green overlay for contrast with white and for matching the green in the top bar.

[neteler]

To me the new variant is harder to read.

Formally, in the EU, there are "Accessibility requirements for ICT products and services" (EN 301 549).

To some extent, it can be tested automatically against the accessibility requirements:

https://wave.webaim.org/report#/grass.osgeo.org

[veroandreo]

If we go with this proposal, I think we need to re-evaluate the whole color palette , because the greens do not really fit together anymore... Also the banner would need to go away as it is based on the previous green colors.

So, IMHO, to integrate this change might require more than replacing banner and logo...

[wenzeslaus]

I tried to use the predefined colors but with the overlay on top of existing image, I needed to use a different green just to get at least somewhat close to the green in the bar. I don't think the current photo of grass fits with the other greens either, it fits much less I would say.

The bar itself may use some review if we keep it; the color gradient there does not seem necessary and it makes it more difficult to match things together. Also interesting would be to have the bar everywhere except the index page. That would simplify matching of the colors in the index image. It may be beneficial for other reasons too, but I don't know how that would be done.

[wenzeslaus]

I did couple more experiments. How about making everything just green (here using primary color)?

Also, the original suggestion and this suggestion both pass the WCAG AA check for large text and while they fail at all others, it is the same as most of the green parts of the website now with the exception of thick lines in the logo and the black mission text in a light transparent rectangle (which I is a workaround if you ask me). Anyway, the AA check passes for large text which is just bold text in their example, so objectively it is about the same state as now elsewhere. I don't know how big issue that is otherwise.

Helper rectangle	Current headings	Original suggestion	Solid green suggestion