First of all, thank you for viewing Shanghai Doll's first premade layout, Deaf to all but the Night Song. This layout was made for Ai's After the Sun Falls layouts contest and it won first place, isn't that great? This is a simple DIV layout that was made in Adobe Photoshop Elements 3.0. Unlike every layout I've made in the past, this one has a super heavy CSS base, no CSS and everything falls apart! Featured is everyone's favorite, humble tengu reporter, Aya Shameimaru from the Touhou STG game series . The image is from Minitokyo and no external resources, minus the image, were used. The title is a slightly modified version of Mystica Lorelei's Imperishable Night theme, Deaf to all but the Song.

Note: Don't worry if you have no idea what I'm talking about.

I was at a complete loss on how to organize everything from the beginning. I usually have some idea but not here. Considering that, I believe this layout came out rather well. I kept the amount of effects I added to a minimum, the image was pretty enough already and I didn't want to make it almost completely unrecognizable. I was going for my own interpretation of a promotional poster, relatively simple design and huge text. The text placement was completely random and so was the bird. See the bird? It's the red clump the text is sitting on. I was making a curvy border for the content but it became a bird. So now, instead of a pointless curvy line, we have Aya racing a bird. It really shouldn't be right beside her though, there's no way a mere bird would be able to keep up with the fastest tengu in all of Gensokyo.

This is just a basic guide that assumes that you know some basic HTML but don't quite know how to go about editing things. If you need additional help, try Googling How to Use a Premade HTML Layout or something more specific to your needs.

• Download and unzip
• Open index.html to edit this page. Additioal pages are made using Save As instead of Save.
  • The effect acheived in the content area will be explained below
• Upload all files to your host's server

As you've noticed, the content is arranged with boxes. This is acheived using the following code. I suggest you use it, the layout isn't as pretty without it. <h1>This is the header,the white text above each box</h1> <div id="box"> Your content would go here. </div> Use this code for every section e.g. the introduction, updates, credits, etc. If this makes no sense, simply take a look at the source. Remember, this only applies to the content, not the navigation.

Important Text Slanty Slanty Underlined Stuff Marked Out Things ^{Add Little Notes}

Questions, comments, etc

Blockquote:

The text over the bird is from Aya's official profile in Phantasmagoria of Flower View. The text for the input and textarea backgrounds are the lyrics to the Higurashi no Naku Koro ni ending, Why or Why Not.

Site © You
Layout © Arisu of Shanghai Doll
Image © KEI, obtained from Minitokyo
Aya Shameimaru, Phantasmagoria of Flower View, and Touhou © ZUN