disguises - a layout archive
disguises

Version 16: Bygone Elegance

Layout Structure

  • Single page content flow
  • PARALLAX SCROLLING ♥ ♥ ♥ sorry y'all I'm just still amazed that I didn't break it
  • Content sectioned by the actual <section> tag (what a novel idea)
  • HUGE images
  • Div containers for the big ole images and the content bits

New Techniques

  • Parallax scrolling!

Trivia

  • I have wanted to make a sleek yet vintage-flavored design like this pretty much as long as I've been poking at webdesign.
  • I tried to learn parallax design from several other tutorials, but none of the others had a demo I could really follow. I had just about given up completely on learning how to do it when I ran across the one I linked one fateful afternoon.
  • I ended up combining a lot of my one-page "domain info" pages back together into this one design, and I was worried it would be too much text for a single page, but instead, the big images balanced the info out nicely.
  • This design uses much larger images than I've ever used before, but I didn't have to do a lot of image manipulation--just a bit of artistic blur and some color desaturation to give the pictures a gentler, older vibe.
  • I built 3 different "version 16s" before I found this parallax tutorial; each of them had this same black/gray/pale peachy-pink/white color scheme, but this one just SINGS because of the large, beautiful images that feature those same colors. Honestly, I can't believe I even had a hand in making ANY of this design...it's just WOW.