Layout thrift store

Unless otherwise stated, everything you need to use these layouts is inline, so you can just yank the source code. If you need help, shoot me an email!

Links back are appreciated, but not required because these require some level of modification before use. You are welcome to chop them up and mutilate them as you see fit. If you use anything here, I'd be delighted if you showed me!

New stuff

My goal here is to do interesting stuff that still looks good on mobile. I only have my phone to test with, so please let me know if something looks weird for you!

These have documentation and a bit of a ramble from me on the layout pages themselves. They're not exactly beginner-friendly, but if you have a basic grasp of HTML and CSS, they should be pretty kind to you.

  • 3 column - A responsive version of the usual 3 column layout, with some tweaks to make it less clunky on mobile.
  • Easy reading blog - A bullshit-free Zonelets-compatible blog layout.
  • Linkmageddon - [slaps roof of layout] This thing can fit so many links in it. This one actually has comments, and I used CSS variables to make it more user-friendly.
  • 2 column - A simple 2 column layout adapted from the first iteration of this website. There are 2 versions; they look the same on desktop but behave differently on mobile. Includes CSS variables.
    • Version 1 - Stays in 2 columns regardless of screen size
    • Version 2 - Turns into 1 column on phones and screens smaller than 800px wide

Old stuff

Or maybe you like vintage. You're in luck, because I made all of these at some point between 2010 and 2013, so they're pure, untainted 2010s web design. If anyone is even into that...

None of them have images because I stupidly hosted everything on Tinypic, which no longer exists. Besides that, they're completely unedited; as such, the code might be formatted annoyingly (sorry on behalf of me from 10 years ago). In accordance with the time they were made, these layouts aren't mobile-optimized, though I don't think any of them are outright unusable on mobile.

  • Hatsune Miku??? - Fairly standard 2 column layout with a header image and full-width horizontal menu bar on top.
  • Barebones 2 column - Very simple fully-contained 2 column layout with a header image and horizontal menu bar.
  • Floaty Sidebar - Text-forward with a fun misaligned sidebar.
  • Compact sidebar - One of the few layouts with absolute positioning that doesn't completely explode on mobile.
  • Floaty Sidebar 2 - A derivative of the first floaty sidebar layout. The links are contained in tables, which means you can fit more of them.
  • 2 column but in blue - Another 2 column layout. But it's blue!
  • The cooler 2 column - A 2 column layout with a lot of cutesy styling. You can tell I had just figured out text shadows.
  • Tiny - Has a small horizontal menu bar that can fit 4 or 5 links on it as well as a header image.
  • Non-corporate minimalism - A relatively no-frills 2 column layout with a horizontal menu bar and header image.
  • Lots of links - Has a 2 column menu underneath the content section.