-
Import a Huge Database with MySQL Command Line in MAMP
I needed to import a 500mb MySQL database today, and I didn’t want to mess with changing the max 32mb upload file size with phpmyadmin. The 32mb limit is due to having to upload and process the file, but if the file is on your local machine anyways, there’s no need to upload it. Let’s bypass…
-
Is This Thing On? A Toggle/Light Switch Quiz
Maybe it’s just me, but toggles and light switches always trip* me up. To pseudo-scientifically find out, I captured different toggle designs in the wild from the ol’ World Wild Web into a quiz using the Quiz Creator I designed and developed for the Center for Media Engagement. I’d be delighted if you took the…
-
Share Pie with Strangers
Two years ago I spent the night in a cabin in an RV park in Northern California. My family and I finished dinner and lounged around a picnic table. A jovial man sat down and introduced himself. Talk quickly turned to work, and we realized we were both web designers/developers. I was a bit further…
-
Terminal Command for Looking up Nameservers
At The Engaging News Project, we recently upgraded our DNS hosting by moving over to Cloudflare. I wanted to test our site as soon as the nameservers updated to Cloudflare’s to make sure no weird issues popped up. Fortunately, there’s a handy terminal command for that! nslookup is a command to query nameservers and get…
-
Apple Bug Report – Non-native Focusable Elements Page Jump
On iOS devices running Safari on version 10+, when focusing a non-native focusable element (ie – a div that is focusable via JavaScript or with a tabindex value) inside an embedded iframe on a page, the parent page will jump down the page and you have to scroll back up to return to the focused…
-
How to Fix Blurry Images in WordPress 4.4 from srcset and sizes
In WordPress 4.4 they added a big feature: responsive images using srcset and sizes for all content images. This is amazing. Since WordPress is a hugely popular framework, the amount of bandwidth saved is astronomical. I’m really proud of the WordPress team for implementing this. But… there are some blurry images. It’s not a perfect…
-
The Process of Building for the Web: Quiz Creator Case Study
Engaging News Project’s Quiz Creator is by far the biggest product I have ever designed and developed. Over an eight month period, I did all planning, design, development, architecture, testing, documentation, and deployment. To give you an idea of what goes into building a professional web application, I’ve documented the overarching phases of the project.…
-
Using BEM in the Wild
BEM can get out of control if you’re not careful. On the first project I used BEM, I handcrafted this artisanal class name: .progress__bar__question-count__current-number. Yup. That’s four levels deep. I’m not proud of this. The goal of this article is to make sure another .progress__bar__question-count__current-number never gets written. Before we dive in, if you’re not…
-
Modular and Descriptive Class Names
What’s the big deal, just name it the first thing that makes sense, right? It makes sense now, so it will probably always make sense! .btn–small, .btn–tiny, .btn–really-tiny, umm… .btn–really-super-duper-tiny! Considering your class names avoids headaches and confusion down the road. But that’s easier said than done. Before we figure that out, let’s get some…
-
B is for Block: An Intro to the BEM Naming Convention
BEM (Block, Element, Modifier) is a great way to keep class naming consistent and meaningful. If you’ve never used BEM before but want to understand how it works, or if you’re thinking about using it for an upcoming site or component, this article is meant for you. If you’re already familiar with how BEM works,…
Jerry Jones 