docs(readme): better alt text, add toggleable list of companies/projects that use Renovate

[HonkingGoose]

Changes

• Improve alt text for images
• Add list of companies and projects that use Renovate, collapsed by default, works well with screenreaders

Context

I used Apple's screenreader (VoiceOver) to read our readme. The plain text works great, but currently the images and badges are confusing. I think we can improve things by clearly labeling our badges and images, so the screenreader can say what it contains.

My goal is to:

• Have screenreaders read the content of images
• Explain that some images are actually badges
• Be more accessible for people who need screenreaders or otherwise need alt text

Changes after testing with VoiceOver

My new badge alt text for the badge was more confusing than the old style. So I'm reverting to the old style, with one minor improvement. The badge is a decorative element. It's not really important to know it's a badge. The content and meaning of the badge is covered by the alt text anyways.

The collapsible list of companies that use Renovate bot, works really well! 🥳 This means we can:

• keep the social proof image with all 20 companies in it
• have a short but descriptive alt text for the image
• hide the long list by default, so it's not breaking the visual layout for those who can see
• have a long list in plain text for those who need it, like screen reader users
• get the plain-text benefits of a list

Documentation (please check one with an [x])

• I have updated the documentation, or
• No documentation update is required

How I've tested my work (please select one)

I have verified these changes via:

• Code inspection only, or
• Newly added/modified unit tests, or
• No unit tests but ran on a real repository, or
• Both unit tests + ran on a real repository

[renovate-release]

🎉 This PR is included in version 37.368.7 🎉

The release is available on:

• GitHub release
• npm package (@latest dist-tag)
• 37.368.7

Your semantic-release bot 📦🚀