Final Assignment for the HTML I Course
For this assignment, I had to produce a mockup of an online magazine site. This exercise needed to have at least four pages and be based on a grid I made. I could not use Bootstrap, or any other prebuilt grid system.
Project Content
For the project I designed a static website using only HTML, CSS and some javascript for animation and effects. The final project consisted of:
the landing page of the magazine containing the logo and teaser descriptions of the articles with pictures
one full article page with at least five paragraphs of real text (no lorem ipsum), two headings, and two images
the contact page form
the 404 error page
the sources page for the images used in the web site
Theme Chosen
I decided to create a fictional yoga magazine website.
Design
Typography
Brand, Navigation, Titles and Hyperlinks:
Work Sans
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890 !@#$%^*()-+=
Main Content:
Libre Baskerville
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890 !@#$%^*()-+=
Collour Palette
Orange
#D6511B
R:214 G:81 B:27
Brown
#0F3305
R:86 G:61 B:47
Light pink
#F3EDED
R:243 G:237 B:237
Screenshots
Main website view
Article page
Contact form
404 error page