Week 4 – IxD301 – Rerun of HTML and CSS

Week 4 – IxD301

Rerun of HTML and CSS

Today we went through the basics of HTMLs and CSSs, something that we covered during first year. This rerun has been really useful and refreshed my memory on all of the things we learnt before. This year however, we have focused our interest a lot more towards Responsive Web Design. This basically means that our site/app will scale to any device which it is being used on.

Different elements of Responsive Web Design include…

  • Controlling the Viewport
  • Flexible Grids
  • Construct Suitable breakpoints

This is something new that I am going to have to learn to use whenever I am developing my site. We have been advised to develop our portfolio site on Webflow, something that I have never used before. I am excited to see how I can adapt to this new software and especially challenge myself to design responsively.

The slide deck today, basically ran through things such as links, images, buttons, lists etc. in HTML. We also learnt about attributes and blockquotes. It was also interesting to recap on different image types such as JPGs, PNGs, SVGs and GIFs. This will be very useful when it comes to designing my webpage, as I want to make sure my images show up in the best quality possible.

A run through CSS was also very useful as it was something that took me a while to get used to last year, especially when it comes to positioning and padding etc.

Kyle has also left references to multiple sources of HTML and CSS guides online, which is something that really helped me to learn the basics last year. These guides really gave me the confidence to jump straight in and learn. The best thing about web design is that everything is always reversible. Mistakes are not the end of the world, in fact, they are the best way to learn. Like I said before, for my portfolio site I have decided to use Webflow to create my site. It will be a lot quicker and more convenient than using eg. GitHub and Brackets. I also feel that Webflow will allow me to get my desired layout more easily.

Leave a Reply