AdamCap.com

I wrote fairly extensively regarding the 2019 AC.com redesign when it launched, and I knew then, as I took a loupe to my work, that the design had issues. Collating that assessment was constructive because it forced me to acknowledge shortcomings that I may otherwise have turned a blind eye. I kept ideas for improvements in the back of my mind, to work themselves out (stew, as I like to put it), while I submersed myself in other matters.

Yesterday ended up being a “I have nothing planned / oh god / I’m feeling existential uselessness slash woe” kind of day¹, so in an attempt to make something of quiescence, I opened my laptop and forged ahead with an assortment of creative adjustments.

Tweaks

Goodbye, Home Header

I called this element “experimental” initially, and upon reevaluation, it was overly ambitious; it had too much going on. Presented was a fat stack of links, boxes, and doodads for the end-user to manage—too much for a single pair of eyes to concisely assess. Though it lacked focus, it did contain redeeming elements. I still think overflow: scroll will be relevant as long as viewports are limited. The property allows you to include more (whatever) in less space. That’s useful! I moved the posts lists (titled “Blog,” “Dingus,” and “Reading”) to widgets, located the right or end of posts (depending on your viewport)—and swapped the latter two posts lists for more blog posts, which is the trademark content on here I’d be wise to promote.

With those elements salvaged, I retired the home header. It created inconsistency between the home page and every other page on the site. That’s an indication of poor planning; I should want the elements—especially the header, which is perpetually visible—to be coherent throughout. Users shouldn’t have to rack their brains to figure out what the design is going for.

Byline, Revised

The words “published” and “updated” have been replaced with “↘︎” and “↗︎” (respectively) (see this code snippet for more), and the “read in” phrase has been eliminated entirely. These omissions improve the legibility of the date and read time (since there’s less redundancy in the way) and the arrows help draw the eye toward the start of each post, to begin reading.

The shortened byline also now fits flush—on a single line!—on my ant-sized iPhone SE screen, which is joy.

I’m tickled about this update. The diagonal arrows are intuitive, I think, yet I can’t recall encountering quite this same application of arrows in bylines before.² (Maybe there’s a reason for that. Reversion incoming…) If I’m scrupulous, I’ll end up replacing the HTML arrows with SVG ones (possibly these) so that the symbols will be consistent across browsers and operating systems. (Right now, they’re not. Alas.)

Photos of Moi

In the sidebar, instead of Shrek! and wooden spatulas (among other various read items and dinguses), there are now random photos of me. Your boi. I mentioned that my face has to be seen, and though previously it was unavoidable on the home page, it was absent all elsewhere.

Well, I’m back. Pervading your space. Eyes on ya. HEY. (Granted, on mobile, my physiognomy still can’t be seen without scrolling a mile, so there’s still a puzzle unsolved.)

Related: I will plunge into this later, in another post, about what I was going for with the books and dinguses that resided in that sidebar spot previously, but, for now, a teaser: Affiliate programs are for the lazy and suckers.

Join My Newsletter…

I’ve placed newsletter signup forms at the bottom of every post. Oh, look, here’s one now:

If I want to accelerate whatever I’m doing with this blog (or my life…), I need to be able to apprise those who may be interested in what I’m doing that “hey, I am up to something!” I’m all-out on social media, which means that email is essentially my only way to shout from a digital mountain. (And this’s not to discredit email—I think email is far more stable and a safer investment of time/energy/money than social media, but most people are blasé about it; email’s old technology. We are in the midst of a revival in newsletters, but that interest will intensify and reverse course again soon, and the internet will again be sick of them; think of a ship undulating.)

BTW, web dev nitpickers: I am aware that the Buttondown iframe is an external resource and slow to load and I should be hosting my own form and probably a pop-up too. I’m not getting lost down that rabbit hole of optimization yet. The iframe functions well (I prefer how it handles the signup process to the vanilla HTML form provided by Buttondown) and, importantly, it’s enough. Visitors can join easily—if they want to—now.

Nav Nudges

The next–previous posts navigation, floated to the right of the byline, is newly pronounced. I added the word “skip” to the right arrow (“⇢”), and the separator is now an erect pipe (“|”) instead of a limp forward slash (“/”). I knew this element needed a lift after I hadn’t looked at the site in a while and, upon return, immediately thought it finicky, vague, and inchoate.

Tag Spacing

Post tags have been spaced out, so maybe you and I will actually notice and point a cursor at them. Not that I’ve done a superlative job at tagging content over the years, in a way that would foster meaningful connections between content, facilitate discovery, and warrant the tags’ perusal, but…(trails off)…(inarticulate)…(choking sounds)…click them anyway!

Wish List

There are two features I have in mind to improve functionality:

1. Autoload more posts in widgets when the termini of the posts lists are reached (i.e., incorporate infinite scrolling)
2. Enable keyboard navigation to move between posts (on single post pages and archives) (using left and right arrows, or J and K)

Both features will require custom JavaScript, which is my weakest language (of the ones I at least feign to understand). (HELP.) Call me sold on the overflow: scroll posts widgets (“Overflow, 2020.”), so I consider it worth the time to figure that out. Keyboard nav is something I’ve done on PkmnCards, so I don’t think it’ll be too difficult to swing, but I’m already envisioning issues that beget complicated solutions and JS still viscerally perplexes me.

---

¹ Am I the only one who experiences this? It’s an anxious feeling of pending self-nihilism. If I’m not moving, or nothing around me is moving, I’m on edge.

² Smashing Magazine uses a loopy arrow (“↬”) in their article summary sections, which is where I got the idea from. I want to differentiate when a post has been published versus updated though, so the distinct downward (to signify “published,” in the sense that the content has landed) and upward (to signify “updated;” self-explanatory) arrows make contextual sense.

If, after a week, I’m already over my latest AdamCap.com redesign, does that count as progress? (Too soon? Not soon enough?)

I’ve launched redesigns in the past (to be enumerated below), and for each I’ve been privately optimistic that the “new wheels” would spurn creativity and drive and that I’d finally start consistently blogging for once, which I never have in the past, starting then, there, on launch. …Now. Any time. Soon. —I always feel the same deep-down-I-know-it-is-hollow optimism—the progression which follows is similar to that which ensues when you splurge on a product or service, thinking it will help engrain some positive habit or end, because with X in hand or at your disposal, “What you want will be so much easier to attain,” and for exactly one week or month, you are motivated, and it is easier to get yourself doing it, whatever it is—reading, losing weight, drinking water, writing—then the shiny new toy loses novelty, you forget about it, or get busy, and all that momentum abruptly decrescendos into a junk drawer and is eventually regifted to your indifferent (but courteous) “Yeah-OK-I’ll-Take-It” sibling or mom or the trash can.

In the case of my web redesigns, what I splurge is time. I put over a month of full-time work into this recent redesign. That is about how long it takes to make a good website. I did not make money during this time (working rate: $0/hour for approx. 197.5 hours from Dec–Jan), and not making money for that long may as well count as splurging money. I justify this cost because I figure during the process I will improve at web development, kick-start a business (or some kind of financial opportunity for myself), and make the money back later. But that is no shot fish in a barrel. And the real reason I ever redesign my blog is because I think if I have it configured “right,” that I’ll start writing more.

I’ve yet to reach “right.” It doesn’t exist. Writing is the hard part of this endeavor for me. I can code and manage a web property with some celerity. But producing content has always been slow, and tweaking stylesheets doesn’t make words flow any faster or more consistently. I’ve needed to write first, design later. The logical progression would be to make do until the habit is firmly established, then clear hindrances by obtaining resources. I’m acting backwards, again, because I am stubborn, but I did plan this redesign more thoughtfully than past ones (truly! [I swear! (really!)] ) which were inspired with mostly aesthetic (and not so many practical) ends in mind.

I’m going to describe a few of the atypical design elements in play for AC2019. (Which, really, I should not need to do, if the design is actually intuitive and good, but this process will (1) help me, at least, better understand what I was going for and (2) make blatant issues blatant, allowing me to address them.)

Design Elements

Three-Column Home Header

This is a convoluted, experimental, I-won’t-blame-you-if-you-call-it-dubious approach to a header that’s turned out to be…okay? (What?) To elucidate, column by column:

• Column 1: Navigation makes residence in C1, which, really, is an impractical position for navigation, because this situates it on the left side of the viewport, which may as well be mile away from the habitual cursor turf of a right-handed user. (Meaning: It’s a hassle to drag your mouse over there and give the menu use.) But I wanted to employ the underlined ADAM CAP “logo” (I use this term loosely) in the same position throughout the redesign (this is just the home header, remember; all other pages look different), and vertical nav makes efficient use the horizontal space afforded here. I get to include my beloved pixelated A icon in C1, too.
• Column 2: I desperately want to apprise users of new content, without making them scroll far (or at all), while providing them the ability to reference past content almost as effortlessly, and this is my solution. These three widgets show at-a-glance what’s new and allow old stuff to be seen/accessed by scrolling—no clicks necessary to become informed. This is one of the less intuitive aspects of the design. It’s rare to see overflow-y: scroll; elements (though overflow-x: scroll; is becoming commonplace with mobile devices having narrow screens). Even if the average user never discovers the scrollbars, the elements still serve their most crucial purpose (“Here lies activity!”).
• Column 3: I am not at the point yet where I have steady traffic, so it seems critical inform my few passersby whose lawn they’ve tromped on. My face has to be seen (blogs without a face are instantly forgettable [no sideways stares either; “Eye contact!”]) and I feel it’s wise to further cement myself with a goofy, succinct tagline. I’d prefer to include my newsletter signup than the current flat, insipid “hire me” pitch here (but I don’t have the newsletter’s raison d’être even remotely defined yet, and I do need $). This is the designated “call to action” spot, essentially. I’ll figure it out eventually.

This header functions better than anticipated, though it lacks focus. I was worried, in particular, that the C2 overflow-y elements be unusable on mobile, but they’re okay. (If something doesn’t work on mobile, then it doesn’t work at all; mobile users comprise an increasing percentage of the internet’s horde each month, and it’s imprudent not to tailor the web surfing experience to them.) Parts of the home header will inevitably be tweaked, but I’m at least not neurotically stressing out about needing to do so yet. (grits his fucking teeth)

Slanted, Canted, Offset, and Askew

This was a theme I incorporated sparingly (once) but prominently (in the header) in my last iteration of AdamCap.com. I brought transform: rotate(); over to SixPrizes for its 2017 redesign, and rotation pervades even more now. I considered myself brilliant and archetypal for incorporating canted elements then, but this appears to be a common design trend in 2019. I keep seeing it everywhere. Maybe it’s always been a trend and I’m just now realizing it. Regardless: Everyone else who’s canting their divs: Please stop. Give me this one opportunity to stick out and appear different and innovative for once. I mean it. (Thanks!)

I’ve not offset the positions of elements much in the past, but I made a deliberate effort to do so this time around. This technique helps add contrast, which makes individual elements more distinguishable and thus the site more navigable.

Anchors, Matey

I struggle with the decision to show (A) excerpts or (B) full content on archive pages. I prefer—usually—to see a full post if I hit the home page of a blog so that I don’t have to click (and then wait, again, for a page to load) to continue reading. Clicking is a decision, and work, and I don’t want to make decisions or do work. Please, take the wheel. Write well, and draw me in. Decide my fate for me. The less it takes to immerse a reader, the better.

However, when dealing with long-form content, which is what I tend to write, it’s a problem if the user encounters a topic they have zero interest in, and the entry is longer than a single viewport height. Scrolling past can feel like being stuck on a cyber treadmill, and the user will jump ship (leave my site) if they become overly disoriented or entangled. (Mayday! Mayday! Man overboard!) I lose my compass scrolling through the new AdamCap.com home page at times, and I am the sole author here. If anyone should be able to keep their bearings, it’s me. (An inauspicious sign this is, surely.)

My solution to this predicament was to add anchor links (these: ⇠ / ⇢) below post titles so that it’s possible to skip around, post by post, with infinitely higher velocity and precision. This is another unintuitive feature (even more so than the occult overflow-y above; I don’t know how anyone’s going to discover it), but the concept intrigues me and perhaps I’ll come up with a more effective implementation of it later.

Anchor links mesh cooly with my new M.O. because they (anchor links) provide instantaneous feedback. They’re fast. I really like the idea of loading a bunch of content (with a single page load) and letting a user zip through it all, in a deliberate way, and anchor links make that kind of interaction possible.

Sidebar Favs

What I am going for in the sidebar (to the right of posts) is to randomly display items from a curated list of my favorite things (you can buy on Amazon [to support me with scant affiliate commissions…]). What I’ve realized while typing this is that this idea (“favs!”) is boneheaded and unquestionably dubious because, even if I do see success with Amazon’s affiliate program, it places me at the mercy of Amazon. The big AZ. And that relationship has gone sour before. Amazon lowered their payout rates two years ago (in Mar 2017; my earnings dropped by over half the following month), and my Associates account was almost auto-terminated from the program the following year, out of the blue, erroneously. (Customer service resolved the glitch, but the incident certainly perturbed me.) It’s delusional to think I could come anywhere close to earning a stable, living income this way, and that has been my pie-in-the-sky hope here.

Instead, I should be promoting myself. I’m the commodity. And, from looking through past iterations of this website, it seems I’ve gotten away from doing that.

Past Designs

Nov ’09–Jan ’11

AdamCapriola.com (source)

web.archive.org

This is the earliest capture of any of my web entities from the Wayback Machine. AdamCapriola.com served to share me (my personality and personal interests), essentially. I had started SixPrizes.com a few months earlier and thought it was important to have an outlet (to come across as a relatable, real person) if I was to make it online. The images are broken, but I was evidently into relaying what I was wearing each day. I evidently had a “Fan Page” as well. Who knew.

There’s not much to say about the design. I used a theme called Atahualpa because it was easy to customize, and I read somewhere that red is attention grabbing, so I made the titles red.

AdamCap.com (source)

web.archive.org

AdamCap.com existed alongside AdamCapriola.com and contained content more rhetorical in nature. I think. (I am writing this ten years removed from the endeavor, and almost the entirety of it evades my memory.) The tagline reads “Thoughts on life, success, and human nature.” (Turns pale. [Dies.]) (Please ask Siri to dial 911 or shout for help if your eyes also roll clear into the back of your head and remain lodged there for 10+ seconds.)

Notably, I had a newsletter (no recall of what I spouted about—those archives were lost, tragically) and active comments sections, so I did some things right. But I should emphasize: the internet was different back then; this was a time of possibility for the little guy. The web had not become so big and centralized (and wearied and jaded) yet, and a small website like mine, with almost no substance but gumption, could attract a responsive audience.

Re: the design: The capture’s stylesheet is broken, but AdamCap.com was likely identical to AdamCapriola.com.

Jan ’11–Aug ’11

AdamCapriola.com (source)

web.archive.org

I added a third column and switched to excerpts. This looks okay to me; the design is clean, if nothing else. Logo font: Helsinki.

Aug ’11–May ’13

AdamCap.com (AdamCapriola.com Absorbed) (source)

web.archive.org

Above is what I have screen-captured in My Documents. Which looks great! It’s distinctive, at least, and exudes character. Opaque box-shadows still see use every now and then, most typically in retro-style designs. The red-bordered post titles are emphatic and I think serve well to draw the eye where it should be.

However, seen here is only a partial header. With the complete header, this design doesn’t look so hot:

The red–white–teal color scheme is a shade away from matching Aquafresh. That’s all I can think of when I look at this. ProTip: Toothpaste should not be evoked through web design. I was going for color contrast, but just no.

I could have done without the first row of the header; my name (Adam Capriola) was already above the fold (in the sidebar), and the recent tweet display (“GETTING GNAR OFF OVERLY-RIPE BANANAS #WASTEDDDDDDDDDDD – 3 DAYS AGO”), which feigned liveliness, was a cop-out for going long stretches without posting new content. (I should have been writing stuff for the blog instead of wasting breath [and brain cells] on social media.)

May ’13–Dec ’13

AdamCap.com (source)

web.archive.org

This was a short-lived design that I never completed for unremembered reasons. I launched it half-finished and it stayed that way. (Meow.)

Dec ’13–Feb ’16

AdamCap.com (source)

web.archive.org

I’m aghast that I let this design persist so long. It’s minimal to fault. It evinces none of my personality and is completely forgettable. Perhaps it speaks of my mental state through these years. The big feature here was the ability to sort by popular posts, which I doubt anyone did, except for me now and then to tug my own willy about how many views those popular posts had. Moving on…

Feb ’16–Jan ’19

AdamCap.com (source)

web.archive.org

AC2016 was designed for 1024px-wide viewports and none others. This screenshots shows the design at native size. With a viewport any wider or narrower, you’d have to zoom to read properly, so most initial impressions of my site were probably poor. It was a total mistake to not address this. (By 2016, even I, the wannabe Luddite who held onto his flip phone forever, owned a mobile device and could appreciate mobile-friendly design.) What happened is that I put 100% of my focus into the desktop design and I was too drained by the end of this process to even take a crack at mobile, so I put it off. And I never got to it. (Truth be told, I was lazy and addicted to video games at the time. Call me feeble.)

However, the combination of Abril Display (for H1), Freight Sans Pro (for H2–H6), and Freight Text Pro (for body) does look sharp. My face and name are unavoidable. And a handful of visitors were so captivated to email me. So there were elements that fell into place effectively.

2019–?

AdamCap.com

I’ve delved into the unique aspects of this design already, but one more thought: Perhaps the biggest fault with the current design is the lack of “me” above the fold on mobile and outside the home page—my physiognomy should pervade. (Remember me!) I’ve tried to remedy this by inserting my headshot into the header, but including it anywhere up there throws balance off. (I’m fixed on maintaining the conspicuity of the ADAM CAP logo / post title area which leads downward into the content.) So I’m leaving my mug out until better inspiration strikes. Otherwise, the 2019 design is responsive and generally more engaging than previous iterations.

Takeaways / Future Plans

Publishing (for me) and reading (for you) have to be easy. That’s the overarching impetus behind AC2019. I’m attempting to construct a platform that tips me over and has me spilling my brains out into shark-infested waters.

However, I am a slow writer. It feels like I’m rollerblading up a steep hill naked every time I try to share anything on here. The sun is in my eyes, and people are watching. It is difficult for me to spill. Which means: The platform I step onto doesn’t matter at this point. Any of the above designs would suffice now. I need to write—wherever, however, to whomever, in whatever. It’s consistency that needs to be built up. I’m hoping that with repetition the writing process will become easier.

I’d envisioned having delineated sections within this redesign for specific content types, some of whose content I’d enter database-style, with optional commentary (i.e., writing), so that it would be simple for me to keep the site active. Fill in a few fields, and bango: new post! Ta-da! Read all about it! In practice, it’s too much, in the obverse sense of my publishing woes. I’ve coded cruft. I generate noise. The result is mechanical and flat. “Cut the chaff,” as my grandmother Myrtle used to say while indexing a Newport. All anyone is trying to do is communicate, and this is a conversation.

4:19 PM Friday afternoon
32°F and flurries
Berwyn, PA
“California Here I Come” — Bill Evans

People have told me they enjoy my writing, which to be frank flat-out astounded me when I first heard the sentiment. I struggled mightily throughout my formal schooling to piece together essays and fulfill creative prompts. Writing has never felt natural to me, and I suppose coincidentally I am not at all an eloquent orator. There are so many words and ways to arrange them. I’d almost rather not even try.

But writing is therapeutic for me. I can’t deny that. The times in my life when I’ve kept handwritten to-do lists and diaries of my days, I’ve felt more as if I’m moving somewhere forward. I can identify hurdles, actively stumble, and transgress ingrained tendencies into new existences. The act of bringing semi-physical manifestation to the abstraction of thought is powerful. From the visibility of nothing comes something, and an incredible cascade of action can electrify the consciousness. There are few greater catalysts; stagnation knows not the mirror.

So … I’ve decided to make a return to writing. Not just privately through the scraps of paper littering my desk, but also in the public eye. Blogging is an extension of the primordial ink that blackens the pulp, and it forces me to delve further into that which intrigues me. Dialogue can ensue; understanding be met. It seems to me a worthwhile endeavor and craft to hone — I’m the first to admit I need the practice. I can’t say I’ll maintain my penchant for in-depth, well-developed thought pieces, but that’s okay — and perhaps it’s better if I float more shallow introspections and investigations and open myself to fault. Is anyone ever right, anyway?

Topics of interest and that you can expect; these are a few currently:

• Electromagnetic fields
• Aliens
• Digestion
• Freedom of thought (and action)
• Piano jazz

I tend to be fickle and what captivates me at one moment may not the next. Oh, twenty-first century, how have you jaded me. Let’s get excited again.

I’m feeling really good about gutting and sewing back together this website. It’s taking longer than I’d hoped, I won’t make any money off it, and it could be seen as a waste of a few weeks, but I just feel real positive about it.

Seriously… how cool is it to have something to document your life? I wish I started something like this years ago, but now is better than never.

I’ve finally decided to work on this website again. It was one of my New Years resolutions, and I really want to follow through with all of them.

(I’ve actually knocked off a fair amount of them already which I’m pretty stoked about.)

I am a total believer in terror management theory, so to ensure I have some kind of legacy that remains long after I’m gone (and in turn boost my self-esteem to the stars), I’m going to make this website basically a log of my life.

I’ll just write about whatever I’m thinking about or working on at the time, post photo albums, document my health and measure my fitness levels, link to dumb YouTube videos I think are funny… basically make this site an open diary of sorts.

I’m still trying to plan out exactly how I’m going to organize all the different content, but it should be kinda cool and (maybe) technically sophisticated. I’ll be able to look back over the years and see what I was up to at different times in my life.

I don’t know how productive this will be in terms of return of investment, but I figure I’ll at least get some more practice with WordPress and it’ll be something I can always look back on. If I start writing about one topic in particular a lot, then maybe I’ll branch off and start a new website devoted to that subject and try to monetize it, but that’ll be a little ways off.

But yeah… just making this post to kinda get the ball rolling. I’m hoping to get everything set up within a week.