You think this could take the place of business cards?

[reelwebdesign]

I made an experimental business card in CSS and was wondering if maybe there was a way we can share these cards via mobile phones (like how Bump works) so there'd no longer be a need for actual printed business cards. Anyone have any thoughts? Want to work together to make it happen?
Nothing is clickable right now as it was just n experiment but yuo can check it out here:

reelwebdesign.com/peter-marino.html (http://reelwebdesign.com/peter-marino.html)

Any thoughts?

Peter

[traq]

Why not base your work on the hcard microformat (http://microformats.org/wiki/hcard)?

✓ machine- and human-readable
✓ established, well-recognized format
✓ degrades gracefully (javascript/css3+ not required)
✓ highly interoperable (it's just HTML!)

You could still use the <canvas> (for graphics) underneath the hcard. SVG might be an option, too.

[reelwebdesign]

Interesting Adrian, I never saw that before. Do you have full CSS control with it?

[traq]

Yeah, sure, it's just normal HTML.

This, for example:

<style>
.photo{ display: block; float: left; margin: 1em; border: 0; }
.fn{ visibility: hidden; }
/* the hcard microformat requires `fn` ("full name"); even though we're not displaying it.
it still has the benefit of being machine-readable, however -
if your email client got this, for example, it would probably still sort it under the full name (not the nickname). */
.nickname{ font-weight: bold; color: darkred; }
.honorific-suffix{ font-weight: bold; color: #3e3e3e; }
.category{ display: block; border: 0; }
</style>

<header class="vcard">
<img class="photo" src="die-WHY_WONT_IT.png" alt="philosoraptor considering best practices in PHP">
<h1>
<p class="fn">Adrian Testa-Avila
<p><a class="nickname url" href="member.php?29708-traq">traq</a>
</h1>
<p class="honorific-suffix">global $Moderator;
<img class="category" src="images/ranks/moderator.gif" alt="global moderator">
</header>
...would display very much like my post header here on DD.

You can use stylesheets for SVG images (http://css-tricks.com/using-svg/), too, with surprisingly good results.

[FrickenTrevor]

It looks cool, I could see my self embedding something like that onto a page compared to the boring About page.

[mlegg]

That is very cool. thanks