Website | Wong

Design Strategy
    For my design strategy, I wanted to make a website that was both pleasing to look at, but easy enough for someone in elementary school to use. I’m not used to making websites through Photoshop – I prefer using Dreamweaver and actually writing out the HTML for the website to design it. But overall this was a great experience.
    For the banner on top, I wanted to make the title look like a book, but I think it looks more like a random blue rectangle. I was trying to figure out how to make either a gradient or a silver/gold color but overall I think I knew it would be difficult to make it look like a book’s spine. I also made the navigation bar horizontal instead of vertical because I knew I wanted to have drop down menus, and a horizontal bar looks cleaner than a vertical bar (for my purposes).
    I used elements from my poster project for the homepage, like my “Book America” and I redid the “Cat in the Hat” ribbon, so it had the allusion of having movement and being more flowing and less stiff. For the buttons in my navigation bar, I added the book images because the event is National Read Across America Day, which happened on March 2, Dr. Seuss’ birthday. This time, I didn’t focus on the Dr. Seuss aspect because it really is hard to design without running into copyright issues. But I chose to have an open book when the links aren’t clicked, and to have a book flipping pages when they are clicked. I chose to have a book flipping pages instead of a closed book because each time I designed a closed book, it seemed more like a rectangle than a book.
    I also added a picture of children reading for the other pages, as well as a stack of books because I thought that it added a nice touch to the website. Users could also scroll down for some of the pages. For the drop down menus, the link that is highlighted in a lighter color is the page that the user is at, so for “ideas,” the user is at the “elementary schools” page. I also kept the same frame for all of the pages because it made the website seem cleaner and more accessible and usable for users. In terms of hierarchy, I tried to make the baby blue stand out the most so that it would be what users saw first. I also made the books on the bottom large so that users would look at that, and then see the text next to the books and read the information given.

Choice of Typefaces
I chose to use Apple Casual for the homepage because I liked the playfulness of the font, and also because it was what I used for the poster project. I chose to use Chalkduster because it was also a fun font, and I thought it was appropriate because this website focused on students. I chose to use Georgia for the main text because it was a nice and clean serif font, but still playful enough to complement the other fonts I used. And Georgia is also very easy to read.

Color
I originally wanted to use a Red-White-Blue scheme because the event is Read Across America, but then I thought it would be too cliché. So I chose to do a red and blue scheme, and add images. I also wanted to do a red and white scheme for Dr. Seuss, but when I left the background white, the website seemed a little too boring – especially since it was more of an informative website that linked to pages that had materials that could be used or pages with more information about the organizations involved. Even when I added the graphics, the white seemed to be too boring so I made the background a baby blue to complement the navy blue I used for the header and the footer. The RBG colors can be seen on the markups.

Images
Most of the images used were found on Google Images or on the NEA Read Across America website. All of the information used was also taken from either the Read Across America website or from my own information – the Onondaga County Literary Coalition was a client of Hill Communications, Newhouse’s PR firm, and I was a member of the team in charge of the client. The scrollbar was created from making a screenshot of my current screen and then cutting & pasting together parts of a scrollbar into Photoshop.