Introduction
In this project you’ll clone the website of one of the most design-forward companies in the world. It’s not a very complex site but it uses background photos well and the navbar at the top contains a gradient that you should be able to mimic.
Assignment
- Take a close look at the screenshot below which is taken from an old version of the Apple website:
-
Create a new HTML document and download the media assets that you will use from here.
-
Think about all the elements on the page and how they are grouped together.
-
Lay out the basic structure of the page using empty semantic HTML elements that are appropriately sized and positioned.
-
Set up the top navigation bar. How is that gradient achieved?
-
Set up the main background image.
-
Fill in and position the additional sections. Don’t worry about enclosing every paragraph of text in
<p>tags. -
Push your solution to a private Github repo and submit the URL to the Quiz below.
Additional Resources
- Suggest some in the comments below!
LOOKING FOR HELP?
When looking for help, try doing so in the following order:
- Did you try everything you could?
- Did you read the documentation?
- Did you Google for it?
- Did you post your question on Slack/Forum?
- Did you ask your fellow students for help?
- Did you ask your Mentors for help?
- Did you leave a comment on the comments section of this page?
- Did you ask your Instructor for help?
- Did you arrange and appointment with your instructor using Calendly? Visit this URL and set up an appointment: https://calendly.com/kostasx
- Is it urgent? Did you try reaching him on Slack
UPDATED: 30.10.2020
