Have you ever stopped to consider why Assembly programmers are always soaking wet? They work below C-level.

This is Real-Time Overview for Wednesday, November 21st, 2018, and hopefully this will give you something to listen to while you’re traveling for Thanksgiving, at least if you’re in the US. If you’re not, then even better, you’re listening because you actually want to hear about some helpful articles. Not that you travelers don’t of course. And see, this is how you make a mess of an introduction, so before I dig myself a deeper hole, here’s this week’s article roundup.

So, in our last episode of Real-Time Overview, I featured an article from

Boris Müller on the blandness of current web design trends. In the spirit of that article, I want to mention another article, this one from Andrew Haller at the AirDev blog that takes another look at this topic.

Andrew shares a number of examples with the reader to showcase how homepage centerpiece calls to action have begun to homogenize across a number of brands. He then digs into what he thinks some of the reasons are for this trend. The first big one is understandable – herd mentality. When something works, we tend to stick to it. We also tend to trust the alphas in the pack to make the right decisions for us to emulate. I do think that’s a rather natural process of design evolution that you can trace back through not just web design, but trends throughout the decades in all fields.

The second was a need to educate the user – or not – as the case may be. We mention Jakob’s Law a lot, but that’s because it’s important. It says: “Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.” So back to the idea of herd mentality, you follow the leader.

Honestly, I don’t think the trend of web design tending to follow certain themes is bad, and my point in sharing these particular articles the last couple episodes isn’t necessarily to encourage you to go out and be entirely avant garde with your next design. Instead, I want you to think about what opportunities it affords you, what tweaks you could make, and where you can safely experiment to improve upon the conventions. Just because you follow the trend doesn’t mean you have to be an absolute carbon copy, after all.

You can read Andrew’s ideas on this subject over at the company blog for AirDev.

This week, you can check out an article featured at UX Collective on Why are Micro-Experiences so Important to UX Design by Shane Ketterman.

It’s by sheer chance that this article is also a throw back to a recent Real-Time Overview episode where we covered this topic from another source. That time it was the Nielsen Norman Group.

Shane’s first thought is about how UX design is about sweating the small stuff, which is important because a user’s experience is composed of countless small things that happen in the course of engaging with your website. Some of them even take place at an unconscious level. But those small things add up, and can define what separates good UX design from bad.

Now, I should take a fast step back real quickly though. The Nielsen Norman article focused on micro-interactions, whereas Shane’s is on micro-experiences, and that deserves to be called out since I think both would agree that they are referring to different things. Confused? Don’t be. These are two sides to the same coin, and they both focus on, as Shane said, sweating the small stuff.

One will usually inform the other, and this article offers some suggestion as to what guidelines might look like that focus on making micro-experiences for users better as you iterate on a project. As he puts it, micro-experiences start to take shape when you’re refining and scrutinizing the effectiveness of your design.

Go give Shane’s article a read over at UX Collective, and you can catch the Nielsen Norman case study link back on the Halloween episode of Real-Time Overview. As always, links to all these articles are in the shownotes over at drunkenux.com.

In the land of web development, two things are constant: death and redesigns. Okay, fair enough, I really don’t know how death factors into it, but dang it, I wanted to make the joke for better or worse, and I apologize, because I know it’s worse.

That being said, swing by Search Engine Land and you can read an article by Marcus Miller that that looks into Recovering SEO Traffic and Rankings After a Website Redesign, because at some point we’re all bound to be brought into a redesign, large or small, and someone’s going to ask the question about what it means for search engine results.

We generally tend to think about website redesigns at a high level about the visual and functional changes that come along with it. Information architecture frequently factors in at some point, though, and changes to the organization of content on your site inevitably result in things moving, being combined or split up, or removed entirely. Once this work starts, that’s where our question comes in.

Luckily, there’s actually a lot you can do to ensure your search results continue to score well and don’t lead users to 404 pages. First and foremost, before you start swapping out all those pages, you need to understand and have a grasp on where you were. What pages ranked for, how much traffic they brought in, and where they were. If you haven’t established that baseline, it can make it harder for you to notice a problem, and harder still to trace it backwards to fix. So stop first and make sure you know what analytics is tracking and how, and prepare before and after reports.

As a piece of my own advice, I love annotations in Google Analytics for stuff like this, to make it easy for you to visualize the signposts where big things happened on your site.

This topic actually runs pretty deep, and there is no one piece of killer advice or a single good strategy to stick to, as the nature of your content changes will dramatically impact what you should do if you notice your organic search traffic dropping. The best advice I can give that’s touched on in the article is to make sure you use proper redirects when things have moved, make sure your content is high quality and tracks for the keywords you want to rank on, and make sure your expectations and outcomes are on the same page.

Remember, it’s okay for a page to 404, or in the cases of removed content, 410. Google knows what to do about that. Same with redirects, and 301 and 302s are very different things. Sitemap files can also help. These can all ensure your site remains ranking well, and in the end, you need to measure this against your outcomes. If organic search drops by 50%, but your conversions stay high, that’s not necessarily a problem. It means you’re getting more valuable traffic. You always want to look at 2-dimensional data before considering a problem.

Marcus’s article is filled with good suggestions and advice, and you can read it today over at Search Engine Land. If you have any great recommendations for retaining search traffic after a redesign, shoot us a message on Twitter of Facebook and let us know.

If you want to learn some new CSS magic this week, I suggest an article by Zell Liew over at his blog that looks at the psuedo-selectors :empty and :blank.

Both of these selectors are meant to help you target elements that don’t contain actual content, for instance, divs that might be used for layout presentation elements. Another use case can be in something like an Angular app where you have one field updating another element, and that element is empty until something else happens. This can allow you to style that element to indicate that it has a functional purpose that will change as you interact with the page.

He includes a couple examples that showcase this functionality, and when you see it in action, it begins to make a lot of sense. For instance, an error message. If you have a DOM element that populates an error message dynamically, you could use the psuedo-selector to style it one way when it’s empty, and another once a message drops into it.

Maybe you have a dynamic app that the user interacts with. His example is a to-do list tool. If you haven’t made anything yet, the list is empty, so using that empty state you could show the new user a tutorial panel or something else in that space by changing the display between block and hidden based on the content that would normally be there. You get all this without any extra CSS classes or JavaScript, no need to manipulate the DOM elements, and just by allowing the presence or lack of content to control visibility or whatever other styling you want to have playing a part.

It’s a pretty quick tutorial to boot, so if you’re getting prepared for Thanksgiving, it’s a great lesson to fit in before you take off.

This week we wrap up with an article from Anthony at UX Movement that makes the case for Why You Should Use a Text Area for Address Form Fields.

We’ve all used a form at some point to order something where we were asked our shipping or billing address. And that form undoubtedly asked you to fill in fields labeled “Address 1” and “Address 2.”

Typically, this has existed for a street address in the first field, and apartment or building numbers in the second. But there really is no solid pattern to that, and studies have shown that the split up fields cause users confusion.

He sets up a simple example showing how a user would be asked to enter an address in a form with two fields, versus one. The single field allows the user to think about their address in the same way they deal with it in real life, and it allows for better exception handling and fringe use cases to be met.

The one that comes to mind for me is when I need to send something “care of” or “attention to” someone else. I would normally write that on it’s own line on an envelope or shipping label. But which line does it go on in a form? Especially when the address already has a street and suite number to account for. Now I have to smash things up together on lines, and hope there isn’t a character limit.

It’s a good argument, and one strengthened when we know that users abandon forms more as you add fields. By reducing the fields, you can increase conversions and make things easier on the user. And let’s bring it all home. Remember earlier when we were talking about micro-experiences? This is the sort of stuff we’re talking about. Removing the little frustrations and points of confusion that will make your user appreciate your system better.

Next up, let’s start autocompleting city and state based on the user’s zip code. That’s an argument for another day though.

Thanks for listening to Real-Time Overview today and we hope you found these selections helpful for whatever it is that you are working on this week. For The Drunken UX Podcast, I am Michael Fienen. If you want to get the links to any of the articles from today’s episode, be sure to swing by our website at drunkenux.com, we’ll have all of them linked in the shownotes there.

The Drunken UX Podcast is now available on Spotify for anyone who prefers to listen to us over there. Just log into your account, click on search, and type in “Drunken UX,” we’ll be the first result that pops up. Click the little heart icon to add us to your library.

And stay tuned for this coming Monday for episode 24 of The Drunken UX Podcast where Aaron and I will be joined by Sean Marcia to talk about Ruby for Good and how to manage an open source project.

Until next time, keep your personas close, and your users closer.