events/2007-09-05-dconstruct-microformats-workshop: Difference between revisions

From Microformats Wiki
Jump to navigation Jump to search
(fix upcoming link)
 
(35 intermediate revisions by 11 users not shown)
Line 1: Line 1:
<h1>dConstruct Microformats Workshop</h1>
<h1>dConstruct Microformats Workshop</h1>
 
{{TOC-right}}
One of several microformats [[events]].
One of several microformats [[events]].
__TOC__


== Summary ==
== Summary ==
This workshop will cover just about everything to do with microformats. That's the beauty of such a simple technology: it only takes a single day to become an expert. This won’t be a passive presentation: you will learn not just the theory of microformats; you’ll also get down and dirty with some hands-on markup.
This workshop will cover just about everything to do with microformats. That's the beauty of such a simple technology: it only takes a single day to become an expert. This won’t be a passive presentation: you will learn not just the theory of microformats; you’ll also get down and dirty with some hands-on markup.


Line 13: Line 9:
<div class="vevent">
<div class="vevent">
* Title: <span class="summary">dConstruct Microformats Workshop</span>
* Title: <span class="summary">dConstruct Microformats Workshop</span>
* Where: <span class="location vcard"><span class="fn org">Clearleft</span>, <span class="adr"><span class="locality">28 Kensington Street,</span> <span class="locality">Brighton</span>, <span class="country-name">England</span> <span class="postal-code">BN1 4AJ</span></span> (Coordinates: <span class="geo">50.8258;-0.1385</span>)</span>
* Where: <span class="location vcard"><span class="fn org">Clearleft</span>, <span class="adr"><span class="street-address">28 Kensington Street,</span> <span class="locality">Brighton</span>, <span class="country-name">England</span> <span class="postal-code">BN1 4AJ</span></span> (Coordinates: <span class="geo">50.8258;-0.1385</span>)</span>
* When: <span class="dtstart">2007-09-05</span>
* When: <span class="dtstart">2007-09-05</span>
* Web:  
* Web:  
** <span class="url">http://2007.dconstruct.org/workshops/#jeremytantek</span>
** <span class="url">http://2007.dconstruct.org/workshops/#jeremytantek</span>
** <span class="url">http://upcoming.yahoo.com/event/211922/</span>
** <span class="url">http://upcoming.org/event/211922/</span>
</div>
</div>


'''[http://technorati.com/events/http://microformats.org/wiki/events/2007-09-05-dconstruct-microformats-workshop Add this event to your diary or calendar program]''' http://www.boogdesign.com/images/buttons/microformat_hcalendar.png
'''[http://technorati.com/events/http://microformats.org/wiki/events/2007-09-05-dconstruct-microformats-workshop Add this event to your diary or calendar program]''' http://www.boogdesign.com/images/buttons/microformat_hcalendar.png


== Outline ==
== Presentations ==
 
S5 presentations:
If you are coming to this workshop and there are issues that you want to make sure are addressed, please list them here:
* [http://adactio.com/extras/microformatsworkshop/ dConstruct Microformats Workshop] - useful links for the workshop including [http://adactio.com/extras/microformatsworkshop/exercises/ exercises]. The [http://adactio.com/extras/microformatsworkshop/outline/ online outline] ([[events/2007-09-05-dconstruct-microformats-workshop-outline|previously drafted here]]) is also available.
 
* [http://tantek.com/presentations/2007/09/microformats/background/ dConstruct Microformats Workshop background]
* ...
* [http://tantek.com/presentations/2007/09/microformats/data-portability/ dConstruct Microformats Workshop data portability]
 
Here is a rough outline of the structure of the workshop:
 
<ol class="xoxo">
<li>Background
<ol>
<li>Semantic markup (Tantek)
<ol>
<li>Web History 1990s</li>
<li>2000-2001</li>
<li>2002-2003: Wired News redesign, CSS tipping point, semantic (X)HTML grows</li>
</ol>
</li>
<li>Questions?</li>
</ol>
</li>
<li>POSH
<ol>
<li>Lesser known markup (Jeremy)
<ol>
<li>Examples
<ol>
<li>thead, tbody, summary?</li>
<li>optgroup?</li>
<li>del, ins?</li>
<li>cite attribute?</li>
<li>rel attribute</li>
</ol>
</li>
</ol>
</li>
<li>Questions?</li>
</ol>
</li>
<li>Elemental microformats
<ol>
<li>rel-license (Tantek)</li>
<li>XFN (Jeremy)</li>
<li>rel-tag (Tantek)</li>
<li>vote-links (Jeremy)</li>
<li>Questions?</li>
</ol>
</li>
<li>Building blocks
<ol>
<li>The class design pattern (Tantek)
<ol>
<li>not just for CSS</li>
</ol>
</li>
<li>The abbr design pattern (Jeremy)
<ol>
<li>datetime</li>
<li>geo</li>
<li>accessibility concerns</li>
</ol>
</li>
<li>Questions?</li>
</ol>
</li>
<li>hCard
<ol>
<li>background (Tantek)</li>
<li>implementation (Jeremy)</li>
<li>example sites</li>
<li>Questions?</li>
</ol>
</li>
<li>hCalendar
<ol>
<li>background (Tantek)</li>
<li>implementation (Jeremy)</li>
<li>example sites</li>
<li>Questions?</li>
</ol>
</li>
<li>Exercises
<ol>
<li>spot the contact and event info</li>
<li>fill in the blanks</li>
<li>Questions?</li>
</ol>
</li>
<li>Compound microformats
<ol>
<li>hResume (Tantek)</li>
<li>hReview (Jeremy)</li>
<li>hAtom (Tantek)</li>
<li>Questions?</li>
</ol>
</li>
<li>Case study
<ol>
<li>Yahoo! Europe (Norm!)</li>
<li>Questions?</li>
</ol>
</li>
<li>Philosophy
<ol>
<li>Scientific method: gather data before forming hypotheses (Tantek)
<ol>
<li>what information are humans already publishing?</li>
<li>the specific reasons are irrelevant, the 'existence' of the behavior matters</li>
<li>use only information published visibly, it tends to be more accurate than that published invisibly</li>
</ol>
</li>
<li>Progressive problem solving (Jeremy)
<ol>
<li>solve simple problems before complex problems - simple solutions will often act as building blocks for complex problems, and illuminate how to more easily solve them</li>
<li>solve the most common problems first. by developing ways of sharing the most commonly published/used information types first, more use cases, applications, scenarios will be enabled faster</li>
<li>if only one person seems interested in a problem, it's probably not yet worth the attention of the community</li>
</ol>
<li>Reusing vocabularies helps communication (Tantek)
<ol>
<li>reuse rather than reinvent (vocabulary reinvention is a common (e.g. XML) standards mistake = babel)</li>
<li>reuse from existing well implemented interoperable standards</li>
<li>vcard to hcard</li>
<li>icalendar to hcalendar</li>
</ol>
</li>
<li>The Pareto principle (Jeremy)
<ol>
<li>80/20</li>
<li>Humans first, machines second</li>
</ol>
</li>
<li>Questions?</li>
</ol>
</li>
<li>Extracting microformats
<ol>
<li>Operator (Tantek)</li>
<li>Bookmarklet, Bluetooth (Jeremy)</li>
<li>Parsing (Brian)</li>
<li>Questions?</li>
</ol>
</li>
<li>Data Portability
<ol>
<li>being able to move your data thru time and space</li>
<li>note additional data portability points from Tantek's 2005-09 Web Essentials preso on microformats</li>
<li>most recent high profile example of data portability: social networks</li>
</ol>
</li>
<li>Social Network Portability
<ol>
<li>problem statement: having to re-enter profile info, re-add friends</li>
<li>solution: your data should be published/shared with microformats</li>
<li>profile info: use hCard</li>
<li>link to your home page: use XFN rel="me" for identity consolidation / URL claiming</li>
<li>friends lists: hCard for names/links to friends + XFN for relationships </li>
<li>view all friends / paginating friends: use XFN rel="me" to consolidate friends lists into profile URL</li>
<li>supported by sites today (show names/logos)</li>
<li>how to support open user profiles with hCard</li>
<li>how to support open friends lists with hCard+XFN</li>
<li>how to import/subscribe to an open user profile (e.g. Satisfaction, hKit)</li>
<li>how to import/subscribe to an open friends list (e.g. Dopplr)</li>
<li>Backnetwork example (Glenn?)</li>
</ol>
</li>
<li>The future
<ol>
<li>More microformats?</li>
<li>More parsers
<ol>
<li>Firefox 3</li>
</ol>
</li>
<li>More implementations
<ol>
<li>Google maps</li>
</ol>
</li>
<li>Questions?</li>
</ol>
</li>
<li>General Q&A - possible Q&A topics:
<ol>
<li>Creating microformats
<ol>
<li>The process (Tantek)
<ol>
<li>first make sure your site is POSH</li>
<li>second make sure your site uses existing microformats in known ways</li> <li>solve a specific problem</li>
<li>try using existing microformats for your new problem</li>
<li>document existing publishing behaviors of your type of information</li>
</ol>
</li>
<li>Proposals (Jeremy)</li>
<li>Community (Tantek)
<ol>
<li>wiki</li>
<li>IRC</li>
<li>mailing list</li>
</ol>
</li>
<li>Questions?</li>
</ol>
</li>
</ol>
</li>
</ol>


== Tags ==
== Tags ==
tags: '''microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards'''
tags: '''microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards'''


== Presenters ==
== Presenters ==
*[http://tantek.com/ Tantek Çelik]
*[http://tantek.com/ Tantek Çelik]
*[http://adactio.com/ Jeremy Keith]
*[http://adactio.com/ Jeremy Keith]


== Attending ==
== Attending ==
Line 247: Line 38:
* [[User:Adactio|Adactio]]
* [[User:Adactio|Adactio]]
-->
-->
* [[User:DuncanCragg|Duncan Cragg]]/[http://duncan-cragg.org/ Duncan Cragg]/[http://www.linkedin.com/in/duncancragg Duncan Cragg]
* [[User:ChristopheDucamp|Christophe Ducamp]]
* [[User:ChristopheDucamp|Christophe Ducamp]]
* [http://www.kenneth.himschoot.com/vcard Kenneth Himschoot]
* [[User:AnnaKoutli|Anna Koutli]]
* [http://www.linkedin.com/pub/0/2a4/b47 Pierre Marissal]
* [http://www.linkedin.com/pub/0/2a4/b47 Pierre Marissal]
* ...
* [http://www.middlege.com Paul Middlege]
* [http://adhocproductions.co.uk Kieron Norfield]
* [[User:EmilOvemar|Emil Ovemar]]
* [[User:JohanSahlen|Johan Sahlén]] (blog coming in the future)
* ....
 
== URLs discussed ==
* [http://www.gmpg.org/xfn/creator XFN creator]
* [http://services.alphaworks.ibm.com/manyeyes/view/S7ipIHsOtha6i3-ZJvKJH2- Many Eyes XFN visualization], [http://xfngraph.sourceforge.net/index.en.utf8.html Another XFN visualization]
* [http://code.google.com/webstats/ Google Study of HTML attributes and uses]
* [http://microformats.org/code/hcard/creator hCard Creator]
* [http://leftlogic.com/lounge/articles/microformats_bookmarklet/ LeftLogic Bookmarklet]
* [http://kitchen.technorati.com Technorati microformats search]
* [http://www.w3.org/TR/NOTE-datetime W3C Date Time]
* [http://www.revish.com/ Book Reviews]


== Session Comments and Q&A ==
== Session Comments and Q&A ==
* ...
* Q. When do you actually use REV and REL?
** A. Rarely should you ever use REV. See the [[rel-faq#Should_.27rev.27_even_be_used|rel-faq about this]].
* Q. Are Vote-links only external URLs or can they be internal?
** A. they are based on URLs, so you can link internally as well as externally
 
* Q. Could you use the title attibute instead of the link for rel-tag
** A. the REL attribute is semantically connected to the href


== Photos ==
== Photos ==
Line 259: Line 73:
tags: '''microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards'''
tags: '''microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards'''


<!--
=== before ===
*[xxxUrlxxx]  
Tantek and Jeremy fold [[pocket cheat sheets]].
-->
[http://www.flickr.com/photos/andybudd/1330657215/ http://farm2.static.flickr.com/1152/1330657215_653be4c314_m_d.jpg]
* ...
=== during ===
Please note and tag yourselves!
 
[http://www.flickr.com/photos/tantek/1339574094/ http://farm2.static.flickr.com/1048/1339574094_84e8cff845_m.jpg]
[http://www.flickr.com/photos/tantek/1338697893/ http://farm2.static.flickr.com/1205/1338697893_5815540025_m.jpg]
[http://www.flickr.com/photos/khimscho/1328581455/ http://farm2.static.flickr.com/1425/1328581455_8ab93f4a54_m_d.jpg]
[http://www.flickr.com/photos/adactio/1332086561/ http://farm2.static.flickr.com/1091/1332086561_ead1c90b16_m.jpg]
[http://www.flickr.com/photos/adactio/1332094573/ http://farm2.static.flickr.com/1288/1332094573_379c236a5e_m.jpg]
[http://www.flickr.com/photos/adactio/1332979504/ http://farm2.static.flickr.com/1134/1332979504_4e50535847_m.jpg]
[http://www.flickr.com/photos/andybudd/1331957374/ http://farm2.static.flickr.com/1154/1331957374_775866b2ab_m_d.jpg]
[http://www.flickr.com/photos/andybudd/1331574418/ http://farm2.static.flickr.com/1060/1331574418_e1270393b4_m_d.jpg] [http://www.flickr.com/photos/tantek/1338689489/ http://farm2.static.flickr.com/1247/1338689489_0ba9811c68_m.jpg]
[http://www.flickr.com/photos/duncancragg/1364574601/ http://farm2.static.flickr.com/1165/1364574601_ae2691d967_m.jpg]
[http://www.flickr.com/photos/duncancragg/1364574599/ http://farm2.static.flickr.com/1194/1364574599_f54638d6d9_m.jpg]
[http://www.flickr.com/photos/duncancragg/1364574595/ http://farm2.static.flickr.com/1167/1364574595_b43a311395_m.jpg]


== Related Articles/Blogs ==
== Related Articles/Blogs ==
Line 269: Line 96:
tags: '''microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards'''
tags: '''microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards'''


* ...


<!--  
<!--  
Line 276: Line 102:
-->
-->


==Relatedpages==
==Related pages==
* [[data-portability]]
* [[social-network-portability]]
{{events-related-pages}}
{{events-related-pages}}

Latest revision as of 05:43, 4 April 2017

dConstruct Microformats Workshop

One of several microformats events.

Summary

This workshop will cover just about everything to do with microformats. That's the beauty of such a simple technology: it only takes a single day to become an expert. This won’t be a passive presentation: you will learn not just the theory of microformats; you’ll also get down and dirty with some hands-on markup.

Details

Add this event to your diary or calendar program microformat_hcalendar.png

Presentations

S5 presentations:

Tags

tags: microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards

Presenters

Attending

Alphabetically sorted by last name.

URLs discussed

Session Comments and Q&A

  • Q. When do you actually use REV and REL?
  • Q. Are Vote-links only external URLs or can they be internal?
    • A. they are based on URLs, so you can link internally as well as externally
  • Q. Could you use the title attibute instead of the link for rel-tag
    • A. the REL attribute is semantically connected to the href

Photos

Please use all of the following tags when tagging photos published related to the dConstruct Microformats Workshop:

tags: microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards

before

Tantek and Jeremy fold pocket cheat sheets. 1330657215_653be4c314_m_d.jpg

during

Please note and tag yourselves!

1339574094_84e8cff845_m.jpg 1338697893_5815540025_m.jpg 1328581455_8ab93f4a54_m_d.jpg 1332086561_ead1c90b16_m.jpg 1332094573_379c236a5e_m.jpg 1332979504_4e50535847_m.jpg 1331957374_775866b2ab_m_d.jpg 1331574418_e1270393b4_m_d.jpg 1338689489_0ba9811c68_m.jpg 1364574601_ae2691d967_m.jpg 1364574599_f54638d6d9_m.jpg 1364574595_b43a311395_m.jpg

Related Articles/Blogs

Please use all of the following tags when tagging blog posts published related to the dConstruct Microformats Workshop:

tags: microformats dconstruct07 dconstruct2007 microformats-dconstruct2007 workshop microformatsworkshop upcoming:event=211922 socialnetworkportability dataportability openstandards


Related pages