My Intro to Markup and Typography

This week in class we touched upon the various markup languages that are used to define the content of a webpage. Web designers utilizes HMTL (Hyper-text markup language) and CSS (Cascade Styling Sheets) to create simple, beautiful, and user-friendly webpages. This week we got a chance to begin learning these markup languages and putting our newfound knowledge to practice with practical and relative assignments.

We used Codepen.io as our tool that allowed us to begin practicing web design. I personally found this site to be amazing. It’s a huge community based around web development. It’s awesome! Codepen allows you to write code in HMTL, CSS, and Javascript. The neat thing about it though is that as you are writing your code, you are given a live-preview of the site you are building. This is an extremely helpful feature as if you didn’t have this live preview, you would have to save your work as a .hmtl document and open it up everytime to see if the changes you made worked as planned. Lastly, my favorite feature by far is that fact that the community centered around this site actively share their creations with the world. This gives every user the ability to sift through the developmental mind’s of other bright individuals, essentially providing the user a fountain of unlimitted knowledge.

After the Codepen assignments, we also were tasked with editting a live webpage. I had a blast with this one. This was by far my favorite assignment this week. I chose to edit Facebook’s home screen. I’m pretty familiar with most browsers’ development toolkits as I work with applications that are designed to search for HTML/XML strings on a daily basis. If there is a “parsing” issue or a “cannot find x” issue going on, the first thing I do is check the HTML of a site to see if anything has changed on the backend. This only relates to my experience navigating the developer tools. This was my first time ever editting a webpage for fun and to be quite honest, I didn’t even know you could do that. I had a great time reading through the code, trying to understand why making a change in one section could cause a boatload of changes that impacted multiple other sections. I can see that inheritance plays a huge role in this and may prove to be very challenging for me down the line.

We also had a discussion on whitespaces in Slack. I enjoyed reading this article as it truly helped me with some formatting issues with the site I made to satisfy the requirements of assignment 5. The article was very informative and also provided the syntax for each “whitespace” character in Word, Pages, and HTML. I also mentioned in the Slack chat that after reading this article, an issue arose at work in which I was able to directly apply this newfound knowledge while diagnosing an issue with one of our scrapers (web crawlers). On the backend, a developer went and removed a whitespace in some embedded HTML that we were targetting. This caused the scraper to blow up when attempting to write the record. Since it was targetting a specific HTML string, the change made the string different; therefor, the scraper couldn’t find what it was looking for and wrote and error and moved on to the next with the same result over and over.

This was my summary of this week and I’m already looking forward to next week’s assignments. I’m already taking a lot out of this course. I know that I may fall behind here and there as I work a full-time job during the week and also run my own side business on the weekends. But I don’t plan on letting any of my priorities stop from me passing this class and taking every little bit of knowledge provided out of it.

Like what you read? Give Ken Kelemen a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.