I’m a specialized UI/UX designer and I teach designing online, to aspiring designers through Superprof (search my name on superprof to view my classes! Free ad plug? maybe :p)
A few months back, this couple from the US contacted me and asked if I could take Web Development classes for them. I have often had this experience of people confusing UI/UX designing and web development, so I clarified the issue, and told them, even though I have some experience in developing websites, my forte is designing. I’m a computer science engineer, and I like to code, but design is where my passion lies.
They were completely fine with it and asked for the free first class I offer. I happily scheduled a class for them. Even though I only had basic experience as a web developer, I was confident that, with a little bit of research, I would be able to teach all the basics of web-dev, from creating the index page to connecting it to a domain and deploying it on a hosting service. Since I was just charging 6,000 rupees for 10 classes, I felt it would be a win-win for both of us.
We scheduled the free class 2 hours from the call, and I started brushing up on the basics, and the topics to cover in the first class. It had been months since I developed a website, and to be frank, Google had been a helping hand in all cases. So I came up with a very creative idea!
Since I had less than 2 hours with me to go through everything, I thought I’d help them familiarize the software we would be using, which would take around 10–20 minutes, after which I’d explain the different aspects of web development. This way, I’d make a good first impression, and if they like my way of teaching and book classes, I will have more than enough time to research properly!
I was quite impressed with this idea and this was the schedule I came up with -
- Help them install and understand VS Code(arguably the best code editor there is).
- Talk about the basics of HTML, CSS, and what they’re used for.
I’ll explain what HTML and CSS is, in simple terms, for context —
HTML is the skeleton(raw content) of a website, and CSS is what adds the colors and flair to it.
We started the free class as scheduled, had a little bit of small talk, and I showed them how to install VS Code.
To that, they replied they don’t have access to a laptop at that moment.
(:
(:
(:
Familiarization of VS Code was supposed to take up most of the time! I hadn’t prepped for an hour of HTML and CSS explanations!!!
I started freaking out.
I’ve no clue how, but managed to pull myself together and started explaining the basics.
We went through what HTML and CSS represent, what they are used for, how they can improve a website’s design and even showed a few of the websites I developed as well.
It was going really well!
We were nearly at the end of the session and I was showing them a few HTML tags and their usages when they asked me how CSS changes things.
It was at that moment that I knew I f… forgot the tag used to connect CSS to HTML.
I didn’t let it show though. I casually stopped sharing my screen, and asked them something related to the topic, buying myself some time to search and find the tag on Google. Thankfully, I found it right on time and started sharing my screen again.
So I started explaining the basics of CSS. A good and simple example, I thought, would be to show them, how a random word would look like when you add styling to it.
So I wrote a small piece of code to explain CSS better. I have linked the HTML and CSS code below—
Now, if you have even a small background in web development, you’d be able to realize what went wrong.
I didn’t though.
Everything was going so well, I couldn’t screw up here!
I gave them a few stupid excuses and started searching frantically to see what went wrong.
I couldn’t find anything wrong with it. This was how you write the code, this is exactly how you link CSS to HTML, I had done everything right! Or so I thought.
After 5 minutes of keeping them waiting and me freaking out and searching for the mistake, I told them “it must be an issue with the browser and I had never experienced this before”.
They said that it’s alright and told me they’ll contact me “soon” and left the meet.
It’s been five months… I don’t think their understanding of the word “soon” is accurate :P
For those who didn’t understand what went wrong, there is a small error in the CSS code.
You could delete the dot in the first line, just before “h1”, and it will work perfectly fine.
“.class” is how you usually define a class in CSS. I knew that. But since “h1” is an HTML tag, the dot wasn’t necessary.
I was devastated.
I don’t blame them, I would’ve done the same if I was on their side, but I felt like I’ve failed myself.
From then on, I ensured never to teach things I’m not completely comfortable with, and that I’ll stick with teaching and practicing designing.
After being down in the dumps for 30 minutes, I called my friends up and went out. A full Chicken Biryani later, everything was back to normal.
