BonFX

Typography & Graphic Design Blog

Redesign of nbcnews.com gives “mobile-first” strategy a black eye

by

Visit nbcnews.com now. The “news” site has 5 headlines. I’m on a Mac with a 1080p display. This is what 5 headlines on a 1080p display looks like: news This is what happens when someone doesn’t get mobile-first. Mobile-first should mean optimizing the content and design starting with mobile, not starting and ending with mobile. I’m looking at a formerly desktop-friendly news site that is 100% unusable on a desktop device. This is such a goofy misapplication of mobile-first methodology that it’s goofy. Let me just say that I wrote a little piece called 52 Question Checklist for Responsive Web Design Projects that was written to prevent goofy misapplications of mobile-first, or responsive web design, exactly like what we see at nbcnews.com. It annoyed a few people. I wonder if any of those people are on the design team at nbcnews.com? Ok, so the world should design websites mobile-first. We get it. It’s right. It’s “how to build websites” now. But someone in charge of nbcnews.com only read the table of contents to “Mobile-First Web Design for Dummies” (is that a real book?), stopped there, not realizing they didn’t get it. This is Windows 8 all over again. Truly mobile paradigms are….mobile! They don’t translate to desktops! Hasn’t anyone on the design team at nbcnews.com been paying attention…to anything? Oh well, another day, another deleted bookmark to a formerly relevant or usable site. BTW: Don’t even click “Search” unless YOU ARE READY FOR SOME SERIOUS SEARCHING! WOOHOO! You clicked “Search”, didn’t you. You were warned.  

Font Combinations

by

Here are the three (well, four) best resources for creating classic font combinations that we know of: The resource page has pretty much all the classic font combination pages and resources from over the last decade. If you start there, you are going to get all the info you need. There are other more modern sites that focus on examples rather than principles, such as I Font You, but they tend to be a bit random. A book like The Big Book of Font Combinations takes a systematic approach and limits itself to a core subset of the most popular fonts of all time. BONUS REFERENCE: You can also find many of the classic fonts, pre-typeset and mixable on the fly in, our iPhone App, Font Combinations 2.0. font-combinations  

Have you thought “I’ve spent way too much time editing CSS”? Well, glimpse the future

by

Ok People: Here is a glimpse of the future of web design 🙂 Imagine a future where you spend time designing and not fiddling. Remember those days past? They will yet come again. Imagine designing in the browser. You will be doing it before too long. I predict a wholesale shift to much more advanced CMS and web platforms or systems where code takes a big retreat behind dazzling GUIs like we see in Squarespace 6, and other platforms like Virb, Adobe Muse, etc. Hand-coding will be a niche, enterprise-focused endeavor. The realities of responsive web design necessitate this fact. There was a time before PageMaker and Quark where people edited PostScript by hand, but those days are a distant memory. Can you even imagine hand-coding a page to simply print something out? Web design is moving in that direction. Listen to these sage words and watch magic happen as the user below changes a complex layout in realtime in Squarespace 6. Wow: Skip to 6:50 for the relevant snippet and watch for about 30 seconds. Again, wow: So if your favorite CMS doesn’t yet have rich GUI-based dynamic layout editing as it’s default mode, or have it on it’s roadmap, know one thing: it will.