Now I have all my content mostly organised I've started by playing about with my theme which comes with a few useful widgets that could come in useful later on.
As a starting point I decided to get my main parallax logo header, basic colour scheme, navigation and font choices set in order to create my overall site style. I ended up setting my actual site logo as the logo on the theme settings (rather than as a header image which was one of the other options) because it worked better when made responsive.
I set my navigation as a static element (so it moved when scrolled down and then stuck to the top after the header) and altered the navigation font to my main logo font Amatic sc (a google font that came with my theme and one I have researched previously). After some brief experimentation I opted not to use a block highlight colour on the navigation, instead I altered the text highlight colour- the main set navigation text colour is my fuchsia tone which when hovered over and clicked on changed to an electric blue. Whilst I have a whole set of colours that will work within my theme I plan on using these two along with black and white as my main colour scheme.
I did briefly experiment with some body text fonts- after a quick experiment I found that the Amatic font didn't work well as body text (visually it looked too much and when using large amounts of text it wasn't very easy to read which effects the overall usability of my site). I instead decided to play around with some more google fonts that I could use for body text. I stumbled upon the two below- obviously I needed to see how they would look visually with my main heading font- but they also needed to be nice and legible in order to ensure my overall site usability. Stylistically I found that a handwritten font best matched the Amatic font but in terms of legibility the first font seen below was a little too thin and its vowels were little too cramped looking for my liking.
The Covered By Your Grace font below is much fatter and though it matches visually I also think its fairly easy to read so for this reason this is the font I plan on using for my body text.
Below is my my header/logo image- this is present on all of my pages (theres no way of changing this if I have it as a header which makes it smaller on all the other pages excluding the home it doesn't work responsively and cuts off half the picture I have no knowledge of code in order to rectify this) so it has to stay as the large top page filler- having said this - it does help with my sites overall consistency and helps to really hammer home my overall branding.
My Home page layout:
Starts with my main logo, when you scroll up the navigation sticks to the header, rest of page consists of main heading title, image slider, and then small paragraph of text.
When designing my home page I always knew that it was going to be the most simple- I took a lot of inspiration from the Ymuno and Reading festival sites both of which kept their home pages very image based. From a users perspective I felt that the home page needed to allude to some of the acts (hence the image slider) and briefly describe a bit about the festival- since we also have to include an about page I opted to put a very brief welcome to the festival and its small history paragraph as my text.
I placed the image slider above the text in the centre of the page because I feel that thats what most users are going to look for and then framed it with my small paragraph of text. Overall very happy with my home page so far!
No comments:
Post a Comment