Sadale.net (jan Sate)

Language: TOK | QSS | EN

ABOUT | BLOG | PROJECTS | MERCH

Sadale.net Revamp - Generation 4

2025-01-19 | Meta
This article is also available in other language(s):

Hello guys! I'm glad to announce that I've just revamped my website. It's now at Generation 4.

The previous version of the website looks like a soulless corporate website. The main objective of this change is to give my site a proper personal vibe and to make it better aligned with my current vision and ideology. It also makes the site easier for me to host and maintain, and easier for the viewers to read and navigate.

Why the Revamp?

I have pretty much become a different person since I created the previous version of the website. The new site is a better match to the vibe of who I actually am now.

sadale.net was created about 10 years ago. I was still a college student back then with the mentality of an immature kid. While I had way superior technical skill in computer and programming compared with my peers, I pretty much had no idea on how this world worked. I used to be a very insecure person. The blog, web tools, apps, desktop programs, etc. were originally created for showing off, with the ultimate objective of making money or gaining influence. Plenty of stuffs I made were created for filling the checkboxes on my CV. And I was pretty much an aggressive asshole while I was interacting with others, online or offline.

10 years passed. I have achieved financial security. I have learned about passive investment. I have learned how this world operates. More importantly, I have interacted with awesome people on the internet and learned to be friendly with each others. Now that I'm a much more decent person to deal with.

By 2020, I have landed on a day job for a few years. At that point, all my new projects on this websites have been solely hobbyist projects with no profit-making intention. I don't particularly enjoys making money while I'm outside my work hours. Today in 2025, my main income source is from my day job, accounting for ~80% of my total income, with the remaining ~20% of them (which is slowly increasing) coming from passive investment return. As for the profit of my hobbyist projects? Yes, I managed to sell a few units of ilo nanpa but there's barely any profit to speak of. I sold like 25 units over several years with total gross income of like $500. After deducting the production cost, it accounts for less than 0.1% of my total income. Let's not forget about the countless hours that I spent on these projects! Anyway, I'm still willing to keep working on these projects. Not because it's profitable or it will ever get profitable. It's just something that I actually want to do regardless of the profit.

The thing is that, the previous version of the website was created with the old mentality I've got 10 years ago. It does not show what kind of person I am today. During the 10 years, I have also learned Toki Pona and invented Sadalian Script, in which the previous version of the website was made for English-only content in mind and it can't properly cater for multilingual blogposts.

I have been wanting to revamp this website for years. But I had never got the time to do that. As I was a bit tired while I was working on my Toy Motor Controller project, I decided that I'm gonna put that project aside and finally spend time to revamp this website for a change of pace.

Evolution of sadale.net's Design

The image below shows the evolution of the design of sadale.net up til now. The screenshot stacked on the top is the homepage, beneath it is a sample blogpost.

A set of screenshots showing the evolution of sadale.net's design, showing the generation 2, 3 and 4's homepage and the blog

You can view the archived old version of the websites here:

Changes Overview

Changes: Web 1.0 Static Site Generator

The previous version of the website was a dynamic site created with Django. The blogposts in Markdown format were stored in a database and managed using the admin page that comes with Django.

For the current site, I made my own static site generation script in Python. It can generate the website from a few HTML templates, an i18n tab-separated-value file and many Markdown files. There's no database nor server side scripting. The structure of the files looks like this:

generate_html.py
content/
    legacy_tag_redirect.tab # Mapping between legacy URL and the new URL
    blogpost/
        1-en.md
        2-en.md
        2-tok.md
        2-qss.md
        ...
    page/
        about-en.md
        about-tok.md
        about-qss.md
        ...
template/
    i18n.tab # i18n string table
    meta.html # Contains headers, footers, etc.
    blogpost.html # Contains a single article
    blogindex.html # Blogposts list
    blogindexentry.html # Each entry of blogpost list
    ...

I extracted the old blogpost content from the database and dumped it as Markdown files inside the content/blogpost/ directory. The content of each of the blogpost's Markdown file looks like this:

Title: Hello World
Date: 2015-01-01
Series: meta

Hello! This is the first blogpost of my website!

Checkout my new project FooBar! You can view the blogpost series here: [Foobar Blogpost Series]($_foobar_url)!

If you happened to speak Toki Pona, use the link here: [kulupu sitelen pi pali Pupa]($tok_foobar_url)

The "template engine" I used is the Python's Built-in Template Strings Mechanism. It got no fancy feature, but it just works!

This design is very simple. And it works very well for my own use case. It's way easier to maintain a static site than a dynamic site.

And yes, I know. There're many existing static site generators. Unfortunately, this website requires multilingual support, a specific URL format and themeable design. It would take me more effort to find a generator that suits my use case than to make one from scratch.

As for the front-end, the old site used Semantic UI. And the new site doesn't use any UI framework whatsoever, making the entire site lightweight. :)

Changes: Multilingual support

Changes: Multilingual support: No More Language Interlacing

The previous site was designed for single language only. Whenever I needed to make the blogpost available in multiple languages, I would make a single blogpost with two languages interlacing with each others like the follows:

Screenshot a blogpost on the old site showing two languages interlaced with each others

This is an absolutely terrible approach for multilingual support. It instantly removes 50% of real estate from the screen (or 67% if it's a tri-language article).

With native multilingual support of the new website, now that the entire page would be in the same language. There's a small section on top of the article suggesting the user of other languages to switch to another page. See below:

Screenshot of a blogpost on the new site in English, with a section suggesting the availability of the article in another language

This is a much better design for the end-user. The user can choose the language that they want to read the article in, with almost no compromise on the screen space.

Changes: Multilingual support: Supported Languages

This site now supports Toki Pona (TOK), Sadalian Script (self-proclaimed QSS) and English (EN).

All of the articles can be written in one or more languages. If the article is unavailable in certain language, the user would be given link(s) to read in an available language.

Toki Pona is a constructed language that I've learned in 2018. There's a few active communities across the world. I'm proficient in this language for written communication. As I'm a member of Toki Pona communities, this website now supports the language so that I can share my work with fellow Toki Pona users.

Sadalian Script is a script that I personally invented many years ago. It's a phonetic script for Cantonese (a Chinese dialect). The script looks like no other languages. Each character of Sadalian Script represents the Cantonese reading of a Chinese character. I've made several revision of the script over the years, with the design finalized on late 2023. I plan to publish this script to Omniglot some days later. Before then, you can view the single-page documentation of the script here: Documentation of Sadalian Script rev8. I have registered unofficial unicode codepoints for Sadalian in Under-ConScript Unicode Registry.

Unfortunately, I'm not proficient in reading the script (yet). The only thing I'm proficient in is the romanized version of this script. Therefore, I need to find a way that I can easily type and review in the romanized script, and have the site to render it in the actual Sadalian Script. To do that, I could either use the font ligature feature, or get the page generated with the text using Sadalian Script's actual unicode codepoints. I decided to use the latter one because it would be no fun to give away the romanized Sadalian Script to the viewer of the site! :P I have implemented a feature in my static site generator that converts the Markdown article files written in romanized Sadalian Script into the actual Sadalian Script codepoints.

Automatic conversion of Romanized Sadalian Script to Sadalian Script's unicode codepoints

English has lost its official language status on this website for promoting the use of the other two languages. Despite that, it is still being supported so that normies like you can read this website. :)

Changes: Multilingual support: Existing Blogposts

Most of the existing blogposts on this site are English only. For existing blogposts that have multiple languages interlaced with each others, I'm gonna split them up and use the new multilingual support for showing the blogpost in each of the available languages.

A few of the existing blogposts contains Toki Pona, Cantonese (a Chinese dialect) and Esperanto. All Cantonese content will be converted to Sadalian Script because it's a script that's meant to replace Chinese characters. Barely anyone reading this site speaks Cantonese anyway, and I gotta find ways to use the script that I personally invented. :P Esperanto content will be removed because I was never proficient in the language. I think there were like maybe a couple of blogposts that has Esperanto content. Its removal would barely harm anything.

On top of that, I'll find a time to translate some of the existing English-only blogposts into Toki Pona and Sadalian Script. I hope that I can translate all articles into Toki Pona and Sadalian Script written after 2020, and maybe also a few pieces of earlier blogposts. Translation to Toki Pona is prioritized over Sadalian Script because somebody other than me can actually read that. That's gonna take me long and it'll probably take me years to get it done.

Changes: Multilingual support: Future Blogposts

I'll try to make all of the future blogposts available in all three languages, including Toki Pona, Sadalian Script and English.

Changes: Blogpost Series System

The old site allows each blogpost to have multiple "tags". It's kind of similar to social media hashtags. The end-user can click on the tag to view all blogposts that has the same tag on it.

However, after blogging for years, I find this tag system very confusing to use. I've defined way too many tags. And I often add blogposts to a tag even if it's just marginally relevant. In addition, when there's a multipart blogpost series, there's no easy way for the user to find the other parts of the blogpost.

In the new site, I'm getting rid of the tagging system. It's replaced by a blog series system, which is similar to "Category" of other blogs. Generally speaking, the blog series is defined by the project. There're also non-project series' like Meta, Game Jam, Toki Pona News, etc. Each blogpost can be assigned to up to one series only. For example, the series of the blogpost you're viewing is in the Meta series.

For ease of navigation, at the end of each blogpost, there's a section showing a listing of all blogposts of the same series. It helps the user to view other relevant blogposts.

Changes: Non-blog Pages

In the old site, the entire site was a blog. The homepage itself would show you the most recent blogposts that you could just keep on scrolling and read them one by one. On top of the recent blogposts section, there's a tiny untitled "About" section with my project listings along with text of my introduction. There were no dedicated homepage nor dedicated project listing page. The title bar of the old site looked like this:

Old title bar of sadale.net

The social media buttons on the title bar linked to my profile on external social media site. But you won't believe how stupid those text buttons on the left are. Those buttons, upon clicked, would show all of my blogposts that has certain tag on it! It means that you might find duplicated content by clicking on any of the buttons on the title bar because a single blogpost can have multiple tags.

In the new site, the title bar is much more intuitive. Each button actually leads to a real page with non-blog content as shown below:

New title bar of sadale.net

The new sites has an "About" page, which also serves as the homepage. It has a "Blog" page, which leads to a list containing links to all of the blogposts. It has a "Projects" page, which shows you a list showcasing the stuffs that I've worked on. And there's a "Merch" page, which shows you stuffs available for sales. The tiny shoehorned "About" section of the old site has been expanded into three new full pages! There's also a few buttons for you to switch between languages on the far right side.

I'd like to focus on talking about new homepage (i.e. the "About" page):

New Homepage of sadale.net

At the top of the new homepage, it has a piece of stylized text dancing around yelling "WELCOME TO MY WEBSITE!". Then it comes to a text wall that contains everything you need to know about me, with interactive content mixed into it. There's an anthem too. And there's social media links and contact methods. The homepage ends in a stripe retro 88x31 GIF. The content of the new site contains much more useful information than the old site. It's also much more warm and casual than the old one, with a very strong personal vibe on it.

Changes: URL Redirection

The URL structure of the site has changed for multilingual support and the new blog series system.

For maintaining backward-compatibility of the old links, all of the old links are properly redirected to the most relevant page on the new site. I've manually created a mapping between the old links and the new links, My script would generate the appropriate redirection index.html files based on the mapping.

For simplicity of deployment, I do not use URL rewrite for redirection purpose. I'm very well aware that using redirection HTML files may comes with SEO penalty. But this website is meant to be read by a human so everything's good as long as a human can read this site properly.

Changes: Removed Features

Some features had been removed since the introduction of the new site.

Changes: Removed Features: Comment Box

The comment box has been extremely underutilized. For the vast majority of the blogposts, there is no comment at all.

For some reasons the spambots had made its way into a few of the articles and spammed in the comment box intensively, which I had to manually remove them.

Most of the viewers of this site knows me personally anyway and they could just send me comments by other means. I failed to see any benefit of adding the comment box. It's also time-consuming to moderate the comments. I'm getting rid of it that's it.

Changes: Removed Features: SEO Tricks

In the old site, there's some feature created for SEO, namely the meta description and the page's thumbnail.

The funny thing about meta description is that I had to come up with a description of the article on my own. And all of them ended up being something like "Official blogpost of release announcement of project X". The so-called "description" barely describe the content inside the article.

So what about the thumbnail? Hah! It's just the Sadale's icon for every single page. Every single one of them! Whenever a page on my site got posted to social media, they would just see the sad beer icon regardless of the content inside the page, which's unhelpful.

This is a personal website, not a corporate one. There's no reason for me to work on SEO on this site. Therefore, the new site will stop doing any of the SEO tricks.

Changes: Removed Features: Google Analytics

The old site has Google Analytics configured. It's meant to analyze the demographics of the userbase and provide insight to me on how to improve my site to gain more users.

It turns out that I barely read the Google Analytics' Report. I've only read it maybe 3 or 4 times ever. And I'm pretty sure that this Google Analytics thingie is tracking the users, which's evil.

I'm gonna remove this filth from my site. I don't need my users to be tracked. I don't need the insight report. I don't need to grow the userbase of this website because it isn't a for-profit one.

That's It!

That's it for all of the changes of the Generation 4 sadale.net. This site revamp has turned the website into a full-ledge personal website. It also comes with quality of life upgrade to all of the readers.

Enjoy viewing this new site! Feel free to provide feedback in the comment box below whichever community that you usually chat with me in! :D (uhm... If you don't already know me personally, maybe you could drop me an email or something).

Long Live sadale.net!


Link for sharing this article: Sadale.net Revamp - Generation 4

Blogposts in Series "Meta":

View all blogposts