Friday Favorites on HTML5 in 24 Hours

Friday Favorites 2/19/2016 - late start

Sun, 21 Feb 2016 17:49:00 +0000

Okay, so Friday, Sunday… last week was pretty wacky for me. And I have nothing to show for it. :-) In other words, in my weekly review with my manager (me…) I had to say that while I did a lot of work last week, I can’t really show anything as completed. One client I had was having huge website issues that needed to be solved by their host. And their host wants them to either “optimize” their site (but they don’t say what they mean by that) or upgrade to a more expensive plan. Another client I just completely failed by getting confused by email and thinking that I had until Thursday when they needed it completed by Wednesday. I was working on the site on Wednesday when he called to ask what the status was. I replied confidently, “I’ll definitely be done on time.” Thinking “I should be done in about 2 hours! Phew! 20 hours ahead of time!” And he replies “Great, I’ll tell the team you’ll be done in 30 minutes!” “Wait, What?”

I also planned a follow-up article to Monday’s article on Five Key Design Ingredients to post first on Tuesday, then Wednesday and now I might get it done by tomorrow, or maybe Tuesday. sigh And as you saw, nothing got posted this week other than Monday’s article. Oh well, back to the calendar!

Link of the Week: CanIUse

CanIUse is a very useful site for web designers

My link of the week this week is a site I use all the time–CanIUse. This site lets me look up lots of CSS, HTML, and JavaScript features and see what the current support is for various browsers. Now, mind you, this is not a substitute for actually testing in the browsers as in my experience a feature might be supported by the browser by not being ignored, but actually do nothing (font-stretch , I’m talking to you!). But it’s a great place to start. I use this site all the time and I can’t recommend it highly enough.

Thought of the Week: Is It Bad that HTML5 is No Longer Ahead of Its Time?

I saw this article last week on TechCrunch HTML5 On The Rise: No Longer Ahead Of Its Time. It seems sad but true. HTML5 is now really mainstream. And while I’m a little nostalgic for the days when it was the cool new technology, the fact is that it really is cool that it’s mainstream. It’s way less common to see people balking at the idea of using a simple doctype like <!doctype html> (which always blew my mind that people didn’t like that. I mean, a doctype that’s easy to remember? What’s controversial about that?). And HTML5 video is pretty much the standard these days. It’s awesome.

h/t @JasperEavu

Friday Favorites 2/12/2016 - Typography Edition

Fri, 12 Feb 2016 18:00:00 +0000

This week I’ve been doing a lot of writing about typography. Which has resulted in my looking at a lot of websites and articles about typography. I have known that CSS supported OpenType font features for a while, but I hadn’t really tested it much, until now. Check out this image:

[caption id=“attachment_1681” align=“alignnone” width=“720”] An example of how CSS supports font-features. View it for yourself

It is nice text with fancy typesetting, but since it’s in an image it’s not that exciting, right? But check out the site live in your browser. Unless you’re using a very old browser, you should see the image I display above. Bu then highlight the text. It’s selectable! It’s just text! Search engine robots can read it, Assistive technology can read it without alt-text. This is so exciting!

I found this on the Font Deck blog from four years ago. Yes, that’s how long CSS has had the ability to do this. Why aren’t more sites using it? Typography can be beautiful.

Friday Favorites: 2/5/2016 - Infomagical

Fri, 05 Feb 2016 18:00:00 +0000

Getting Infomagical

The InfoMagical site

This week was an interesting week for me. I spent a lot less time than I usually do online. Why? Because I was participating in an experiment on reducing information overload called Infomagical. It was a series of five challenges, one per day, designed to attempt to help us focus our minds into something magical. My focus was on creativity. And creativity for me means writing and web design. And I did a lot more of that in this one week than I have in the last oh twelve months? Okay, that’s an exaggeration, but I did get so much more done and felt more energized and excited and, dare I say it?, creative!

There were five challenges as I said. They were:

Single-task

The idea here was that we should focus completely on whatever task you have in front of you and not try to multi-task. As you end up switching between the two tasks and that just doesn’t work.

I found that this was very difficult in some ways and ridiculously easy in other ways. It was difficult because I’m so used to trying to do two, three, even five things at once. It was hard to pare it down to just one. For instance, I like to listen to podcasts while I’m writing or preparing to write. But what I noticed after single-tasking was that I don’t get nearly as much out of the podcasts I listen to when I’m trying to write at the same time. It was much easier to write in silence, not trying to focus on anything else. And I got my word count goals done so much faster than usual! Then I had time to really listen to the podcasts.

And in really listening to some of them I realized that there are a number of podcasts that I really don’t like or don’t need to listen to. Which brings me to the second challenge:

De-Clutter

The Infomagical team mentioned Marie Kondo, and I must admit, while I bought her book, I couldn’t finish it. She just struck me as a little too nuts. I do roll my shirts and pants in my drawers now however. So on this day, I was prepared for resistance since they had the idea that we should de-clutter our information world as well. But I decided that I could try it out and if I didn’t like it, well, I could go back to my old method. So the first thing I did was move almost all my apps into a single folder on my iPad desktop. While I was moving them, I deleted a bunch, like nearly half, of the apps I had on the device. This may not seem like a big deal until you realize that I have a 64GB iPad and it was nearly two-thirds full, mostly apps. I was worried that it would be hard to find the apps I use a lot in one giant folder, but then I realized after a little while that I already was in the habit of swiping right and searching for the apps by typing. I left the two apps I used the most often in the gray bar at the bottom of the screen.

Later on someone pointed out that you can use Siri to open apps. “Open DayOne” opens my journaling app and “Open Facebook” opens the time-sucking vortex. So I moved the two apps I use all the time into the folder (no, neither of them were Facebook). Then I realized that I was still distracted by the tiny colors in the folder screen, so I rearranged the folder to have the 16 blandest icons in the front. My only criteria was their color–white, gray, and maybe black, no reds or blues to distract me. But even that was somewhat distracting. So I pushed the entire folder to the second screen. Now my iPad is a beautiful picture of a dragon ornament and nothing else. I wish I could get rid of the gray bar at the bottom, but no big deal.

[caption id=“attachment_1645” align=“alignnone” width=“720”] My iPad desktop today.

The other key to this challenge was turning off all badges. You know, those are the little numbers that appear at the top right of an app icon letting you know that “something has happened” in that app that it wants you to deal with. My experience is that 99.999999% of the time those numbers are either something you already know (yes, I know I have 800 late items on my to-do list, thanks Omnifocus) or something you really don’t care that much about (really? you want me to stand up and cheer because no podcasts needed updating, Downcast???). Turning off all the badges–and yes, Apple doesn’t make this easy, you have to do them each one by one, app by app–was a huge stress reliever off my mind. I have been known to get frantic at seeing a badge on Netflix, but when you open the app nothing seems different! What’s the badge for? And don’t get me started on Facetime badges that never go away even when you’ve opened it and dealt with every phone call or message you’ve received from right now back to the 1900s. Poof! Now I have no badges. Nothing nags me in that way. Yes, I still get notifications. My phone still buzzes when I get a text message and my iPad still lets me know that there was an update on that Kickstarter campaign. But now it’s not obnoxious about it. If I want to know, I just swipe down. Otherwise, I stay focused on my day.

What’s especially cool about this method is that it makes using my iPad a lot more deliberate. I have to think about what I want to do before I just mindlessly swipe through a bunch of apps. And often that deliberation makes me realize “hey! I don’t really want to go into the time-sucking vortex right now. I’d rather write/read/draw/walk.” And I close the iPad (or not) and do something that ends up being much more fulfilling in the long run.

Focus on What’s Important

The third challenge seemed like a tough one to me at first. The goal was to only consume information that took me forward in my goal of being more creative. So no binge watching Netflix, no random scrolling Facebook. Instead, I was to ask myself if what I was about to read/do was in service to my creativity or not. And if it wasn’t I was to avoid it.

No cat pictures? Impossible!

But really, this was the easiest, and most satisfying day of all five for me. I got more done on this one day than I really thought possible. And everything went more quickly than I expected. Because I wasn’t spending time on things that weren’t furthering my creative goal and I wasn’t being interrupted by stupid things, I was really productive.

Make a Connection

Day four the challenge was to have a conversation, not a chat or email, but a phone call or in-person talk with someone for at least seven minutes about something I’d learned this week. This was challenging because I work from home, and I don’t think they meant chat with my dogs. I couldn’t decide who I wanted to talk to, and part of that was the realization that the people I wanted to talk to were either at work and couldn’t talk, in another time zone and so busy, or not answering their phone.

I did finally get through to someone, and we talked for almost 30 minutes while I waited in line to pick up my son from school. We mostly talked about de-cluttering because I’m so pleased with how my iPad is back to being a tool and not just a time suck.

Pick a Long-term Information Goal or Mantra

This challenge has been harder for me, as I don’t really know what I want my long-term goal to be. Having a general goal of “Be more creative” seems too broad. And yet the idea that I should just boil it down to “45 on 15 off*” seems a bit too pat. I did find a video this week that I enjoyed and seems to encompass my desires for creative work and focus. See below to watch it.

I’m going to keep thinking about this one for a day or two and see if I can come up with something that really speaks to me. But I might only do it in the 15 minutes goof off time I have each hour. Or maybe I’ll just go watch Poirot on Netflix while I think about it…. Hmmmmm

*By “45 on 15 off” I mean that I want to spend at least 45 minutes of every hour I’m in front of a screen doing “work” or something creative, and the other 15 minutes can be spent on “fun” like Netflix or Facebook or whatever.

My Mantra for Now…

https://www.youtube.com/watch?v=8bfELN6NskE

#DontBotherMeImWorking

Friday Favorites: 1/29/2016

Fri, 29 Jan 2016 23:00:00 +0000

Most Interesting Article I Read This Week

Tips for Designers Who Don’t Code by SpeckyBoy.

[caption id=“attachment_1584” align=“alignnone” width=“719”] Not a lecture, just good advice

This is not a lecture article. The advice in this article is really good. For example, everything in your design should start with the content. And this means your mockups, not just the final design. How will your beautiful layout look if the title is more than three words long? What if the ads in the sidebar extend below the length of the main content–will you be okay with a big blank spot in the middle of your design? What if the people choosing the images don’t choose image in the correct aspect ratio–will your landscape-focused design look good with portrait images? or square? What if they attempt to crop the offending image, and it’s even worse than if they’d just left it alone?

Design is great, but when it meets the real world it can be challenging, and if you don’t code it can just be frustrating. But this article might help at least a little.

Quote of the Week

Design is not just what it looks like and feels like. Design is how it works.

-- Steve Jobs

This is something to bear in mind whether you code or you don’t code. If your web page or application doesn’t work for the audience it’s targeting then it’s poorly designed, no matter how pretty it might be.

Friday Favorites and Features: 1/22/2016

Fri, 22 Jan 2016 23:00:00 +0000

Two New Articles Featured

This week two of my articles on web design were featured on InformIT:

I hope they are useful to you.

Most Interesting Article I Read This Week

[caption id=“attachment_1562” align=“alignnone” width=“719”] Learn to Code HTML and CSS in 12 Lessons online.

Shae Howe’s book Learn to Code HTML and CSS (Buy on Amazon.com) is a really nice looking introductory book on HTML and CSS. And he’s also got a free online course you can take to learn HTML and CSS that is just as beautiful. Learn to Code HTML and CSS in 12 lessons.

Product or Service I’m Considering

[caption id=“attachment_1567” align=“alignnone” width=“720”] A browser specifically for developers

This Monday I was recording some videos on Firebug, and so I had to open Firefox to install it. I haven’t used Firefox in a long time because Chrome has been working well for me. But it seems like Firefox is going to suck me back in. I learned of a new Firefox fork called the Firefox Developers Edition. This is an interesting version of Firefox that puts tools useful to developers front and center.

h/t Noupe

Quote of the Week

The enemy of art is the absence of limitations. –Orson Welles

So the next time you find yourself complaining about the drawbacks to a certain browser or how annoying it is to have to design for tiny screens consider that without those limitations you can’t create art. And creating something beautiful, something that is art, is a noble goal for any website.

David Bowie RIP

Fri, 15 Jan 2016 23:00:00 +0000

Most Interesting Article I Read This Week

I grew up in the 70s and David Bowie was a huge part of it. So I was very sad when I learned of his death on Monday morning. Like many of my friends I spent most of Monday and portions of Tuesday (and let’s be honest, Wednesday, Thursday, and yes, today…) watching videos of Bowie singing a-capella with Freddie Mercury and crying as I listen to Blackstar. But one of the articles I found most interesting was one on the BBC: David Bowie: The internet pioneer. I remember Bowienet, although I was not a member. I remember when he released “Telling Lies” as a downloadable single. But I didn’t realize how much he was involved in the early Internet. He was a man ahead of his time. David Bowie—RIP

He will be missed.

Quote of the Week

“It’s only forever, not long at all.”

—Jareth (David Bowie) in Labyrinth

Friday Favorites: 1/8/2016

Fri, 08 Jan 2016 23:00:00 +0000

Most Interesting Article I Read This Week

File this under “I wish I’d written that…” You never learned to code? Start here. is a great overview article for beginning web designers and web developers. Don’t be intimidated by the title, it’s not just about “coding” but about building web pages and more. I love that it starts out by figuring out what language you should learn first. And it goes well beyond just HTML, so for those of you who don’t think writing HTML is programming, you’re covered.

The article is long, but worth it if you’re struggling with what language to learn or how to break into programming. Even if you just want to decide what to learn next, this is a great overview of some good choices.

Git Is My New Favorite Tool

I’m currently moving most of my projects into Git using BitBucket. It’s been really great for both collaboration with other designers abut also just keeping track of changes to everything from my latest book project to the Wordpress themes I’ve been working on.

I was using a GUI to interface with Git, but I’ve found that I like the command line interface better. I’m so much faster just typing than I am with the mouse.

Quote of the Week

“Begin at once to live, and count each separate day as a separate life.” — Seneca

What Are You Working On?

I’m working on:

A new book on Cool CSS
A video course covering HTML, CSS, JavaScript, jQuery, and Git
Three different WordPress themes
Four different websites