Creating a Simple HTML and CSS Website with No Prior Coding Experience – a List of Useful Resources

Digital Publication Platforms is a fancy name for the coding, accessibility, and publishing on the web course I am taking as part of my Master’s Degree in Content Strategy at FH Joanneum.

One of the assignments was to prepare an HTML and CSS “business card” – a simple website that represents us and our portfolio.

The only short-lived and unmemorable HTML adventure I have ever had happened in secondary school when I created a tribute to Evanescence – the band that provided the soundtrack to my moping teenage years – for the IT class.

It was an elaborate image map, and I got a “5” (very good in the Polish educational system). Should have been a “6”!

I never crossed into the CSS territory up until November 25, when I bought the Complete Web Development Bootcamp and started learning.

I noted all of the resources I used to create my website on this page. Scroll to the very bottom of this post to see the final product.

HTML and CSS Courses

The Complete 2023 Web Development Bootcamp on Udemy taught by the charismatic Dr Angela Yu from the App Brewery.


Visual Studio Code – Microsoft’s source code editor which runs on your desktop and is available for Windows, macOS and Linux.

Visual Studio Extensions:

HTML and CSS Guides

Layout – my nemesis

This was the most difficult part of the whole learning process. I was told that CSS layout is tough overall, which, luckily, meant that there were a lot of resources available to approach the topic from different angles.

Here, I want to applaud the unsung heroes of coding who put out tutorials and videos with painstakingly documented steps. *claps in an empty living room*

HTML structure:

  • Semantic HTML elements explainer video by ByteGrad, who discusses the purpose of such sections as <main> or <header> over <div>


+ Examples of layouts:


+ CSS effects

+ Fonts and Special Characters

  • Free Google Font pairings for those like myself who have not been gifted the ability to instantly pick complementing fonts. (I was queueing up for strategic thinking skills when talents were being handed out in heaven ha ha #Polishdadjoke)


Accessibility Checklist

My Website

View it live here.

Banner image credit: browser mockup by Mainuddin Mahmud via Behance