Monday, February 25, 2013

More Design: Creating the Homepage and Song Display

Now that the sneak-peek reveal of Songs of the Victorians is two weeks from today (which I discussed in last week's post), I'm focusing on designing the homepage and the song display page.  I received lots of positive feedback from the "Coming Soon" page (check out this post to see how and why I made it) , and I knew I wanted it to somehow be a permanent part of the site.  I finally found a way! I've put the navbar through the center of the image so users can see how to navigate to other pages but also still read the imitation sheet music cover and understand its thematic purpose:


I'll replace the "coming soon" text with "Available Now" or something like it.  Victorian sheet music often put the location of the first performance in that spot, so if anyone has suggestions on what would be better suited to this spot once the site is live, I'd love to hear from you!

I've spent about a month wrestling with how best to display the songs.  I needed a design that would allow me to easily add more songs in the future without ruining the look, and I needed to include the song's title and composer as well as the title and author of the poem it uses as lyrics.  I also needed a space to include links to the archive and analysis pages for each song, since those pages are the central focus of the project.  This is the design I've decided to use:



As you can see, the logo portion of the homepage still appears at the top of the page to tie the site together.  Each song entry is clearly separated from the others by a dotted line, but the side-by-side set up groups them together.  Each entry also contains all the information I mentioned earlier, and the entry for Caroline Norton's "Juanita," which will be live on March 11th, includes links to the archive and analysis pages.  I'm still trying to figure out how to style those links:  should they be in a different color? Should each one be a button? Should they be underlined?  I'd appreciate any suggestions you might have!

For next week, I need to decide on whether the archive and analysis pages should include the large logo like the image up above, or if it should change and use the smaller logo with the tagline (see this post for the other design option), and then create the page accordingly.  I'll also be writing the text of the analysis page in TEI.  Stay tuned for these updates!

1 comment: