Profile

Cover photo
Michele Gerarduzzi
Works at Zooppa.com
177 followers|3,776 views
AboutPostsPhotosYouTube

Stream

 
Emmet LiveStyle is a plugin for live bi-directional (editor↔browser) CSS editing of new generation. Currently, it works in Google Chrome, Safari and Sublime Text, more browsers and editors will be available later.
2
Giovanni Cappellotto's profile photoMichele Gerarduzzi's profile photo
2 comments
 
wow! figata, anche se la canzone del video è una tamarrata pazzesca!
 ·  Translate
Add a comment...

Michele Gerarduzzi

Shared publicly  - 
 
 
grazie Chrome per poter mostrare tutte le mie password in chiaro. GRAZIE eh!
 ·  Translate
1

Michele Gerarduzzi

Shared publicly  - 
1
Michele Gerarduzzi's profile photo
2 comments
 
2-1 per me :P

Michele Gerarduzzi

Shared publicly  - 
 
 
One thing I’ve started using a lot more of over the last year is classes. Dozens of short, tiny helper classes. Instead of applying one ID or class to an element, I’ve started using a handful of smaller ones in conjunction with each other to get the same result.

A few minutes ago—largely as a proof of concept—I wrote this HTML:

`<a href=/login/ class="btn btn-rev btn-lrg giga go brand-face">Log in</a>`

Although a very exaggerated example, it felt good.

Using lots of tiny classes like that is akin to eating at Subway; instead of ordering a sandwich as a whole you can make an almost infinite amount of combinations of sandwich by combining the smaller parts—the ingredients.

By breaking a sandwich down into smaller bits you can quickly and efficiently create a multitude of varieties of sub. This is what class based builds are like. Instead of:

`#sandwich`

we now have

`.bread.lettuce.cheese.salami.mayo`

and that is awesome!

Don’t like tomato? It’s easy to leave it out…

Class based builds are like eating at Subway (only nicer).
1
Have him in circles
177 people
Luca Della Dora's profile photo
Serena Boldrin's profile photo
Silvia Mion's profile photo
 
Ciao a tutti e scusate l'uso forse improprio del gruppo.

Zooppa.com sta cercando Senior Web Developers Rails da inserire nel proprio team (del quale, come alcuni di voi sapranno, faccio parte anche io).

Se siete interessati – o se conoscete qualcuno che potrebbe esserlo –, date un’occhiata alla job offer su http://vivaio.h-farmventures.com/ o mettetevi in contatto con me.
 ·  Translate
1
Francesco Levorato's profile photoMichele Gerarduzzi's profile photo
2 comments
 
+Francesco Levorato grazie, farò presente!
 ·  Translate
Add a comment...

Michele Gerarduzzi

Shared publicly  - 
1

Michele Gerarduzzi

Shared publicly  - 
1
Fabio Dal Colle's profile photo
 
gne gne  1 - 1  (ma sta sera mi metto)
 ·  Translate

Michele Gerarduzzi

Shared publicly  - 
 
 
Online tools I regularly find helpful

Hey guys. I thought it might be helpful to put together a list of some of the tools I use in my workflow these days in case it's useful. Please feel free to check them out (or share your own toolbox) if you think it would be of assistance to others.

With thanks to +Paul Irish +divya manian, +Joe McCann and others for their work on these tools.

Dillinger.io
==========
http://dillinger.io - An excellent markdown editor in the browser which can connect with both Dropbox and GitHub. I personally use it for everything from drafting slides to articles when Mou (http://mouapp.com/) isn't available. We're working on bringing GitHub markdown and Gist support to it soon.

HTML5 Please API
===============
http://api.html5please.com - (Released this week) An API and set of widgets for detecting modern browser features required by your page/app/demo and suggesting compatible alternatives to your users if yours doesn't meet requirements. We're hoping to convince some Chrome experiments to adopt this shortly.

HTML5 Please
===============
http://html5please.com - Modern browser features rated by how safe they are to use with recommendations on the best 3 polyfills to consider for each (where applicable). If you ever use the Modernizr polyfills list as a reference point, this is an improved view of that data.

DocHub.io
=======================
http://dochub.io - Centralised documentation for JavaScript/CSS/HTML (sourced from the MDN), jQuery, PHP and Python. Very useful if you need a super-quick reference interface while working on a project. (thanks to Xavier for reminding me about this one)

Browerstack
=================
http://browserstack.com - This has all but completely changed how I cross-browser test new projects and I can't recommend it highly enough. Browserstack lets you spin up VMs for practically any old or modern web browser you may need to test in and they've also been working on getting support for distributed testing in place. You might also be interested in +Scott González's node-browserstack project that lets you use their API through Node https://github.com/scottgonzalez/node-browserstack.

Grunt (not online, but very useful)
================
https://github.com/cowboy/grunt - Ben Alman's task-based build tool for projects does everything from concatenation through to unit testing with a headless browser. It can even watch for file changes if you're interested in that. Do check it out as although it's in beta, it's already very powerful.

CSS3 Please
================
http://css3please.com - A cross-browser CSS3 rule generator that covers everything from gradients to @font-face. I crack this open more than once every week.

Matt Kersley's 'Responsive'
======================
http://mattkersley.com/responsive/ - A really simple, but useful little tool for testing responsive layouts. This helped me test out the redesign on my blog and was fairly accurate when I later confirmed rendering on actual devices.

Remy's jsconsole
==================
http://jsconsole.com - A super-awesome tool that lets you remotely control and debug browser windows, regardless of whether they're in another another browser or completely different device. Great for partial testing your app on mobile/tablet devices.

Chrome Dev-tools AutoSave
======================
http://bit.ly/usqlZh - I covered this in a screencast but CDA is a really hot way to make changes to pages in the Chrome developer tools and have them automatically save locally (so you don't even need to switch back to your editor). If you haven't checked it out it's definitely worth trying.

John Alsopp's CSS3 Playground
=======================
http://westciv.com/tools/gradients/ - When you need something a little more visual, John's CSS3 tools let you play around with configurations for gradients, text properties, transforms and more. Great for tweaking designs.

jsPerf (an absolute must)
======================
http://jsperf.com - I've listed this more than once as my site of the month in .net magazine and for good reason. It's an extremely useful way to benchmark your JavaScript snippets and get a lot more value out of Browserscope.

Codiqa
========
http://www.codiqa.com/ - An extremely helpful visual builder for creating jQuery Mobile apps. It's not promoted as one, but it's also very useful to creating app mockups without needing to touch any code.

CanIUse.com
==============
http://caniuse.com - Most of you will already know this one, but it's helped power some of the other tools on this list. It's a curated list of browser features supported by browsers, broken down by browser versions.

HTML5 Readiness
=================
http://html5readiness.com/ - A historic view of how far HTML5 and CSS3 feature implementation has progressed over the years and where we are now (last updated 2011, will probably be updated again soonish). Mostly here for funsies.

That's it! I of course use a number of other desktop tools but that's about it for now. jsFiddle/jsBin etc have also been awesome but for the most part I've shifted to doing everything in gists if not with Dillinger.
1

Michele Gerarduzzi

Shared publicly  - 
 
Jean-Baptiste Quéru originally shared:
 
Dizzying but invisible depth

You just went to the Google home page.

Simple, isn't it?

What just actually happened?

Well, when you know a bit of about how browsers work, it's not quite that simple. You've just put into play HTTP, HTML, CSS, ECMAscript, and more. Those are actually such incredibly complex technologies that they'll make any engineer dizzy if they think about them too much, and such that no single company can deal with that entire complexity.

Let's simplify.

You just connected your computer to www.google.com.

Simple, isn't it?

What just actually happened?

Well, when you know a bit about how networks work, it's not quite that simple. You've just put into play DNS, TCP, UDP, IP, Wifi, Ethernet, DOCSIS, OC, SONET, and more. Those are actually such incredibly complex technologies that they'll make any engineer dizzy if they think about them too much, and such that no single company can deal with that entire complexity.

Let's simplify.

You just typed www.google.com in the location bar of your browser.

Simple, isn't it?

What just actually happened?

Well, when you know a bit about how operating systems work, it's not quite that simple. You've just put into play a kernel, a USB host stack, an input dispatcher, an event handler, a font hinter, a sub-pixel rasterizer, a windowing system, a graphics driver, and more, all of those written in high-level languages that get processed by compilers, linkers, optimizers, interpreters, and more. Those are actually such incredibly complex technologies that they'll make any engineer dizzy if they think about them too much, and such that no single company can deal with that entire complexity.

Let's simplify.

You just pressed a key on your keyboard.

Simple, isn't it?

What just actually happened?

Well, when you know about bit about how input peripherals work, it's not quite that simple. You've just put into play a power regulator, a debouncer, an input multiplexer, a USB device stack, a USB hub stack, all of that implemented in a single chip. That chip is built around thinly sliced wafers of highly purified single-crystal silicon ingot, doped with minute quantities of other atoms that are blasted into the crystal structure, interconnected with multiple layers of aluminum or copper, that are deposited according to patterns of high-energy ultraviolet light that are focused to a precision of a fraction of a micron, connected to the outside world via thin gold wires, all inside a packaging made of a dimensionally and thermally stable resin. The doping patterns and the interconnects implement transistors, which are grouped together to create logic gates. In some parts of the chip, logic gates are combined to create arithmetic and bitwise functions, which are combined to create an ALU. In another part of the chip, logic gates are combined into bistable loops, which are lined up into rows, which are combined with selectors to create a register bank. In another part of the chip, logic gates are combined into bus controllers and instruction decoders and microcode to create an execution scheduler. In another part of the chip, they're combined into address and data multiplexers and timing circuitry to create a memory controller. There's even more. Those are actually such incredibly complex technologies that they'll make any engineer dizzy if they think about them too much, and such that no single company can deal with that entire complexity.

Can we simplify further?

In fact, very scarily, no, we can't. We can barely comprehend the complexity of a single chip in a computer keyboard, and yet there's no simpler level. The next step takes us to the software that is used to design the chip's logic, and that software itself has a level of complexity that requires to go back to the top of the loop.

Today's computers are so complex that they can only be designed and manufactured with slightly less complex computers. In turn the computers used for the design and manufacture are so complex that they themselves can only be designed and manufactured with slightly less complex computers. You'd have to go through many such loops to get back to a level that could possibly be re-built from scratch.

Once you start to understand how our modern devices work and how they're created, it's impossible to not be dizzy about the depth of everything that's involved, and to not be in awe about the fact that they work at all, when Murphy's law says that they simply shouldn't possibly work.

For non-technologists, this is all a black box. That is a great success of technology: all those layers of complexity are entirely hidden and people can use them without even knowing that they exist at all. That is the reason why many people can find computers so frustrating to use: there are so many things that can possibly go wrong that some of them inevitably will, but the complexity goes so deep that it's impossible for most users to be able to do anything about any error.

That is also why it's so hard for technologists and non-technologists to communicate together: technologists know too much about too many layers and non-technologists know too little about too few layers to be able to establish effective direct communication. The gap is so large that it's not even possible any more to have a single person be an intermediate between those two groups, and that's why e.g. we end up with those convoluted technical support call centers and their multiple tiers. Without such deep support structures, you end up with the frustrating situation that we see when end users have access to a bug database that is directly used by engineers: neither the end users nor the engineers get the information that they need to accomplish their goals.

That is why the mainstream press and the general population has talked so much about Steve Jobs' death and comparatively so little about Dennis Ritchie's: Steve's influence was at a layer that most people could see, while Dennis' was much deeper. On the one hand, I can imagine where the computing world would be without the work that Jobs did and the people he inspired: probably a bit less shiny, a bit more beige, a bit more square. Deep inside, though, our devices would still work the same way and do the same things. On the other hand, I literally can't imagine where the computing world would be without the work that Ritchie did and the people he inspired. By the mid 80s, Ritchie's influence had taken over, and even back then very little remained of the pre-Ritchie world.

Finally, last but not least, that is why our patent system is broken: technology has done such an amazing job at hiding its complexity that the people regulating and running the patent system are barely even aware of the complexity of what they're regulating and running. That's the ultimate bikeshedding: just like the proverbial discussions in the town hall about a nuclear power plant end up being about the paint color for the plant's bike shed, the patent discussions about modern computing systems end up being about screen sizes and icon ordering, because in both cases those are the only aspect that the people involved in the discussion are capable of discussing, even though they are irrelevant to the actual function of the overall system being discussed.
1
People
Have him in circles
177 people
Luca Della Dora's profile photo
Serena Boldrin's profile photo
Silvia Mion's profile photo
Basic Information
Gender
Male
Work
Occupation
Web Developer
Employment
  • Zooppa.com
    Web Developer, 2007 - present
Links