Skip to main content

Geoff Graham

Read, write, coffee, web, repeat.


Preventing Suicide with UX: A Case Study on Google Search

I came clean about my long-running and ongoing battle with chronic depression last year in a blog post on my personal site. But don't worry, things are no worse than they were then and this post is about something else. This post is about designing empathetic user experiences.… Read article “Preventing Suicide with UX: A Case Study on Google Search”


Having fun with link hover effects

A designer I work with was presenting comps at a recent team meeting. She had done a wonderful job piecing together the concept for a design system, from components to patterns and everything in between that would make any front-end developer happy.

But there was a teeny tiny detail in her work that caught my eye: the hover state for links was a squiggle.… Read article “Having fun with link hover effects”


Slow Websites

The web has grown bigger. Both in expansiveness and weight. Nick Heer's "The Bullshit Web":

The average internet connection in the United States is about six times as fast as it was just ten years ago, but instead of making it faster to browse the same types of websites, we’re simply occupying that extra bandwidth with more stuff.

Nick clearly explains what he means by bullshit, and one can see a connection to Brad Frost's similarly framed Read article “Slow Websites”


Short note on the accessibility of styled form controls


A Quick Roundup of Recent React Chatter

Like many, many others, I'm in the pool of leveling up my JavaScript skills and learning how to put React to use. That's why Brad Frost resonated with me when he posted My Struggle to Learn React."Read article “A Quick Roundup of Recent React Chatter”



The block-overflow property truncates text and indicates more content follows by inserting an ellipsis or custom string after a number of lines that is set by the max-lines property.… Read article “block-overflow”



The offset-anchor property defines a point within the box it is applied as the anchor that moves along the offset-path.

That's kinda wordy, so let's break that down a bit.… Read article “offset-anchor”



The line-clamp property truncates text at a specific number of lines.

The spec for it is currently an Editor's Draft, so that means nothing here is set in stone because it's a work in progress. That said, it's defined as a shorthand for max-lines and block-overflow, the former of which is noted as at risk of being dropped in the Candidate Recommendation.… Read article “line-clamp”


VuePress Static Site Generator