HTML and CSS Reference
The naming was done fairly simple: when you did
the analysis of this design, there was a top bar part
of Monoplate , so that takes the #top container; the
header has the #header and so on.
Usually the containers are named after what they
represent or contain (e.g. div.icons for the top bar's right
icons ), but you can choose and develop your own
personal system for naming.
Or you can find existing systems.
Getting used to a naming system improves your
converting skills. You will work faster each time.
It gives you a more accelerated rate of coding any
HTML/CSS and it also improves the maintainance
of your projects.