This is the personal website and blog of academic librarian Hannah Shelley. It's 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 and not part of my paid work.
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 lightweight 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)
- Google docs for writing before converting to HTML in Notepad++
- Claude
- Code debugging (The JavaScript is mostly vibe-coded at this point)
- Sometimes feeding early drafts or fragments of blog posts. This results in an output that basically contains my ideas reflected back to me in different words. This helps me process meaning and occasionally sparks new thoughts, augmenting the editing process. This has been helpful in getting me more confident in putting my thoughts to paper, and I want to be transparent about it. I don't use it to write drafts or "polish" them.
- 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
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