Difference between revisions of "introduction"

From Microformats Wiki
introduction
Jump to navigation Jump to search
m
m (Replace <entry-title> with {{DISPLAYTITLE:}})
 
(102 intermediate revisions by 27 users not shown)
Line 1: Line 1:
= Introduction to Microformats =
+
{{DISPLAYTITLE:Introduction to Microformats}}
 +
== What are Microformats? ==
  
* [http://thedredge.org/ Andrew D. Hume] has written a blog post [http://thedredge.org/2005/07/introducing-microformats/ introducing microformats].
+
Microformats are a way of adding simple markup to human-readable data items such as events, contact details or locations, on web pages, so that the information in them can be extracted by software and indexed, searched for, saved, cross-referenced or combined.
* See microformat [[presentations]] for more background and introductory material on [[microformats]].
+
 
 +
More technically, they are items of semantic markup, using just standard "plain old semantic HTML" (i.e. "[[POSH]]") with a set of common [[class-names]] and "[[rel]]" values. They are open and available, freely, for anyone to use.
  
 
== Why Microformats ==
 
== Why Microformats ==
Line 9: Line 11:
  
 
In short, microformats are the convergence of a number of trends:
 
In short, microformats are the convergence of a number of trends:
# a logical next step in the evolution of web design and information architecture techniques and practices
+
# a logical next step in the evolution of web design and information architecture
# a way for bloggers and other self-publishers to publish richer and richer information themselves, without having to rely upon centralized services.
+
# a way for people and organizations to publish richer information themselves, without having to rely upon centralized services
# an acknowledgment that "traditional" metadata efforts have either failed or taken so long to garner any adoption, that a new approach was necessary.
+
# an acknowledgement that (outside of speci<span class="notspam">alist</span> areas) "traditional" metadata efforts (e.g. meta tags) have either failed or taken so long to garner any adoption, that a new approach was necessary
 +
# a way to use well formed [[HTML]] for data.
 +
 
 +
== The Appeal to Simplicity ==
 +
 
 +
* Microformats are a simple effort which has appealed to many frustrated with previous complex efforts.
  
=== Evolution of Web Design ===
+
One parallel that has been drawn is to REST in the API / web services world - for more on REST see [[suggested-reading#REST|suggested reading on REST]].
  
In the beginning (1990), there was HTML and it was good.  It was simple, minimal, and used to semantically markup user visible data (text) and share it on the World Wide Web.
+
==Get Started ==
  
Then came the browser wars (1994-1999) where dominant browser manufacturers took their turns introducing "innovative" presentational tags, giving the typical web author/designer what they wanted: a semblance of control over the presentation of their webpages.  The result: HTML 3.2 "standardized" these defacto presentational innovations.
+
It's easy to get started with microformats:
 +
* [[get-started]] with adding microformats to your HTML
  
The introduction of CSS1 (1996) and the semantically richer HTML4 (1998) brought a glimmer of hope, but it wasn't until years later (2000-2001), with the introduction of fully compliant (or almost) implementations of CSS1/HTML4 (IE5/Mac, IE6/Windows, Netscape 6) that it became practical for web designers to depend on CSS in their web pages.  Leaders in the community began to furiously adopt and promote CSS (even if it took a hack or two) and the efficiencies and enhanced productivity that separating presentation from markup brought them, yet remained a small vocal minority.
+
==Learn More ==
  
The introduction and growth of the CSS Zen Garden (2002-2003) was CSS's tipping point. With the clear and obvious presentation of visual beauty and broad creativity, designers world-wide "got it" and realized that this was the future of web design. The presentational markup of &lt;FONT&gt;, &lt;TABLE&gt;, and spacer.gif were tossed aside by any and all self-respecting web designers, who discovered the near infinite flexibility of &lt;div&gt;, &lt;span&gt;, and the 'class' attribute.  A few in the community even began adopting some of the more semantic elements in HTML: &lt;p&gt;, &lt;h1&gt;...&lt;h6&gt;, &lt;ol&gt;, &lt;ul&gt;, &lt;li&gt;, &lt;em&gt;, &lt;strong&gt;.  Leaders in the community exercised the semantic limits of strict HTML4 (experimented with XHTML) and documented best practices.
+
Learn more about microformats from the microformats.org
 +
* [http://microformats.org/about/ about page],  
 +
* [http://microformats.org/ blog],  
 +
* [[FAQ]],
 +
* [[articles]],
 +
* [[press]],  
 +
* [[presentations]],  
 +
* [[books]],  
 +
* [[podcasts]],  
 +
* [[screencasts]],
 +
* and more [[suggested-reading|suggested reading]].
  
As the community followed rapidly in the footpaths they had worn, the leaders began to run into the limits of semantic (X)HTML.  Other subcultures were attempting to rewrite the world in their own language(s) (RDF, "plain" XML, SVG), yet not having much of an impact on the World Wide Web, which required human presentable data, compatible with the browsers and various clients people already used.  Social Software and Blogs, written by this new generation of web designers and programmers, began to take off.  Natural patterns emerged from the way people used blogging systems, putting things into lists, especially lists of other bloggers (known as blogrolls), and annotating them with information representing relationships such has having met, friends, family, etc. The first microformat, XFN, was designed to match these behaviors, and introduced to the blogging community (2003-2004) whose tools adopted it within weeks.  The GMPG was formed as a home for XFN, and documentd a few key design principles later adopted for microformats.  The key notion, that semantic (X)HTML could be extended, had been introduced and accepted by the community.
+
==See Also==
  
By understanding, using, and combining semantic (X)HTML building blocks, as well as determining that semantic (X)HTML could be validly extended via new rel, meta name, and class values, defined in (X)HTML profiles in the XMDP format, the community began to design and develop many more microformats (2004-2005).  More patterns emerged from the blogging community, and each aggregate human behavior drove the design of simple, adaptive microformats to meet its needs.  Creative Commons licensing became popular and [[rel-license]] was proposed.  Outlines and lists: [[xoxo|XOXO]]. Contact info: [[hcard|hCard]].  Calendars and events [[hcalendar|hCalendar]].
+
* [[testimonials]]
 +
* [[implement|So you want to implement microformats?]]
  
Using these new found building blocks, the web design and information architecture communities were no longer limited by the predefined semantics of HTML4 (nor did they have to compromise human presentation and ease of authoring which other attempts sorely lacked).  2005 may well be the year that microformats became the next step in the evolution of the web.
+
== External Resources==
  
 +
* Emily Lewis's excellent series of articles:
 +
** [http://ablognotlimited.com/articles/tag/Getting+Semantic+series/ A Blog Not Limited: Getting Semantic With Microformats Series]
 +
* Sitepoint has a nice introductory tutorial:
 +
** [http://reference.sitepoint.com/html/microformats Microformats - Plugging the Gaps in HTML]
 +
* Premasagar has written up
 +
** [http://premasagar.com/microformats/compound/ some nice microformats examples with source].
  
== Stub note ==
+
== Translations ==
  
This page is a stub and could certainly use some contributions, especially from folks new to [[microformats]], and what key points and details from their perspective helped explain to them what microformats are, why they matter, what benefits they provide to web designers, information architects, web developers, web programmers etc. - [http://tantek.com/log/ Tantek]
+
* [[introduction-pt-br]] (see also [[introduction-pt-br-2]])
 +
* ...

Latest revision as of 16:28, 18 July 2020

What are Microformats?

Microformats are a way of adding simple markup to human-readable data items such as events, contact details or locations, on web pages, so that the information in them can be extracted by software and indexed, searched for, saved, cross-referenced or combined.

More technically, they are items of semantic markup, using just standard "plain old semantic HTML" (i.e. "posh") with a set of common existing-classes and "rel" values. They are open and available, freely, for anyone to use.

Why Microformats

Why did we come up with microformats?

In short, microformats are the convergence of a number of trends:

  1. a logical next step in the evolution of web design and information architecture
  2. a way for people and organizations to publish richer information themselves, without having to rely upon centralized services
  3. an acknowledgement that (outside of specialist areas) "traditional" metadata efforts (e.g. meta tags) have either failed or taken so long to garner any adoption, that a new approach was necessary
  4. a way to use well formed HTML for data.

The Appeal to Simplicity

  • Microformats are a simple effort which has appealed to many frustrated with previous complex efforts.

One parallel that has been drawn is to REST in the API / web services world - for more on REST see suggested reading on REST.

Get Started

It's easy to get started with microformats:

Learn More

Learn more about microformats from the microformats.org

See Also

External Resources

Translations