The third and final web development exercise (at least for now) features challenges that include embedded fonts, captioned images, backgrounds, and a pullquote. The body copy of the exercise is a short essay I wrote on the possibilities of discovering extraterrestrial life within our own solar system, updated in late December 2013 to include recent discoveries on Europa and Mars.
This exercise requires a little more work than previous examples, so you have two hours to complete it. The page is set in Museo Sans by Jos Buivenga, which I have provided in 500 weight for normal and italic in OTF format.
You will have to convert the typeface into webfont formats* and embed it on the page. You will also have to edit a NASA image of Mars, using PhotoShop or another bitmap editor, to use behind the main heading.
Download the source files, which include the original essay in Microsoft Word format, a JPEG mockup of the final page, the original images, and Museo Sans. Along with recreating the mockup, the exercise has the following goals:
- Add appropriate markup around the term HARPS.
- Add the form at the bottom of the essay.
- Ensure that the result is valid HTML.
- Make the page completely responsive.
The form is deliberately not shown in the mockup: you will have to decide on the appropriate inputs to use. You can employ any tools you wish to complete the page.
* A greater range of Museo Sans is available from Typekit, which offers the typeface as part of a free trial. If you’re using Adobe Creative Cloud, you have free access to Typekit.
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.