Tips on html5 structure?

Question

Hey guys,
I'm new to html and wanted to try out some stuff. But I have no idea on how to start things in an organized way.
How would you recommend to start and progress on the structure?
I have tried by the basic sections, and then move on to the details. But it doesn't feel like I'm being either organized or productive.
It seems like I'm losing a lot of time in things that are not really relevant to the project I'm trying to do.

Answer 1

Hi Lethicia Severo ,
When you say you want to try some stuff, would you tell more about what you're trying to do ?
You can start by looking here, on sololearn, in the sololearner's code.
Find one, quite simple which is close to what you'd like to do.
Then go and review the code line by line and try to understand how it is done,why that tags...
If it's about designing your page, maybe you could first, before coding, make a mock on paper, draw on it every different section, depending on their purpose and then decide which tag to apply to them (section, article, header, nav, div...), then each section will have content, so you can repeat that step again with every section, but at one point you'll need to know more about CSS display properties (flex and grid system) and also position property to really have the rendering the way you'd like.
There are also some tools to help achieve that :

https://bashooka.com/coding/10-useful-tools-to-create-website-from-mockup/

https://codemyui.com/

Answer 2

Practice with codes.
Use these code to remember HTML.
Do the curriculum lesson by lesson, don’t skip lessons, even if you think you know them.
Use comments in your code
Hope this helps :)
Feel free to ask questions!

Answer 3

Thanks Emmanuel, the article has helped a lot.
I was trying to apply the lessons on a simple table that latter became a survey sheet. But it seemed messy and confusing, pretty sure it was because I didn't know what to expect for a result. So I was only throwing more things there to see what would happen :v

Looking to some other projects it got quite clear that I can't put everything on a single one... Thanks man!

Answer 4

You're welcome Lethicia Severo ,
Happy the post helped clarified things.
Once you'll finished the CSS course, you'll be provided with more tools and flexibility.
I know tables are still useful but you can check also that article for information, it might give you ideas and alternative.

https://css-tricks.com/snippets/css/complete-guide-grid/

Happy coding 🙂