What I learned this week… #001

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

Your email address will not be published. Required fields are marked *