Welcome to the redesigned BarhamInk.com, the new home for Alora’s Tear and other writings by me, Nathan Barham. For most people, the take away is this: it’s fast! Like, really fast. Even if you’re on a limited mobile connection, BarhamInk.com should be one of the fastest sites you visit on any given day. And despite the speed increase, all of the content, features, and capabilities from the old site are still here (plus a lot more). If you’ve been following the book series since its debut in 2014 or if you’ve been following my writing on Apple, gaming, and other interests, you’ll notice more changes.

First and foremost, where once there were two sites, now there is only one. When I began writing Think Critical (at natebarham.com) my goal was simply to share my thoughts about technology and gaming, two interests that have been a part of my life for as long as I can remember. I hosted the site with Tumblr, and though it never really fit the trademark Tumblr aesthetic, there was enough customization that I could make the site look and behave almost exactly as I envisioned it.

In 2014 I published Alora’s Tear: Fragments, and with it, BarhamInk.com on Squarespace. This solution allowed me to focus on content first, things like important locations, a pronunciation guide, and thoughts on writing. Not to mention links for buying books and information about the new publishing entity I’d just created. Secondarily, Squarespace provided easy design templates to work with that didn’t require CSS or HTML.

Fast forward several years—and four novels. Things have changed. Now everything points to BarhamInk.com, one site to communicate my thoughts on various subjects as well as promote and enrich the world of Vladvir, its characters, and any future worlds when Askon and friends turn their final page.

For those who have seen all the iterations of my online writing presence, I thank you especially. Without the readers of Think Critical, I might not have felt confident enough to publish Alora’s Tear on my own. And for those who have always followed the books but never knew about the site that came before, it is my hope that you will enjoy having a more complete picture of the person who crafted Askon’s tale and all the tales yet to come.

Technical site details follow, if you’re into that sort of thing…

Readability

A number of years ago I read Butterick’s Practical Typography. It was the first formal consolidation of all the typography principles I was seeing applied across many of my favorite sites on the web, some of which are still actively maintained today (The Brooks Review, MattGemmell.com, Inessential by Brent Simmons, MacStories, and many others). I used these principles in designing the paperback versions of Alora’s Tear and have done so on BarhamInk.com as well.

Regardless of device, text should be large, clear and high contrast, with ample whitespace between lines and surrounding the content, while line length balances screen size with typeface size, never extending so far that they become tiring for readers. These details alone aim to make a better reading experience whether you’re visiting for a chapter-length excerpt or a blog post of a few dozen words.

The featured typeface is Quattrocento (in its serif and sans versions) to characterize the site’s text in a way that suggests both general purpose writing and medieval fantasy (when reading Vladvir-related content). If you block web fonts, you’ll get Palatino, Garamond, or just plain old serif. And, because I was too attached to it, despite examining dozens of alternatives, Adelle makes its way over from Think Critical for the site title courtesy of TypeKit.

Links and headings take on my favorite shade of green (Askon’s signature cloak is the same color for both practical and sentimental reasons), differentiating them from body text and navigation links. All links take on the underline text decoration when you hover over them with the cursor. Pretty standard, of course, but intentional nonetheless.

Images

Images take on several forms, most notably the large, highly detailed art from Isis Sousa, whose work is as much a part of the Alora’s Tear series as are my words. These big beautiful digital paintings take center stage, setting the tone for each volume’s preview page. Inside posts, images are smaller and can flow alongside the text on the desktop or tablet, while remaining inline on phone screens.

Navigation links are persistent across the site,but do not follow the reader (I despise sites that do this) as they scroll down the page. On desktop, each category has the ability to show a dropdown submenu for more options. For instance, the about section has a dropdown for The Author, Barham Ink, and The Site.

On mobile, there’s one link to buy books and a menu that takes readers to the main sections of the site, the submenu links from the desktop dropdown are provided above the content so mobile users don’t miss out on any of the content suggestions from the desktop version. Lastly, a second set of navigation appears below the featured image on book buying pages to highlight the places where you can purchase Alora’s Tear in paperback and ebook.

Responsive Design

In a world where most people consider their phone to be their primary computer (even if they don’t know it consciously) websites should present themselves in a way that makes life on a mobile device easier, and arguably the best version of that site. At the very least, desktop and mobile should be equals in content and access, while having individual design decisions that emphasize the strengths of the platform. BarhamInk.com is designed with these principles in mind. Anything that you can find easily on desktop, you can find just as easily on mobile.

A Note on Accessibility

Typography and readability are to 2013 (or so) as Accessibility is to 2018 (or so). In the intervening years, Apple has made significant efforts in their products to account for people of all abilities to enjoy them. I’d like to be doing the same here. My first step was to increase text size and contrast and to include alt-text on all images. The work of writers like Steven Aquino have helped me to understand that this should be an area of concern for all designers. If you find anything on the site that makes reading it unnecessarily difficult for certain people, please let me know.

Jekyll

I first heard about Jekyll from Matt Gemmell. It’s a static website generator that for my purposes, does three things:

  • Gives full control of HTML and CSS styling
    • Squarespace allowed some customization, but every template I tried had dependencies and corner cases where the site just never looked the way I wanted.
    • Tumblr had more control in this way; however, the platform itself was not designed for hosting websites like BarhamInk.com and Think Critical always felt shoehorned into a community where it didn’t belong.
  • Makes everything load much faster
    • Both previous sites, and especially the Squarespace version, were inexplicably (at least to me and other laypersons) slow to load. It’s a site with some text and a few images. Why a four or five second load time?
    • Jekyll uses static pages, which ends up meaning that loading the site is down to a small fraction of a second on a fast connection, and even when the connection is slow, the text and structure loads quickly while the images appear as they download.
  • Allows me to write in Markdown
    • Now, this is definitely not an exclusive feature, but as I use Ulysses to write novels, I’ve become very attached to Markdown syntax in my writing. Years ago, I attempted to get Marco Arment’s Second Crack working because I was attracted to the idea of typing up a plaintext Markdown document, dropping it into a folder, and having that post appear on my website. No Tumblr app needed, no Squarespace blog app needed, no visiting a web interface to post—just my words in the simplest file format possible and a folder that syncs.
    • Jekyll gets most of the way there, though it does require a push to the host. Maybe now that the site is in action, I’ll be able to find a way to just drop content into a folder and watch it appear.

Closing Thoughts

If you’ve made it this far, bravo! And I thank you. This site redesign has been an obsessive labor of love only equaled by the amount of focus I spend on the paperback versions of my books. Unfortunately I am not nearly as adept with HTML/CSS as I am with a descriptive paragraph or dialogue, but I hope my efforts make using the site more pleasant and reflect the attention to detail that I try to apply to all of my work.

-Nate