My Base CSS Rules

/* Base Rules */

@viewport {width: device-width;}
:root {font-size: 100%;}

html {hanging-punctuation: first last;}

*, *::before, *::after {box-sizing: border-box;}

* {margin: 0; padding: 0;}

body { text-align: left;
font-kerning: normal;
font-variant-ligatures: common-ligatures contextual;
font-feature-settings: "kern", "liga", "clig", "calt","lnum";
}

h1, h2, h3, h4, h5, h6 {
overflow-wrap: break-word;
text-wrap: balance;
}

p {
overflow-wrap: break-word;
text-wrap: pretty;
}

pre {overflow-y: hidden; }

audio, canvas, embed, iframe, img, object, svg, video {
display: block; width: 100%; vertical-align: middle;
}

img {height: auto; }

ul, ol, dd, summary { margin: 0; padding: 0; }

nav ul, nav ol, aside ul { list-style: none; list-style-image: none; }

abbr {font-variant-caps: all-small-caps; text-decoration: none;}

input, button, textarea, select {
font: inherit;
letter-spacing: inherit;
word-spacing: inherit;
color: currentColor;
}

Pasting Text Without Format

In over 25 years of using computers, I had done countless copy and paste texts. Yet, I got annoyed with formatting every time I performed these two tasks.

Recently, I was helping Đán with his homework and I watched him copied and pasted text in to his assignments without the formatting.

He showed me how:

Win: Ctrl + Shift + V
Mac: Cmd + Shift + V

How in the world have I not known this all these years? Then again, better late than never. Thanks kiddo!

Upgraded to Ubuntu 24.04.1 LTS

After several failed attempts to upgrade Ubuntu 22.04 to 24.04.1 early this month, I was doing some research to migrate off DigitalOcean. My first choice for this WordPress-powered blog was WP Engine. After the controversy between WordPress and WP Engine unfolded, I was debating between WordPress.com and Pressable, both owned by Automattic. I still haven’t made up my mind.

I still don’t know where to move my PHP sites, which I put them all in one DigitalOcean’s Droplet. I don’t want to go back to shared hosting plans. I need a managed cloud hosting solution. I haven’t dug far enough. I was doing research on running my own server in my house, but that seems like a terrible idea. So I scrapped that.

I still don’t know what to do with the hosting for all of my sites, especially in the long run when I will no longer alive. I guess they should all evaporate with me. I shouldn’t even be thinking that far.

Today I tried to upgrade to Ubuntu 24.04.1 LTS again. Of course, I created snapshots before I did. To my surprise, the upgrade worked for both Droplets. It was a huge relief. I am going to stay with DigitalOcean for a bit longer. Maintaining Ubuntu keeps me up-to-date with backend development.

Running two Droplets costs me $35 a month. They are more than what I wanted to pay. I was thinking off combining all my sites into one Droplet, but I am not sure if that’s a good idea.

WordPress vs. WP Engine

In the last couple of days, I am following the battle between WordPress and WP Engine. On Wednesday Matt Mullenweg banned WP Engine from access WordPress.org. This ban has a huge impact on us. George Mason University hosts hundreds or even maybe thousands of is WordPress sites on WP Engine. The Scalia Law Sites, which powered by WordPress MultiSite, is also on WP Engine. I hope the issue will resolve quickly.

Need a New Home for My Sites

In the past few days, I tried to upgrade from Ubuntu 22.04 to 24.04 twice for two different Droplets, but both failed. The upgrades went through, but I could not restart the servers. I will try again when I have more time, but I need to look for a new home for all of my websites for the long run.

I like the cloud hosting services at DigitalOcean. They are fast, reliable, and easy to manage—until they are not anymore. Management the Droplets is also the downside. Every few months I have to do updates and upgrades. Minor security updates are fine, but a major upgrade is not. I don’t want to manage these servers anymore. I feel the same way Winnie felt when she finally decided to move from DigitalOcean to Opalstack.

I can’t go back to shared hosting. I need cloud hostings like DigitalOcean, but fully managed. I am considering WP Engine for this blog, but then I would need another home for five other sites. I am not in any rush. I still have a bit of time to make the decision. If you have any hosting recommendations, please let me know.

HTML Sample Page

The following HTML example page is drawn from Manuel Matuzović’s Web Accessibility Cookbook.


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page Name - Site Name</title>
</head>

<body>

<header>

<a class="skip-link" href="#content">Jump to main content</a>

<a href="/">Site Name</a>

<a href="/">
<img src="/img/logo.svg" alt="Site Name">
</a>

<nav aria-label="Main">
<ul>
<li><a href="" aria-current="page"></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</nav>

<form role="search">
<label for="search">Search</label>
<input type="text" id="search">
</form>

<!-- Download link to a pdf -->
<a href="/file-name.pdf" download="custom-file-name.pdf">
Download File Name (PDF, 2MB)
</a>

<!--Automatic quotation marks-->
<p lang="vi">
<q>Lời trích dẫn tiếng Việt</q>
</p>

<!--Subject & body prefilled Email-->
<a href="mailto:[email protected]?subject=Hello&body=Message">
[email protected]
</a>

</header>

<main id="content">
</main>

<footer>
&copy; 2024
</footer>

</body>
</html>

HostPapa Targeted Thomua.com

HostPapa hit me a few years ago with the resource limit bullshit. I cancelled all of my services with HostPapa. I knew it was just a matter of time before HostPapa went after my clients.

According to their automated performance scans, Thơ mưa had exceeded the allocated resources. Of course it was a scam because Thơ mưa was not even powered by WordPress. It was just a static site built on HTML, CSS, and a bit of PHP. No way it was hogging up the resources.

When my client forwarded to me the HostPapa scheme trying to upsell their service, I advised my client to get out. My client agreed. I transferred the domain and migrated the entire site over to Namecheap. I haven’t used Namecheap in the past. Since my client already has a few domains with Namecheap, I signed up for their hosting as well. Namecheap seams to be a good, reliable company.

HostPapa took 9 days to release the domain. Even though the migration process was time-consuming, I didn’t charge my client a penny. I created Thơ mưa 8 years ago and I had no obligation to take on the migration, but it was the right thing to do. This is one of the reasons I am not doing good at business, but I am OK with that.

If your site is hosted with HostPapa, you need to get out. They are a horrible company.

A Year of Nada

A year ago, we licensed a commercial CMS ($21,500 annually) and a cloud server ($11,000 annually). We also paid almost $200,000 for the design, development, implementation, and migration. A year went by, the new website has gotten nowhere. Yet, we need to pay $32,500. This is super wasteful, but it is what happen when someone has no experience in web technologies take charge of the website. I have nothing to say. I just do my part and go with the flow.

Users’ Privacy

I have been in the game for over 20 years making websites and my philosophy hasn’t changed. My first priority has always been our users. From accessibility to usability to security to privacy, I fight for our users every step of the way.

When I was in charge of the site, I made sure the pages are fast, secured, easy to navigate, and optimized across devices and screen readers. The pages had to work with JavaScript turned off. I am not against using JavaScript. In fact, I encourage using JavaScript through progressive enhancement. My concern has always been the abuse of JavaScript, particularly in the privacy territory.

When I had to work directly with third-party vendors on digital marketing, I needed to know exactly what information they collect from our users and what they do with the data. Furthermore, I would limit their tracking to relevant pages, and not the entire website. I also made sure that they would be responsible for any privacy issues they created. If I didn’t hold them accountable, they would have the ability to use cross-site scripting to hijack our site to do whatever they wanted with our users’ data. I wouldn’t allow that to happen under my watch.

Dark-Pattern Scripting

As I was driving on the road, I received text messages, emails, and phone calls about our site was being hacked. When someone clicked on an email link on any page, they would get a pop-up form instead of their email client. The recipients would get an email from [email protected] instead of the senders’.

My first thought was our site was being hacked with XSS (Cross-Site Scripting). I called my assistant on my phone and walked her through the diagnose. I asked her to look for strange scripts in our templates. Then I asked her to comment out the script tags, which included Google Tag Manager and Pixel Tracking. When she commented out the Pixel Tracking script from a third-party vendor, the pop-up form went away.

The Pixel Tracking script allowed them to hijack our site and inject XSS into our pages with any email links. The JavaScript codes created the pop-up form. The submission from the pop-up form allows them to obtain all of the email messages. This is a serious privacy concern. Email communications should be between the sender and receiver, not the third-party.

I didn’t work with them on this Pixel Tracking script. When I worked with third-party vendors in the past, I made sure that they told me exactly what they were capturing. They would need to check with me first before they implement these types of dark patterns. I would also limit their tracking to a specific set of pages under a directory instead of the entire site.