THE PENDING DRAFT

claudiorimann.com

February 17, 2015

claudiorimann-com

My portfolio right now gives me kind of an embarrassing feeling every time i look at it. Not because of the work that is actually in there, but the page itself. It was built around three years ago, and as you know three years is a lot of time in our area. I learned a ton in the meantime and i would do so many things different today. Maybe thats a good sign, “if you’re not embarrassed by your past work, you stopped learning” or so they say, right?

I’m hard at work to completely rebuild the site from scratch, but until that is finished i wanted to have some place to link to from various projects and i also wanted to have something in english. So, a couple of days ago i sat down and quickly coded something up which is online now. Oh and yes, the idea is completely stolen from florianziegler.de.

claudiorimann.com

Lazy Load XT

February 16, 2015

If you work with a lot of images, performance issues can quickly add up and become pretty complicated to tackle. Lazy Loading is one popular technique how we can approach this and with Lazy Load XT there seems to be a new solution which also supports things like srcset, horizontal scrolling or video elements.

Images make up over 60% of an average page’s size, according to HTTP Archive. Images on a web page would be rendered once they are available. Without lazy loading, this could lead to a lot of data traffic that is not immediately necessary (such as images outside of the viewport) and longer waiting times.

Just recently i implemented jQuery Lazy Loading on a portfolio page and we were able to bring the pagesize down to some kilobytes (until first render) from what was around 4MB and even over 16MB on retina screens. The site was built some years ago, so srcset or <picture> elements weren’t an option and we used retina.js which was quite fast, but loads the small version and then the retina version on top. Not ideal, i know.

So, lazy loading was a great help in reducing all that, but when implementing it i struggled not only with some possible negative SEO implications (which i’m still trying to fully understand) but also it was very hard to combine retina.js with the jQuery Lazy Loading.

Lazy Load XT is a new script which uses jQuery, Zepto.js or DomTastic to deliver lazy loading functionality and it includes srcset support as well as many other of the things i missed. Also, i like the modular way it is built which let’s you choose which plugins or extensions you need and thus let you save some more kb’s from your bottom line.

Redefining Lazy Loading With Lazy Load XT

Pragmatic Redesign for GitLab

February 12, 2015

I use git and GitLab for pretty much everything i’m working on, from the smallest experiments to large client projects, everything gets pushed to a remote repository on our server. The last update for GitLab brought some small UI changes which i really liked. They’ve done some great work with this and it’s one of those improvements where you look at it and recognize that something has changed, but couldn’t tell what it is. Like when someone you know has slightly changed their haircut and you notice that she/he looks a bit different, a bit better, but you don’t see what exactly has changed. I like those kinds of iterative, small redesigns. And i fully agree with their statement about the importance of having a clear plan and a set of goals before you start redesigning anything.

Changes to the interface are always stressful. So you shouldn’t even start to redesign without a list of issues you intent to solve. This way, your users get compensated for the changes with improved usability.

Well done GitLab!

Pragmatic Redesign for GitLab

Measuring Responsive Breakpoint Usage

February 10, 2015

Designing websites for a modern web means dealing with a whole lot of different setups, devices and resolutions and the best way to handle this is to build things as device agnostic as possible when planning our breakpoints. Wouldn’t it be nice, if tools like Google Analytics would let us track not only devices, but also the usage of our actual breakpoints? Well, turns out that’s possible with a clever use of matchMedia(), as Philip Walton from Google explains in his article.

If your site is built on device-less principles, but its usage is measured against device-only metrics, you’re going to get a mismatch—potentially a big one.

I’m looking forward to implement and play around with this somewhere.

Measuring Your Site’s Responsive Breakpoint Usage

Paul Graham on “How Not to Die” as a startup

February 9, 2015

I really enjoyed reading this post by Paul Graham about “How Not to Die” as a startup. It’s the transcript of a talk he gave to a group of founders at a Y Combinators dinner in 2007 and he talked about all kinds of things startups are going through. And even though he described it as a “grim” talk himself, i found it to be more of a motivational piece than anything else.

I’m pretty sure he’s right when he says that a big portion of success is basically just “don’t give up”. Paired maybe with a bit of luck and a whole lot of flexibility and iteration. An idea alone almost never directly became a big hit without any form of transformation and the startups that made it are almost never the one’s that had the best and most original idea to begin with, but the one’s that tried harder and kept iterating instead of giving up.

Let me mention some things not to do. The number one thing not to do is other things. If you find yourself saying a sentence that ends with “but we’re going to keep working on the startup,” you are in big trouble. Bob’s going to grad school, but we’re going to keep working on the startup. We’re moving back to Minnesota, but we’re going to keep working on the startup. We’re taking on some consulting projects, but we’re going to keep working on the startup. You may as well just translate these to “we’re giving up on the startup, but we’re not willing to admit that to ourselves,” because that’s what it means most of the time. A startup is so hard that working on it can’t be preceded by “but.”

And also this next quote resonated with me and resembled some of the things i meant when i wrote about our goal to solving almost no one’s problem.

I like Paul Buchheit’s suggestion of trying to make something that at least someone really loves. As long as you’ve made something that a few users are ecstatic about, you’re on the right track. […]

So when you release something and it seems like no one cares, look more closely. Are there zero users who really love you, or is there at least some little group that does? It’s quite possible there will be zero. In that case, tweak your product and try again. Every one of you is working on a space that contains at least one winning permutation somewhere in it. If you just keep trying, you’ll find it.

In that sense: Let’s keep on trying, and have a good week!

Paul Graham – How Not to Die

IE8 Linter

February 7, 2015

A little tool to lint websites for IE8 compatibility, with warnings for possible pitfalls and suggested fixes.

I hope i will never have to support IE8 again. But if, this could come in handy.

GitHub – ie8linter

BOOM

January 27, 2015

This article by Brian Krogsgard (Post Status) came just in the exact right moment to motivate me even more to finally reveal what we’ve been working on.

Like I said, I interviewed about a dozen photographers from different backgrounds. None of those interviewed felt particularly satisfied with their web workflows. There is room in this market. My question is: who will fulfill their needs?

Looks like we’re onto something. More about our little project will follow this week.

Stay tuned!

Post Status – WooCommerce is going after photography

Style Guides Podcast

January 22, 2015

Styleguides.io provides a ton of useful resources on Website Style Guides. You find pretty much everything from Articles to Books, Talks, Tools or Examples. If you’re building Style Guides and didn’t know it yet, you should check it out.

Today Brad Frost announced a new Podcast, where he and Anna Debenham will interview folks making Style Guides. In the first episode they talked with Jina Bolton, Senior Product Designer at the Salesforce UX Team and although i’m usually not that much into audio podcasts i gave it a try and really enjoyed it.

Style Guides with Jina Bolton

Chris Lema on Estimating without Requirements

January 17, 2015

Estimating is one of the harder parts of any web business. Estimating without requirements is even harder. I don’t know about you but i often found myself just quoting something, out of the blue, without even realizing how wrong my numbers where, only to find out later on when it’s already too late. Over the years i learned how to phrase my offerings and contracts more precise, educating my clients that some things cannot be known at the beginning of a project, that they understand that those estimated hours really are only estimates etc. but yet it still feels wrong if you have to come back to a client and let them know you need double or more time than what was initially agreed upon. Proper contracts are important, but they only bring you so far. Things happen, things out of your responsibility will go wrong and even those things should also be taken into account when estimating your time. If you run a business you need to be as good as you can get about estimating properly, if you like it or not.

Chris Lema, who wrote a lot of brilliant things about pricing and estimating before, shared his “3 point estimating approach” which he describes as follows:

I use a 3-point estimating approach that I know others use. But often when I come across other’s estimates I find that they’re using the three points differently than I do. And the result is that if you use three incorrect points, your estimate will be wrong as well.

He explains in more detail what he means by this in a short video and it’s one of the best explanations on the topic i came across so far.

Chris Lema – My Approach to Estimating without Requirements