Study Everything

This is what my window looks like at this point. 

It reminds me of when I was learning Japanese at cafes, surrounded by about 10 books, 3 notebooks, my laptop, and somewhere in their midst a nice, hot latte, half-drunk.

I like to learn things holistically. Which can be crippling in its overwhelming nature. But I do feel it is the best way – getting to the essence of the thing you’re trying to learn. The essence… understanding. Which gives you flexibility. Which is the mark of truly knowing something. Having mastery of something regardless of the context.

So here is what I’m doing with html, and what I’ve done.

I dove into the youtube tutorial last blog to get some work down.

I felt that it was like being taught some vocabulary in a language class – without learning about the grammar, or pronunciation, let alone getting to practice it. This is the problem I run into with so many ‘educational’ resources these days. And the cynical side of me says it’s because they want to keep the blinders on as long as possible so you’ll only go through their course to the very end (and have advertising time etc.). However there are always gems out there, you just have to search a bit. 

So I went right to the source. With Japanese, I got a real book and trudged through it. I tried to write top level poetry while at an amateur level so I’d have to stretch my abilities. So I’m doing the same here.

It was apparent that with just this html stuff there’s no way it’s even a fraction of how to make a real, modern website. I need to grasp all the other things that go into making these cool 2020 websites. Scanning the source code of our current site and various others, I got to see all the tools I’d need to learn about.

I dive into stuff like this that I have NO training to understand. And with the right attitude – this is nothing but a gold mine for learning. If this is the real thing, and I can learn to understand it, and mimic, and then recreate it, then I’ll have mastered it.

So since it seems like HTML is crazy basic text stuff only… the non-html things:

Google Tag Manager

I found pretty much this exact thing across several different sites. So time to find out what it is.

Found a really good article here.

There are three main parts to Google Tag Manager:

• Tags: Snippets of Javascript or tracking pixels
• Triggers: This tells GTM when or how to fire a tag
• Variables: Additional information GTM may need for the tag and trigger to work

Which begs the question: what are tags?

Tags (metadata) – are words or phrases which describe the content of your site, regardless of format. The same tags can be added to text, articles, videos, products or photos. We recommend always using more than one tag for each item.

Well, so they describe it and… the important part: you can configure everything. This is data analytics. You could make a tag for Blog views. Then you can trigger it to only fire when the viewer reaches a certain point on just the blog page. Or something for ads. There’s lots of possibilities, and there’s lots of perks for using it.

But the short is: customizable site analytics.

Bootstrap

My biggest question looking from the source code of a website to the website itself was “how the heck do you just… format things?” The code for summoning an image somewhere with text next to it seems easy enough. But I really wanted to figure out how you know, the site actually gets its shape.

A showerthought, but designing a site in just HTML can be thought of as typing up a site on Microsoft Word, then having a program that can do that type-up all at once.

So I was looking around at different site’s codes and googling things I didn’t understand. On our site, and then August’s site I found clues that pointed me to this.

I wanted to find out how to duplicate this Slideshow-style front picture:

So I checked for where it would be located in the source code:

Bingo. Then I’ll just google this thing:

Got it.

So what is bootstrap. I’ve heard about Java, and CSS – but apparently I’ve gotta know this thing too, for sure.

w3schools has been the best resouce I’ve found. Giving you info and letting you look at it however you want. For bootstrap, they have this.

Where we’re at:

I’m getting a hang of looking at code in general. The mental link between the mass of characters and symbols and the product that comes out of them. What I want to work on for next week is formatting using bootstrap so I can really give some shape and space to my site. It seems like the other things like Google Tag Manager, and HTML etc, putting images and sizing them and getting text on there.. that all seems okay. I’ve gotten through the <head> or in other words, the backend section of our new site, leaving a few parts blank or with blanks to be filled in. The body is next. So, to bootstrap next week!