\
**Category:** Documentation\
**Tags:** documentation\
**Created:** [March 15, 2024, 12:42am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566 "2024-03-15T00:42:26Z")\
**Posts on this page:** 8\
**Page:** 1
**Author:**  [@Privat33r](https://discuss.python.org/u/Privat33r)\
**Post date:** [March 15, 2024, 12:42am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/1 "2024-03-15T00:42:26Z")
The HTML design feels outdated as it uses older HTML styling. I suggest to refresh the design at least by means of partial modernization. It’s especially visible when you visit `devguide` subdomain and compare it to `docs`. Some of these things can be considered taste preference, while others are representing legitimate concern. A few suggestions provided below:
1. Make design more responsive
> **With wider screens, \`devguide\` definitely renders much nicer**
>
> 
1. Add more spacing to top bar: it is too dense
2. Remove list style type (or at least add option to make lists without type/use that option in many places)
3. Add tooltips at least for the glossary and basic terms
4. Add more themes, make font customizable, improve accessibility
5. Add labels for the `select` input elements in the top bar to improve [accessibility](https://dequeuniversity.com/rules/axe/4.8/select-name)
6. Redesign side bar
7. Remove vertical bars from the tables
8. Remove excessive `important!` properties from the css.
P.S. I was unable to provide images for illustration because of the forum’s limitation on embedded media posting for new users…
> **Full unformatted version with illustrations**
>
> ```md
> 1. Make design more responsive
> [details=With wider screens, `devguide` definitely renders much nicer]
> 
>
> 
> [/details]
>
> 2. Add more spacing to top bar: it is too dense
> [details]
> 
> I will compare it to Github's one since `devguide` doesn't have a topbar
> 
> [/details]
>
> 3. Remove list style type (or at least add option to make lists without type/use that option in many places)
> [details]
> Before:
> 
>
> After:
> 
> [/details]
>
> 4. Add tooltips at least for the glossary and basic terms
> 5. Add more themes, make font customizable, improve accessibility
> 6. Add labels for the `select` input elements in the top bar to improve [accessibility](https://dequeuniversity.com/rules/axe/4.8/select-name)
> 7. Redesign side bar
> 8. Remove vertical bars from the tables
> [details]
> Example-1:
> 
> to
> 
>
> Example-2:
> 
> to
> 
> [/details]
> 9. Remove excessive `important!` properties from the css.
>
> ```
---
**Author:**  [@Privat33r](https://discuss.python.org/u/Privat33r)\
**Post date:** [March 15, 2024, 12:45am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/2 "2024-03-15T00:45:09Z")
> **devguide render**
>
> 
(message for test, I am not sure if I even should make 10 messages just to post illustrations)
---
**Author:**  [@CAM-Gerlach](https://discuss.python.org/u/CAM-Gerlach)\
**Post date:** [March 15, 2024, 3:20am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/3 "2024-03-15T03:20:33Z")
Hi Kerim, I bumped your account up a trust level so you should be able to post your images and links, or edit your posts above to contain them.
As to your points, the docs theme is certainly quite old and creaky as far as it comes to HTML styling. The docs team has been notionally strongly considering a migration to highly modern theme like @pradyunsg 's [Lutra](https://pradyunsg.me/lutra/), under development with large documentation sets like CPython’s specifically in mind, as well as work by @hugovk and others to modernize low-hanging fruit in the current theme (dark mode, a11y, etc) where feasible.
I’m sure we’d welcome your contributions along these lines to both of those efforts, after due consideration and discussion of any major changes that might warrant broader feedback.
---
**Author:**  [@hugovk](https://discuss.python.org/u/hugovk)\
**Post date:** [March 15, 2024, 6:33am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/4 "2024-03-15T06:33:01Z")
Here’s the full list with images:
* * *
1. Make design more responsive
> **With wider screens, \`devguide\` definitely renders much nicer**
>
> 
>
> 
1. Add more spacing to top bar: it is too dense
> ****
>
> 
> I will compare it to Github’s one since `devguide` doesn’t have a topbar
> 
1. Remove list style type (or at least add option to make lists without type/use that option in many places)
> ****
>
> Before:
>
> 
>
> After:
>
> 
1. Add tooltips at least for the glossary and basic terms
2. Add more themes, make font customizable, improve accessibility
3. Add labels for the `select` input elements in the top bar to improve [accessibility](https://dequeuniversity.com/rules/axe/4.8/select-name)
4. Redesign side bar
5. Remove vertical bars from the tables
> ****
>
> Example-1:
> 
> to
> 
>
> Example-2:
>
> 
> to
> 
1. Remove excessive `important!` properties from the css.
---
**Author:**  [@hugovk](https://discuss.python.org/u/hugovk)\
**Post date:** [March 15, 2024, 6:40am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/5 "2024-03-15T06:40:23Z")
These generally sound like good ideas.
The main docs uses a Sphinx theme that lives at [GitHub - python/python-docs-theme: Sphinx theme for Python documentation](https://github.com/python/python-docs-theme). Would you like to open separate issues or PRs over there, and we can go through them one-by-one? Some of these things might be in Sphinx itself.
> [@Privat33r](#):
>
> 1. Add tooltips at least for the glossary and basic terms
Do you mean using ``? It has limited and inconsistent support for keyboard users, touch users (e.g. mobile) and for screenreader and Braille users:
[https://adrianroselli.com/2024/01/using-abbr-element-with-title-attribute.html#Verdict](https://adrianroselli.com/2024/01/using-abbr-element-with-title-attribute.html#Verdict)
> [@Privat33r](#):
>
> 1. Add more themes, make font customizable, improve accessibility
I’m not sure if we should have multiple themes, or if Sphinx even supports it. It would mean we need to maintain integration of 2x or 3x or more themes (plus light+dark).
If we can let people customise the font via browser settings, that would probably be best.
I think we should use the [system font stack](https://systemfontstack.com/) for wider support, improved readability and consistency, and quicker loads, which both the [devguide](https://devguide.python.org/) (via the [Furo theme](https://github.com/pradyunsg/furo)) and [PEPs site](https://peps.python.org/) use. Here’s a demo: [3.13.0a4 Documentation](https://hugovk-python-docs-theme.readthedocs.io/en/sfs/)
---
**Author:**  [@Privat33r](https://discuss.python.org/u/Privat33r)\
**Post date:** [March 15, 2024, 9:48am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/6 "2024-03-15T09:48:39Z")
> Do you mean using ? It has limited and inconsistent support for keyboard users, touch users (e.g. mobile) and for screenreader and Braille users:
I meant more like wikipedia-style tooltips so users recap information quickly, it might help in studying. We can add “title” attritbute to `` tags and display it with JS from cached json with dictionary.
> I’m not sure if we should have multiple themes, or if Sphinx even supports it. It would mean we need to maintain integration of 2x or 3x or more themes (plus light+dark).
I was thinking more of “light” themes which would rather mostly be a color schemes, like obsidian, monokai etc.
> I think we should use the [system font stack](https://systemfontstack.com/) for wider support
Sure, sounds good
---
**Author:**  [@Privat33r](https://discuss.python.org/u/Privat33r)\
**Post date:** [March 15, 2024, 9:54am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/7 "2024-03-15T09:54:09Z")
> I bumped your account up a trust level so you should be able to post your images and links
Thanks 🙂
Also thank you for providing an accurate depiction of the current situation along with links, hopefully I can make meaningful contribution for both of these efforts. It would make sense to start with minor improvements and move to another theme for bigger things (e.g. top/side-bar redesign).
---
**Author:**  [@hugovk](https://discuss.python.org/u/hugovk)\
**Post date:** [March 16, 2024, 9:52am UTC](https://discuss.python.org/t/docs-html-render-redesign/48566/8 "2024-03-16T09:52:33Z")
> [@Privat33r](#):
>
> > I think we should use the [system font stack](https://systemfontstack.com/) for wider support
>
> Sure, sounds good
Please see PR [python/python-docs-theme#176](https://github.com/python/python-docs-theme/pull/176).