Typography is the art and technique of designing and arrange type that will make the written language legible, readable and appealing when displayed. This allows the type to have its own character, tone and can be relevant to the audience of the piece. There are many different elements of type design that factor into this, point size, line length, line spacing, letter spacing and height. These can all be shown on the image below.
I took some time to look into typefaces that are used online, I looked at rang of different websites all with different purposes, and therefore the typeface used would have been chosen specifically to empathise the tone of that website. However I focused on the elements that we could use across our own designs, such as composition, fonts, colours and shapes used.
Contrasting colours:
This website was interesting as it looks to be more text based with no images on this first element of the home page, they have compensated for this by using big blocks of contrasting colours, the dark and the light compliment one another rather than clash and also the font being the opposite font on each side makes it clear and bold to read and it then therefore makes it more interesting to look at. As you may find that the user may not spend very long on the site if there is not much visually to keep their attention, therefore the bold style of the colour is visually effective. This will inspire me to make sure any of the colours that we use for the fonts have to be bold and not clash with the background.
Bold white
This typeface I really like, it is a clear and elegant looking font, which I think looks very professional. Also the choice for it to be white makes it stand out and pop against the darker photograph in the background. Also the logo at the top of the page is white, therefore the colours across the site correspond with that and this is something I can use in our design as the Andrew Grant colours are white and red and we could use this in the type designs across the website.
Not as clear
This typeface is a more stylistic font this makes the text look different to other websites and therefore may drawn to read what it says compared to the rest of the text on the page. However I think this font with the transparent middle is much less clear to read on the photograph chosen in the background. This shows that the typeface has to fit with what the background is for it to be effective, as this font may have been much clearer for the user to read on a different background and therefore it would be more effective.
Composition
The composition of the typeface is also very important, I think this text on the website on the left is placed to draw your eye across the page as it works well with the image used. The composition of the image draws the eyesight from the top of the page, following her arm to the text then you take in the bottom half of the website. This is a really useful tool as the text is complimenting the image and the image also compliments the text, which informs us that the composition of the type is very important for keeping the flow of the page and also drawing the users attention where you want it to be.
Interactive
This typeface stood out from the rest as it was interactive, there was movement within the text, this one had a wave of movement on the page. This could be used as a tool to keep the users attention and keep them on the page, however due to being a wave movement it may be a little sickening and may actually put people off spending too long looking at it. Therefore I think in our own designs we should have other interactive elements such as hover opacities and changing photos and videos rather than movement within the text itself.
Imagery
This typeface is really interesting, they have used imagery within the text itself, this is very visually pleasing for the audience. It adds a different element to the website that other sites would not have, also the bright colours contrast against the white background so it is also clear and easy to read.
Creative
The typeface used in this website is similar to one of the typefaces above that I have spoke about however this time it is used correctly and is on a black background and therefore is much clearer and easier to read. However this is a much more creative typeface design as it is vertical on the screen, this is different to what you see on other websites, although it may make it more difficult to read as it is not on a natural angle, it can be used as a tool to bring the viewers eyes down the screen as the text is produced from the bottom of the screen. This shows that we don't have to use the generic way to present the text on a page, you can be creative in order for it to be effective to what you are trying to portray on the site.
Shape
Similarly to the one above this typeface shows that you don't have to be conventional with the text. This typeface is used to empathise the shape of the image. It makes it more interesting to look at and will draw attention. This may be useful for a more interactive website, however I'm not sure how this would be as effective with a digital magazine as it may draw away from the fact it is a magazine.
Typeface Designs:
These are all designs I have looked into for our digital magazine, I have looked at a range of different fonts in order to determine which would work the best with the website, brand and content by using the working title that Andrew Grant had given us for the digital magazine.
The first font is a bold font, I have tested it in all three of the Andrew Grant colours, I don't think this one would be as suitable for the site as it is quite different to the fonts that are used in their branding and it may be too bold and harsh. However as you can see it is clear and very easy to read in all three colours.
The second font I have experimented with I really like, it is a clear and attractive font, but it is a thinner design and not as bold as the pervious and therefore it looks more professional and sophisticated, which is the tone Andrew Grant wanted for the magazine. I chose to play around with the AG in this typeface as that is the meaning behind the title, as it stands for Andrew Grant, so therefore I tried it in the brands colour red. I think this makes it more stylistic and it is more obvious who created the magazine. I also tried it the third time in capitol letters, however this does not look much different from the rest of the text so does not have the effect that I desired it to have.
This third design is my favourite of the fonts I have looked as because it has all the professionalism and sophistication that the pervious typeface had but the letters have a more curved shape, making them friendlier looking and less like a business font, which relates to Andrew Grant wishing the digital magazine to be welcoming. I also like the red letters in capitol format in this design as it makes them pop and stand out and therefore they are serving their propose of representing the brand and company without the font being too overbaring and powerful like the bold fonts are. This font could also work for the other text on the page and not just the title making a consistent design.
The next font is very bold, but like the pervious font it has more curvature to the letters making them more friendly looking and therefore it create more a positive message and not the negative or warning message that a bold text may represent in society. However when you do add the red lettering into this design it does reflect the danger or warning signs that you might see or be reminded of and therefore I do not think this would be a good choice for the digital magazine.
This font is very different to the rest as it is bold and unique, I think this font would be really useful to create a brand or magazine identify as it is the type of font that would get recognised on any format and then be referred back to where someone may have seen it and therefore can be related to the magazine. However the client wanted the font to be on brand and this font is a big step away from that and therefore I don't believe would be any good for the digital magazine.
The final font design is also very stylistically different to the rest I have looked at, as I had not experimented with the more italic font, this font did not work with the red lettering being in capital letters and it broke up the word too much and it looks more like three separate words. However I do like the middle design, but I think the italic font may reduce the reading audience of the digital magazine, as from first impression this is a very feminine font, and therefore some may assume the content of the magazine may be tailored towards women, which is not true, so therefore this font wouldn't be good to use, it would need to a more gender neutral font design such as the third one I have designed.