Summary

In this chapter, we developed the portion of a website that is commonly known as Above the Fold, which is the portion that is visible before you scroll the page. We used our design mockups as a valuable reference that guided us in our development. In the process, we covered a lot of important concepts, some of which may have been completely new to you.

We took a look at how we can plan our development by thinking about how to break up our preexisting designs (if available) into boxes of content. Then, we split up the page into two main sections, the navigation menu and the Hero section, starting with the latter.

We explored how to add elements from containers to background images and links. We learned how to style them, add classes to them, and how to lay them out.

We saw the difference between static positioning, relative positioning, and absolute positioning. We then turned our attention to the navigation menu, starting with our breakdown of how to lay out the content...