Week 2: Developments — WebDev

Day 6 [230522]

I did a simple prototype of my webpage and created nice containers for the top half of my webpage. This was done quite quickly by playing around with widths.

Prototyping and creation of My Story Page

Day 7 [240522]

I used flexible containers as well to generate and create a simple partition between two different elements, allowing it to look like this.

Day 8 [250522]

After tinkering around with all the code, I finally managed to add in a 3 by 3 grid which was done with flexible containers. I understood how to use the property grid-template-columns to create a simple 3 by 3 grid like this. I also understood how to use > to specify a particular element within a division.

Finally being able to add in the grid

Day 9 [260522]

For Day 9, I continued designing my Education and Contact Me pop-up page. I liked the simplicity in the design but have to standardise the format as I continue working as well. I have to include a cross symbol to allow me to escape out of the pop-up page.

Design of my Education Page
Design for my Contact Me pop-up page

Day 10 [270522]

Honestly, I was quite annoyed at the @media function today because I had no idea where my navbar icon went to and resizing all the items suddenly seemed so difficult so that will definitely be something that I will have to continue working on next week. I think another thing that I would like to work on would be my Contact Me page which I have yet to prototype and develop. CSS codes are starting to get messy, I need to do something to tidy up all the codes before they get too difficult to comprehend.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store