Web Design 101: Coding & 2 Popular Platforms

As a marketer, you likely have found yourself wearing many hats over your career, perhaps even multiple hats at the same time. Even if a job has a more narrow focus, say social media for example, many still require a diverse set of skills to be successful. Yes, you could theoretically use one person to take the photo, another to write the caption, someone to schedule it, and one last person to engage with comments OR the process could be simplified by one person using many skills to create the post. I don’t know about you, but the latter option sounds much more effective to me, at least for smaller businesses. That being said, marketers need to dip their toes into many topics in order to be attractive to employers. For those that hope to work in digital marketing, this looks like learning the basics of coding. 

Why code as a digital marketer? 

Building a brand new website, sending beautiful emails, and other digital marketing activities aren’t always easy. Although there are programs out there that simplify the processes, such as Shopify, Mailchimp, and Wix, they aren’t the end-all be-all solution to digital communication. Sometimes issues require work behind the scenes, which can be technical and confusing. Although these could be outsourced to developers, resolving them in-house is much quicker and more resourceful. Here’s some other reasons why digital marketers should consider learning basic code:

• MORE FLEXIBILITY: Although prebuilt website templates are great for those who have limited time or are just starting out, coding allows for much more customization. This can help differentiate the brand and better tailor the content to their customer’s needs. 

• ACCURATE EXPECTATIONS: As creative individuals, marketers have a tendency to dream big. Although this is great for brainstorming and creating unique work, ideas can sometimes be a bit unrealistic. Learning coding basics can help marketers have more accurate expectations about what is actually possible. 

• BETTER COMMUNICATION: Not all coding issues can be resolved by a marketer and that’s okay - we’re not the experts in this area! However, knowing some coding basics can make it easier to communicate with developers and resolve the issue together. 

Now I’m no hypocrite, so I began learning the basics of coding for this blog post. Here’s how it went! 

My experience with coding 

I started with a Codecademy course all about the basics of HTML. It’s a great topic to start with, as HTML, or HyperText Markup Language is core to front-end development work and the skeleton of all web pages. To create more advanced websites, HTML eventually has to be paired with CSS and JavaScript, but it does serve as a great starting place. This course was easy to follow and has a wonderful interactive element that gives you more confidence in your abilities. It’s free to take the lessons but to test your knowledge and gain certifications, you unfortunately must upgrade your subscription plan.

Once I finished a few lessons, I decided to experiment with what I learned on two different platforms: WordPress and Squarespace. These two companies are both wildly popular for creating websites, so I thought that they’d be great options to test my new knowledge with. 

WordPress

I’ve used WordPress before and I’ll start by saying that there’s somewhat of a learning curve to it. The account is easy to set up and choosing a template helps you quickly dive into creating a beautiful website. Customizing each page is relatively simple, as there are premade blocks available ranging from paragraphs to social media links to contact forms. However, it can sometimes be difficult to work with formatting and responsiveness. 

If you’re comfortable with HTML and prefer to build the website that way, WordPress makes it easy to do so. By right-clicking on an element, a short menu appears with the option to “Edit as HTML” about halfway down the list. I selected this option for a few of my elements and here’s how it showed up.

Although I definitely prefer the visual editor, this feature offers a great opportunity for customization in a relatively straightforward way. Users can take it a step further by customizing some coding of the overall page (found on the right side under “advanced”). Here you can change the HTML element, create direct links to certain sections of the page, and add CSS classes to stylize elements. 

Overall I do enjoy using WordPress, however, it hasn’t always been that way. I always try to teach myself things but it can be time consuming and frustrating. Life would have been much easier if I started using these resources from Wordpress when I first started, so I highly recommend that you don’t repeat my mistakes. 

Now that we’ve talked a bit about the leading website builder, let’s discuss Squarespace, a competitor that is known to be a bit more friendly for beginners. 

Squarespace

Squarespace is very similar to WordPress but is initially less overwhelming and easier to navigate. Selecting the free plan on WordPress introduces you to the homepage with the complex menu on the left. Squarespace on the other hand, allows you to select a template for free and then upgrade payment plans later. 

Both programs provide a quick tour when you open the editor for the first time. However, Squarespace makes the editor easier to access by it being the first thing displayed when you open the account. Both platforms use sections and blocks to build the website, but Squarespace has a much more intuitive design. Since they allow you to choose a template right off the bat, there is more content available to build off of on each page. WordPress doesn’t offer this (or if they do it’s more difficult to find) but Squarespace makes it easy to create a beautiful page. 

I created the following section in about five minutes. I found Squarespace much more enjoyable to use than WordPress and it has all of the same blocks as WordPress - they’re just easier to move around and visually organize. It was also easier to view in a mobile format, which is incredibly important because over 60% of total web traffic comes from mobile devices in 2023. You can even edit while in mobile view, which is great because it is a feature that WordPress has yet to adopt.

I think that Squarespace offers enough flexibility and variety that you wouldn’t need to add custom code to have the site of your dreams. However, you can add a variety of supported code, depending on the plan. All plans can use CSS, HTML, and Markdown, but those with more advanced needs may require a more expensive plan. This article from Squarespace Support gives a rundown on how to add custom code to a site and all of the payment plans. 

In the end, Squarespace appears to be much more user friendly but slightly less responsive to those that want to edit via coding. For my needs, I know that I’ll definitely consider moving over to Squarespace from WordPress in the future. 

Final thoughts 

Overall, I think that WordPress and Squarespace are both awesome options to build a new website on. Those two platforms, along with Codecademy, are great programs for digital marketers to utilize. Many websites could easily be built through Squarespace, which is simple to use yet still professional and customizable. It’s the perfect option for smaller projects and clients with basic needs. 

For projects that have more complex requirements, WordPress may be the way to go: it’s still simple to create a website, just with more of a learning curve. However, it’s easier to edit via HTML to create a fully customized website. This, of course, is a skill that many marketers may not possess. Luckily, Codecademy is a platform that digital marketers can use to quickly learn the basics of coding that they’ll need for their day-to-day tasks. All three of these companies offer important tools for digital marketers to familiarize themselves with if they want to be more hirable. Thank you for reading and happy coding!