Experience Code Conference

A new conference is coming to Vancouver January 31 – Feb 1. Brought to you by the same folks who gave us the design & content conference, experience code conference is a conference for UX-focused frontend developers. Similarly to the design and content, this new conference will feature a full day of talks and a series of workshops. A few speakers have been announced and the list of workshops is available on their site.

This conference is a great opportunity to the design and code community of Vancouver and vicinity to come together, learn and be inspired

Resilient Web Design

Jeremy Keith author of DOMScripting, Bulletproof Ajax, and HTML5 For Web Designers has always been a favourite author of mine.

I read his HTML 5 book on the beach during a holiday. That’s probably not the kind of books most people read on the beach, but that’s what sets Jeremy apart from other tech writers. His writing is approachable and a pleasure to read.

His new book Resilient Web Design is more of a history book, rather than code. Not a single line of code is provided, but lots of examples and ideas are offered to help web designers approach their work. I thoroughly enjoyed it and would recommend it to anyone.

Free SVG Background Patterns

I’ve been a big fan of Subtle Patterns for a long time and use a few other resources once in a while. Thanks to Smashing Magazine‘s newsletter, I’ve discovered a new pattern library called Hero Patterns. Unlike Subtle Patterns, this new library offers patterns in SVG format!

Thanks to the SVG specification, not only can you get cool patterns,, you can adjust the colours and opacity. This is another great resource for designer and developers to bookmark!

Resources for Web Designers

Keeping a list of resources is always a difficult task, but a must-do for any designer or developer. Over the years I’ve discussed a few of them on this blog and some of my favourites, such as Unsplash, Trello and Whatfont, I use every day.

Caroline Reder, Director of Content & Communications at Webydo, put together a list of 75 smart resources for designers. This extensive list covers photos, icons, videos, type, colour, inspiration, tools and more. This fabulous list is a great place to find your next favourite resource and start your own list.

Learning Sass with CodePen

If you’ve been working with CSS for a while, you’ve probably heard of Sass and even switched to it by now. Using Sass allows you to code much faster and efficiently. Getting started can be a bit daunting though. Tools like CodeKit can help or if you’re familiar with the command line then installing Sass is a breeze, but if you’re not, then you’re stuck. That is, until now.

Dudley Storey, at The New Code has created a free comprehensive course that allows you to learn Sass while using CodePen. Because Sass is built into CodePen, you can get started right away. His excellent tutorial series, takes you through the basics,  nesting, extends and imports and concludes with loops.  If you’re just getting your toes wet, this is a great place to start.

 

Preventing unwanted Google Search Results

Something weird and peculiar happened to me this week which I thought I’d like to share with you so that you learn from my mistake.

A client alerted me to the fact that my name was showing up as an author on their site in Google search results and sent me the following screenshot.

Google-search-results

This website was built for a company that required no blog, thus no author template was provided. But ever so helpful Google decided to index the author archive anyway, meaning that clicking on the link, led to a page with no content.

When building websites for clients, I normally insert the content in all the pages and thus I’m listed as the author, which is where this information on the search results page comes from. This is fairly normal and I’m sure that I’m the author of millions of pages out there.

There are a few ways to deal with this.

  1. When launching the site, if you are adding your client as a user, simply switch all of the authorship on all content.
  2. If you won’t be adding your client as a user, you can go to your User profile and change your display name. A good idea would be to add the company’s name as a nickname and then use that as your display name.
  3. Finally and this is probably the most important tip, if you are using the Yoast SEO plugin, go to Titles & Meta > Archives setting and se the author archive to no index and Disable the author archives.  This will then redirect anyone who hits that link to your home page.

Ideally, you want to do this before you launch a site, before Google indexes your non-existing author archive, but I didn’t know it would do this until this week. Lesson learned.

 

 

Flexbox fundamentals with Wes Bos

I’ve had the chance to play with Flexbox for a while on a few different projects and it’s been super handy. Flexbox allows you to do things that floats just make you scream and pull your hair out.

Although very simple, flexbox can be a bit tricky, especially when using it in a WordPress theme where you may not have full control of how the HTML is generated ( i.e. menus and search box). One of the best guide for using flexbox is Chris Coyier’s “Complete Guide to Flexbox“. I constantly refer back to this guide every time I’m using flexbox.

A few months ago, Wes Bos released a series of videos at Flexbox.io. I was curious about these and so signed up, got the videos, but hadn’t had the chance to go through them until this week. I spent a couple of days listening and playing around with the code. Although, most of the information was a review for me, the videos clarified quite a few things and highlighted very important points. I even burst out laughing when Wes said, “now this is when people normally say, What? This flexbox stuff doesn’t work“. I had literally just said something very similar.

I must admit, I’m not a big fan of video tutorials. I would rather just see code and read a brief explanation, but these were fabulous. Wes explains things very well, he’s very clear and repeats the most important points frequently. Best of all, the videos are free, so you should really check them out if you haven’t had a chance yet.

In Video 13, Wes introduces gulp and node which he uses for auto prefixing. I had some issues installing all of this and since I never write CSS, but work with Sass instead, I opted to use mixins instead and as always, a quick search lead me to a great collection that fits the bill.

A big thanks to all you fabulous people sharing knowledge online. You’re awesome.

WordPress Documentation

As anyone who has ever used the web, you won’t find it surprising to hear that maintaining good documentation is difficult. For those of you who have known me for a long time (back in 2011?), you may remember that I had set up a site that had good WordPress documentation with links to articles and videos.

Don’t bother looking for a link, because you won’t find one. I simply can’t keep it up to date and won’t be maintaining that site. WordPress is evolving so rapidly, keeping up good documentation is very challenging. The same is true for all sorts of software tools, apps and anything online.

I remember has a teenager being told that purchasing a new car was a waste of money, since as soon as you drive it out of the lot, it depreciated. I’m starting to see the web in the same way. As soon as you start using a tool, something on the net changes and the documentation is no longer accurate. Just like purchasing cars, I think that’s something we have to accept.

Kudos to anyone who maintains docs. Your job is not an easy one.