Week 1
Objective
1) Create a website describing yourself.
2) Work through a git tutorial.
Git,HTML
I used to do programming a couple years ago when I first started building neurotech projects. But since I’ve been doing research, I haven’t been working on my programming skills so this week I started again from the very basics.
This website is built entirely using HTML and CSS. I had a website design in mind so I went without a web template. I started by designing a skeleton of the website that I wanted to create in Figma:
After playing around with HTML and CSS, I reproduced the design onto my laptop:
But, because I was using margins I realized that the design was scaled to fit my own display. If I moved it to a smaller or larger display, it wouldn’t scale to fit the size of the screen. Instead, it looked something like this:
To fix this problem, I redid the entire website using CSS grids. This made sure that every component of the website scaled with the size of display. Try it for yourself by playing around with the size of this website!
Except, the website still had issues on mobile. I couldn’t keep the original 7x4 grid, so I used media queries to create a singular column of weekly projects. This is what it looked like once I was finished:
