CSS Qual a melhor forma de fazer campos separados para por informação?

[Impts]

Por exemplo, estilo o dashboard que eu deixei o link abaixo, eu pesquisei por GRID (mas não tenho certeza se é isso), tentei alterar algumas informações com base no que os sites gerava, porém, quando aumentava largura, etc... desconfigurava tudo, qual a melhor forma de fazer o que eu pretendo?

 

encurtador.com.br/juz08

 

Anexei um PDF, em vermelho por exemplo, seria meu menu fixo, em azul, seria as area no qual em cima e baixo são status bar, e no meio, colunas tipo card de produtos.

 

Doc1.pdf

[GabrielSennaMs]

@Impts Esses tutoriais podem te ajudar nisso:

https://www.w3schools.com/howto/howto_js_sidenav.asp,

https://www.w3schools.com/css/css_float.asp,

https://www.w3schools.com/css/css3_flexbox.asp,

https://www.w3schools.com/css/css_rwd_intro.asp