The awesome internet (week 43)

28 October 2011



Online checkout in real life



When designing a webshop, or any other digital version of a real life situation, it could be a good idea to project your designed workflow on the real world. This video shows what would happen if a common checkout process would happen in a real store.

It's funny, but don't forget this happens a lot! Please think about this video the next time when you're designing or implementing a webshop.





Clean and Optimized CSS code



Optimization isn’t just minimizing file size — it’s also about being organized, clutter-free, and efficient. You’ll find that the more knowledge you have about optimal CSS practices, smaller file size will inevitably come as an direct result of their implementation.

This quote propably says it all. Just read this excellent article!

http://coding.smashingmagazine.com/2008/08/18/7-principles-of-clean-and-optimized-css-code/






CSS naked Day



To promote good HTML semantics there was this initiative called "CSS Naked Day". During this day all participants would disable all CSS files in their website, leaving out only the unstyled HTML. Once a website was set up semantically correct this should be no problem and the website should still be readable. It doesn't have to look nice, but it should be readable and the hierarchy should be logical.

It's a shame this Naked Day doesn't exist anymore. If it was ressurected again, I would participate too!

http://naked.dustindiaz.com/





CSS Specifity



This is a great article by CSS master Chris Coyier about CSS specifity. This is a must read for every front-end developer!

http://css-tricks.com/855-specifics-on-css-specificity/







local storage



This a simple movie from NetTuts+ explaining what localStorage is capable off. I can guarantee this slightly more than 4 minute movie will explain you what localStorage is good for. I was thinking of creating a jQuery plugin for a digital version of post-its with it. What use of localStorage can you think of..?





CSS only resizable elements



A little snippet I stumbled upon last week is this one that lets you create resizable elements without javascript. This only works in Firefox, Chrome and Safari, so be sure to create fallbacks!

http://jsfiddle.net/simurai/baBN9/






Skrekkøgle



Not really webdevelopment-related, but I just liked their website and the project they are doing. I would love to have this huge 50 eurocent coin on my desk... :)

http://www.skrekkogle.com/





Notificon



This lightweight JS library gives you the ability to change the favicon of your website on the fly. Want to notify a visitor of a new incoming PM? Just include Notificon, set the label and there you go. Be sure to check out the demo!

One downside is that it only works in Chrome 6+, Firefox 2+ and Opera. Be sure to use this library only for non-obstructive code. Always create a fallback!

http://github.com/makeable/Notificon






Nice parallax effect



This website is a beatiful example of a proper application of the popular parallax effect. Just scroll down the site and look at the awesome job they did on this site.

http://www.newzealand.com/nieuw-zeeland/
You must have JavaScript enabled to use this form!

Leave a comment!

  1. Your mail is safe with me. It's only only used to display your Gravatar image!

1 comment

  1. Johan van Tongeren Gravatar

    Paul

    28 October 2011

    Ossum :-)