This week’s RTO brings you a great visual cheatsheet for getting started with CSS Grid. This thing is a really great reference if you’re need a hand once in a while remembering how to make the grid work the way you want. If you need some advice on learning in 2018, consider thinking about the Three Mos. What are the Three Mos? Listen on to find out! We’ve also found some advice to help you think about how you value success in your design work, a killer guide to removing malware from infected WordPress sites, a catalog of common design mistakes, and because I can’t resist, more information on dark UX and why to avoid it.

Followup Resources

  1. GRID: A simple visual cheatsheet for CSS Grid Layout
  2. Learning Web Development in 2018
  3. 10 Ways to Measure Your Success in Design
  4. Comprehensive WordPress Malware Removal Guide
  5. Common Webpage Design Mistakes
  6. Dark Patterns: Free Trial Doesn’t Mean I’m Giving You My Credit Card Details

Transcript

Do you know what the best way is for a QA tester to get drunk? By taking screenshots.

This is Real Time Overview for Thursday, August 16st, 2018, I am your host Michael Fienen. Don’t miss this past Monday’s episode of Build Process, when Mike Richwalsy from Gas Mark 8 sat down with me to talk about how he got into web development and what his advice is for you, our intrepid listener. You can just let our playlist continue after this episode and it should be the next one up. And since we’re coming a day late this week, let’s jump right into our first article.

If you’re in the mood to start the day off by finding a good tool to help you better understand CSS Grid and all the properties associated with it, then swing by grid.malven.co and check out the visual and occasionally animated cheatsheet that they’ve put together there.

CSS Grid is a great evolution for CSS layouts, but it’s also fairly complex and includes a lot of properties that give you a ton of ways to manipulate the content that you’ve stored in your grid. This tool gives an easy way to quickly identify which properties produce which results when employed. For instance, how confident are you that you know exactly what happens when you tell a grid item to justify-self: center;? How about how containers will behave if you have grid-auto-flow: dense;?

Reference tools like this can be big time savers and make great learning tools as you work on becoming a Master of the Grid. To get started, head to grid.malven.co to checkout the cheatsheet in its entirety.

One of the main messages we embed in episodes of Build Process is the nature of learning in this industry, and how staying competitive means you’re constantly looking at where we’re going. Kevin Ball has written an article to this end over at Zendev.com that outlines his technique for learning web development in 2018.

To make his point, Kevin has wrapped his thoughts on learning around a nice device: The Three Mos. That’s motivation, momentum, and money. The idea is looking at what it is that’s interesting you, or maybe being suggested to you, and determining if you’re excited to get into it, if learning it is something that can carry you into other things, and is it something someone will pay you to spend the time figuring out.

For example. You might think Flash games are just the hottest thing since sliced bread. Your motivation is strong. But learning Flash today doesn’t drive your skillset on to anything else, and you can be sure as anything that no one is going to pay you to learn it. Result? Probably not worth learning in 2018.

He anchors his Three Mos concept with something else I love as a learning tool, which is finding a project to bite into. This doesn’t have to be something big someone else is doing. It could be solving a problem for just yourself. Maybe you want the Goldilocks of recipe management tools. So sit down, pick the thing that’s motivating you and create it. Take that project and branch it into other things you might need – frameworks, build processes, deploy systems, whatever. Once you figured it out, once you gotten to where you know how to solve those problems and find answers, go see if you can get paid.

Learning web development isn’t easy. It also never, never ends. My advice is to always plan time into your day to read a little, or play with something you’ve created. And if you stick with Kevin’s suggestion of trusting The Three Mos, you’ll probably end up alright.

If you’re a designer who’s been feeling frustrated with what you’ve been accomplishing in your work lately, or you feel like you’re always trying to catch up to everyone else, let me present you with an article by Jon Moore that shares 10 Ways to Measure Your Success in Design.

I love talking about Imposter Syndrome. It’s such an important topic, that we’ve created an entire segment of our podcast just to help address it. Build Process, and if you haven’t checked that out, you damn well should. We have three episodes out so far, and next month the fourth one features freelance developer Rachel Cherry, so don’t miss that. Anyway, where was I?

Right, designers. Design can be a hard thing to measure. And if you’re trying to figure out what you’re doing right or wrong, it can be really hard to judge yourself when you’re comparing your work against the best stuff other people put out to showcase. We forget, those same people probably aren’t showing off the stuff that isn’t great.

Jon tackles this by anchoring your work to the outcomes you were chasing. Rather than focusing on subjective quality, aesthetics, or appeal, he points you towards the material outcomes of your work. Did you fix something? Did you figure out what a user needed? Did you improve? And these questions, while incredibly important, pale in comparison to the biggest one:

Before you started trying to compare yourself to everyone, were you proud of what you created?

This is a fantastic article that can really help you get into a different gear when you stop to think about the quality of your work. It works if you’re just starting out, or if you’ve been at it for fifteen years. You can stop by Medium and check out this article on the UX Power Tools blog.

Work with WordPress long enough, and it’s a simple law of nature that you’ll have to deal with a compromised site. That’s not a knock on WordPress, it’s just out there everywhere, it’s an easy target, and the plugin and theme ecosystem provides a lot of attack vectors. Toss in a mix of shared webhosts, and you have a great big ol’ bullseye.

Oliver Sild comes to the rescue at WebARX with his Comprehensive WordPress Malware Removal Guide. And I’m not sharing this because it offers a couple quick tips to delete a couple files or anything. He’s packed an entire toolbox of suggestions into this article, some simple and straightforward, but then some going into detail.

I’ll offer the same disclaimer he does – cleaning up a compromised WordPress site depends on a lot of things, so be prepared to get a bit technical, and understand that sometimes it’s well worth paying a professional to come in.

Oliver runs through the standard suggestions of making sure you change passwords and permissions on files to limit the attack vectors so that you don’t get reinfected if your password has been compromised. Limiting access, locking down FTP, databases, etc are all necessary steps, even if they’re inconvenient. And that’s true regardless of your CMS. It’s just good advice.

From there, he goes further. He explains how to do things like diff your installation files to make sure there haven’t been changes. He tells you where to look for files that shouldn’t be there, and he shows you common techniques of sneaking in backdoor executables.

All told, he does well to label his guide “comprehensive.” This is a very thorough guide to understanding how to respond when you discover your site is hacked. It’s a great way to start and familiarize yourself with basic web security, and you could use it to launch into deeper techniques in the future. You can find all of his suggestions and explanations in this post over at WebARXSecurity.com.

Speaking of comprehensive, take a swing by the Tilda Publishing blog and catch Nikita Obukhov’s article Common Webpage Design Mistakes. They have absolutely gone to town with a list of mistakes made when designing and structuring pages, complete with examples all along the way.

Many of the cases seem obvious, like paying attention to even spacing, but they start to really stand out when you see cases side by side, along with illustrations of why it looks bad. In fact, looking at the way some of the content sections are spaced and knowing I see examples of it day to day on other sites makes me feel a little… itchy.

From landing pages to articles, they’ve given you a list of behaviors to avoid and issues to be on the lookout for, along with why you might want to consider other solutions. Go take a look for yourself and read through their recommendations, and let us know if you think there are others to add to the list.

Because I’m a sucker for a good article on Dark UX, I have to round out today with a stop by Lireo Designs’ blog where Deborah Edwards-Onoro has written up some of her thoughts and experiences on the subject.

She begins by framing out an experience while looking in to a free trial membership that turned around and asked for credit card details in order to sign up. It’s something we’ve all ran into at some point. And as Joe Natoli replied “as if no one sees this as ‘we’re going to do our best to trick you into paying past the free trial.’” This pattern is so prevalent, everyone knows that giving that number over means you’re guaranteed to get charged one way or another without jumping through hoops.

Her entire article provides both a great introduction into what dark patterns are, along with examples and commentary from the community at large about them. And as she puts it, it’s about being ethical in our treatment of users.

You have to ask yourself, is it worth building a career on trying to trick users? Is it worth being shamed by users in social media over your behavior. And most importantly, are you willing to bet sales on anti-patterns?

You can catch Deborah’s article over at the Lireo Designs blog, and you can follow her on Twitter at redcrew where she also shares great material on accessibility and universal design.

Thanks for clicking into Real Time Overview this week and we hope you found these selections helpful for whatever it is you’re working on this week. For the Drunken UX Podcast, I’m Michael Fienen. If you want links to any of the stories in today’s episode, be sure to swing by our website at drunkenux.com, they’ll all be linked in the shownotes there. Don’t forget to follow us on Twitter or Facebook, you can find us at /drunkenux. Stay tuned to your favorite podcast app, a new episode of the Drunken UX Podcast will be coming up this Monday.

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