disguises - a layout archive

Version 14: Out of a Dream

Click thumbnail for full-size view

Debuted On May 31st, 2014

matching button for this layout


Photoshop Elements 8.0 Notepad
Web Font Generator
Brushes: Azalea (Photoshop Elements 8.0 Special Effect)
Fonts: Timeless, Parisienne, Garamond, Arial,
Tahoma, Georgia, Socialico, Modern Pictograms

Layout Structure

  • Fixed horizontal navigation at top of page
  • 2-column centered floated div layout below
  • Header image as part of content div
  • Large footer with lots of information

New Techniques

  • Using the @font-face CSS rule to incorporate specific fonts; great for social media icons without the hassle
  • Creating a fixed navbar at the top of the page
  • Organizing and styling footer information


  • I tried to make this layout for about a year--I tried using darker purple first, then finally hit on the idea of using lavender and gray together.
  • Even with the new color scheme, this design lacked a little something for a long time; it even lacked a title until I finally made the dreamy, gauzy header image, with the soft floral brush and looping font of "withinmyworld.org". Then, I came up with the version title: "Out of a Dream."♥♥♥
  • I love the organizational flow of this layout, and how it highlights my recent works.