Intro to Coding: It's Not So Scary!
In high school, one of my math teachers would start her class each year by introducing herself and her career background. During this introduction, she would always talk about how her background in computer science and coding paved the way for many job opportunities for her. She always encouraged her students to take a few coding classes because it will be a part of our careers no matter what field of work. She made coding seem like the future of our world (and she's right)! Ever since taking her class, I have been inspired to learn basic code but the task seemed so daunting I always put it off. Well, life has a tendency to come full circle because today I will be discussing Codecademy and website-builder platforms!
As digital marketers, we need to have a basic knowledge of how to code. Not does it help gain insights on how websites are built, but it is also valuable when working alongside web developers. Instead of going to a development team for every little question and change, we should be able to get our hands a little dirty and fix problems ourselves. Coding is prevalent in all components of digital marketing from email marketing to Google Ads to SEO. Coding is the language of the digital world.
Learning to Code with Codecademy
There are many great tools online to get you started on your coding journey! A perfect example is Codecademy. Just like the name suggests, Codecademy is a free online training that teaches users how to code. They have lessons (beginner, intermediate, advanced) in a multitude of coding languages including HTML, Javascript, Python, and SQL. As a coding virgin myself, I decided to take some time and work through a portion of the HTML training.
The first lesson “Introduction to HTML” teaches you how to build an informational website using basic HTML elements. It starts by explaining the basic structure of HTML anatomy. This one is an example of a paragraph element. That’s what the “p” inside the brackets stand for - paragraph. Each section of code starts and ends with tags that tell you and the program the beginning and end of a particular section. The content, what shows up on a webpage, goes in the middle of the tags.
So far not too bad right?
The step by step the lessons walk you through more HTML elements such as coding different headings, creating sections, styling text, etc. Below you can see the layout of the lesson. Your screen is split into three sections. The left section is where instructions and explanations are. The middle is where you type the instructed code. And the right section is where you can see the website you are building.
Here I learned how to create a bulleted list.
Starting from the top the <h3> stag signifies that “species” will be displayed as a subheading.
Then below the heading, the tag <ul> indicates an unordered list which will be displayed as bullet points. Below that, the tag <li> stands for list item. This tag is how you add an item to the list. The last line has the closing tag </ul> indicating that that is the end of the unordered list.
No website is complete without a few pictures! Here Codecademy taught me how to insert an image using the <img/> tag and an “scr” attribute to site the image source.
Finally here are the final results of the webpage we built including a picture and video at the end! From what looked like a few words on a page at the start, turned into something that resembled a webpage. And I have to say I have enjoyed learning how each element pieces together to create the finished product. After this experience, I definitely have a greater appreciation for websites I see online and I can honestly say I will be continuing my training on Codecademy.
Website-Building Platforms
Luckily for most people, these days there are businesses that help simplify the process of building a webpage without coding knowledge. You have probably heard of many of them including Squarespace, Wix, WordPress, GoDaddy, and more. These website builders are user friendly and make creating a website accessible to pretty much anyone who wants one. However, I recommend using these platforms as a jumping-off point and an aid in your coding journey rather than replacing it.
Squarespace
Squarespace makes building a website seem like a piece of cake. There is no coding involved, so it is easy for anyone to use. You start by creating an account and selecting the overall layout of your site. From there, you have options to change headings, fonts, and colors, add pages and pictures, create buttons, and more. The possibilities are truly endless.
When playing around with Squarespace I decided to build a personal website. As my header, I changed the photo and inserted a line from one of my favorite poems. Below that, I started writing a short introduction about myself so visitors can get to know me.
The best thing about Squarespace is that it automatically provides you with a clean, put-together website with minimal work, but it is also one hundred percent customizable to your wants and needs. For advanced users, there is an option to insert your own code as well. Squarespace also provides built-in analytics, SEO, and marketing strategies. You can even add a commerce page with selling tools such as Point of Sale and Customer Information. Overall Squarespace is a great user-friendly platform for both beginner and advanced website builders.
WordPress
As the former VP of Web Development of WWU’s Student Marketing Association, I had to learn how to navigate WordPress to make edits to our website. I was fairly intimidated by the platform at first. The user interface is not as straightforward as Squarespace, but once I did some Googling and watched a few tutorials I got the hang of it.
Similar to Squarespace, WordPress is completely customizable (if not even more customizable) and easy to edit. There is also an endless amount of possibilities due to the plug-ins available. A plug-in is a piece of software, often from third-party businesses, that contain a group of functions that can be added to your website.
Plug-ins in Action
Due to COVID-19 and school switching online, last quarter SMA needed a new method for members to sign up for our SMA Newsletter. Previously we would have members write down their emails at an in-person meeting and then we would manually enter them into our MailChimp account. With a MailChimp plug-in on WordPress, I was able to insert a form on our website where visitors are able to enter their email and be automatically added to our MailChimp email list.
Although WordPress does not require any code, they make it simple to add your own HTML code if you prefer. While editing a piece of text, simply switch to the “Text” view instead of “Visual.”
Conclusion
While website building platforms are a great and easy resource to start your web development process, coding is still a skill that everybody should have a basic knowledge of. It will not only help you gain a greater understanding of the digital world but will also be valuable when working alongside developers. Coding allows for endless possibilities! I have been putting off learning to code ever since high school, but now I can proudly say that I have started the journey and am excited to continue learning through Codecademy!
P.S. If you are a creative like myself, don't let the stereotypes of coding put you off! Here is a gif created by code! I would call that art too.
