I get people writing into me saying "I love the layout/design/speed of your blog. How is it built?" It's an evolving process, but I wanted to share the core technology.

Content, Layout, Editing: Ghost

I am a big fan of Ghost, as I laid out in my article comparing Ghost with Medium.

I originally started writing on Blogger and Medium, but when Ghost became big enough for me to feel confident about it, I moved all my content over, and never looked back.

The main reasons I love Ghost are

• I really like the values of the founder, John Nolan, and the company. In their original mission statement, John asked the question: "If you eliminated all the promises of wealth from the roadmap up front, and tried to build a good company, how would that affect the product, business, customers, and every little decision in between?"
• Ghost is open source, and cheap to use and host. WordPress is like this too, and you can host it for as little as a few dollars a month. But not many other platforms are: Squarespace is $10+ a month, as is Wix, and
• Ghost is fast. There's a lot that goes into making a site fast, but at its core, Ghost serves up pages really quickly.
• The document-writing interface is a pure joy to use. The only other online document writer that I like at all is the one on Medium. Ghost's is equally as pleasant to write on.

A year after signing up for Ghost, I have no regrets. Writing posts is joy, much more so than in WordPress, even with their latest Gutenberg updates (which, as of 5.2, I still don't like, even though I'm clearly not a luddite — Koenig vs Gutenberg is the subject of an article to come).

Sign up for a trial with Ghost and check it out.

(I get a small commission if you do, but I've recommended Ghost for years before they offered commissions.)

Hosting: DigitalOcean, for really fast and cheap servers

You need a web host to store your web server. When people (like you, friendly visitor!) visit hooshmand.net, they are requesting pages from a server. (Unless you opt for the simpler route of letting Ghost do it all for you!)

DigitalOcean is basically a "server in the sky". A Linux machine somewhere out there in the cloud. It's the equivalent of a small computer with incredibly fast internet that you rent for $5 a month.

For anyone (like me) who is comfortable editing config files, having your own server for a website is a huge advantage compared to shared hosting.

Having my own server vs shared hosting means

• I can run multiple websites on one server if I want, slashing my hosting costs
• I can run web applications on my server too
• I can host code, static images and files, without any fuss (just upload and go)
• It's easy to manage on the road from a number of devices (I use Termius to access it remotely from my phones or computers)
• I can back up my whole server with daily snapshots

I started using DigitalOcean in 2016 when there were few alternatives. These days there's also Linode, or Cloudinary which sits in between. They're all very similar, but I can still recommend DigitalOcean and safely say I'm not using it anywhere near its limits.

I also use DigitalOcean to host Discover Discomfort on WordPress.

Image Compression: ImageOptim (Mac; PC alternative)

I'll put together a whole post on SEO optimization of images in a Ghost blog. But the most important part is this: Make sure the images are tiny.

Take the photos of elephants above, for example (which I took on Safari in the Maasai Mara). Here are the file sizes:

• Original raw image size: 21MB (5111 px width) (which of course I'd never publish on the blog)
• Lightroom JPG with standard settings, full resolution: 8.1MB
• JPG resized to 1500px, using Mac Preview: 707KB
• Resized JPG after ImageOptim (72%, stripping metadata): 136KB

Really the biggest difference is the one after reduction. That's where I was shocked to see just how small a JPG could get.

Another example: the cover image for this post was 626KB straight out of Adobe Spark. But the reduced file is only 79KB. That's an 87% reduction — typical, too.

The difference to page-loading time can be massive. Images are often the biggest files in a page.

My standard process for reducing an image is:

1. Resize, max width 2000, often less.
2. Convert to JPG or PNG, depending on the contents.
3. Rename to a keyword-dense filename.
4. Shrink with ImageOptim
5. Upload
6. Add alt tags and caption (also important for SEO).

Every one of these steps is important. But the only one using another important tool is compression.

Online, there's a tool called TinyPNG, which you can use on a Windows computer. Despite its name, it also works with JPG files. I've tested both and TinyPNG is a bit less effective (e.g. the above image compressed to 270KB rather than 136KB). I also prefer the drag-and-drop nature of compressing files with ImageOptim.

Share images: Adobe Spark

When people share images on Facebook, in Whatsapp, or whever else, a "share image" comes up. I find it's useful to show not just what the post is about, but also to describe it. It makes it more likely a person will click into the image.

For this, I use Adobe Spark. It makes it trivially easy to find an image and to place designed text on top of it. It literally takes me under a minute each time.

I also like to use a different share image to the cover image.

Ghost Theme Customisation

I've customised the basic Casper theme for Ghost. After you've customized the first five things, it's important to customize a few other things, like

• Your front page: I added in amore prominent subscriber box, and an "About" section so people would know why they're at my front page
• Tweaks to post layout: I got rid of the overlap with the first paragraph and the header image, for one thing
• Other pages: Making custom "about pages" for example.

In all of these, you need to learn a little about the "Handlebars" scripting language. It's not hard, and it's akin to writing Macros in VBA on an old version of Excel.