Browser Test Report

In this post, I’ll be using two browsers, Safari and Chrome to test my JavaScript and jQuery galleries. The point of this is to look for any inconsistencies across two main browsers.

Google Chrome:
v 37.0.2062.94 (up to date as at 29/08/2014 @9:35pm) Screen Shot 2014-08-29 at 9.34.02 pm


v 7.0.6 (up to date as at 29/08/2014 @9:35pm)

Screen Shot 2014-08-29 at 9.37.25 pm

JavaScript Gallery

Tested in Google Chrome

Screen Shot 2014-08-29 at 9.43.23 pm


Tested in Safari

Screen Shot 2014-08-29 at 9.46.37 pm


The two are strikingly similar, something I find different is the way that the images are rendered. The images seem a little ‘out of focus’ and they almost seem a different size. I feel like I’ve been staring at the screen for so long and I could be losing my mind. Something just doesn’t seem right with Safari. Chrome renders the images more nicely.
(Side note) I’ve just noticed my divs for the thumbnails have moved slightly I will fix these before submission.

Whether they’re rendered different or exactly the same, I still prefer Chrome. However, if I’m honest, I cannot spot any obvious difference.

jQuery Gallery

Tested in Chrome

Screen Shot 2014-08-29 at 9.58.49 pm

Tested in Safari

Screen Shot 2014-08-29 at 9.57.06 pm


The differences are small again. Here there is a slight deviation color/saturation of the main image, and the thumbnails are once again rendered slightly differently. Also, if I line the top of the webpages up, Safari is about 20px lower than Chrome. I am really unsure of why this is but it is.  The fonts render pretty much exactly the same in both galleries. The effects seem to all run exactly the same (if clicked in sync).

Other than these aspects. I can’t see any obvious difference in the JavaScript Gallery or the jQuery gallery.


Browser Test Report

Browser Specifications:

chrome explorer

Computer Specifications:


Internet Explorer: Fixed Layout




Chrome: Fixed Layout






BTR: Chrome vs Internet Explorer, Fixed Layout: No apparent inconsistencies, apart from a small issue with the footer moving in Internet explorer (as below [top chrome, bottom Internet Explorer]). I am unsure of what has caused this however it is the only inconstancy across the whole fixed webpage. Chrome seems to refresh faster than Internet Explorer.






Internet Explorer: Fluid Layout


Chrome: Fluid Layout


BTR: Chrome vs Internet Explorer, Fixed Layout: No obvious differences in webpage. Pages scroll the same and are saturated similarly (if not identical). Browsers both re-size at a similar speed and break at the same spot. Chrome however seems to refresh the page quicker than Internet Explorer. 


Concept Statement

Subject Area:

Hand-in-hand with the beginning of the university year comes, the need for poor, returning students to sell-on their old study books. If not retired to the bookshelf, these artefacts become a rather difficult item to spark interest in other than “lowest price buy now”. While trying to sell my Interpersonal Communications book for the second year in a row, I thought to myself, “maybe AUT should just offer a book store that buys and sells students text books”. This thought lead me to the branding of my webpage, “The Bookshelf”.

In a nutshell, my themes for the exemplar website was based around this idea of a website dedicated to selling on old textbooks. 


The style of my webpages could be called ‘minimalism’, however I’ve referred to it many times in posts as ‘minimalism, almost’. The colours are mostly block colours and block shapes are boldly defined with no drop-shadows, inner-shading and/or curvature. My colour pallet could be best described as ‘natural’, however used in a very unnatural way, (without shading) simple. My font choice is easily rationalised as “to look like a page from a book”. Within my coding I made the line-height drastic to emphasise the space between the lines of text to make it feel more like a physical page from a book. The choice of font is also serif, as it captures this idea more so than a san-serif font could. My illustrations are composited in such a way that makes it look as if the viewer is looking straight at a bookshelf. The background is textured to look like wallpaper and shelves are placed upon the page to make the background look like a wall. Books are then stacked on these shelves, which provided the framework for the paragraphs to sit underneath nicely. There are also other assets on the wall which make it feel a little more homely such as a 21st key and a fireplace at the bottom to enhance this feeling.