Greetings Web Devs,
Iam studying for more than a year about web developing , so far i can say that i feel comfortable with HTML5 CSS3 and JS . I recently realize that iam getting confused with a website layout . Iam gonna post couple of images to explain to you what i meant .
Mainly iam not sure which is the best way to layout and how to define how many columns and rows should i use to design a template. Lets say for the sake of this example iam gonna use an irrelevant website ( http://themes.semicolonweb.com/html/canvas/one-page/index.html ) . So i want to practice my css grid skills . When i see a template iam not sure how to divide it so i can design the layout like .
So what determine how you should split the website so you can easily design the layout . So for this example we could split the layout into 12 columns and design it like this pic (https://prnt.sc/j3w64b ) .
When i first saw the template and i wanna rebuild it to improve my css grid skills i came with this https://prnt.sc/j3w6n5 . I used only rows and i use CSS GRID inside the rows to divide them as small grids. But my main layout was only rows and i didnt use any column . I really struggle to understand which is the best way , and how to idientify how you should grid a template layout .
Thank you in advance .