ARTM2210 Intro to Web Design

Just another Intro to… site

Final Review

I have chosen to evaluate my single-page fable website, The Nightingale. I will review what works very well for it and where it could use improvement in the following areas:

Balance

Unity

Emphasis

Layout

Color

Texture

Navigation

I chose this page rather than my group’s shoe page because I feel it better represents each of those elements, yet at the same time also would benefit from improvement in each area more than the shoe page.

On the topic of balance, the primary elements to examine are the header/navigation bar content and the main page content. In both, I have very similar positive and negative comments. Without consideration for window size changes, simply looking at the content within the bounds of where the content appears, both exhibit good visual balance. The way that I have the images branching off from the tree on alternating sides and then the final image centered on the base of the tree gives the overall image of the tree and the page a quite equally weighted balance. Similarly, the content of the header/navigation bar is balanced well, with the story name and the nightingale images and navigation link larger and more prominent to either side of the smaller, duller author/source credit, “Stories from Hans Christian Andersen,” which is approximately at the center, right above the tree’s center. But, issues begin to arise when the window width is changed. Both the header/navigation bar content and the main page content (tree, images, clouds) stay exactly where they are when the window is made thinner or wider. I am fine with that when it comes to thinning the window – I would rather have the content stay where it is and be cut off by a thinning window than to warp the scale to fit all the content, in smaller form, into the thinner window. But, I would like the content to maintain a general centered orientation when the window is widened, rather than staying off to the one side. I now know better how to achieve that, as we applied that technique to our shoe page and it worked very well.

On the topics of unity and emphasis, I am overall very pleased with the page. In exploring those, I will also make notes on color and layout. The overall color scheme of the page is unifying – in both the header/navigation bar and the main page area, blues, greys, black, white, and to a lesser degree yellows and greens compose the whole color scheme. I am very happy with my decision to make blue the royal color of the emperor’s domain, because it unifies the images with the sky background of the page and also is very well complimented by the browns, greys, and white that I chose for much of the rest of the color scheme, as well as the less common yellows, greens, and reds. The choices of colors also helped to establish an emphasis system within the images to simplify the scenes and make roles very understandable – blues for people associated with the royals (with a shade system, actually – darker for higher rank, lighter for lower), greys for the working men of the kingdom, yellow emphasizing power/acclaim (crown, the perch from which the nightingales sing), red for the fake nightingale (the only bright red thing in the whole page, pointing out its unnaturalness) and the strong contrast between the very green and blue and lively outside world where the nightingale is free and happy and the very grey palace interior and grey bars of the birdcage, both places where the nightingale feels trapped and unhappy. Going back to the layout of the images, branching off of the central tree, alternating sides with each paragraph of text, I feel it lends a lot to the unified feeling of the page. It sets a pattern which helps the eye navigate the page, and the placement I chose for each originating branch was carefully calculated – just slightly below the end of its corresponding block of text, so upon finishing reading the text, their eye will be led right to the proper image. I did have some issues with drawing the emperor so many times, so many of the images of him don’t look as much like others as I would like, so, for me, that shakes the unity of the images a little.

On the topic of texture, I made a few good uses of it, but there is more I would like to do. I like the way the clouds look, though I had originally designed some more attractive and realistic ones, with some very attractive shade variation (kind of swirls of darker and lighter colors, that gave them more of a puffy depth) and I wish I had used those instead. Within the images, I mostly used solid colors, but I like the texture where I incorporated it – in the nightingale’s feathers, emperor’s hair, the fake nightingale’s jeweled body details, and the bushes in the second image. It would have helped to texture the tree, but I fear it would make the text difficult to read, so it is something I would probably toy with to try to find a subtle texture for. Texture in the sky and in the header/navigation bar would also make the page look better overall, but the current appearance works well, too. My use of mostly solid colors in the images somewhat allowed me to use mostly solid colors for the other page elements, so that it is all in a similar style. I am also very happy with my text choice, especially in the title, where it is large enough that the chalk-y texture begins to show more. In this situation, it has a kind of scratchy look, which works with the nature-based themes of the story and page design.

Finally, I would like to note that I am very happy with my navigation. As I said before, the layout of the text and images guides the eye in a very smooth, natural way as the viewer scrolls down the page. The only click-based navigation I have is the gradual scroll to top and scroll to bottom buttons. The gradual animation is more aesthetically pleasing than a jarring instant jump and I feel that the length of the page demanded I provide a button to scroll to the top. The scroll to bottom button is more to provide a quick overview of the page, so if someone just wants to check it out before reading through the whole story, they can watch the images go by and get a sense for page in a few seconds.

There are tweaks I would like to make and things I would like to add, but I am overall thrilled with the appearance and functionality of this page.