Begin in the middle.
The first paragraph, where you lay out what's about to happen. The half-apology you use to preface your comments at the meeting. The email that takes a paragraph or two to get to the point…
You can skip those.
Throat clearing is a good way to make sure that people are looking at you. And an even better way to give yourself time to collect your thoughts, to indulge your fears or to get yourself warmed up.
But we're already looking at you. We've clicked through to your link, given you the microphone, read your note…
Say all that stuff in your head, but, we'd really like to hear the best part first.
Begin in the middle.
Right there, there’s your problem.
I know you’d like to reach more people, and most people don’t read. But if you’re going to write, the only choice you have is to reach people who will choose to engage with you.
Do it properly, and there’s a chance that those voluntarily literate people will tell their friends and colleagues.
And of course, the same thing goes for trying to teach people who don’t learn, tell jokes to people who don’t laugh, and campaign to people who don’t vote. It almost always works better if you engage with people who are enrolled in the journey and then motivate them to engage with their peers.
PS for people who listen, the 16th episode of Akimbo is now live. I hope you get a chance to listen to my answer to the second question on this episode, about education…
’Tis a gift to be simple. Increasingly, in our line of work, ’tis a rare gift indeed.
In an industry that extols innovation over customer satisfaction, and prefers algorithm to human judgement (forgetting that every algorithm has human bias in its DNA), perhaps it should not surprise us that toolchains have replaced know-how.
Likewise, in a field where young straight white dudes take an overwhelming majority of the jobs (including most of the management jobs) it’s perhaps to be expected that web making has lately become something of a dick measuring competition.
It was not always this way, and it needn’t stay this way. If we wish to get back to the business of quietly improving people’s lives, one thoughtful interaction at a time, we must rid ourselves of the cult of the complex. Admitting the problem is the first step in solving it.And the div cries Mary
In 2001, more and more of us began using CSS to replace the non-semantic HTML table layouts with which we’d designed the web’s earliest sites. I soon noticed something about many of our new CSS-built sites. I especially noticed it in sites built by the era’s expert backend coders, many of whom viewed HTML and CSS as baby languages for non-developers.
In those days, whether from contempt for the deliberate, intentional (designed) limitations of HTML and CSS, or ignorance of the HTML and CSS framers’ intentions, many code jockeys who switched from table layouts to CSS wrote markup consisting chiefly of divs and spans. Where they meant list item, they wrote span. Where they meant paragraph, they wrote div. Where they meant level two headline, they wrote div or span with a classname of h2, or, avoiding even that tragicomic gesture toward document structure, wrote a div or span with verbose inline styling. Said div was followed by another, and another. They bred like locusts, stripping our content of structural meaning.
As an early adopter and promoter of CSS via my work in The Web Standards Project (kids, ask your parents), I rejoiced to see our people using the new language. But as a designer who understood, at least on a basic level, how HTML and CSS were supposed to work together, I chafed.Cry, the beloved font tag
Everyone who wrote the kind of code I just described thought they were advancing the web merely by walking away from table layouts. They had good intentions, but their executions were flawed. My colleagues and I here at A List Apart were thus compelled to explain a few things.
Mainly, we argued that HTML consisting mostly of divs and spans and classnames was in no way better than table layouts for content discovery, accessibility, portability, reusability, or the web’s future. If you wanted to build for people and the long term, we said, then simple, structural, semantic HTML was best—each element deployed for its intended purpose. Don’t use a div when you mean a p.
This basic idea, and I use the adjective advisedly, along with other equally rudimentary and self-evident concepts, formed the basis of my 2003 book Designing With Web Standards, which the industry treated as a revelation, when it was merely common sense.The message messes up the medium
When we divorce ideas from the conditions under which they arise, the result is dogma and misinformation—two things the internet is great at amplifying. Somehow, over the years, in front-end design conversations, the premise “don’t use a div when you mean a p” got corrupted into “divs are bad.”
A backlash in defense of divs followed this meaningless running-down of them—as if the W3C had created the div as a forbidden fruit. So, let’s be clear. No HTML element is bad. No HTML element is good. A screwdriver is neither good nor bad, unless you try to use it as a hammer. Good usage is all about appropriateness.
Divs are not bad. If no HTML5 element is better suited to an element’s purpose, divs are the best and most appropriate choice. Common sense, right? And yet.
Somehow, the two preceding simple sentences are never the takeaway from these discussions. Somehow, over the years, a vigorous defense of divs led to a defiant (or ignorant) overuse of them. In some strange way, stepping back from a meaningless rejection of divs opened the door to gaseous frameworks that abuse them.
Note: We don’t mind so much about the abuse of divs. After all, they are not living things. We are not purists. It’s the people who use the stuff we design who suffer from our uninformed or lazy over-reliance on these div-ridden gassy tools. And that suffering is what we protest. div-ridden, overbuilt frameworks stuffed with mystery meat offer the developer tremendous power—especially the power to build things quickly. But that power comes at a price your users pay: a hundred tons of stuff your project likely doesn’t need, but you force your users to download anyway. And that bloat is not the only problem. For who knows what evil lurks in someone else’s code?Two cheers for frameworks
There’s nothing wrong with using frameworks to quickly whip up and test product prototypes, especially if you do that testing in a non-public space. And theoretically, if you know what you’re doing, and are willing to edit out the bits your product doesn’t need, there’s nothing wrong with using a framework to launch a public site. Notice the operative phrases: if you know what you’re doing, and are willing to edit out the bits your product doesn’t need.
Alas, many new designers and developers (and even many experienced ones) feel like they can’t launch a new project without dragging in packages from NPM, or Composer, or whatever, with no sure idea what the code therein is doing. The results can be dangerous. Yet here we are, training an entire generation of developers to build and launch projects with untrusted code.
Folks, CSS is not broken, and it’s not too hard. (You know what’s hard? Chasing the ever-receding taillights of the next shiny thing.) But don’t take my word for it. Check these out:
- Getting Started with CSS Layout—Rachel Andrew, Smashing Magazine
- Learn CSS Grid—Jen Simmons
- CSS Grid Layout—MDN web docs
- Grid by Example—Rachel Andrew
- A Complete Guide to Grid—Chris House, CSS-Tricks
- Practical CSS Grid: Adding Grid to an Existing Design—Eric Meyer, A List Apart
- Jen Simmons Labs
- Layout Land—YouTube
- A Book Apart: The New CSS Layout, by Rachel Andrew
- The Story of CSS Grid, from its Creators—Aaron Gustafson, A List Apart
- Transcript: Intrinsic Web Design with Jen Simmons (The Big Web Show)
There’s a lot of complexity to good design. Technical complexity. UX complexity. Challenges of content and microcopy. Performance challenges. This has never been and never will be an easy job.
Simplicity is not easy—not for us, anyway. Simplicity means doing the hard work that makes experiences appear seamless—the sweat and torture-testing and failure that eventually, with enough effort, yields experiences that seem to “just work.”
Nor, in lamenting our industry’s turn away from basic principles and resilient technologies, am I suggesting that CDNs and Git are useless. Or wishing that we could go back to FTP—although I did enjoy the early days of web design, when one designer could do it all. I’m glad I got to experience those simpler times.
But I like these times just fine. And I think you do, too. Our medium is growing up, and it remains our great privilege to help shape its future while creating great experiences for our users. Let us never forget how lucky we are, nor, in chasing the ever-shinier, lose sight of the people and purpose we serve.
When people are confused, unengaged or dubious, it's probably because you haven't answered a very simple question to their satisfaction.
The answer doesn't have to be direct (quid pro quo doesn't scale very well) but it must be clear enough to be understood.
Marketing is often the craft of using symbols and inferences to make it very clear to people what they're going to get.
Math’s important. It’s elegant. It’s a magical way to deal with abstract concepts on your way to finding out the provable truth. There's not enough math in the world.
Math isn’t the same as arithmetic. Basic arithmetic is necessary, but everything beyond that is simply easily-graded compliance disguised as busy-work.
A high school principal told me that there’s a high correlation between students who fail to complete algebra and those that drop out of school before graduation. It’s not surprising if you think about it—factoring polynomials is a totally useless activity that only demonstrates that you’re good at school.
What would happen if we introduced variables and intuitive algebra and then immediately switched gears to probabilities (gambling and decision making) and statistics (sports, predictions and understanding the world as it is and it might be.)
What would a year of hands-on truth-finding do for a class of freshman? What mathematical and vocational doors would it open?
Every day we spend teaching hand factoring of binomials to non-math majors is another day we raise mathematically illiterate kids. What are we waiting for?
We have a choice, a chance to engage with two different environments.
There's the 'up or out' competitive mindset of the soccer squad. Every game you re-earn your spot on the team, or find yourself on the bench.
And there's the fortress, the sinecure, the satisfying feeling of knowing that we're safe. Or at least that we feel safe. This is my desk, my office and my job. When something interrupts that apparently secure perch, it feels a little bit like dying. Don't touch my stapler.
In the fast-moving world of 'up' is also the promise of possibility, the freedom to innovate, the requirement to be generous in your work. Out isn't nearly as important, it turns out, as forward.
Soccer is a zero-sum, winner/loser finite game. But life, it turns out, is a magical opportunity for up, and for forward.
While the sinecure demands little but compliance.
Here's the key question: Which feeling/experience/state do you look back on fondly? Which one engages you, challenges you, makes you the best version of yourself?
When you tell yourself your story—the story of last week, last month or last year—is it about how boring and secure life has become?
What you learn isn't up to someone else's curriculum or syllabus any more–it's on you, on each of us, to decide what's next, to decide who we will become. We're not in fifth grade, wondering if something is going to be on the test.
It used to be that only 10,000 people a year could learn from a top business school, that executive education cost more than a car, that strategies and insights were closely guarded secrets. Now, they're available to those willing to make the commitment.
That commitment is a choice. It's the choice to become a bigger contributor, to stand a little taller, to make a bigger difference.
Up isn't always what we're going to get. Sometimes, we challenge ourselves and fail. But the alternative, the non-choice of sitting still and hoping we'll be ignored in our little sinecure, isn't much of an alternative at all.
In this moment, this summer, right now, each of us has the chance for a bit more up. The chance to connect, to inspire and even to leap.
Today is the last/best day (the deadline) to apply for this summer's altMBA. This is what it feels like to level up.
If you knew,
and you could see the world through the eyes of the customer,
and you really cared…
What would you do?
That's a simple test of creating excellence.
So, if I'm on hold for 56 minutes with Orbitz, does the CEO know? Is that ever a desired outcome?
Does the engineer who shipped a hackable voting machine know that it's hackable?
The plumber who finished the job and left the hot/cold controls in reverse position… did he care enough?
Excellence cuts through bureaucracy and status quo and excuses and asks a simple question:
What would you do if you knew?
Most customer relationships don't stumble because something went wrong. Your best customers know that mistakes happen.
It's what happens next that can cripple the relationship.
How we recover from a miss is where the possibilities lie. If you're open, engaged and focused on making things better, the door is open to build a resilient, ongoing partnership. Not just for customers, but for all the people we work with and count on.
Too often, we're so focused on not hiccuping, or so filled with shame and blame when we do that we fail to allocate enough emotional labor to do the most important part–making things right. Not with a refund or a basket of fruit, but by truly seeing the other person, understanding what happened and doing the hard work to move forward.
What would you say if I told you I just read and analyzed over 350 articles from A List Apart in less than six weeks? “You’re crazy!” might have passed through your lips. In that case, what would you say if I was doing it for a grade? Well, you might say that makes sense.
As a part of an Independent Research Study for my undergraduate degree, I wanted to fill in some of the gaps I had when it came to working with the World Wide Web. I wanted to know more about user experience and user interface design, however, I needed the most help getting to know the industry in general. Naturally, my professor directed me to A List Apart.
At first I wasn’t sure what I was going to get out of the assignment other than the credit I needed to graduate. What could one website really tell me? As I read article after article, I realized that I wasn’t just looking at a website—I was looking at a community. A community with history in which people have struggled to build the right way. One that is constantly working to be open to all. One that is always learning, always evolving, and sometimes hard to keep up with. A community that, without my realizing it, I had become a part of. For me, the web has pretty much always been there, but now that I am better acquainted with its past, I am energized to be a part of its future. Take a look at some of the articles that inspired this change in me.A bit of history
I started in the Business section and went back as far as November 1999. What a whirlwind that was! I had no idea what people went through and the battles that they fought to make the web what it is today. Now, I don’t mean to date any of you lovely readers, but I would have been three years old when the first business article on A List Apart was published, so everything I read until about 2010 was news to me.
For instance, when I came across Jeffrey Zeldman’s “Survivor! (How Your Peers Are Coping with the Dotcom Crisis)” that was published in 2001, I had no idea what he was talking about! The literal note I wrote for that article was: “Some sh** went down in the late 1990s???” I was in the dark until I had the chance to Google it and sheepishly ask my parents.
I had the same problem with the term Web 2.0. It wasn’t until I looked it up that I realized I didn’t know what it was, because I never experienced Web 1.0 (having not had access to the internet until 2004). In that short time, the industry had completely reinvented itself before I ever had a chance to log on!
The other bit of history that surprised me was how long and hard people had to fight to get web standards and accessibility in line. In school I’ve always been taught to make my sites accessible, and that just seemed like common sense to me. I guess I now understand why I have mixed feelings about Flash.What I learned about accessibility
Accessibility is one of the topics I took a lot of notes on. I was glad to see that although a lot of progress had been made in this area, people were still taking the time to write about and constantly make improvements to it. In Beth Raduenzel’s “A DIY Web Accessibility Blueprint,” she explains the fundamentals to remember when designing for accessibility, including considering:
- keyboard users;
- blind users;
- color-blind users;
- low-vision users;
- deaf and hard-of-hearing users;
- users with learning disabilities and cognitive limitations;
- mobility-impaired users;
- users with speech disabilities;
- and users with seizure disorders.
It was nice to have someone clearly spell it out. However, the term “user” was used a lot. This distances us from the people we are supposed to be designing for. Anne Gibson feels the same way; in her article, she states that “[web] accessibility means that people can use the web.” All people. In “My Accessibility Journey: What I’ve Learned So Far,” Manuel Matuzović gives exact examples of this:
- If your site takes ten seconds to load on a mobile connection, it’s not accessible.
- If your site is only optimized for one browser, it’s not accessible.
- If the content on your site is difficult to understand, your site isn’t accessible.
It goes beyond just people with disabilities (although they are certainly not to be discounted).
I learned a lot of tips for designing with specific people in mind. Like including WAI-ARIA in my code to benefit visually-impaired users, and checking the color contrast of my site for people with color blindness and low-vision problems. One article even inspired me to download a Sketch plugin to easily check the contrast of my designs in the future. I’m more than willing to do what I can to allow my website to be accessible to all, but I also understand that it’s not an easy feat, and I will never get it totally right.User research and testing methods that were new to me
Nevertheless, we still keep learning. Another topic on A List Apart I desperately wanted to absorb was the countless research, testing, and development methods I came across in my readings. Every time I turn around, someone else has come up with another way of working, and I’m always trying to keep my finger in the pie.
I’m happy to report that the majority of the methods I read about I already knew about and have used in my own projects at school. I’ve been doing open interview techniques, personas, style tiles, and element collages all along, but I was surprised by how many new practices I’d come across.
The Kano Model, the Core Model, Wizard of Oz prototyping, and think-alouds were some of the methods that piqued my curiosity. Others like brand architecture research, call center log analysis, clickstream analysis, search analytics, and stakeholder reviews I’ve heard of before, but have never been given the opportunity to try.
Unattended qualitative research, A/B testing and fake-door testing are those that stood out to me. I liked that they allow you to conduct research even if you don’t have any users in front of you. I learned a lot of new terms and did a lot of research in this section. After all, it’s easy to get lost in all the jargon.The endless amount of abbreviations
I spent a lot of my time Googling terms during this project—especially with the older articles that mentioned programs like Fireworks that aren’t really used anymore. One of my greatest fears in working with web design is that someone will ask me something and I will have no idea what they are talking about. When I was reading all the articles, I had the hardest time with the substantial amount of abbreviations I came across: AJAX, API, ARIA, ASCII, B2B, B2C, CMS, CRM, CSS, EE, GUI, HTML, IIS, IPO, JSP, MSA, RFP, ROI, RSS, SASS, SEM, SEO, SGML, SOS, SOW, SVN, and WYSIWYG, just to name a few. Did you manage to get them all? Probably not.
We don’t use abbreviations in school because they aren’t always clear and the professors know we won’t know what they mean. To a newbie like me, these abbreviations feel like a barrier. A wall that divides the veterans of the industry and those trying to enter it. I can’t imagine how the clients must feel.
It seems as if I am not alone in my frustrations. Inayaili de León says in her article “Becoming Better Communicators,” “We want people to care about design as much as we do, but how can they if we speak to them in a foreign language?” I’m training to be a designer, I’m in Design, and I had to look up almost every abbreviation listed above.What I learned about myself
Prior to taking on this assignment, I would have been very hesitant to declare myself capable of creating digital design. To my surprise, I’m not alone. Matt Griffin thinks, “… the constant change and adjustments that come with living on the internet can feel overwhelming.” Kendra Skeene admits, “It’s a lot to keep track of, whether you’ve been working on the web for [twenty] years or only [twenty] months.”
My fear of not knowing all the fancy lingo was lessened when I read Lyza Danger Gardner’s “Never Heard of It.” She is a seasoned professional who admits to not knowing it all, so I, a soon-to-be-grad, can too. I have good foundations and Google on my side for those pesky abbreviations that keep popping up. As long as I just remember to use my brain as Dave Rupert suggests, when I go to get a job I should do just fine.Entering the workplace
Before starting this assignment, I knew I wanted to work in digital and interaction design, but I didn’t know where. I was worried I didn’t know enough about the web to be able to design for it—that all the jobs out there would require me to know coding languages I’d never heard of before, and I’d have a hard time standing out among the crowd.
The articles I read on A List Apart supplied me with plenty of solid career advice. After reading articles written by designers, project managers, developers, marketers, writers, and more, I’ve come out with a better understanding of what kind of work I want to do. In the article “80/20 Practitioners Make Better Communicators,” Katie Kovalcin makes a good point about not forcing yourself to learn skills just because you feel the need to:We’ve all heard the argument that designers need to code. And while that might be ideal in some cases, the point is to expand your personal spectrum of skills to be more useful to your team, whether that manifests itself in the form of design, content strategy, UX, or even project management. A strong team foundation begins by addressing gaps that need to be filled and the places where people can meet in the middle.
I already have skills that someone desperately needs. I just need to find the right fit and expand my skills from there. Brandon Gregory also feels that hiring isn’t all about technical knowledge. In his article, he says, “personality, fit with the team, communication skills, openness to change, [and] leadership potential” are just as important.
Along with solid technical fundamentals and good soft skills, it seems as if having a voice is also crucial. When I read Jeffrey Zeldman’s article “The Love You Make,” it became clear to me that if I ever wanted to get anywhere with my career, I was going to have to start writing.Standout articles
The writers on A List Apart have opened my eyes to many new subjects and perspectives on web design. I particularly enjoyed looking through the game design lens in Graham Herrli’s “Gaming the System … and Winning.” It was one of the few articles where I copied his diagram on interaction personality types and their goals into my notebook. Another article that made me consider a new perspective was “The King vs. Pawn Game of UI Design” by Erik Kennedy. To start with one simple element and grow from there really made something click in my head.
However, I think that the interview I read between Mica McPheeters and Sara Wachter-Boettcher stuck with me the most. I actually caught myself saying “hmm” out loud as I was reading along. Sara’s point about crash-test dummies being sized to the average male completely shifted my understanding about how important user-centered design is. Like, life-or-death important. There is no excuse not to test your products or services on a variety of users if this is what’s at stake! It’s an article I’m glad I read.Problems I’ve noticed in the industry
During the course of my project, I noticed some things about A List Apart that I was spending so much time on. Like, for example, it wasn’t until I got to the articles that were published after 2014 that I really started to understand and relate to the content; funnily enough, that was the year I started my design degree.
I also noticed that it was around this time that female writers became much more prominent on the site. Today there may be many women on A List Apart, but I must point out a lack of women of color. Shoutout to Aimee Gonzalez-Cameron for her article “Hello, My Name is <Error>,” a beautiful assertion for cultural inclusion on the web through user-centered design.
Despite the lack of representation of women of color, I was very happy to see many writers acknowledge their privilege in the industry. Thanks to Cennydd Bowles, Matt Griffin, and Rian van der Merwe for their articles. My only qualm is that the topic of privilege has only appeared on A List Apart in the last five years. Because isn’t it kinda ironic? As creators of the web we aim to allow everyone access to our content, but not everyone has access to the industry itself. Sara Wachter-Boettcher wrote an interesting article that expands on this idea, which you should read if you haven’t already. However, I won’t hold it against any of you. That’s why we are here anyway: to learn.The takeaway
Looking back at this assignment, I’m happy to say that I did it. It was worth every second (even with the possible eye damage from reading off my computer screen for hours on end). It was worth it because I learned more than I had ever anticipated. I received an unexpected history lesson of the recent internet past. I was bombarded by an explosion of new terms and abbreviations. I learned a lot about myself and how I can possibly fit into this community. Most importantly, I came out on the other end with more confidence in myself and my abilities—which is probably the greatest graduation gift I could receive from a final project in my last year of university. Thanks for reading, and wish me luck!Thanks
Thanks to my Interactive Design professor Michael LeBlanc for giving me this assignment and pushing me to take it further.