As a member of the development team, backend (PHP, JS, etc) knowledge is a given. However, it’s equally important to have adequate proficiency with frontend development (HTML, CSS, SASS, etc).
Challenge: Design to Landing Page
Overview:
You’ll create a simple landing page (.html is fine) that follows the design provided.
Specifications:
- Create an HTML landing page from our Figma design.
- Use modern markup and styling techniques/methods.
- The featured image should play this YouTube video when the play button is clicked. How you implement that is up to you!
- The page should be fully responsive – so shift and size down elements as you see fit. We’ll view this in desktop, tablet, and mobile viewports.
- CSS should be written using SASS and both the source and compiled files should be included. Method of compiling (gulp, grunt, etc) is up to you.
Notes:
- If you don’t have a Figma account (free), sign up to access the inspector view.
- You can download and use the prepared asset files (images and icons).
- Do not rush! Strive for attention to detail (one of our core values) – we’ll compare the HTML template to the design file provided 🙂
Package the code as a Zip file and upload it to the form below:
