This has been an interesting week for web design community, to say the least. The W3C revealed a new HTML5 logo to help designers and developers ‘tell the world’ that they’re using HTML5.
The logo was designed by Ocupop, a U.S.-based design agency, and it’s licensed under Creative Commons Attribution 3.0, a permissive license that allows ‘remixing’ of the licensed work. The logo has been made available on stickers and t-shirts, and there’s a gallery already promoting examples of the logo in use.
The logo’s official site includes a “badge builder� that customizes its orientation and allows you to add supplementary icons to indicate support for the different technologies that have become associated with HTML5.
We intend for it to be an all-purpose banner for HTML5, CSS, SVG, WOFF, and other technologies that constitute an open web platform. The logo does not have a specific meaning; it is not meant to imply conformance or validity, for example. The logo represents “the Web platform” in a very general sense.
That all-encompassing definition has met with some opposition from Jeremy Keith. According to Keith, while he does approve of the logo’s design, he disagrees with the blurring of the lines that separate the web technologies that the logo is supposed to represent. Keith doesn’t have a problem with the media using the term “HTML5″ to cover this broad area, but he feels it’s not appropriate to push this kind of terminology in the web development industry.
In support of the definition, Ocupop Creative Director Michael Nieling said in a statement that “HTML5 needs a consistent, standardized visual vocabulary to serve as a framework for conversations, presentations, and explanations.�
Keith’s concerns are valid. The logo will certainly strengthen the awareness of HTML5 (which is something we all want), but it’s difficult to accept that something like WOFF, which is a web font format and has nothing to do with the HTML5 spec, will fall under the “HTML5″ umbrella. Similarly, CSS3 does not belong in that scope. But interestingly, you’ll notice in that quote from the W3C blog post that the “all-purpose banner” includes “CSS” — so it’s not just CSS3, it’s all of CSS. I can’t see many people being too happy about this.
And if that wasn’t enough, before the web design community had a chance to exhale, the WHATWG Blog published a post entitled “HTML is the new HTML5″, announcing two changes: (1) The HTML specification will be known simply as “HTMLâ€� (dropping the “5â€�); and (2) The spec will be considered a “living standardâ€�, not just a draft, dropping use of the “snapshotâ€� model of development.
What Do You Think?
This article doesn’t intend to offer too much of an opinion on these matters, as it’s still early. But we know many in the industry want to voice their thoughts, so we’re encouraging you to offer your comments on the logo, its stated purpose, and the further developments on the term “HTML5� announced on the WHATWG blog. It certainly has been an important week in web development, so we’d love to get your thoughts on all of this.
This has been an interesting week for the web design community, to say the least. The W3C revealed a new HTML5 logo to help designers and developers ‘tell the world’ that they’re using HTML5. The logo was designed by Ocupop design agency, and it’s licensed under Creative Commons Attribution 3.0, a permissive license that allows ‘remixing’ of the licensed work. The logo has been made available on stickers and t-shirts, and there’s a gallery already promoting examples of the logo in use.
The logo’s official site includes a “badge builder� that customizes its orientation and allows you to add supplementary icons to indicate support for the different technologies that have become associated with HTML5.
We intend for it to be an all-purpose banner for HTML5, CSS, SVG, WOFF, and other technologies that constitute an open web platform. The logo does not have a specific meaning; it is not meant to imply conformance or validity, for example. The logo represents “the Web platform” in a very general sense.
That all-encompassing definition has met with some opposition from Jeremy Keith. According to Keith, while he does approve of the logo’s design, he disagrees with the blurring of the lines that separate the web technologies that the logo is supposed to represent. Keith doesn’t have a problem with the media using the term “HTML5″ to cover this broad area, but he feels it’s not appropriate to push this kind of terminology in the web development industry.
In support of the definition, Ocupop Creative Director Michael Nieling said in a statement that “HTML5 needs a consistent, standardized visual vocabulary to serve as a framework for conversations, presentations, and explanations.�
Keith’s concerns are valid. The logo will certainly strengthen the awareness of HTML5 (which is something we all want), but it’s difficult to accept that something like WOFF, which is a web font format and has nothing to do with the HTML5 spec, will fall under the “HTML5″ umbrella. Similarly, CSS3 does not belong in that scope. But interestingly, you’ll notice in that quote from the W3C blog post that the “all-purpose banner” includes “CSS” — so it’s not just the new stuff in CSS3, it’s all of CSS. I can’t see many people being too happy about this.
And if that wasn’t enough, before the web design community had a chance to exhale, the WHATWG Blog published a post entitled “HTML is the new HTML5″, announcing two changes: (1) The HTML specification will be known simply as “HTMLâ€� (dropping the “5â€�); and (2) The spec will be considered a “living standardâ€�, not just a draft, dropping use of the “snapshotâ€� model of development.
What Do You Think?
This article doesn’t intend to offer too much of an opinion on these matters, as it’s still early. But we know many in the industry want to voice their thoughts, so we’re encouraging you to offer your comments on the logo, its stated purpose, and the further developments on the term “HTML5� announced on the WHATWG blog. It certainly has been an important week in web development, so we’d love to get your thoughts on all of this.
It seems that new resources and articles for teaching and promoting HTML5 are popping up almost daily. We’ve been given HTML5 templates in the form of the HTML5 boilerplate and HTML5 Reset (although they both go beyond just HTML5 stuff). We’ve got a plethora of books to choose from that cover HTML5 and its related technologies. We’ve got shivs, galleries, and a physician to help heal your HTML5 maladies. And don’t forget the official spec.
From my own vantage point — aside from a few disputes about what the term “HTML5″ should and shouldn’t mean — the web design and development community has for the most part embraced all the new technologies and semantics with a positive attitude.
While it’s certainly true that HTML5 has the potential to change the web for the better, the reality is that these kinds of major changes can be difficult to grasp and embrace. I’m personally in the process of gaining a better understanding of the subtleties of HTML5′s various new features, so I thought I would discuss some things associated with HTML5 that appear to be somewhat confusing, and maybe this will help us all understand certain aspects of the language a little better, enabling us to use the new features in the most practical and appropriate manner possible.
The Good (and Easy) Parts
The good stuff in HTML5 has been discussed pretty solidly in a number of sources including books by Bruce Lawson, Jeremy Keith, and Mark Pilgrim, to name a few. The benefits gained from using HTML5 include improved semantics, reduced redundancies, and inclusion of new features that minimize the need for complex scripting to achieve standard tasks (like input validation in forms, for example).
I think those are all commendable improvements in the evolution of the web’s markup language. Some of the improvements, however, are a little confusing, and do seem to be a bit revolutionary, as opposed to evolutionary, the latter of which is one of the design principles on which HTML5 is based. Let’s look at a few examples, so we can see how flexible and valuable some of the new elements really are — once we get past some of the confusion.
An <article> Isn’t Just an Article
Among the additions to the semantic elements are the new <section> and <article> tags, which will replace certain instances of semantically meaningless <div> tags that we’re all accustomed to in XHTML. The problem arises when we try to decipher how these tags should be used.
Someone new to the language would probably assume that an <article> element would represent a single article like a blog post. But this is not always the case.
Let’s consider a blog post as an example, which is the same example used in the spec. Naturally, we would think a blog post marked up in HTML5 would look something like this:
For brevity, I’ve left out some of the other HTML5 tags that might go into such an example. In this example, the <article> tags wrap the entire article, then the “section” below it wraps all the comments, each of which is in its own “section” element.
It would not be invalid or wrong to structure a blog post like this. But according to the way <article> is described in the spec, the <article> element should wrap the entire article and the comments. Additionally, each comment itself could be wrapped in <article> tags that are nested within the main <article> tag.
Below is a screen grab from the spec, with <article> tags indicated:
Article tags can be nested inside article tags — a concept that seems confusing at first glance.
So, an <article> element can have other <article> elements nested inside it, thus complicating how we naturally view the word “article”. Bruce Lawson, co-author of Introducing HTML5, attempts to clear up the confusion in this interview:
“Think of <article> not in terms of print, like “newspaper article” but as a discrete entity like “article of clothing” that is complete in itself, but can also mix with other articles to make a wider ensemble.”
— Bruce Lawson
So keep in mind that you can nest <article> elements and an <article> element can contain more than just article content. Bruce’s explanation above is very good and is the kind of HTML5 education that’s needed to help us understand how these new elements can be used.
Section or Article?
Probably one of the most confusing things to figure out when creating an HTML5 layout is whether or not to use <article> or <section>. As I write this sentence, I can honestly say I don’t know the difference without actually looking up what the spec says or referencing one of my HTML5 books. But slowly it’s becoming more clear. I think Jeremy Keith defines <article> best on page 67 of HTML5 for Web Designers:
“The article element is [a] specialized kind of section. Use it for self-contained related content… Ask yourself if you would syndicate the content in an RSS or Atom feed. If the content still makes sense in that context, then article is probably the right element to use.”
— Jeremy Keith, HTML5 for Web Designers
Keith’s explanation helps a lot, but then he goes on to explain that the difference between <article> and <section> is quite small, and it’s up to each developer to decide how these elements should be used. And adding to the confusion is the fact that you can have multiple articles within sections and multiple sections within articles.
As a result, you might wonder why we have both. The main difference is that the <article> element is designed for syndication, whereas the <section> element is designed for document structure and portability. This simple way to view the differences certainly helps make the two new elements a little more distinct. The important thing to keep in mind here is that, despite our initial confusion, these changes, when more widely adopted, are going to help developers and content creators to improve the way they work and the way content is shared.
Headers and Footers (Plural!)
Two other elements introduced in HTML5 are the <header> and <footer> elements. On the surface, these seem pretty straightforward. For years we’ve marking up our website headers and footers with <div id="header">, <div id="footer"> or similar. This is great for DOM manipulation and styling, because we can target these elements directly. But they mean nothing semantically.
“The div element has no defined semantics, and the id attribute has no defined semantics. (User agents are not allowed to infer any meaning from the value of the id attribute.)”
HTML5′s introduction of <header> and <footer> elements is the perfect way to remedy this problem of semantics, especially for such often-used elements. But these elements are not as straightforward as they seem. Technically speaking, if every website in the world added one <header> and one <footer> to each of their pages, this would be perfectly valid HTML5. But these new elements are not just limited to use as a “website header” and “website footer”.
A header is designed to mark up introductory or navigational aids, and a footer is designed to contain information about the containing element. For example, if you used the footer element as the footer for a full web page, then in that case copyright, policy links, and related content might be appropriate for it to hold. A header on the same page might contain a logo and navigation bar.
But the same page might also include multiple <section> elements. Each of those sections is permitted to contain its own header and/or footer element. Keith sums up the purpose of these elements well:
“A header will usually appear at the top of a document or section, but it doesn’t have to. It is defined by its content… rather than its position.”
“Like the header element, footer sounds like it’s a description of position, but as with header, this isn’t the case.”
— Jeremy Keith, HTML5 for Web Designers
And the spec adds to Keith’s clarification by noting:
“The header element is not sectioning content; it doesn’t introduce a new section.”
These explanations help dispel any false assumptions we might have about these new elements, so we can understand how these elements can be used. Really, this method of dividing pages into portable and syndicatible content is just adding semantics to what content creators and developers have been doing for years.
Headings Down A Different Path
Prior to HTML5, heading tags (<h1> through <h6>) were pretty easy to understand. Over the years, some best practices have been adopted in order to improve semantics, SEO, and accessibility. Generally, we’ve become accustomed to including a single <h1> element on each page, with the other heading elements following sequentially without gaps (although sometimes it would be necessary to reverse the order).
With the introduction of HTML5, to use the new structural elements we need to rethink the way we view the structure of our pages.
Here are some things to note about the changes in heading/document structure in HTML5
Instead of a single <h1> element per page, HTML5 best practice encourages up to one <h1> for each <section> element (or other section defined by some other means)
Although we’re permitted to start a section with an <h2> (or lower-ranked) element, it’s strongly encouraged to start each <section> with an <h1> element to help sections become portable
Document nodes are created by sections, not headings (unlike previous versions of HTML)
An <hgroup> element is used to group related heading elements that you want to act as a single heading for a defined or implied section; <hgroup> is not used on every set of headings, only those that act as a single unit outside of adjacent content
To see if you’re structuring your document correctly, you can use the HTML5 Outliner
Despite the above points, whatever heading/document structure you used in HTML4 or XHTML will still be valid HTML5
So, although the old way we structure pages does not amount to invalid HTML5, our view of what constitutes “best practice” document structure is changing for the better.
Block or Inline? Neither! (Sort of…)
For layout and styling purposes, CSS developers are accustomed to HTML elements (for styling and layout purposes) being defined under one of two categories: Block elements and inline elements (although you could divide those two into further categories). This understanding simplified our expectations of an element’s display on any given page, making it easier (once we grasp the difference between the two) to style and manoeuvre the elements.
HTML5 evolves this concept to include multiple categories, none of which is block or inline. Well, theoretically, block and inline elements still exist, but they do so under different labels. Now the different categories of elements include:
I certainly welcome this kind of improvement to more appropriately categorize elements, and I think developers will adapt well to these changes, but it is important that we promote proper nomenclature to ensure minimal confusion over how these elements will display by default. Of all the areas discussed in this article, however, I think this one is the easiest to grasp and accept.
Conclusion
While this summarizes some of what I’ve learned in my study of HTML5, a far better way for anyone to learn about these new features to the markup is to pick up a book on the topic. I highly recommend one of those mentioned in the article, or you can read Mark Pilgrim’s book online.
These new elements and concepts don’t have to be confusing. We can take the time to study them carefully, avoiding confusion and dispelling myths. This will help us enjoy the benefits of these new elements as soon as possible, and will help developers and content creators pave the way towards a more meaningful web — a web that, to paraphrase Jeremy Keith, ‘wouldn’t exist without markup’.
Related Posts
You may be interested in the following related posts:
When the CSS1 specification was drafted in the mid to late 90s, it introduced !important declarations that would help developers and users easily override normal specificity when making changes to their stylesheets. For the most part, !important declarations have remained the same, with only one change in CSS2.1 and nothing new added or altered in the CSS3 spec in connection with this unique declaration.
Let’s take a look at what exactly these kinds of declarations are all about, and when, if ever, you should use them.
A Brief Primer on the Cascade
Before we get into !important declarations and exactly how they work, let’s give this discussion a bit of context. In the past, Smashing Magazine has covered CSS specificity in-depth, so please take a look at that article if you want a detailed discussion on the CSS cascade and how specificity ties in.
Below is a basic outline of how any given CSS-styled document will decide how much weight to give to different styles it encounters. This is a general summary of the cascade as discussed in the spec:
Find all declarations that apply to the element and property
Apply the styling to the element based on importance and origin using the following order, with the first item in the list having the least weight:
Declarations from the user agent
Declarations from the user
Declarations from the author
Declarations from the author with !important added
Declarations from the user with !important added
Apply styling based on specificity, with the more specific selector “winning” over more general ones
Apply styling based on the order in which they appear in the stylesheet (i.e., in the event of a tie, last one “wins”)
With that basic outline, you can probably already see how !important declarations weigh in, and what role they play in the cascade. Let’s look at !important in more detail.
Syntax and Description
An !important declaration provides a way for a stylesheet author to give a CSS value more weight than it naturally has. It should be noted here that the phrase “!important declaration” is a reference to an entire CSS declaration, including property and value, with !important added (thanks to Brad Czerniak for pointing out this discrepancy). Here is a simple code example that clearly illustrates how !important affects the natural way that styles are applied:
In the above code sample, the element with the id of “example” will have text sized at 14px, due to the addition of !important.
Without the use of !important, there are two reasons why the second declaration block should naturally have more weight than the first: The second block is later in the stylesheet (i.e. it’s listed second). Also, the second block has more specificity (#container followed by #example instead of just #example). But with the inclusion of !important, the first font-size rule now has more weight.
Some things to note about !important declarations:
When !important was first introduced in CSS1, an author rule with an !important declaration held more weight than a user rule with an !important declaration; to improve accessibility, this was reversed in CSS2
If !important is used on a shorthand property, this adds “importance” to all the sub-properties that the shorthand property represents
The !important keyword (or statement) must be placed at the end of the line, immediately before the semicolon, otherwise it will have no effect (although a space before the semicolon won’t break it)
If for some particular reason you have to write the same property twice in the same declaration block, then add !important to the end of the first one, the first one will have more weight in every browser except IE6 (this works as an IE6-only hack, but doesn’t invalidate your CSS)
In IE6 and IE7, if you use a different word in place of !important (like !hotdog), the CSS rule will still be given extra weight, while other browsers will ignore it
When Should !important Be Used?
As with any technique, there are pros and cons depending on the circumstances. So when should it be used, if ever? Here’s my subjective overview of potential valid uses.
Never
!important declarations should not be used unless they are absolutely necessary after all other avenues have been exhausted. If you use !important out of laziness, to avoid proper debugging, or to rush a project to completion, then you’re abusing it, and you (or those that inherit your projects) will suffer the consequences.
If you include it even sparingly in your stylesheets, you will soon find that certain parts of your stylesheet will be harder to maintain. As discussed above, CSS property importance happens naturally through the cascade and specificity. When you use !important, you’re disrupting the natural flow of your rules, giving more weight to rules that are undeserving of such weight.
If you never use !important, then that’s a sign that you understand CSS and give proper forethought to your code before writing it.
That being said, the old adage “never say never” would certainly apply here. So below are some legitimate uses for !important.
To Aid or Test Accessibility
As mentioned, user stylesheets can include !important declarations, allowing users with special needs to give weight to specific CSS rules that will aid their ability to read and access content.
A special needs user can add !important to typographic properties like font-size to make text larger, or to color-related rules in order to increase the contrast of web pages.
In the screen grab below, Smashing Magazine’s home page is shown with a user-defined stylesheet overriding the normal text size, which can be done using Firefox’s Developer Toolbar:
In this case, the text size was adjustable without using !important, because a user-defined stylesheet will override an author stylesheet regardless of specificity. If, however, the text size for body copy was set in the author stylesheet using an !important declaration, the user stylesheet could not override the text-size setting, even with a more specific selector. The inclusion of !important resolves this problem and keeps the adjustability of text size within the user’s power, even if the author has abused !important.
To Temporarily Fix an Urgent Problem
There will be times when something bugs out in your CSS on a live client site, and you need to apply a fix very quickly. In most cases, you should be able to use Firebug or another developer tool to track down the CSS code that needs to be fixed. But if the problem is occurring on IE6 or another browser that doesn’t have access to debugging tools, you may need to do a quick fix using !important.
After you move the temporary fix to production (thus making the client happy), you can work on fixing the issue locally using a more maintainable method that doesn’t muck up the cascade. When you’ve figured out a better solution, you can add it to the project and remove !important — and the client will be none the wiser.
To Override Styles Within Firebug or Another Developer Tool
Inspecting an element in Firebug or Chrome’s developer tools allows you to edit styles on the fly, to test things out, debug, and so on — without affecting the real stylesheet. Take a look at the screen grab below, showing some of Smashing Magazine’s styles in Chrome’s developer tools:
The highlighted background style rule has a line through it, indicating that this rule has been overridden by a later rule. In order to reapply this rule, you could find the later rule and disable it. You could alternatively edit the selector to make it more specific, but this would give the entire declaration block more specificity, which might not be desired.
!important could be added to a single line to give weight back to the overridden rule, thus allowing you to test or debug a CSS issue without making major changes to your actual stylesheet until you resolve the issue.
Here’s the same style rule with !important added. You’ll notice the line-through is now gone, because this rule now has more weight than the rule that was previously overriding it:
To Override Inline Styles in User-Generated Content
One frustrating aspect of CSS development is when user-generated content includes inline styles, as would occur with some WYSIWYG editors in CMSs. In the CSS cascade, inline styles will override regular styles, so any undesirable element styling that occurs through generated content will be difficult, if not impossible, to change using customary CSS rules. You can circumvent this problem using an !important declaration, because a CSS rule with !important in an author stylesheet will override inline CSS.
For Print Stylesheets
Although this wouldn’t be necessary in all cases, and might be discouraged in some cases for the same reasons mentioned earlier, you could add !important declarations to your print-only stylesheets to help override specific styles without having to repeat selector specificity.
For Uniquely-Designed Blog Posts
If you’ve dabbled in uniquely-designed blog posts (many designers take issue with using “art direction” for this technique, and rightly so), as showcased on Heart Directed, you’ll know that such an undertaking requires each separately-designed article to have its own stylesheet, or else you need to use inline styles. You can give an individual page its own styles using the code presented in this post on the Digging Into WordPress blog.
The use of !important could come in handy in such an instance, allowing you to easily override the default styles in order to create a unique experience for a single blog post or page on your site, without having to worry about natural CSS specificity.
Conclusion
!important declarations are best reserved for special needs and users who want to make web content more accessible by easily overriding default user agent or author stylesheets. So you should do your best to give your CSS proper forethought and avoid using !important wherever possible. Even in many of the uses described above, the inclusion of !important is not always necessary.
Nonetheless, !important is valid CSS. You might inherit a project wherein the previous developers used it, or you might have to patch something up quickly — so it could come in handy. It’s certainly beneficial to understand it better and be prepared to use it should the need arise.
Do you ever use !important in your stylesheets? When do you do so? Are there any other circumstances you can think of that would require its use?
At the end of last year, we published a comprehensive list of web design and development conferences that might be of interest to Smashing Magazine’s diverse readership. Many readers commented and added links to other conferences and events that weren’t listed, some of which were added to the post. Using the contents of that list along with some other sources, we’ve compiled a list of web design and development-related conferences and events that will be taking place in the next six to eight months.
As always, there is no way for us to be able to include every possible event here, but we’ll be glad to update the list if you provide a comment to an upcoming event that you feel would be of interest to graphic designers or web developers.
While the previous roundup was organized by category, this one lists the events in chronological order starting with the earliest. Jump to an appropriate month using the links below:
FITC Mobile 2010 FITC Mobile covers all aspects of mobile content development — with presentations, demonstrations, and panel discussions. Covering iPhone/iPad, Android, Flash 10.1, Windows Mobile, HTML5, Unity, Marketing, Usability, and other relevant topics in the mobile world.
When: September 16-18, 2010 Where: Toronto, ON, Canada at the Metro Toronto Convention Centre
An Event Apart D.C. “From the makers of A List Apart, An Event Apart is an intensely educational two-day conference for passionate practitioners of standards-based web design. If you care about code as well as content, usability as well as design, An Event Apart is the conference you’ve been waiting for.”
When: September 16-18, 2010 Where: Washington, D.C., USA at the Washington Hilton
London Design Festival “The London Design Festival is a nine-day celebration of design in the world’s creative capital. The Festival is a platform for the widest spectrum of design disciplines, brought together as a unique and accessible programme.”
When: September 18-26, 2010 Where: London, UK at a number of different venues across the city
MOBILE 2.0 “The MOBILE 2.0 Conference is a two-day event focusing on new Mobile Applications and Services, Mobile Ecosystems, and Disruptive Mobile Innovation presented by the Mobile 2.0 Organizing Committee. For Mobile Developers we have designed an entire day for you to hear about the latest developer tools and monetization techniques.”
When: September 20-21, 2010 Where: Silicon Valley, CA, USA at the Grand Hyatt & the Microsoft Silicon Valley Conference Center
Design For Mobile 2010 “Design For Mobile (D4M) is a multi-faceted conference aimed at engaging the mobile community in a shared discussion about the future of mobile and ‘the mobile now.’ This is a conference focused on strategy and tactics for user research, product definition, usability testing, interaction and design. D4M is comprised of both preliminary and advanced workshops that flank three full days of speakers and interactive sessions.”
When: September 20-24, 2010 Where: Evanston, IL, U.S.A at The Hilton Orrington
Web Directions USA “CSS3, HTML5, Geolocation, mobile web — we’re seeing an explosion of innovation in design and development unlike at almost any other time in the web’s history. To keep you ahead of the curve, Web Directions USA features leading web practitioners, bringing you the freshest technologies, techniques and know-how.”
When: September 21-25, 2010 Where: Atlanta, Georgia, USA at the Loews Atlanta Hotel
National Association of Government Webmasters Conference “The NAGW National Conference is the premier conference that focuses on local, state and regional government web professionals. Local, regional, state and federal government web professionals join their peers at the conference for two and a half days of education, training and networking in a relaxed professional environment.”
When: September 22-24, 2010 Where: St. Louis, MO, USA at the Millennium Hotel
European Information Architecture Summit “A summit for anyone concerned with the design of navigation, organization, labeling, and search systems that help people find and manage information more successfully.”
When: September 23-25, 2010 Where: Paris, France at Les Salons de l’Aveyron
Flash on the Beach “Don’t think that Flash on the Beach is only about Flash. Sure appearing at FOTB in the past we have had the usual suspects — Flash, Flex, AIR, and then some. Open Frameworks, Processing, AJAX, Photoshop, After Effects, Art, Design, Illustration, Animation, Sound and many more. Whether you are a tech-head or a creative, if you are a decision maker or a team manager, if you are in need of a fix of creative inspiration, or want to know the latest how-to’s, Flash on the Beach is where you’ll get it.”
When: September 26-29, 2010 Where: Brighton, UK at the Brighton Dome
BlackBerry® Developer Conference “The BlackBerry® Developer Conference is a premier showcase for what can be done with BlackBerry apps, attended by thousands of the world’s most enthusiastic developers, BlackBerry experts, and Research In Motion® (RIM®) partners. It’s the place to get technical, code-driven information that can be applied to projects; the place where new tools and technologies can be experienced for the first time; the place for getting your questions answered, or finding the inspiration to go further with mobile applications than you ever imagined possible.”
When: September 27-30, 2010 Where: San Francisco, CA, USA at the Marriot Marquis
The ExpressionEngine and CodeIgniter Conference “At the ExpressionEngine & CodeIgniter Conference you can meet the experts, be inspired and break new boundaries! This event brings you presentations and workshops from your favorite EE & CI speakers. Both beginners and experienced users will benefit from a variety of topics and sessions: discover how your favourite content management system and PHP framework can bend even further!”
When: September 29 – October 1, 2010 Where: Leiden, The Netherleands at De Stadsgehoorzaal theatre
Forward – Phoenix Design Week 2010 “The beauty of Phoenix Design Week is that it enables us to put Phoenix design on a pedestal. Throughout Design Week, there are many ways this is being executed, but one of the coolest ways we manifest this goal is by giving you options to showcase your own creative prowess.”
When: September 29 – October 3, 2010 Where: Phoenix, AZ, USA at the Phoenix Convention Center plus other locations
IDEA Conference “IDEA2010 is a design conference tailored for you. This year’s unique mix of traditional presentations with structured activity time assures that you’ll get high-level concepts from big thinkers, and the space to apply them with peers.”
When: September 30 – October 2, 2010 Where: Philadelphia, PA, USA at the Independence Seaport Museum
October 2010 Events
A Better World by Design Conference “A Better World by Design is a three-day internationally acclaimed conference in Providence, RI that connects students, professionals, and individuals from a variety of disciplines in order to build a global community of socially conscious and passionate innovators. Presenters share engaging stories, workshops teach creative skills, and discussions reframe perspectives.”
When: October 1-3, 2010 Where: Providence, RI, U.S.A at Brown University & RISD Campuses
Future of Web Apps “The Future of Web Apps is a conference for web developers and entrepreneurs. You’ll learn about cutting-edge tech and exciting new ideas.”
When: October 4-6, 2010 Where: London, UK at The Brewery
Fronteers “Founded in 2007, Fronteers is the non-profit trade organization of Dutch front-end developers. Its goals include the professionalisation of our trade, (improved) recognition of the front-end discipline, and improving the position of Dutch front-end developers in their company and the web design/development world in general.”
DesignPhiladelphia “Through its events and programming, DesignPhiladelphia showcases the role that design has played historically in Philadelphia, and celebrates the city’s contemporary significance as a center for creative advancement. Through the breadth of our events, DesignPhiladelphia unites the creative disciplines – from architecture to interior design, fashion to product design, multi-media to graphic design.”
When: October 7-17, 2010 Where: Philadelphia, PA, USA at various locations
5D|10 The Future of Immersive Design Conference “5D | The Future of Immersive Design is the visionary, international conference for all designers, practitioners and students working in the fields of narrative media.”
When: October 8-9, 2010 Where: Long Beach, CA, USA at the Carpenter Performing Arts Center
International PHP Conference “With its mixture of topics the International PHP Conference provides an ideal resource for all professionals and their successful daily routine within the whole PHP spectrum. Insights into current Web 2.0 technologies, Security, Best Practices for tools and components, Enterprise know-how, databases, architectures and more are presented at the International PHP Conference 2009.”
When: October 11-13, 2010 Where: Mainz, Germany at the Rheingoldhalle
Web Directions South “Featuring leading web practitioners from across the world, bringing you the freshest technologies, techniques and know-how in web design and development, along with numerous networking and social opportunities. If you work on the web, Web Directions South is the industry event of the year.”
When: October 12-16, 2010 Where: Sydney, Australia at the Sydney Convention and Exhi bition Centre
AIGA Gain “The premier biennial event for business and design leaders. Attendees will learn how industry leaders addressed business challenges through design—and how they reinvented their businesses, their strategies and even themselves. We’ll hear business, design and thought leaders share their innovative approaches to generating greater return on investment, fostering emotional connections and providing positive brand experiences for customers.”
When: October 14-16, 2010 Where: New York City, NY, USA at The Sheraton New York Hotel and Towers
Voices That Matter iPhone Developers Conference “You’ll acquire skills for mastering iOS development from leading authors and experts during a weekend of strong educational sessions. Our speakers are eager to share their knowledge, answer your questions and address your application needs. You’ll participate in interactive discussions that provide the perfect environment for an unbiased and effective learning experience. This engaging two-day conference features how-to sessions covering the latest, most intriguing news in application development for the iPhone and iPad.”
When: October 16-17, 2010 Where: Philadelphia, PA, USA at The Hub Cira Centre
jQuery Conference “The annual conference of jQuery users and developers. There will be talks on jQuery, jQuery UI, plugins, complex application development, and more — all from the top jQuery developers. Speakers include John Resig, Paul Irish, Karl Swedberg, Doug Neiner, and more.”
When: October 16-17, 2010 Where: Boston, MA, U.S.A at the Hilton at Boston Logan Airport
Web Design World “These are interesting times: a combination of technical innovation, audience growth, and crummy economy. As a web designer, you can’t escape any of the three. But you can learn how to keep up with the innovation, take advantage of the growth, and survive the downturn. That’s where we come in. We take our mantra — provide practical, no-fluff, how-to — very seriously. If you’ve joined us before, you know that. If you haven’t, please check us out.”
When: October 18-20, 2010 Where: Las Vegas, NV, USA at Planet Hollywood Resort & Casino
Do-It-Yourself Usability Testing: The Workshop “The workshop will include: A complete explanation of how I recommend doing testing (Hint: very simple, very fast, and very cheap); Two live usability tests on attendees’ sites, so you can see the whole process in detail; A chance to practice conducting a test on your own site; Advice on how to interpret your findings and decide what changes to make; Plenty of time to answer your questions about testing or any other aspect of usability.”
When: October 20, 2010 Where: Washington, DC, U.S.A
Front-Trends Conference “This is a gathering for front-end lovers and professionals to discover the current trends and tools to build a professional career out of innovative front-end development.”
When: October 21-22, 2010 Where: Warsaw, Poland at the Centrum konferencyjno – kongresowe
Brooklyn Beta “Brooklyn Beta is a collaboration between Analog and Fictive Kin. Our goal for the conference is to inspire you to ‘make your own stuff.’ We’d love to see what the Web would be like if all you talented web people started using your magical abilities to bring your own ideas to life. To help, we’ve put together a conference aimed at turning inspiration into action with talented folks from every web field attending. We want to get all the people who can turn an idea into reality in one place and see what happens.”
When: October 21-22, 2010 Where: Brooklyn, NY, USA at the Invisible Dog
ExpressionEngineCamp “ExpressionEngine Camp is a collaborative all-day workshop about ExpressionEngine on October 22nd. Learn best practices or share tips about creating web sites with EE.”
When: October 22, 2010 Where: Denver, Colorado, Casselman’s Event Venue
Adobe MAX 2010 “MAX 2010 is an amazing opportunity to learn new skills, explore emerging technologies, and connect with thousands of other industry leaders, Adobe products users, and Adobe teams. The conference offers hundreds of informative sessions and hands-on labs for designers, developers, and decision-makers, and there are countless networking opportunities, from organized events to casual conversations in hallways between sessions.”
When: October 23-27, 2010 Where: Los Angeles, CA, USA at the Los Angeles Convention Center & the Nokia Theatre L.A. LIVE
FITC Unconference @ MAX 2010 “FITC brings together thousands of forward-thinking designers, developers, and business decision makers that are shaping the future of our industry. The Unconference is a way for attendees to convene in a casual setting to share ideas as well as host their own discussion groups. This year FITC has once again been chosen as one of the organizations to run one of the Unconference areas.”
When: October 25-27, 2010 Where: Los Angeles, CA, USA at the Los Angeles Convention Center
View Conference 2010 “VIEW Conference is the premiere international event in Italy on Computer Graphics, Interactive Techniques, Digital Cinema, 3D Animation, Gaming and VFX. VIEW 2010 will continue to focus on exploring the increasingly fluid boundary between real and digital worlds. Through lectures, meetings, tributes, exhibits, screenings and demo presentations VIEW will reveal the new digital frontier sweeping from cinema to architecture, from automotive design to advertisement, from medicine to videogames.”
When: October 26-29, 2010 Where: Turin, Italy, at the Conference center Torino Incontra
Web Developers Conference “The goal of the Web Developers Conference was to get students engaged with the world of the web and what this beautiful industry offers as well as meeting professionals and making important contacts that could lead to placements and even graduate positions.”
When: October 27, 2010 Where: Bristol, U.K at the UWE Exhibition & Conference Centre.
Microsoft PDC10 “The PDC isn’t just about content and sessions — it’s an opportunity for you to get hands-on access to the latest technologies, have your questions answered by the people who conceived and built the technologies and plan the features and architecture to support your business goals. If you’re a developer, architect or technology leader involved in making strategic technology decisions for your company or organization, you can’t afford to miss the PDC.”
When: October 28-29, 2010 Where: Seattle, WA, USA at the Microsoft Campus
Usability Week 2010 “Many conferences offer cavernous exhibit halls, brief seminars on second-hand discoveries, and a sense of anonymity that can be truly alienating. Usability Week takes a different approach. In place of scattered, shallow talks, Usability Week offers up to 6 days of deep learning as international experts lead full-day tutorials on topics such as: Fundamental guidelines for Web usability; Applying information architecture (IA) principles; Writing for the Web; Application design; Integrating social features on mainstream websites; The human mind (how your users think).”
When: Various dates in October and December. Where: San Francisco, U.S.A; Copenhagen, Denmark; Edinburgh, UK; Las Vegas, USA
November – December 2010 Events
An Event Apart San Diego “From the makers of A List Apart, An Event Apart is an intensely educational two-day conference for passionate practitioners of standards-based web design. If you care about code as well as content, usability as well as design, An Event Apart is the conference you’ve been waiting for.”
When: November 1-2, 2010 Where: San Diego, CA, U.S.A at the Westin Gas Lamp Quarter
When: November 3-4, 2010 Where: Bucharest, Romania at Hotel Intercontinental
FITC Edmonton 2010 “Back for its second year, FITC Edmonton promises to be jam-packed with presentations, demonstrations, and panel discussions. With some of the most interesting and engaging presenters from around the world, FITC Edmonton will be two days and nights that will leave you inspired, energized and awed!”
When: November 6-7, 2010 Where: Edmonton, AB, Canada at the Northern Alberta Institute of Technology
edUi Conference “A learning opportunity for web professionals serving institutions of learning. Through a rare speaker lineup, including top innovators and industry peers, we provide inspiration, tools, and techniques to help web professionals serving colleges, universities, museums, libraries, and other institutions of learning address the challenges they share improving the experience of their users online. edUi 2010 offers something for every member of your web team, with sessions on usability, design, programming, rich media, strategy, social media, and more.”
When: November 8-9, 2010 Where: Charlottesville, VA, USA at the Omni Hotel
User Interface Conference “UI15 is an intense, inspiring 3-day event, masterfully crafted to bring out the best in today’s UX professionals. We’ve assembled an all-star team of design experts to share their latest techniques in interaction design, content strategy, design thinking, and visual communication.”
When: November 8-10, 2010 Where: Boston, MA, U.S.A at the Renaissance Boston Waterfront Hotel
Build Conference “The hand-crafted web design conference. Build is a small, yet perfectly formed, boutique design conference where interesting, talented web practitioners from all over the world come to share ideas, techniques and inspiration. Some are on stage; some are in the audience. For the second year running, we’ve created the conference we really want to go to. We think you might like it.”
When: November 8-12, 2010 Where: Belfast, Ireland at Waterfront Studio
RubyConf 2010 “RubyConf is the official International Ruby Conference. Founded in 2001, RubyConf has provided an annual venue for the ever-growing Ruby community to meet face to face to share, collaborate, and socialize.”
When: November 11-13, 2010 Where: New Orleans, LA, USA at the Hilton New Orleans Riverside
Full Frontal JavaScript Conference “Full Frontal is a conference held in Brighton UK, for the front end developers with JavaScript skills ranging from beginner to advanced. If you’ve dabbled with JavaScript in the past and wanted to learn more about how the language works and what makes it tick, then this conference is for you.”
When: November 12, 2010 Where: Brighton, UK at the historic Duke of York’s Picturehouse
Future of Web Design “The Future of Web Design is coming back to New York in 2010. The newly revitalised event has evolved into a beautiful three full days of essential web learning. A full day conference followed by 2 solid days of in depth workshops, all taught by the best in the industry.”
When: November 15-17, 2010 Where: New York City, NY, USA at New World Stages
Semantic Web Summit East “How can you create value that will put you ahead of the competition? The Semantic Web Summit, formerly the Web 3.0 Conference, features innovators across industries examining the potential of the semantic web, and how it can transform the way you do business. This won’t be a day and a half of technical jargon — this event is about improving efficiencies in marketing and information management for a positive bottom line effect.”
When: November 16-17, 2010 Where: Boston, MA, USA at the Hynes Convention Center
Design City Graphic Design Expo “Stay on top of your industry! Visit Design City and see the latest graphic design tools, services, and products from the world’s largest vendors. You’ll see and test software that you’ve been wanting to try, you’ll meet the people that you talk to on the phone every day, and you’ll be wowed by some of the latest technology created for your profession.”
When: November 20-22, 2010 Where: Toronto, ON, Canada, at the Direct Energy Centre
The Rich Web Experience “RWX 2010 will cover the hot areas of interest in the web space today: HTML5, CSS3, JavaScript, Ajax Libraries, Semantic Web, iPhone, Android, Flex, GWT, NodeJS, Security, and more. RWX 2010 will feature 6 parallel tracks with over 15 speakers and 60 plus technical sessions/workshops. At RWX 2010 you will interact with industry experts, project leads, authors, and top developers.”
When: November 30 – December 3, 2010 Where: Fort Lauderdale, FL, USA at The Westin Beach Resort
Early 2011 Events
New Adventures in Web Design Conference “This event will be sympathetic to existing and new challenges and opportunities faced by front-end web folks in their day-to-day work and beyond. That said, the content will be beneficial to a broad audience, and a number of attendees and guests represent agencies, organisations, and businesses across varied roles. Ultimately, this event is organised by designers, for designers.”
When: January 20, 2011 Where: Nottingham, UK at the Albert Hall
Interaction Eleven “The IxDA Interaction conference is the premiere annual event for interaction designers, with content and activities relevant to practitioners, managers, educators, and students. Now in its fourth year, the Interaction conference has hosted leading speakers from consultancies, agencies, corporations, and universities around the world.”
When: February 9-12, 2011 Where: Boulder, Colorado, USA
International Conference on Intelligent User Interfaces “IUI 2011 is the annual meeting of the intelligent interfaces community and serves as the principal international forum for reporting outstanding research and development on intelligent user interfaces.”
When: February 13-16, 2011 Where: Palo Alto, CA, USA at the Sheraton Palo Alto with workshops at nearby Stanford University
Information Architecture Summit “The Information Architecture Summit is the premier gathering place for information architects and other user experience professionals. It’s grown from a special interest group’s efforts to define an emerging field, to a rich and expanding community of practice, shaping and informing multiple disciplines. You don’t have to be an information architect or user experience professional to enjoy the Summit. You simply have to love the art and science of structuring information.”
When: March 30 – April 3, 2011 Where: Denver, CO, USA
SXSW Interactive 2011 “SXSW Interactive features five days of presentations from professionals in emerging technology, networking events hosted by industry leaders, and a lineup of special programs showcasing new digital works, video games and innovative ideas the international community has to offer.”
When: March 11-15, 2010 Where: Austin, Texas, USA
Related Links
Conference Roundup Very useful web application inspired by the original roundup here on Smashing Magazine.
What conference are you going to attend? Let us know — Smashing Magazine is often attending various conferences and events, and we would love to meet you in person!
