In my MAET classes at MSU we were asked to learn something new using only forums and youtube/video resources. For this project I chose to learn HTML and CSS with the goal being that I create a “landing page” that has links to all my “stuff” (blog, class pages, etc.). I want to give you an update on how this learning process is going.
My Resources
I started with codecademy.com to begin my learning. This isn’t really a forum but it’s step by step nature was a great starting point. Within it there are question and answer forums that I relied on when I became stuck. I created this reference sheet to help me once I began to make my own site. Codecademy was great for starting off but I knew that if I didn’t take notes then I’d be lost later. Once I began to get some of the language down I started looking for editors to use and someone in a forum suggested Brackets. I’ve found this to be an awesome resource because it instantly updates all the edits I make to the webpage in a quick view window. I got a lot of mileage out of this video which shows the basics of creating an HTML document from scratch. I’ve also used Stackoverflow which is an awesome online community for programmers. Of these resources Stackoverflow and Codecademy have been the most helpful.
The Learning Process: Challenges and Solutions
I started off knowing nothing so even though Codecademy gave me baby steps to learning to code, when I jumped into
creating my own documents I got lost quickly. One of the biggest challenges I had to overcome was figuring out how to make my HTML document communicate with my CSS document. After scouring forums I found a post that wasn’t directly related to my problem, but after I studied the code the person had pasted I saw exactly what I was missing. The line of code highlighted to the right is the key to making the two documents talk to each other.
A more broader challenge is just simply learning a new language. There are syntax rules, different commands, structural elements, and countless other challenges that make this project complex. The more I work with it, like any language, the more fluent I become. The solution to overcoming these challenges is time spent working with the language, but also identifying a goal (designing my landing page) and having “go-to” resources to pull from along the way. This helps me overcome fluency problems as well as broader structural problems with learning the language.
Below is a photo of my webpage from the beginning as well as a photo in it’s current state. Next to
each is the code that created it. It doesn’t look like much now but you’d be surprised at how much time went into getting it to this point.
Here is a short video highlighting the moment I realized how to connect the HTML doc and CSS doc.
