&lt;p&gt;The &lt;a href="/Graphics/WebCGM/WG/"&gt;WebCGM Working Group&lt;/a&gt; has published a W3C Recommendation of &lt;a href="/TR/2010/REC-webcgm21-20100301/"&gt;WebCGM 2.1&lt;/a&gt;. Computer Graphics Metafile (CGM) is an ISO standard, defined by ISO/IEC 8632:1999, for the interchange of 2D vector and mixed vector/raster graphics. WebCGM is a profile of CGM, which adds Web linking and is optimized for Web applications in technical illustration, electronic documentation, geophysical data visualization, and similar fields. WebCGM aims to balance graphical expressive power on the one hand, and simplicity and implementability on the other. A small but powerful set of standardized metadata elements supports the functionalities of hyperlinking and document navigation, picture structuring and layering, and enabling search and query of WebCGM picture content. WebCGM 2.1 refines and completes the features found in WebCGM 2.0. Learn more about the &lt;a href="/Graphics/"&gt;Graphics Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/XML/Processing/"&gt;XML Processing Model Working Group&lt;/a&gt; has published a Proposed Recommendation of &lt;a href="/TR/2010/PR-xproc-20100309/"&gt;XProc: An XML Pipeline Language&lt;/a&gt;. This specification describes the syntax and semantics of XProc: An XML Pipeline Language, a language for describing operations to be performed on XML documents. Pipelines are made up of simple steps which perform atomic operations on XML documents and constructs similar to conditionals, iteration, and exception handlers which control which steps are executed. The group has produced an &lt;a href="/XML/XProc/2010/02/ir.html"&gt;implementation report&lt;/a&gt; Comments are welcome through 15 April. Learn more about the &lt;a href="/XML/"&gt;Extensible Markup Language (XML) Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/2006/WSC/"&gt;Web Security Context Working Group&lt;/a&gt; has published a Last Call Working Draft of &lt;a href="/TR/2010/WD-wsc-ui-20100309/"&gt;Web Security Context: User Interface Guidelines&lt;/a&gt;. This specification deals with the trust decisions that users must make online, and with ways to support them in making safe and informed decisions where possible. This document specifies user interactions with a goal toward making security usable, based on known best practice in this area. Comments are welcome through 31 March. Learn more about the &lt;a href="/Security/"&gt;Security Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/2008/WebVideo/Annotations/"&gt;Media Annotations Working Group&lt;/a&gt; has published Working Drafts of &lt;a href="/TR/2010/WD-mediaont-10-20100309/"&gt;Ontology for Media Resource 1.0&lt;/a&gt; and &lt;a href="/TR/2010/WD-mediaont-api-1.0-20100309"&gt;API for Media Resource 1.0&lt;/a&gt;. The former document defines the Ontology for Media Resource 1.0, a core vocabulary to describe media resources on the Web. It is defined based on a core set of properties which covers basic metadata to describe media resources. Further it defines syntactic and semantic level mappings between elements from existing formats. The ontology is supposed to foster the interoperability among various kinds of metadata formats currently used to describe media resources on the Web. The latter defines a client-side API to access metadata information related to media resources on the Web. Learn more about the &lt;a href="/2008/WebVideo/"&gt;Video in the Web Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt; &lt;a class="imageLink" href="http://www.w3.org/People/Jeff/"&gt; &lt;img width="100" height="150" src="http://www.w3.org/2010/03/JeffreyJaffe_thumb.jpg" alt="Dr. Jeffrey Jaffe"/&gt; &lt;/a&gt; W3C today named &lt;a href="/People/Jeff/"&gt;Dr. Jeffrey Jaffe&lt;/a&gt; its new Chief Executive Officer. "Web technologies continue to be the vehicle for every industry to incorporate the rapid pace of change into their way of doing business," said Dr. Jaffe. "I'm excited to join W3C at this time of increased innovation, since W3C is the place where the industry comes together to set standards for the Web in an open and collaborative fashion." As W3C CEO, Dr. Jaffe will work with Director Tim Berners-Lee, staff, Membership, and the public to evolve and communicate W3C's organizational vision. The CEO is responsible for W3C's global operations, for maintaining the interests of all of the W3C's stakeholders, and for sustaining a culture of cooperation and transparency, so that W3C continues to be the leading forum for the technical development and stewardship of the Web. Read the &lt;a href="http://www.w3.org/QA/2010/03/w3c_ceo_blog_first_posting_mar.html"&gt;CEO Blog&lt;/a&gt; and learn more in the &lt;a href="/2010/03/ceo-pr.html"&gt;press release&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;W3C published today seven documents related to HTML:&lt;/p&gt; &lt;ul class="show_items"&gt; &lt;li&gt;&lt;a href="/TR/2010/WD-html5-20100304/"&gt;HTML 5&lt;/a&gt; and &lt;a href="/TR/2010/WD-html5-diff-20100304/"&gt;HTML5 differences from HTML4&lt;/a&gt;. In addition, some content that was part of the HTML 5 specification has been published in two new standalone drafts: &lt;a href="/TR/2010/WD-2dcontext-20100304/"&gt;HTML Canvas 2D Context&lt;/a&gt; and &lt;a href="/TR/2010/WD-microdata-20100304/"&gt;HTML Microdata&lt;/a&gt;.&lt;/li&gt; &lt;li&gt;&lt;a href="/TR/2010/WD-html-markup-20100304/"&gt;HTML: The Markup Language&lt;/a&gt;, a first draft. This document describes the HTML markup language and provides details necessary for producers of HTML content to create documents that conform to the language. By design, it does not define related APIs, nor attempt to specify how consumers of HTML content are meant to process documents, nor attempt to be a tutorial or "how to" authoring guide.&lt;/li&gt; &lt;li&gt;&lt;a href="/TR/2010/WD-rdfa-in-html-20100304/"&gt;HTML+RDFa&lt;/a&gt;, which defines rules and guidelines for adapting the RDF in XHTML: Syntax and Processing (RDFa) specification for use in the HTML5 and XHTML5 members of the HTML family.&lt;/li&gt; &lt;li&gt;&lt;a href="/TR/2010/WD-html-bidi-20100304/"&gt;Additional Requirements for Bidi in HTML&lt;/a&gt;, a first draft. Authoring a web app that needs to support both right-to-left and left-to-right interfaces, or to take as input and display both left-to-right and right-to-left data, usually presents a number of challenges that make it an especially laborious and bug-prone task. Some of these are due to browser bugs, but some can be traced to a gap in the specification of the bidirectional aspects of a given HTML feature. And some of these challenges could be greatly simplified by adding a few strategically placed new HTML features. This document proposes fixes for some of the most repetitive pain points.&lt;/li&gt; &lt;/ul&gt; &lt;p&gt;All documents were published by the &lt;a href="/html/wg/"&gt;HTML Working Group&lt;/a&gt; except the last one, published by the &lt;a href="/International/core/"&gt;Internationalization Core Working Group&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/Voice/"&gt;Voice Browser Working Group&lt;/a&gt; has published a Working Draft of &lt;a href="/TR/2010/WD-voicexml30-20100304/"&gt;Voice Extensible Markup Language (VoiceXML) 3.0&lt;/a&gt;. This document specifies VoiceXML 3.0, a modular XML language for creating interactive media dialogs that feature synthesized speech, recognition of spoken and DTMF key input, telephony, mixed initiative conversations, and recording and presentation of a variety of media formats including digitized audio, and digitized video. See the &lt;a href="/TR/2010/WD-voicexml30-20100304/diff.html"&gt;diff-marked version&lt;/a&gt; of changes since the previous draft, and learn more about the &lt;a href="/Voice/"&gt;Voice Browser Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/2008/xmlsec/"&gt;XML Security Working Group&lt;/a&gt; has published two Working Drafts: &lt;a href="/TR/2010/WD-xmldsig-core2-20100304/"&gt;XML Signature Syntax and Processing Version 2.0&lt;/a&gt; and &lt;a href="/TR/2010/WD-xml-c14n2-20100304/"&gt;Canonical XML Version 2.0&lt;/a&gt;. The first specifies XML syntax and processing rules for creating and representing digital signatures. XML Signatures can be applied to any digital content (data object), including XML. The second is a major rewrite of Canonical XML Version 1.1 to address issues around performance, streaming, hardware implementation, robustness, minimizing attack surface, determining what is signed and more. It also incorporates an update to Exclusive Canonicalization, effectively a 2.0 version, as well. Learn more about the &lt;a href="/Security/"&gt;Security Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/XML/Core/"&gt;XML Core Working Group&lt;/a&gt; has published a Proposed Recommendation of &lt;a href="/TR/2010/PR-xlink11-20100225/"&gt;XML Linking Language (XLink) Version 1.1&lt;/a&gt;. This specification defines the XML Linking Language (XLink) Version 1.1, which allows elements to be inserted into XML documents in order to create and describe links between resources. It uses XML syntax to create structures that can describe links similar to the simple unidirectional hyperlinks of today's HTML, as well as more sophisticated links. Comments are welcome through 31 March. Learn more about the &lt;a href="/XML/"&gt;Extensible Markup Language (XML) Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/Voice/"&gt;Voice Browser Working Group&lt;/a&gt; has published a Proposed Recommendation of &lt;a href="/TR/2010/PR-speech-synthesis11-20100223/"&gt;Speech Synthesis Markup Language (SSML) Version 1.1&lt;/a&gt;. The Speech Synthesis Markup Language Specification is designed to provide a rich, XML-based markup language for assisting the generation of synthetic speech in Web and other applications. The essential role of the markup language is to provide authors of synthesizable content a standard way to control aspects of speech such as pronunciation, volume, pitch, rate, etc. across different synthesis-capable platforms. SSML 1.1 improves SSML 1.0 support for a broader set of natural (human) languages. Known implementations are documented in the &lt;a href="/Voice/2009/ssml11-ir/"&gt;Implementation Report&lt;/a&gt;, along with the associated test suite. Comments are welcome through 23 March. Learn more about the &lt;a href="/Voice/"&gt;Voice Browser Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/AudioVideo/TT/"&gt;Timed Text Working Group&lt;/a&gt; has published an updated Candidate Recommendation of &lt;a href="/TR/2010/CR-ttaf1-dfxp-20100223/"&gt;Timed Text Markup Language (TTML) 1.0&lt;/a&gt;. TTML is a content type that represents timed text media for the purpose of interchange among authoring systems. Timed text is textual information that is intrinsically or extrinsically associated with timing information. This an updated document based on implementation experience; see the &lt;a href="http://www.w3.org/TR/2010/CR-ttaf1-dfxp-20100223/#change-history-cr2-to-cr3"&gt;list of changes&lt;/a&gt;. A &lt;a href="http://www.w3.org/2008/10/dfxp-testsuite.zip"&gt;test suite&lt;/a&gt; for TTML is available, along with its &lt;a href="http://www.w3.org/2008/10/dfxp-test-coverage.html"&gt;coverage report&lt;/a&gt; and a &lt;a href="http://www.w3.org/2009/05/dfxp-results.html"&gt;preliminary implementation report&lt;/a&gt;. The test suite and implementations are work in progress and may not reflect all of the changes of this document. Learn more about the &lt;a href="/2008/WebVideo/"&gt;Video in the Web Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt; The &lt;a href="/2005/MWI/Tests/"&gt;Mobile Web Test Suites Working Group&lt;/a&gt; has &lt;a href="/2005/MWI/Tests/blog/2010/02/09/wctmbv2"&gt;just released&lt;/a&gt; a &lt;a href="/2010/01/wctmb2/"&gt;brand new Web Compatibility Test for Mobile Browsers&lt;/a&gt;. Based on the same idea of evaluating support of a number of Web technologies at a glance as in the &lt;a href="/2008/06/mobile-test/"&gt;first Web Compatibility Test published in July 2008&lt;/a&gt;, this second version features a number of more recent technologies that promise to make Web browsers more powerful, in particular on mobile devices. Learn more about the &lt;a href="http://www.w3.org/Mobile/"&gt;Mobile Web Initiative&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;W3C announced today a &lt;a href="/2010/02/mbui/cfp"&gt;Workshop on Future Standards for Model-Based User Interfaces&lt;/a&gt;, 13-14 May 2010 in Rome Italy. Participants will examine the challenges facing Web developers due to variations in device capabilities, modes of interaction and software standards, the need to support assistive technologies for accessibility, and the demand for richer user interfaces. Discussion will focus on reviewing research on model-based design of context- sensitive user interfaces in relation to these challenges, and the opportunities for new open standards in the area of Model-Based User Interfaces. W3C Membership is not required to participate; anyone who satisfies the &lt;a href="/2010/02/mbui/cfp.html#requirements_for_participants"&gt;participation requirements&lt;/a&gt; may attend as long as space permits. Statements of interest are due 2 April. Please see the &lt;a href="2010/02/mbui/cfp"&gt;Call for Participation&lt;/a&gt; for more information. &lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;During the &lt;a href="/News/2009#entry-6545"&gt;implementation phase&lt;/a&gt; of the Rule Interchange Format (RIF), the &lt;a href="/2005/rules/wiki/RIF_Working_Group"&gt;Working Group&lt;/a&gt; discovered a problem with the design of the Production Rules Dialect. This problem is addressed with a new &lt;a href="/TR/2010/WD-rif-prd-20100211/"&gt;Last Call Working Draft&lt;/a&gt; that changes the way actions are handled to more closely match existing production rule engines. Please send comments and &lt;a href="/2005/rules/wiki/How_to_Submit_an_Implementation_Report"&gt;RIF implementation reports&lt;/a&gt; to &lt;a href="mailto:public-rif-comments@w3.org"&gt;public-rif-comments@w3.org&lt;/a&gt;. Last Call comments should be sent before 5 March. Learn more about the &lt;a href="/2001/sw/"&gt;Semantic Web&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

&lt;p&gt;The &lt;a href="/Math/"&gt;Math Working Group&lt;/a&gt; has published a Proposed Recommendation of &lt;a href="/TR/2010/PR-xml-entity-names-20100211/"&gt;XML Entity Definitions for Characters&lt;/a&gt;. This document presents a completed listing harmonizing the known uses in math and science of character entity names that appear throughout the XML world and Unicode. This document is the result of years of employing entity names on the Web. There were always a few named entities used for special characters in HTML, but a flood of new names came with the symbols of mathematics. Comments are welcome through 11 March. Learn more about the &lt;a href="/Math/"&gt;Math Activity&lt;/a&gt;.&lt;/p&gt; </content>

by W3C Staff at March 10, 2010 08:00 PM

Editors Note: In his first article for Think Vitamin Thierry Koblentz discusses the issue of “resetting” your CSS.

“base.css” versus “reset.css”

For a long time, the very first line in my styles sheets was:

* {padding:0;margin:0;}

This simple rule was very convenient as it leveled margin and padding values of all elements across browsers. This “hard reset” was short and simple and it had the advantage of belonging to the main styles sheet rather than being an external file.

Later, this technique was denounced as bad practice as it makes the rendering agent style (check) every single element in a document. It also triggered issues with form controls, but authors were used to specifying styles for these.

Then came “reset” styles sheets. These files go way beyond resetting margin and padding. The most complete in terms of properties/elements involved has to be Eric Meyer’s. It “unstyles” everything you could think of, from a to var.

Authors start with a clean slate. From there, they most often write rules to style elements that were originally styled by the browser’s styles sheet, but overwritten by the reset file. In short, many elements are styled three times:

1. by the browser’s styles sheet (see User Agent Styles Sheets).
2. by the “reset” file.
3. by the author’s styles sheet.

Criticism of this Approach

Jonathan Snook, Jens Meiert and others have “criticized” this approach, saying more or less that there was no use for a “middle man”. On Jen’s site, “randomCommenter” summarizes the issue pretty well when asking: "Wouldn't a well written base style sheet render a reset style sheet redundant and therefore useless?"�

Actually, I believe Eric Meyer himself hints in that direction when he says:

"I don’t particularly recommend that you just use this in its unaltered state in your own projects. It should be tweaked, edited, extended, and otherwise tuned to match your specific reset baseline. Fill in your preferred colors for the page, links, and so on. In other words, this is a starting point, not a self-contained black box of no-touchiness."�

In any case, people should at least evaluate the rules in these reset files before copying and pasting their content. For example, if one authors documents as HTML 4.01 Strict! one may safely remove from a reset styles sheets any reference to elements like:

• iframe
• applet
• strike
• u
• font
• s
• center

My Base Styles Sheet

Following the idea of “tweaking” a reset file, I came up with this “base styles sheet“. It sets default styling for many elements, follows a couple of recommendations regarding usability/accessibility, and addresses a few “common issues” as well.

What does it do that a reset doesn’t?

It fixes a few things

• It forces a gutter for a vertical scrollbar (when content is too short to require a scrollbar)
• It includes an IE button width fix
• It removes “sticky” outline (not in Internet Explorer though)
• It prevents “mysterious gaps below images“
• It prevents descenders letters in legend from being cut-off in Internet Explorer
• It vertically aligns checkboxes and radio buttons with their label
• It sets a default color background for the document with no shrink wrap effect on body¹

It styles lists by default

It is easier to remove markers on lists than to style them. So, by default, lists are styled to show indentation and markers depending on hierarchy and list types. But the styles sheet contains a class to reset this styling. When applied to a UL or OL – it will remove markers and left margin on their items.

It creates vertical “gutters”

Left and right padding are applied to most block-level elements to create vertical gutters. This allows to build layouts without having to use “padding” on main containers which helps to produce designs that do not break in IE 5 (or IE 6 in quirks mode) as width and padding values are not mixed. This is also an alternative to using non semantic wrappers as a workaround to avoid mixing these properties.

Why using padding instead of margin to create that space?

Using padding allows to paint elements’ background all across their parent container. Stretching from one edge to another. When this behavior is not seeked, for example when styling a heading with a bottom border that should be no wider than what appears to be the “content box”, authors can use a class (in the sheet already) to revert that styling (swaping padding values with margin values).

It creates horizontal white space too

• Via margin – By default, vertical space is obtained through top margin. A top margin of 1.2em is applied to most block-level elements.
• Via padding – Authors can uncomment two rules in the styles sheet to create spacing using padding instead of margin. The advantage of this method is that it prevents two common “issues”:
  • Collapsing margins - Margins will not collapse since elements are not styled with vertical (top/bottom) margins.
  • Loss of top margin when clearing floats – When an element clears a float, it “loses” its top margin, but that gap is preserved if top padding is used instead.

What else?

Rules in this base styles sheet are well commented and values that one would like to change (font-family, font-size, line-height, color, padding, etc.) are placed near the top of the file.

You can download base.css with comments or a minified version. My advice is to use these rules as a starting point to create your own styles sheet. Do not link to an external file to then override property values, instead, add, remove and edit anything you want to end up with a main styles sheet for your own project(s).

My base.css styles sheet is a work in progress. If you play with it, and if you see things that should not belong in there or to the contrary things that should be included, please join the discussion.

¹ The YUI reset styles sheet sets a background-color on html. This styling makes the browser paint the background of body no taller than its content instead of matching the viewport’s height (this is by specs). I believe a future release of YUI reset will include this change.

by Thierry Koblentz at March 10, 2010 02:00 PM

We're always excited to engage with members of the W3C including the developers of other browsers as well as the broader web development community to help shape the direction of emerging Web standards, particularly HTML5.  This includes participating in events like TPAC, which we wrote about in November, and on-going engagement with various working groups.  Patrick recently talked about joining the SVG working group, and I'd like to share a brief list of other happenings on the way to making HTML5 well-defined, well-tested, and accessible:

• Providing feedback on HTML5
  Tony Ross, Internet Explorer Program Manager, and Jonas Sicking of Mozilla, led a discussion about extensibility in HTML5 at TPAC after our initial submission.  While the working group hasn't resolved the issue yet, we think the event helped inform everyone and generate the different proposals submitted since. 
• Testing HTML5
  Kris Krueger, Internet Explorer Test Lead, was appointed facilitator of the W3C HTML5 Testing Task Force.  The task force has set up necessary infrastructure like a wiki, Bugzilla, a work item tracker, and CVS repository for test cases.  With that in place, they've started to review DOM Level 2 HTML test cases to use as the start of HTML5 testing.  As with CSS2.1, we think a good test suite is critical to ensuring a specification results in interoperable implementations.
• Ensuring new specifications enable accessibility
  We care deeply about an accessible web so besides implementing accessibility-focused browser features, we're working with Apple, IBM, and other interested parties to ensure the new HTML5 <canvas> and <video> elements have great accessibility support so everyone can use sites leveraging them.  This work is driven by the Accessibility Task Force.  Together, we're working on <canvas> HTML prototypes to use as "˜proof of concepts' to ensure the feature is well-designed, as discussed in a recent teleconference. 
• Indexed DB Proposal
  Together with Mozilla, we're excited about a new design for local storage called Indexed DB.  We think this is a great solution for the web.  Look for another post with more information about this proposal.  In the meantime, you can read the latest working draft. 
• DOM Level 3 Events
  Travis Leithead, Internet Explorer Program Manager, continues to help close down open issues with the latest editor's draft. It's been awhile since the working group published the last working draft and the group plans to publish an update soon that will improve clarity for implementers and web authors alike. On a recent teleconference, we noted that DOM Level 2 Events was published as a Recommendation nearly 10 years ago; it's exciting to have the next milestone in sight!

Finally, you can read an interview with Paul Cotton from Microsoft and co-Chair of the W3C HTML Working Group on the W3C Blog.

Adrian Bateman
Program Manager

by ieblog at March 09, 2010 09:23 PM

Editors Note: In his first article for Think Vitamin Matthew Smith, Principal Designer at Squared Eye Design, discusses the benefits, risks and infrastructure required to work effectively with fellow freelancers.

Working Alone

Working alone can be great. There's a pleasant autonomy of knowing exactly what you're  doing and when. There are few unknowns. You work directly with the client and don't have to worry about managing others.

In the past I've done everything from branding, strategy, IA, design, front-end dev, and CMS integration on a single project. These days, if I'm working alone, its usually providing PSDs to a client who has an internal dev team or something similar. I love it!

These projects are less complex than my collaborative projects, so life is simple. But if I limit myself to the size  and quantity of projects that I'm able to complete all on my own, my business will stagnate. If I am unwilling to pursue entrepreneurship and management, I will forever remain a technician.

Be a Jumbo Shrimp

Growth isn't for everyone, but for me it's a matter of defining my future. I want to be a Jumbo Shrimp "” a big presence in a niche area. I don't want to simply design interfaces for the next 30 years; I want to change the world "“ even if only in a small way. Growth can magnify my ability to directly affect positive change.

Working Together

By partnering with other professionals, I can grow my business and take on projects that can't be harnessed by one man. A huge beer one man can tackle, but a huge project is another undertaking all together. Forming partnerships with others can be overwhelming at first.

But with the right team and a poorly paid talented project manager, you can take on more challenging, higher paying projects. Bolster the success of your partnership (and avoid massive cardiac arrest) by setting the stage with a healthy understanding of the risks and the infrastructure required to harvest the bountiful benefits.

Risks

As with any great opportunity, you'll find an inherent level of risk involved. The normal stuff applies "” what if someone gets sick, eaten by a whale, or discovers that working for you is a level of ass pain they never before imagined? What happens if you have a different work ethic than others on your team?

No one to manage the project

A project lacking management can quickly descend into the hells of scope creep. When that happens, you may be forced to nominate someone Survivor-style to run point. Managing might not be their strong suit or even what they want to be paid for. This can lead to real frustration within your team, and if combined with alcohol and firearms "“ there will be blood.

Your team is flat

It doesn't matter if its soda, tires, or teams "“ flat is bad. If you don't know who's in charge of your project, it's destined for confusion. If you prefer stress and direct path to insanity, then I highly recommend no leadership whatsoever.

No consequences or incentives

If you don't have a clear set of consequences and incentives to encourage your team to stay unified and on target, you're likely to end up with a wayward child on your hands (I want those sweeties!). Recovering from team disunity or distraction costs valuable energy, which distracts from the project goals.

Infrastructure

There are a few areas that aren't quite risks, if they are well defined and everyone has a clear understanding of them, they are as follows:

Choose a project manager

Once you've chosen the right PM, does everyone agree that he has the authority to tell them what to do, and when? Making sure that everyone is ready to receive instruction from your PM and that everyone trusts the PM is critical to keeping the project's flow. If my PM told me to stop enjoying beer, I'd fire him, so your PM's authority should have some boundaries.

Give your team a hierarchy

A flat system will cause confusion and delay. It's important that there is clear delineation of responsibility and authority. Sometimes this may coincide with who brought the project to the table, or it may be defined by who is the better leader.

Whatever the case, make sure you have a clear chain of command. Let your PM define the workflow of your partnership. Ideally everyone has moments of overlap and involvement in every stage of the project so that you aren't simply running a relay race.

Choose incentives or consequences to govern your team

Finding the right incentives and consequences helps you cover your risks properly to ensure that everyone has the right level of stake in the project and their reputation. Done well, this is a document that everyone can sign on to, so that if the project goes south because of someone's error, it's their agreement with the document that hands out the punishment "“ not one of your team.

For our partnership, one incentive/consequence is very simply the ability to be re-hired on the next project, or fired from the current one dependent on whether you're meeting the project expectations or not. We also spank, though for some in our coworking office that's an incentive, so we use it sparingly.

Benefits

You can now safely move about the cabin, you have a project manager on duty

A PM's responsibilities and authority can give you room to breathe. It will also allow you to do what you do best "” whether that's IA, design, tweeting, or development. It also bears mentioning that your clients will experience a higher level of care and organization. And if you depend on word of mouth like we do, this is one of your greatest assets.

Organizational clarity leads to total work nirvana

Okay, that's overkill, but you and your clients will notice the efficiency that grows from a clear structure of authority. It allows your team to operate as a congruent force with a head, rather than an unruly band of independent freelancers.

Great incentives and real consequences keep the house clean

I hate conflict as much as anybody. If you put together a solid document with both incentives and consequences, you'll find your projects and your team keep clean and free from unmanageable conflict. Everyone on your team wants to succeed, make money, and have a big party when every project's done "“ this will make it so much easier.

In Summary

Bringing a team of freelancer's together to provide a solid end product to a great client is profitable adventure and a joy. The Blue Sky Resumes project was the most ambitious foray into collaboration for our team.

The experience had a high learning curve, some of which I'm hoping to spare you from. If you move in this direction, you'll see failures along the way; it'll be as tough as it is fun. But the work you'll get to engage in, and the great people you get to work with are worth every moment.

Resources

To Read

• Army of Davids (Good business oriented abstract read)
• Noded (I've not read this, but ought to)

Other Collaborative Freelancers

• Sidebar Creative
• Analog

Coworking Is a Good Place to Start

• Coworking on Wikipedia
• Coworking Site

by Matthew Smith at March 09, 2010 02:00 PM

On March 4, the W3C published no less than seven new or updated working draft documents related to HTML:

• HTML5
• HTML: The Markup Language
• HTML5 differences from HTML4
• HTML+RDFa
• HTML Microdata
• HTML Canvas 2D Context
• Additional Requirements for Bidi in HTML

Read full post

Posted in (X)HTML, HTML 5.

by Roger Johansson at March 08, 2010 07:05 PM

Right now nobody’s interested in a mobile solution that does not contain the words “iPhone” and “app” and that is not submitted to a closed environment where it competes with approximately 2,437 similar mobile solutions.

Compared to the current crop of mobile clients and developers, lemmings marching off a cliff follow a solid, sensible strategy. Startling them out of this obsession requires nothing short of a new buzzword.

Therefore I’d like to re-brand standards-based mobile websites and applications, definitely including W3C Widgets, as “HTML5 apps.” People outside our little technical circle are already aware of the existence of HTML5, and I don’t think it needs much of an effort to elevate it to full buzzwordiness.

Technically, HTML5 apps would encompass all websites as well as all the myriads of (usually locally installed) web-standards-based application systems on mobile. The guiding principle would be to write and maintain one single core application that uses web standards, as well as a mechanism that deploys that core application across a wide range of platforms.

March 08, 2010 02:45 PM

Where are you and what is around you?

Geolocation is a hot topic. Google just got the patent on geolocated advertising, mobile phones allow us to pinpoint ourselves on the planet and find things nearby and with augmented reality applications we can even find our way by filming our surrounding and finding hidden treasures by moving our mobile around. Using geolocation as a developer is quite easy, you can do a few things:

• If you are building something in a social network, you can get the geographical location from the user’s profile.
• If you work on a certain mobile platform (Android, WebOS, iPhone) you get APIs to detect the current location.
• If that is not an option you can use the W3C geo location API in browsers that support it.
• If everything else fails you can guess the visitor’s location from their IP number.

That is the where, but how to know what is around me?

Knowing the location is one thing, but what if you want to know more about the area? What about the geographical hierarchy? What part of the city/country are you in and which other geographical and administrative areas are nearby?

All of this has been available for you for quite a while. The GeoPlanet API and dataset released by Yahoo! has been out for a while but did not quite get the love from the mainstream developer crowd it deserves. The geo hackers, on the other hand already love it to bits and helped make it more accurate by providing feedback.

To make it a bit easier for you to understand what the GeoPlanet API allows you to do, I’ve put together the GeoPlanet Explorer – a tool that lets you explore all the GeoPlanet data in an interactive way:

The Geoplanet Explorer uses three tools: YQL for accessing and filtering data, YUI3 for the rich interaction and CSS layout, Yahoo Maps for display and PHP to glue all of that together. You can get the full source code on GitHub.

Simplifying matters using woeid

One big problem of geo location is ambiguity. If you have a location with latitude and longitude you can pinpoint it on the globe. You don’t know what it is though. The centre of a certain county, city and a point of interest could share the same latitude and longitude, but they are actually totally different things.

To fix this problem, Yahoo! a long time ago introduced the Where on Earth ID (or short woeid) which is a number that defines a place with its geographical location and describes what it is. For example my neighbourhood in London has the woeid of 36239 and that means I can get the following information from it when querying the GeoPlanet API:

• Stoke Newington (Suburb):
  • Country: United Kingdom
  • WOEID: 36239
  • Administrative:
    • England (Country)
    • Greater London (County)
  • Localities:
    • London (Town)
    • Stoke Newington (Suburb)
  • Postal N16 (Postal Code)
  • Location (lat/lon): 51.561199, -0.082980
  • Bounding Box: NE 51.577190, -0.058070 SW 51.546692, -0.092380

The bounding box information is very useful for displaying this information on a map as it shows you which points need to be visible in order to see the whole place.

There is just something pretty about having a number instead of a lat/lon pair which is why woeid is rapidly becoming a standard. Flickr supported it for quite a while, Dopplr uses it under the hood, the Yahoo! Weather API understands it and soon Twitter will also use it for geolocating content in an unambiguous way (right now there is only support in the Twitter Trends API).

So how could you use this for your own products?

There are a lot of ways you can use the geo tools by Yahoo! in your own solutions – by far the easiest is using YQL to access the data. This, for example allowed me to write the addmap.js solution:

Using this you can can easily take the content of a page element with a certain ID and add a map of the locations it “talks about” to the document:

<script src="http://github.com/codepo8/geotoys/raw/master/addmap.js"></script>
<script>
addmap.config.mapkey = 'YOUR_API_KEY';
addmap.analyse('content');
</script>

The API key is needed for the Google maps, not for YQL. YQL in this case under the hood uses Placemaker which is an API that finds geographical content in URLs or texts.

YQL and the geo tools offer you some other interesting options:

Geographical locations in texts/urls/RSS feeds

By using the Placemaker table in YQL you can extract geographical locations from a texts or a source on the web:

select * from geo.placemaker where documentContent =
"Hi, I am Chris, I live in London but actually I am from Germany"
and documentType="text/plain" and appid=""

This finds both “London” and “Germany” as geographical locations. You can see the result of this here as an XML file. You will find places and references. Places are what has been found and references where it was found. The start and end elements describe the character location in the whole string.

Placemaker also takes feed and web site URIs and finds the locations in them for you. For example to see the locations mentioned in my portfolio page you can do the following:

select * from geo.placemaker where documentURL =
"http://icant.co.uk" and documentType="text/html" and appid=""

Again, you can check the result as an XML file. As this is an HTML document there is no start and end but the references are reported as XPATHs.

Feeds are also supported, so if you want to get the locations in the BBC News feed you can use the following:

select * from geo.placemaker where documentURL =
"http://newsrss.bbc.co.uk/rss/newsonline_uk_edition/front_page/rss.xml"
and documentType="text/rss" and appid=""

Verify the result as an XML at your leisure – this time the XPATHs point to the RSS items.

The easiest way to see the power of Placemaker is using GeoMaker which gives you a simple interface to do turn a text or URL into a map or microformats to embed into your documents:

Location by IP

Getting the geographical location of an IP is possible with the following YQL statement:

select * from geo.places where woeid in (
  select place.woeid from flickr.places where (lat,lon) in (
    select Latitude,Longitude from ip.location where ip = "123.23.23.33"
  )
)

You can see this as an XML file here.

What we’re doing here is using the IP2location API ,get the woeid from the latitude and longitude using the Flickr findByLatLon method and run the result through the geo API to get all the information – quite some work off your hands, isn’t it? Without YQL you’d have to sign up for all these APIs and understand their inner workings to get the same information.

Getting location by IP is an old trick in the book of advertisers – you probably will have encountered ads like “meet singles in your city now” and see them changing when you went to another place – this is what they use to get this information. The accuracy of IP location is not very high though. It also can feel a bit creepy.

Location by Latitude and Longitude

Therefore it is much better to use a system that allows people to opt-in to tell their geographical location. There are services for that but we also have a W3C API built into browsers. Right now Firefox and Mobile Safari support it but it also cropped up in the latest developer build of Chrome.

Using the W3C location API is easy:

<script>
if(navigator.geolocation){
  navigator.geolocation.getCurrentPosition(function(position){
    var lat = position.coords.latitude;
    var lon = position.coords.longitude;
    alert('you are at' + lat +','+lon);
  },function(error){
    alert('Couldn\'t get your location :(');
  });
}
</script>

You test if the browser supports navigator.geolocation and if it does you use the getCurrentPosition() method to retrieve the current position. This will cause the browser to ask the visitor if they want to share their information – normally in an information bar on top of the viewport as shown in this screenshot:

The getCurrentPosition() method takes two parameters which are function to call in the success and the failure case – meaning that the visitor allowed you to get their location or not – or that there was some other error.

You can then use YQL once more to get the location from latitude and longitude – this time using the Flickr API method as the first one:

select * from geo.places where woeid in (
  select place.woeid from flickr.places where lat=51.5142271 and lon=-0.1289602
)

See the XML output here.

Putting it all together

Let’s end with an example script how you can use this. We use the W3C geolocation API to get a visitor’s location and if it isn’t available we fall back to using the IP. In any case, we use YQL to get the location information and the areas around the current location. The solution uses JavaScript except for retrieving the IP which is done in this case by PHP. You can see the full demo in action here. See the comments // for information about what is going on.

<script type="text/javascript" charset="utf-8">
<?php
  if ($_SERVER['HTTP_X_FORWARD_FOR']) {
   $ip = $_SERVER['HTTP_X_FORWARD_FOR'];
  } else {
   $ip = $_SERVER['REMOTE_ADDR'];
  }
  if(preg_match('/^[\d+\.?]+$/',$ip)){
    echo 'var IP = "' . $ip . '"';
  }
?>

// ^^
// This PHP block will get the current IP and assign it to a JavaScript
// variable - if it is the right format.

if(navigator.geolocation){
  navigator.geolocation.getCurrentPosition(
    function(position){
      getDataForLatLon(position.coords.latitude,
                       position.coords.longitude);
    },
    function(error){
      if(IP){
        getFromIP(IP);
      }
    });
} else{
  if(IP){
    getFromIP(IP);
  };
}

// ^^
// we test if the W3C location API is supported and if it is, we
// get the current lat and lon and call the appropriate method.
// if there was an error or the API is not available at all we call
// getFromIP.

function load(yql,cb){
  var src = 'http://query.yahooapis.com/v1/public/yql?q='+
            encodeURIComponent(yql) + '&format=json&callback=' + cb + '&'+
            'env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys';
  var head = document.getElementsByTagName('head')[0];
  var s = document.createElement('script');
  s.setAttribute('src',src);
  head.appendChild(s);
}

// ^^
// YQL is a web service that returns JSON. This allows us to create
// script nodes dynamically to get information from it. This function
// does that for us.

function getDataForLatLon(lat,lon){
  var yql = 'select * from geo.places where woeid in ('+
            'select place.woeid from flickr.places where lat='+
            lat + ' and  lon=' + lon + ')';
  load(yql,'foundLocation');
}
function foundLocation(o){
  if(o.query.results){
    var place = o.query.results.place
    var out = '<p>You are in ' + place.name + ' which is a '+
               place.placeTypeName.content + ' located at ('+
               place.centroid.latitude + ',' + place.centroid.longitude+
               ')</p>';
    document.getElementById('location').innerHTML = out;
    getBelongTos(place.woeid);
  }
}

// ^^
// If we can get a lat and lon from the API, we put together the right
// YQL statement. If we are successful we call the foundLocation() method
// which writes out the right HTML to the document and calls the
// getBelongTos() method

function getFromIP(ip){
  var yql = 'select * from geo.places where woeid in ('+
            'select place.woeid from flickr.places where (lat,lon) in('+
            'select Latitude,Longitude from ip.location'+
            ' where ip="'+ip+'"))';
  load(yql,'foundLocation');
}

// ^^
// If there was no luck with the W3C geo API we call this function using
// the IP we got from PHP

function getBelongTos(woeid){
  var yql = 'select * from geo.places.belongtos(0) where '+
            'member_woeid='+woeid;
  load(yql,'foundBelongs');
}
function foundBelongs(o){
  if(o.query.results){
    var out = '<p>Your location belongs to: ';
    var place = o.query.results.place;
    var info = [];
    for(var i=0;i<place.length;i++){
      var cur = place[i];
      info.push(cur.name + ' (' + cur.placeTypeName.content + ')');
    }
    var out = '<p>Your location belongs to: ' + info.join(', ') + '</p>';
    document.getElementById('location').innerHTML += out;
  }
}

// ^^
// If we found a location, then we call the belongtos method of the
// GeoPlanet API to get all the areas the current location belongs to.

</script>

In my case the result from the W3C geo location is:

You are in St. Giles’s which is a Suburb located at (51.516151,-0.125460)

Your location belongs to: WC1V 6 (Postal Code), London Borough of Camden (Local Administrative Area), 0207 London (Zone), Middlesex (Historical County), London (Town), Greater London (County), MMA London (MMA), South East England (Colloquial), DMA South East England (DMA), England (Country), England and Wales (Colloquial), Great Britain (Colloquial), United Kingdom (Country), Market United Kingdom and Ireland (Market), Europe/London (Time Zone), British Isles (Supername), Northern Europe (Supername), European Union (Supername), Western Europe (Supername), Europe (Continent), Eurasia (Supername), Earth (Supername)

Only using IP I get:

You are in Whitehall which is a Suburb located at (51.501831,-0.125760)

Your location belongs to: SW1A 2 (Postal Code), Westminster (Suburb), City of Westminster (Local Administrative Area), 0207 London (Zone), Middlesex (Historical County), London (Town), Greater London (County), MMA London (MMA), South East England (Colloquial), DMA South East England (DMA), England (Country), England and Wales (Colloquial), Great Britain (Colloquial), United Kingdom (Country), Market United Kingdom and Ireland (Market), Europe/London (Time Zone), British Isles (Supername), Northern Europe (Supername), European Union (Supername), Western Europe (Supername), Europe (Continent), Eurasia (Supername), Earth (Supername)

Quite a lot of information using a few lines of code, isn’t it? Geographical location is a very interesting topic and allows us to show much more useful content to our visitors. Using YQL and GeoPlanet it is pretty easy for you to do so – give it a go!

by Christian Heilmann at March 08, 2010 02:00 PM

Our friends Jim and Nick at Doctype recently attended Future of Web Apps Miami along with their camera gear. They kindly put together a highlight reel of the day including interviews and clips from the main stage sessions. They will be releasing full length interviews over on their Facebook page shortly.

Just as a quick heads up the full length videos from the event will be made available shortly here on Think Vitamin.

Useful Links

Doctype Future of Web Apps episode: http://doctype.tv/fowa
Twitter: http://twitter.com/doctypetv
Facebook: http://facebook.com/doctype

by Keir Whitaker at March 08, 2010 09:19 AM

The RSA 2010 Security Conference is just finishing up here in San Francisco, and I'm struck by how many of the conference sessions and keynotes have warned about the threat that socially engineered malware poses to the security of the Internet. Malware has become the scourge of the Internet, and it's not just the security experts who are worried"”the top story in my morning paper yesterday described how a typical malware attack compromised a financial firm's network. Our data shows that one out of every 250 downloads is the result of a user being tricked into downloading malware to their PC.

We're proud of the protection SmartScreen® Filter provides to protect IE8 users from such attacks, and I'd like share some of the latest numbers on our level of protection.

Since we launched IE8 in March 2009, SmartScreen has blocked over 560 million attempts to download malware, recently averaging over 3 million blocks per day! Hosted in datacenters around the world, SmartScreen's URL Reputation Service (URS) has evaluated over 250 billion URLs to help keep IE8 users safe from malware. Even more impressively, since IE7's Phishing Filter was introduced in 2005, the URS has processed over 5.7 trillion reputation requests in order to block malicious web sites. Every day, Microsoft receives around 300 million telemetry reports from IE8 users and processes 4.1 billion URLs looking for malicious websites and files. On the back end, our systems and analysts evaluate over 1 terabyte of binaries every day to help identify sites delivering malware.

The Q1 2010 NSS Lab's test shows that Microsoft's continued investment in SmartScreen is paying off. Since launch, IE8's SmartScreen Filter has continued to improve its protection against Socially Engineered Malware threats.

IE6 and 7 don't provide protection against socially-engineered malware. If your family and friends aren't up-to-date, please encourage them to upgrade to IE 8 for a safer Internet experience.

While IE8 offers the best built-in protection any browser offers against socially engineered malware, you still should follow best-practices to stay safe online. For instance:

• Enable SmartScreen Filter using IE8's Safety menu ().
• Install antivirus and antispyware software from trusted sources and keep it up-to-date. Microsoft Security Essentials is available for free.
• Turn on your firewall.
• Enable Automatic Updates for Windows and other Microsoft software using Microsoft Update.
• Keep your computer's other software, including browser add-ons, up-to-date.
• Before downloading software, consider the risks and be aware of the fine print. For example, make sure the license agreement does not conceal a warning that you are about to install software with unwanted behavior.

You can read more tips and learn about common Internet attacks over on the Security Tips blog.

Stay safe out there!

Eric Lawrence
Program Manager

by ieblog at March 05, 2010 09:44 PM

Last week, the W3C HTML Working Group reached a decision to publish several new working drafts and these are now available. The discussion about what to publish and how to structure the HTML5 specification has taken several months. In November, at the TPAC meeting, a request was made for the Microdata section of the specification to be removed. Back in August, I posted about our support for a separate Canvas 2D API specification.

Some people in the community raised concerns about exactly what should be in scope for the HTML working group. Tim Berners-Lee shared his thoughts:

"I agree with the WG chairs that these items -- data and canvas -- are reasonable areas of work for the group.  It is appropriate for the group to publish documents in this area. On the one hand, they elaborate areas touched on in HTML4. On the other, these elaborations are much deeper than the features of HTML4, but also they form separate subsystems, and these subsystems have strong overlaps with other design areas. It is important (a) that the design be modular; (b) that the specifications be kept modular and (c) that the communities of expertise of the respective fields (graphics and data) be involved in the design process."�

We strongly support Tim's call for modular design and modular specifications in web standards. Large monolithic documents are hard to consume and take longer to stabilise with well thought out engineering decisions. In fact, the decision to take these features from HTML5 and make them separate documents continues the process that started last year as the storage and networking APIs were moved out of HTML5 and into the W3C WebApps working group. Just like good software design, loose coupling and high cohesion are good principles for defining web standards. That doesn't make them easy to apply and there is still more work to do to reduce the coupling between drafts. The group is working on improving the tools used to generate the documents to improve the cross-references, which will help towards this goal.

Microdata and Canvas 2D are now available as new working drafts alongside the core HTML5 draft. This also sets Microdata on a similar footing to the updated HTML+RDFa draft. You can review the full set of documents published yesterday here:

• HTML5
• HTML+RDFa
• HTML Microdata
• HTML Canvas 2D Context
• HTML: The Markup Language
• HTML5 diffs from HTML4

Adrian Bateman
Program Manager

by ieblog at March 05, 2010 04:56 PM

Fronteers 2010 has been announced: 7 and 8 October, Amsterdam. Jeremy Keith and Jeff Croft have been announced as speakers. Ticket sale will start in April at the latest.

For clarity's sake: this year I have nothing to do with the organisation; I'll just attend the conference, relax, enjoy the show, as well as a beer or two.

Maybe I'll meet some of my readers at Fronteers 2010.

March 05, 2010 04:13 PM

After a brief hiatus due to heading across the pond for Future of Web Apps Miami we're back with Episode #3 of Think Vitamin Radio. This week we are joined by Greg Annandale as Ryan is on holiday.

A full transcript is available.

by Keir Whitaker at March 05, 2010 08:12 AM

Tab isolation has recently become a more popular topic. This post is a quick survey of what tab isolation is, how it works, and what it provides.

What is it?

Tab isolation is a way to improve a browser's reliability by containing the impact of a crash. Depending on how it's implemented, tab isolation can also help contain some security attacks. There are two different implementations available today, each with different benefits.

In a tabbed browser without isolation, a problem in one tab can crash the entire browser. For example, a crash in a webpage in Firefox 3.6 or IE7 will bring down the entire browser. While modern browsers have features to recover tabs after a crash, the point of isolation is to contain the problem and prevent the browser from stopping. You can see a demo of this here (starting around 13:25). 

A Quick Historical Survey

On March 5, 2008, Microsoft released the first IE8 beta with Loosely-Coupled IE (or LCIE for short). This was the first mainstream implementation of tab isolation. On September 2, 2008, Google Chrome's first beta released with "process isolation."� Mozilla Firefox has recently discussed an "Out of Process Plugins"� (OOPP) or Electrolysis project aimed at isolating Firefox plug-ins, such as Flash, from the rest of the browser.

How do isolation approaches differ today in approach and benefits?

There are a lot of different subsystems in a browser to isolate from each other, and different ways to do it.

IE8 isolates the frame process (title bar, back button, address bar, etc.) from the tabs processes (that show web pages). If anything causes a site to crash (an extension like Flash, or the rendering or scripting engine, etc.), the frame and other tab processes will not crash. IE isolates the whole tab "“ all of its code, data, and extensions "“ to keep IE resilient to webpages with issues.

In addition to using multiple processes, IE8 on Windows 7 and Vista (and IE7 on Vista) sandboxes the tab processes in Protected Mode for security reasons. Specifically, tabs run without permissions to install software, modify settings, or change files of any user. Protected Mode provides defense in depth so that (in most cases) security vulnerabilities in the browser or an add-on (like Flash) cannot be exploited to harm the computer. Isolation makes this additional security possible. (Technically, there are several different types of isolation (process isolation, origin isolation, etc.), and of sandboxing (integrity levels, restricted subsets, DOM mirroring, etc.) as well.)

Chrome's isolation is a bit different, factoring the different subsystems of that browser along different lines. From their documentation, they have separate processes for rendering, for the frame, and for add-ons (native plug-ins, not extensions). As with IE7, part of Chrome runs with lower privilege. Unlike IE (where page add-ons run in low), plugins in Chrome by default run with more privileges. As with any architectural difference, there are scenarios that are better in one architecture and worse in another. Theoretically, for example, a vulnerability in the Flash control running in Chrome does not have a defense in depth protection like Protected Mode to contain it.

Isolation is a super important part of modern browsers.  It's essential for delivering a more reliable browsing experience. It can also improve security. Depending on how it's engineered, it can also have an impact on compatibility with sites and browser extensions.

Andy Zeigler
Program Manager

by ieblog at March 04, 2010 11:16 PM

The fact that web browsers have different ways of displaying alternative text when images are missing or disabled is something that I talked about in Safari, WebKit and alt text for missing images and Steve Faulkner expanded on in alt and title content display in popular browsers.

In How should Web browsers render alternative text?, Vlad Alexander asks (and answers) a few questions on this topic.

Read full post

Posted in Accessibility, Browsers.

by Roger Johansson at March 04, 2010 05:41 PM

One of the things that’s great about the Internet is that it’s open to everyone. There are a million sites, all different, and everyone is free to invent their own way of doing things. Of course, that has left us with a legacy of systems which don’t always work well together.

When you are using a web browser things mostly work because everyone adheres more or less to web standards, or at least the bits major browsers support. When you want to get data from the web to use in your app things aren’t quite as simple. Enter YQL (Yahoo Query Language).

Almost every developer knows about using SQL for getting data from databases. We wanted to do that for the Internet. YQL allows you to access all kinds of information from the internet in a very similar way to the way you would get data using SQL.

A YQL Query

A basic query in YQL is really easy:

select * from search.web where query = "javascript";

The thing we want to do is select all data (*) from Yahoo! search for web pages where the query is the term “javascript”. If you already know SQL it’s obvious, if you don’t it’s still pretty easy to read. In this case what’s happening under the hood is YQL is mapping the request to the search.web table to a pattern to call the Yahoo! BOSS (search) web service. So we are actually making a request, on your behalf, to the url:

http://boss.yahooapis.com/ysearch/web/v1/javascript?format=xml&start=0&count=10

A Sample Result

The data is returned in your choice of XML, JSON or JSONP. Like SQL most YQL data tends to be organised as rows of results.

In the case of the above query it looks like this (NB: this is truncated to show one result, view a full version in your browser):

<?xml version="1.0" encoding="UTF-8"?>
<query xmlns:yahoo="http://www.yahooapis.com/v1/base.rng" yahoo:count="10" yahoo:created="2010-03-02T09:22:58Z" yahoo:lang="en-US" yahoo:updated="2010-03-02T09:22:58Z" yahoo:uri="http://query.yahooapis.com/v1/yql?q=select+*+from+search.web+where+query+%3D+%22javascript%22%3B">
<diagnostics>
<publiclyCallable>true</publiclyCallable>
<url execution-time="157"><![CDATA[http://boss.yahooapis.com/ysearch/web/v1/javascript?format=xml&start=0&count=10]]></url>
<user-time>158</user-time>
<service-time>157</service-time>
<build-version>4265</build-version>
</diagnostics>
<results>
<result xmlns="http://www.inktomi.com/">
<abstract><![CDATA[<b>JavaScript</b>.com is your source for all things <b>JavaScript</b>, including tutorials, free java scripts, downloads, tools, <b>javascript</b> source code and other scripting resources.]]></abstract>
<clickurl>http://lrd.yahooapis.com/_ylc=X3oDMTQ4YzcwbGR0BF9TAzIwMjMxNTI3MDIEYXBwaWQDb0pfTWdwbklrWW5CMWhTZnFUZEd5TkouTXNxZlNMQmkEY2xpZW50A2Jvc3MEc2VydmljZQNCT1NTBHNsawN0aXRsZQRzcmNwdmlkAzc4ZHhPR0tJY3JyNGp1ZDd4R3RJcERZWXZOOFNqMHVNMlBJQUM0NkU-/SIG=10va2460d/**http%3A//www.javascript.com/</clickurl>
<date>2010/02/28</date>
<dispurl><![CDATA[www.<b>javascript.com</b>]]></dispurl>
<size>59075</size>
<title><![CDATA[<b>JavaScript</b>.com]]></title>
<url>http://www.javascript.com/</url>
</result>
</results>
</query>


Read AND Write with YQL

Looking at the example above you might agree that it’s pretty easy to use the BOSS web service already since it’s RESTful and the URL are easy to construct. Well, the same can’t really be said for the Wordpress XML-RPC API. But, with YQL we can still easily insert a new post into a Wordpress blog:

insert into wordpress.post (title, description, blogurl, username, password) values ("Test Title", "This is a test body", "http://yqltest.wordpress.com", "yqltest", "password");

A few things are interesting here. Firstly we are still using SQL syntax, but this time we are inserting data. YQL doesn’t just read data, you can write too. More than that even though BOSS uses REST and Wordpress is XML-RPC with YQL you don’t need to care. You just ask for what you want and the YQL table deals with it. Once you start using YQL to get one piece of data there isn’t any more cost to using more services.

Getting Started

So far we’ve looked at some of the things YQL can do but not how you would go about getting started, so let’s do that. The easiest way to become familiar with YQL is the YQL console. It’s a lot like the MySQL console in that you can use it to easily query available tables or to test and construct queries you want to make in your application. The console looks like this:

The first and most obvious thing is the query box. This opens with the query “show tables” which as in SQL returns a list of all the available tables. You can see that result underneath the query box. You can use the radio buttons to get the results as XML or JSON, your choice.

On the right hand side we have some navigation to get you started quicker. The list of the current tables is shown and you can open the tree to folders to show specific tables.

By default we show all the Yahoo! tables, but you can also click on a button to show all the tables created by the community. These cover a wide variety of services, almost anything you can think of.

Contribute Tables of your Own

You can also contribute new tables. They can be either really straight forward in the case of a good REST web service, or as complex as it needs to be to get the job done. A simple table might look like this one:

<table xmlns="http://query.yahooapis.com/v1/schema/table.xsd">
<meta>
<author>Yahoo! Inc.</author>
<documentationURL>http://craigslist.org/</documentationURL>
<sampleQuery>select * from {table} where location="sfbay" and type="sss" and query="schwinn mountain bike"</sampleQuery>
</meta>
<bindings>
<select itemPath="" produces="XML">
<urls>
<url>http://{location}.craigslist.org/search/{type}?format=rss</url>
</urls>
<inputs>
<key id="location" type="xs:string" paramType="path" required="true" />
<key id="type" type="xs:string" paramType="path" required="true" />
<key id="query" type="xs:string" paramType="query" required="true" />
</inputs>
</select>
</bindings>
</table>

You can see that it’s just XML, and only a few lines at that. The important bits are the “select” element. This represents a select statement we can make in YQL. If you wanted to insert you’d need an “insert” element too.

The select statement has a “url” which maps each “key” to the web service. In this case we have two path parameters which are inserted into the URL with { } and a query parameter which is automatically added to the end. This is the entire data required to let you select from Craigslist in YQL.

YQL is easy and extensible, and best of all there are already hundreds of tables contributed by the community to all kinds of great services like Twitter, Facebook, Etsy, bit.ly?

What are you waiting for, try the console today!

by Tom Hughes-Croucher at March 04, 2010 02:54 PM

There are many tools in the market that allow you to customize your pages' cascading style sheets (CSS), but there are actually a very few that do the opposite"”scan for all the CSS rules in the document and remove those that are not used. Cleaning out the CSS will not only reduce the bandwidth impact, but will also improve the performance of the browser (minimizing the time spent by the CSS engine to parse the style sheets).

In this post, I will describe how to build that tool using a bookmarklet and a new standard function introduced in Internet Explorer 8: document.querySelectorAll().

Let's start with the basics: a Web page can include many cascading style sheets, each of which is composed of one or more selectors. For instance, #elementId { }, .className { }, and body{ } are each examples of selectors. Using the function querySelectorAll(), you can programmatically inspect the DOM tree and count the number of times each selector is actually used.

For instance, the following code snippet counts the number of times the CSS class Foo is used in the document:

var selectorCount = document.querySelectorAll(".Foo"�).length;

Now that we have this information, we need a way to run this script inside the document. For the purpose of this article, I didn't want to change our server-side code.

I decided to create a bookmarklet, which is a special link that can interact dynamically with the currently loaded page. The syntax of the bookmarklet is fairly straightforward:

<a href="javascript:( 
    function() {          
        var c = document.createElement('script');
        c.type = 'text/javascript';
        c.src = 'http://demos.cloudapp.net/IE/CssCrunch/Scripts/CssCrunch.js'; 
        document.getElementsByTagName('head')[0].appendChild(c); })();">            
    CSS Crunch
</a>

As you can see, at runtime this injects a remote script file that runs the analysis and displays the result.

If you scroll to the bottom of the list of CSS rules, you'll see an option to remove temporarily unused selectors. This allow you to test if the page still displays and behaves the same way, as shown in the picture below.

I'd like to stress the fact that the goal is not to reach 100% usage on any page; there are scenarios in fact where the same style sheet could possibly be used by multiple pages and it makes sense to pre-fetch some rule, or where the page compression balance well having additional styles to maintain. Instead you should use this tool to identify possible areas for improvement.

That's it! You can try it here:

1. Right click Run CSSCrunch and select "Add to Favorites"�
2. Accept the security warning (by default, any bookmarklet is considered unsecure due to its nature)
3. Choose a location (for example, Favorites Bar)
4. Installed! You can now browse to this test page (or any other site) and click "CSS Crunch" in the Favorites Bar

This is just a starting point; if you are interested in doing more, you can find the source code here. I encourage you to look at the underlying code and customize it to suit your needs. For example, you might want to add support for multiple-pages analysis, or integration with server-side tools such as Visual Studio or IIS, or a compression capability such as Microsoft Ajax Minifier.

Ok, time to go! I'm checking the CSS on this blog now"¦ :)

Have fun!

Giorgio Sardo
Web Technical Evangelist
Microsoft Corporation

by ieblog at March 04, 2010 01:12 AM