I was given the following task to update the Charity Page on the River Island website. The graphics team provided me with the proposed design layout for the set page. The key features which were included in the design was a navigation bar image built primarily upon the use of anchor tags, image links, paddings, margins and additionally the placement of an inbuilt navigation system, linked to the River Island About Us section. The provided graphic incorporates both a desktop and mobile version of the page site design. In differentiating the two I set 3 media queries one for desktop, one for ipad and one for mobile within my CSS. Below is the following graphic image:
Below you can see screenshots of both my html and css for the aforementioned page:
The final page was tested on staging the River Island main server, before being made live. The following images are screenshots of the page in desktop, ipad and mobile view.