The client provides the goals and content. The content determines the layout. It is useful to make a content inventory.
The viewport is the visible rectangle within the browser window. This is the part that you can see. The actual document may extend beyond the viewport width and require scrollbars to view the rest of the document.
There are two main css ways of creating grids: flexbox and css Grid. Flexbox is one dimensional: you may lay out items horizontally or vertically. Css Grid is two dimensional: you lay out items both in columns and rows.
Flexbox works really well with small components like menus. Grid is more for a larger scale layout. They are not mutually exclusive.