Patterns for Personal Web Sites
Recently (2023-10) I came across a great resource by Mark L. Irons on how to make personal web sites more accessible with patterns.
I have been thinking about exactly such patterns for a while, but Mark’s resource is almost perfect so I just link to it here and try to add a few more patterns.
I wanted to assess the quality of my own site against the patterns, so I made a table below—how my site stands up (as of 2023-11-14).
| Pattern Name | Present? | Comments and examples |
|---|---|---|
| Deep content | Yes | Kinesis Advantage Review |
| Diverse content | Yes | See music or photos |
| Gift to the community | Yes | E.g. dev glossary |
| Your own voice | Maybe | It’s up to the reader to decide |
| Useful home page | Yes | I hope so. |
| Index pages | Yes | Hugo has me covered. |
| History page | Yes | Last updates |
| Default pages | Yes | Hugo deals with that. |
| Private entrance | No | But thinking about it. |
| Cover page | Maybe | About can be considered a cover |
| Secret garden | No | Not very feasible with Hugo. |
| Consistent format | Yes | Achieved with Hugo layouts. |
| Standard header+footer | Yes | See below. :) |
| Link to maintainer | Yes | About me in the footer. |
| Appropriate length | Yes | I am not using pagination. |
| Necessary images | Yes | No editorial images from Stable Diffusion… |
| Recognizable links | Yes | Though I override default colours. |
| Readable links | Yes | |
| Relative links | Yes | Hugo does that. |
| Living site | Yes | Roughly weekly updates. |
| Incremental growth | Yes | |
| Freshness dates | Yes | |
| Unchanging URLs | Yes | I started adding aliases when moving content. |
| Entrances everywhere | Yes | |
| Visible location | Yes | Breadcrumb menus above articles |
| One jump home | Yes | |
| Three jump maximum | Yes | Top menu → section → articles |
| Site map | Yes | Sitemap |
| Related pages | Yes | Integrate into the body, then add a list. |
| Guessable URLs | Yes | |
| Open to all | Yes | You can read this website in links or w3m. |
| Appropriate format | Yes | E.g. PDF with score of music. |
| Valid markup | Yes | In the sense of Mark’s article. |
| Graceful failure | Yes | I have 404 for this. |
| Downloadable weblet | Yes | E.g. PDF with score of music. |
| Offline readability | Yes |
Score
~33 out of 36. I am pretty happy with the results I must say!
Several points are for free since I use static site generator Hugo.
How does your site stand up?
Ideas for more patterns
- Regularly remove or update dead links.
- Do not use cookies (spare readers from the cookie banner).
- Limit the use of JavaScript.
- Limit the use of esoteric fonts, stick to the defaults whenever possible.
- Do not hesitate to publish unfinished content.
- Design for mobile first. It’s
20232024. - Use the space on the screen responsively.
- Make it fast (minimize, do not use CDN and third-party libraries).
- Make the visual design your own. Do not use the template everyone else uses.
- Limit the line length inside paragraphs to ~80 characters.
- Expose your RSS
published: 2023-11-13
last modified: 2024-01-29
https://vit.baisa.cz/notes/blog/patterns-for-personal-web-sites/
last modified: 2024-01-29
https://vit.baisa.cz/notes/blog/patterns-for-personal-web-sites/