Can you think of an analogy to describe HTML, CSS and the DOM?
How would you describe it to your non-technical friend?

The best analogy I can think of is of a house which was described by the presenter in the Udacity course “Not your typical intro to web development”.

You can think of HTML as being the structure of your house, the foundations, roof, walls and rooms. CSS is the style of your house, the colour of the walls, the carpet and curtains, the layout of where the windows and rooms are etc. You can think of the DOM as a way of viewing the architects and engineers blueprints of the layout and structure of the house, with the interior designers notes and style guides included as well.

What is meant by boxifying design?

It is a way of breaking down the design of a webpage by putting each item into boxes or rectangles. By doing this it makes it easier to structure the layout of your website design. It also helps to identify the layout of how each item on the page should be entered in the HTML in order to keep it neat and tidy.

What is the box model?

This refers to the CSS box model. Where all HTML elements can be thought of as boxes or rectangles. The CSS Box is made up of margins, borders and padding that sits around the content or HTML elements. With the margins on the out side of the box used to put space between the box and the other items on the page, after that it is the border of the box and followed by that is the padding which is added to to create some space between the border box and the content that sits in the inside the box.