
This weeks learning was all about HTML. Looking at its history, its purpose and its format. The outcome is an understanding of how to write code in HTML, using the correct elements and semantic markup. We also focused on the importance of file structuring and how to organise them well.
Anatomy of a webpage: Structure
HTML is used to create the structure of a document and provides meaning to content. It uses elements formed of tags & attributes, describe the structure of a page and is not to be used for presentation.
Linking pages for navigation
As we are creating multiple web pages that need to link together, understanding multiple ways of linking to other pages – both internally & externally.


Semantic Markup
Semantic markup gives the content meaning & logical structure.

Structuring the content correctly – using heading elements where appropriate and considering which heading type to use such as in the example above, using<h1> for the the title “Keys” and <h2> for subtitles “material” and “shape”.
File structuring
Keeping files well organised is super important! Using folders to sort files, using good file and folder names that are descriptive and identifiable but consise.
Folders! Folders! Folders!

We can use our folders to sort our files – by categorising the content within them. For example by categorising projects, then file types within the project like ‘images’.
File names


Good file names make work easier! Having a systematic naming approach such as ‘content-detail.extention’ i.e “natwest-homepage.jpg”
Some general naming conventions that are good to follow are:
- all lowecase letters
- no use of spaces but dash (-) or underscore (_) instead
- use numbers but no special characters (i.e / & , )
Writing code
Writing up my code for my three designed objects, I found it helpful to not only to have the content (that we produced for last weeks classes) but also visualise the content (don’t worry I did not use HTML for presentstion!).



Sources:
https://hivo.co/blog/the-art-of-naming-best-practices-for-file-naming
https://designforweb.org/chapter10-workflow.html
HTML & CSS by Jon Duckett
Leave a Reply