BBC Website
The BBC website has quite an unconventional layout, so I was interested to see hierarchy in terms of the type. The website is mainly black and white, with the occasional bit of coloured text, so there is not much to distract the eye from the type.
The first noticeable piece of type is the date. It is considerably larger than the rest of the text and is a very legible, thin, sans-serif typeface. We are used to reading top left across, so this could also be a major factor as to why this is the first piece of type seen.
The next piece for type I saw was the BBC logo. This was due to it's placement directly above the date, and also it's unique white text on a black background that really makes it stand out.
The 3rd piece of type I noticed was the weather, but soon realised that what had actually lead my eye to it was the thick black line stroke of the cloud icon.
I seemed to be working my way through the type in order of scale. The next pieces of text my eyes were eased to were the headers for each story, which are about double the scale of the body text.
Once I had glanced over the story headers, my eyes were drawn to the rest of the smaller text, but now working my way through in order of line stroke. The blue coloured BBC now drew my eye towards in before the main menu.
I then glanced briefly at the main menu as it was the same line weight and size.
My eyes were then led towards the smaller text, first at the red text, than clearly stands out more and then the rest.
Smash Magazine Website
Smashing Magazines website also has a mainly white and grey background, but it also features a large amount of bright and colourful adverts on the right hand side, which really distracts the eye from the actual website content.
The first thing that caught my eye on this website was the title to each post. The text is considerably larger, has a thicker line weight, is in black (whereas a lot of the other text is grey) and it is a very legible font.
Next, my eye was drawn briefly to the sidebar because of the contrast in grey/black and thick/thin text.
I would have though that the logo/title of the website would be the first thing that I would notice, but the logo here is situated right the the top left corner and doesn't have much impact except for the colour of 'smashing'. I believe the logo should be considerably larger, or alt east placed in a more noticeable area; possibly the centre if the layout was rearranged.
Although these adverts are bright and colourful I tended to not let them distract my eye because I kew that because they we over to the right that they were most probably adverts. There are a few diferent types of text, but the one that caught my eye the most was the 'amazing web templates' as they are a similar size and same colour as the post titles.
Lastly I found that the smaller text stood out more, purely because of the blue highlighted text.
Creative Bloq Website
I chose the Creative Bloq website because it is very clean and simple and I am curious to see how it will compare to the others.
Unlike the 'Smashing Magazine' logo, the Creative Bloq logo carries a lot of impact and stands out instantly on the website because of its thick block text and lack of negative space in-between letters. From a distance it would still stand out. In comparison to the rest of the text, it is a chunky black rectangle.
Just as one would read a book, my eyes read along the menu to the right until I found the second largest piece of text; 'Magazine Store'
I then found that I looked at other pieces of text that were the same as this thick, sans-serif font.
The smallest text on the page was the last thing I looked at.
I then scrolled down to see how the type hierarchy changed.
The article titles were what stood out most. They have a thick line weight and not much negative space, similar to the logo.
The trending the today section used the same font as the article titles. This forced my eye to look over at it briefly.
Lastly I noticed the orange type which categorised the title. I found that rather than standing out from the rest of the type because it was diferent, it wasn't as noticeable as the rest of the type because it lacked the black and white contrast that the rest of the type had.
Channel 4 News
I chose the channel 4 news website as it uses a considerably diferent colour scheme to the other websites and I wanted to see how colour could effect the type hierarchy.
The 4 News logo stands out first because it is in the top left and at least twice as large as the rest of the type on the page.
Then the purple on white text.
The article title is what caught my eye next, despite it being larger than previous text.
Tying colour theory into this as well, it was interesting the see how the hierarchy changed when I made the page black and white in Photoshop. The order seems to change in order of scale rather than making links between pieces of type that are the same colour.
When scrolling down the website, the hierarchy changes slightly, although colour still has a major factor in the order it is read.
Next my eye was drawn to the smaller coloured text and the mini paragraphs that sat underneath them
Lastly my eye was drawn to the coloured type on the right hand side.
Sky News Website
I have chosen the Sky News website to look at as it has a very dark background and I wanted toe see how the type hierarchy is effected by this.
The black 'sky' and 'hd' led me to look for more black text. The story title is what caught my next as it is the largest boac text on the page.
After looking at the menu I seemed to look the highlights box as it was the most similar text to the menu (white on black).
