This is the personal website and blog of academic librarian Hannah Shelley. It isn't part of my paid work, but a personal project where I explore ideas about libraries, technology, and culture. It often overlaps with my professional interests, but the views here are entirely my own.
This site may not look like much, but it’s made with care.
This site reflects my values around accessible, user-centered design, owning your digital presence, and my fondness for the "old web." Simple and hand-coded, but with some of the luxuries of new web (but only the good bits). I do it this way beause it's fun and nostalgic for me, and I like the control and freedom that platforms and templates don't provide.
This website is a constant work in progress. Check back to see what I break next!
Features:
- Boolean search operators - Because what librarian would tolerate a search bar without AND, OR, NOT support?
- Manually updated RSS feed - Old school and committed to it
- Dark/light mode toggle - without the toggle the theme follows your system preference
- Mobile responsive - just as fun to view on a phone as it is on the big screen
- Open graph metadata (title, image, description) so links look pretty when shared on social media
- No tracking, no cookies, no BS - Just HTML, CSS, and some JavaScript
Technical Details
Built with:
- Hand-coded HTML5 and CSS3, validated with W3C tools
- JavaScript (enhanced but not essential - the site works with JS disabled)
Coding and publishing:
- Neocities for hosting
- Notepad++ for code editing (outside of the Neocities editor which is also great and I use this for small touch-ups)
- Claude Sonnet 4.5 for blogging (middle-stage reflective drafting), and some code debugging (The JavaScript is mostly vibe-coded at this point).
- The Read Time for approximate reading times
- Hannah's Blog Snippet Generator👑✨
A custom form I made for myself that automatically generates all the little fragments each new blog post needs: the post file name, archive entry, homepage tile, RSS entry, Open Graph tags for social sharing, JSON entry for site search, navigation links, and more. It has turned what used to be many fussy manual steps into one smooth workflow.
Typography, Images & Icons:
- Body: Georgia (for readability)
- Headings: Courier New
- Icons via Font Awesome
- Favicon.io for the emoji site/bookmarklet icon 💥
- The 88x31 GIF Collection for web buttons (warning: flashing images)
- The Creative Commons filter in Google Image Search, and stock photo sites like Unsplash and Pixabay for free-to-use images
- I do memes and basic image edits in Powerpoint, like a true artist
About my blogging process
This website doesn't use any kind of CMS - each blog post is a seperate html file that I've built. I use the naming convention YYYY_MM_DD_Shorttitle.html.
I usually write and revise posts in Google Docs (easier to think, rearrange sentences etc) before turning them into HTML by hand once the text feels right. After I've uploaded the HTML file, I need to update every part of the website that links to it (with the help of my custom-made Code Snippet Generator).
I often use Claude by feeding it early drafts or fragments. Reading my writing reflected back in different words helps me process meaning and edit for structure, flow, and emphasis. Occasionally it even sparks new thoughts. I use it in the middle stage rather than the beginning (LLMs are boring brainstormers) or end (they'll "polish" away your unique voice). There's controversy around LLM-assisted writing, but I feel I've found a way to use it that augments my revision process rather than replacing my voice, and I want to be transparent about it.
Copyright
All my posts and pages in this site are licensed under Creative Commons Attribution 4.0 International
unless otherwise noted.
This means you're welcome to copy, republish or remix my stuff, just credit me.
I choose open images or make my own when I can, but some memes and whatnot I have stolen in good faith. Contact me to let me know if you see something that should be credited or taken down.
Feedback corner
@hannahshelley.bsky.social Your website design just took 20 years off my life. Thank you.
— LibraryThingTim (@librarythingtim.bsky.social) February 6, 2025 at 3:02 PM
