And itâs not as đŠ as you might think.
I wanted to build a simple personal web page that would have some basic information about myself and my work, which I could later share with people.
Since I didnât have much time, everything had to be
- Quick
- Simple
- Free
- Easily-editable
- and visually appealing.
And so I started to think of my options.
The Obvious Solution
At first, I wanted to find a nice HTML template to use, so I went to various websites such as HTML5 UP!, and searched for something that would suit my needs.
I quickly realized that I wanted my website to be much more minimal and much easier to set up. So I thought why not write plain HTML? This shouldnât take much time.
But, as a designer, I wanted to see something more aesthetically pleasing, and because I didnât want to write any CSS, I decided to search for some ready-made stylesheet that would look good and wouldnât require modifying my HTML.
I found MVP.css, and it looked like it could work for me.
No class names, no frameworks, just semantic HTML, and youâre done.
The Toilet Part
While the solution I found was relatively
- â Quick
- â Simple
- â Free
- â and visually appealing
it certainly wasnât
- â Easily-editable
at least not for me.
So what do I mean by âEasily-editableâ? Itâs quite simple â I wanted to be able to edit the contents of my web page and push the updates on the go, i.e. using my iPhone or iPad.
I know that there are HTML editors for iOS, and I could potentially use them but I found it very suboptimal â it wouldnât be as convenient and as elegant as I have imagined it.
Before I came up with a solution, I made my goal even more complicated:
If I can find a way how to use my phone to edit a website, why canât I use it to create a website?
I googled again and found only some mediocre website builders for mobile which did not meet my needs, and this was when I knew I needed to think outside the box.
I wanted to build a simple personal page â sort of an advanced rĂŠsumĂŠ. Why HTML? Why even code? Why canât I just use some text editing app, create a nice page in it, and share it online under my domain name? It appears I can.
I remembered that Notion (an app I use for note-taking and organizing my thoughts) allows opening shared documents in a browser.
I quickly realized that I could create a document in Notion which would contain everything I wanted to include on my web page, make the document public with reading rights, which means anyone with the link can view it but canât edit it, and redirect visitors from www.alexpak.work to this Notion document which is already responsive, i.e. optimized for viewing on any device be it a desktop computer or a smartphone. And the best part was that I could do it on my iPhone!
It didnât take me much time to put together a nice Notion page, include all the information I wanted, and set up a simple redirection rule in index.html of www.alexpak.work using
<meta http-equiv="refresh" content="0; URL='https://www.notion.so/Alex-Pak-97b45878f216471aabbe11bdf44f4b9d'" />
Now, whenever someone tries to access www.alexpak.work, it takes them to my Notion page, and I can make live changes from my iPhone, iPad, Mac, or any other device with an Internet browser, no matter where I am.
I also made a template out of this page that anyone can duplicate and use. The template is available here.
You can go even further with the website set-up and use custom domains, embed code, change fonts, and many other exciting things using tools like Fruiton or similar.
For those who want more đ¨
I share the best things I find â articles, tools, books, videos, and other great things worth your time, in my newsletter Things Worth Sharing.