google / google/material-design-lite

Enhance / Modernize Footer on getmdl.io

Open
#5,463 2 comments 0 reactions 0 assignees View on GitHub
Dominant language
HTML
Stars
32.2k
Forks
4.9k
PR merge metrics
No merged PRs in 30d

Description

### Description:

The footer on the getmdl.io site is currently very minimal (or missing in some pages). To improve usability, aesthetics, accessibility, and maintainability, I propose upgrading the footer with the following features and design enhancements.

### Current Footer (Baseline):

- Very minimal or non-existent content (only navigation links at top).
- Lacks branding, contact/social, site structure, and copyright.
- No responsive design tweaks or dynamic features.

### Proposed Enhancements:

1. Add Site Branding / Logo

- Show the MDL logo or “Material Design Lite” name in the footer for consistency.
- Optionally link back to home.

2. Navigation / Quick Links

- Duplicate or reorganize the main navigation (About, Getting Started, Components, Templates, etc.) into “Site Links” in the footer.
- Optionally group under headings like “Docs”, “Community”, “Resources”.

3. Social / Community Links

- Add icons/links to GitHub, Twitter, Stack Overflow, etc.
- Encourage community contributions or following.

4. Legal / Policy Links

- Terms of Use, Privacy Policy, License (e.g., MIT or other)
- Attribution information if needed.

5. Contact / Support

- A link or email (or “Get Help”)
- Or “Report issue” link pointing to GitHub.

6. Copyright / Version

- Show current version of MDL (if relevant)
- Copyright line like “© Year Material Design Lite”
- Optionally, “Last updated” date.

7. Responsive & Accessibility Considerations

- Ensure footer is mobile-friendly
- Use semantic HTML (e.g., ), proper aria labels, contrast, and keyboard navigable
- Ensure social icons have aria-label or accessible names

8. Visual Styling / Theming

- Match MDL design language (typography, spacing, colors)
- Maybe include a subtle background, divider line, and hover effects on links
- Light/dark mode support (if site supports theme toggling)

9. Optional Enhancements

- Newsletter subscription form
- Recent blog posts or community highlights
- Language selector (if multi-language)
- Search box (if applicable)
- “Back to top” link or button

### Impact & Benefit:

- Improves site navigation (especially for deep pages)
- Reinforces branding consistency
- Provides legal / support context
- Enhances credibility and completeness of the site
- Encourages community engagement

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.