DEV Community

Cover image for My new website!
Jakob Bouchard
Jakob Bouchard

Posted on • Originally published at

My new website!

Finally, after months of putting it off, I finally launched my new website! I've started over again and again, with different technologies, before finally coming back to WordPress. It's not super fancy, but it loads fast, it's lightweight, and (I hope) it's accessible.

The old website

My old website is, uh, not particularly good. In my defence, I made it 2 years into college, and they made us use WordPress, without much training on it other than “Here is Divi, it's a theme with a builder, now do stuff”. No talk about customisation, child themes or optimisation. It wasn't great, and as such, the quality of my “portfolio” suffered from it. It definitely didn't represent me correctly. It was time for a new one.

My old website
Fun fact: the background is supposed to have some particles, but it’s somehow broken!

My goals

My goals with this new website was to build one that was performant, lightweight, accessible and mobile friendly. All of which the old one wasn't. At first, I kinda wanted to have a bunch of fancy animations and effects, a bit like Locomotive and their websites. However, not only does it usually make websites slow and heavy, it also is quite a bit involved most of the time. I ended up making what is a simpler, easier to maintain website, a bit inspired by Kevin Quirk and Alex Bell's Piccalilli. I think it looks pretty good, and it's more than enough for a personal website anyways. The portfolio section will also be revamped a bit and I removed a lot of my old projects, since they weren't particularly good.

Experimenting with SvelteKit

I really wanted to make my new website using SvelteKit, and possibly Supabase. SvelteKit is an amazing framework and I love using it, I found it super easy to learn, since Svelte is basically just HTML, CSS and JS (optional TypeScript) with a couple of fancy features sprinkled on top. While it is easy to learn, it also doesn't have any CMS features. So I added Netlify CMS, and planned on hosting it on Netlify. It was great and all, but using .md files with the adapter-static for SvelteKit proved to be annoying at some times.

When I started it, I hadn't made many websites yet, and as such, while my technical HTML and CSS skills were pretty good, practically, they were a bit of a challenge, as I wasn't sure of how to build my layout. I also wanted to use Tailwind CSS, which, after reflection, probably would've been overkill. It's a great product and I love it, for sure, but it required much more work, and I didn't want to add too many plugins, as I really wanted a lightweight site.

The winner...

So, I ended up choosing WordPress. Why? Well, I currently work at Distantia, and we mostly make websites using WordPress and our own in-house theme, so I learned a lot about WordPress in the past months. In fact, it really debunked the myth that WordPress is and always will be a bloated, insecure piece of software. With good hosting, minimal plugins, as well as a custom theme, a WordPress website can be really quick. In fact, according to a test from Kevin Quirk, it can be faster than a regular HTML/CSS website.

My theme is based on undescores, but I've stripped it down a whole lot, keeping only what I need, and not using any JavaScript, apart from umami, an analytics tool, which you can learn more about on my privacy page. With CloudFlare in front of my hosting, as well as Nginx caching, the load times are pretty good, even from the other side of the country, it loads in under half a second!

What now?

Well, now that my new website is done and nice, I'll probably start using it more than my old one, and I'll try to start posting more blog posts. I'll definitely try to improve it over time by adding layout elements, maybe more colours, etc. One of the things I really want to do is add a way for WordPress to automatically post a blog post over on when I want it to. That and adding a reading time indicator, I like those. I also need a new favicon and Open Graph image.

Top comments (0)