tips & reminders
A few points to consider and warning of potentially tricky routes ;)
-
choice of text:
don't be tempted to use your favourite song lyric as your selected text. This can be a much more difficult challenge than you are prepared for!
It is incredibly difficult to create a layout for poems and lyrics for an audience which might not be familiar with the rhythm of reading such pieces of literature require. If it's a song you love, you will inadvertently be imagining the audio alongside it, which will mean you will read this text with the melody and flow in your mind. This won't be the case for your readers and your task is to make your chosen text read well and express its message (without additional media, such as music or visuals). -
no images whatsoever!
Your submission can only include images for the project/design planning - the website folder itself is not to include any images, nor link to any online visuals either. -
no icon fonts!
The same applies for icon fonts (which we will talk about soon for other aspects). In the past, some people have tried to out-smart the brief requirements by using font sets which include images - this is not acceptable! ;)
You could use typographical symbols, such as elaborate ampersands, or reference marks if fitting. Any other visual representations should be avoided.
Images for the web
Working with images will be core to your design work. While it'll be fairly easy to put together your ideas as static images for mockups and so on it will be vital to consider carefully how the visuals will be implemented online. This includes the correct size and dimension, the right file formats and an efficient implementation.
Pluralsight offers a good course on images/media and accessibility.
Accessibility: Exploring Images and Media

- JPEGmini
- image optimisation tool • jpg
- by Beamr
- PC / MAC

- RIOT
- image optimisation tool • jpg / gif / png
- by RIOT
- PC / MAC

- imageOptim
- image optimisation tool • jpg / gif / png
- by Kornel Lesiński
- MAC

- ImageAlpha
- image optimisation tool • png
- by Kornel Lesiński
- MAC

- SVGOMG
- SVG optimisation tool • svg
- by Jake Archibald
- online