Remember my complaint about all the CSS3 syntaxes differing from one browser to another? It’s now addressed with CSS3 Please, a jQuery-based, in-browser editor that replaces multiple attribute values of the more complicated CSS3 syntaxes (from border-radius to rgba to @font-face) all at the same time, so you don’t have to.
In addition to syncing and normalizing changes across the necessary properties, it also sneaks in IE support for a few features via IE filters. Right now it helps you write the rules for: border-radius, box-shadow, linear-gradients, rotation and @font-face. A few more transforms like skew and scale are on their way, stay tuned.
You can preview your code on the box at the right side by toggling it on and off. When you’re done, click on the clipboard icon to copy the code.
This is a smart solution to a growing problem. However, even though I’m thoroughly grateful for this tool, I still want to axe the real problem, which is the inconsistent browser syntax. It’s unreasonable for a programming language to have redundant code, and while CSS isn’t really one, it’s still code. We’re still supposed to pride ourselves with efficiency, conciseness, and standards with any kind of code. We like to kick IE for constantly breaking standards; should we tolerate the same thing for other browsers just because they’re implementing cutting edge features?
It’s been a couple of years since the height of the “kill IE6″ web campaigns, and it took that long to hold a funeral that finally seals its fate.
Of course, the IE6 Funeral is an arbitrary event held by the Aten Design Group last March 4, and this doesn’t really eradicate the browser on computers that can’t upgrade.
Over at TechCrunch, commenter Jeff Carlson jokes: “So if someone uses IE6 to browse the web tomorrow, will their web browser be a Zomb-ie6 browser?” You could say that. After all, IE6 is way past its expiration date, sucking the brains out of web designers and developers with its buggy, unstable, insecure features from an ugly past.
Even Microsoft acknowledges it’s time for IE6 to go, as it actually sent over flowers and this note:
Thanks for the good times IE6, see you all @ MIX when we show a little piece of IE Heaven. The Internet Explorer Team @ Microsoft
On March 13, Google will end IE6 support on YouTube, following the March 1 pull-out for Google Docs and Google Sites. Gmail and Google Calendar are next on the list, slated by the end of the year.
Combined with the European government security warnings to upgrade browsers, could Google’s systematic phase-out be the final nail in the IE6 coffin, or is this slow death going to take at least another year?
I really hope this is it.
It’s a disappointing day when you find a single serving site that generates the comprehensive syntax for the border-radius property, aptly named border-radius.com. Because not all browsers (and browser versions) support the latest and greatest things CSS3 can do, one has to resort to browser targeting yet again. Only this time, one browser’s syntax is different from another browser’s, and becomes a chore to write CSS for each.
There’s a pretty obvious explanation for the existence of browser-specific properties from SitePoint:
Vendors—browser makers—are free to implement extensions to the CSS specifications that, in most cases, are proprietary to their browser. They may do this for a number of reasons, such as adding new features for users, or for experiments and debugging. Most often, though, the extensions are used to release and test browser features that have been developed in the preparation of W3C drafts that have not yet reached Candidate Recommendation status—the extensions allow these new properties to be widely tested before they become available as standard CSS properties.
So for starters, the browser-specific CSS has prefixes like:
-moz: Gecko-based browsers like Firefox-webkit: WebKit-based browsers like Safari and Chrome-ms: Internet Explorer-o: Opera-khtml: Konqueror
(The complete table is listed at the W3C.) That’s fine, but what I don’t get is why the syntax following the prefix isn’t always the same as the standard CSS syntax. The border-radius property is just one example, which is peanuts compared to the gradients syntax. Compare:
-webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(0,10,148)),
color-stop(1, rgb(45,58,246))
)
-moz-linear-gradient(
center bottom,
rgb(0,10,148) 0%,
rgb(45,58,246) 100%
)
Sure, we can turn to generators like WestCiv’s and Damien Galarza’s—and we’ll probably be increasingly dependent on them in the future as CSS capabilities and their corresponding syntaxes grow more complex. But why must browser vendors insist on that when it only multiplies the code and maintenance necessary? Does it have to do with the way their engines parse the code, or something less significant?
The Apple stories just don’t stop coming, do they? Here’s yet another provocative issue concerning the company, but this time with web development: the iPhone is the new Internet Explorer 6, according to Peter Paul Koch.
The iPhone has become an obsession. If we don’t pay attention, we’ll have a mobile web that only works on the iPhone. And then we’ll have the real mobile web that wasn’t made by us and doesn’t give a shit about web standards and best practices.
Worse, it seems web developers are happy with this state of affairs. It seems web developers are congratulating themselves on excluding 85% of the smartphone users. They certainly never bother to check their sites in S60 WebKit, the largest smartphone browser in the world.
Fucking dimwits.
We’re doing exactly the same as ten years ago. We now say “iPhone” instead of “IE6,” but otherwise nothing’s changed.
No, wait, there’s one more change: the iPhone has far less mobile market share now than IE6 had desktop share back then.
The once most advanced browser is now the most hated, and the same fate could happen with the iPhone and its mobile web browser. However, given that they were made by two very different companies—the oft-hated Microsoft and the much-adored Apple—it’s hard to imagine the revolutionary smartphone gaining a stigma someday. An interesting achievement if that does somehow happen, but what an unfortunate future that would be.
Still, I have two points to make. First: I’m glad that a reputable voice is finally calling out this obsession with creating custom-tailored websites for the iPhone, when it’s supposed to have the most advanced browser, displaying pages as they normally would on a regular computer. Chances are you don’t have to. That’s what the multitouch zoom gesture is for, so that the screen size wouldn’t be such a hindrance.
Second: hype, here we go again. PPK draws back the curtain and tells us that there are other devices far more popular than the iPhone, yet the buzz about mobile web development is strongest with iPhone apps and iPhone app-like websites. It goes against the very idea of web standards, of making websites work in as many platforms as possible, not just what gains the most attention and is considered cool. (As an aside: what can be said about implementing CSS3 properties via browser-specific extensions? Is it the same thing?)
Finally, a minor third point: Koch isn’t addressing every mobile web developer in his article, just the ones that are so caught up in this iPhone-loving bubble that it’d be a shame when they mislead impressionable developers branching out to the mobile arena.
And a far worse shame if because of the hype we somehow get stuck in the rut that is IE6 all over again.
Or as a like to call it: podcasts that have caught my eye in the past week or so. And they differ in several ways, so there’s sure to be something for everybody. Take your pick:
Confession: It took me a while to realize that this podcast is actually the previously-named You Suck at Web Design, relaunched as a new brand with a new site design. This show isn’t so much a bag of tricks on web design as it is a quirky, personal storybook told by Matthew D. Jordan, but still a must-listen.
This is not just one but seven shows tackling different topics, from photography to Ruby programming, founded just last year by Dan Benjamin. I love the idea of a whole network of shows about the internet, on the internet, and here we have a whole suite for people who make websites. I can think of few things better than that. More networks and more topics, perhaps?
In light of the “circuses” happening in both the Hollywood late night talk show circuit and the web working groups, standardista slash comic strip creator Kyle Weems aka CSSquirrel announced this:
I am in the process of devising a “late night” talk show that the Squirrel will host, featuring interviews with cartoon representations of various web designers/developers/standardistas. It’ll draw from the mighty traditions of the Tonight Show, The Daily Show and Space Ghost: Coast to Coast, and in theory will be a plug-in free experience brought to you in part by HTML5, JavaScript and vector tree-climbing rodents.
Check out the podcast over at SitePoint, titled HTML5 is a beautiful mess:
The podcast touches on that matter, and spins out to the state of the actual implementation of HTML5 itself, whether there’s a challenge in getting designers and developers to start using it, the issues of accessibility in <canvas>, and how delightful it’d be to move past plugins.
Truthfully, I’m trying to avoid getting caught in the sticky details of how HTML5 is developing at the moment because it only adds to the anxiety (isn’t stressing over Internet Explorer enough?) and diminishes hope (we’re supposed to be moving forward with these technologies already). But it also helps to stay realistic not just idealistic, and drawing back the curtain on how the working groups are actually working on the HTML5 standard is a good way to do that.
Web standardistas lament the outdated HTML and CSS support by IE6, but the biggest reason you should drop the browser stat is security, security, security. And if the following evidence from Google, the governments of Germany and France, and Microsoft itself do not convince you, I’m not sure there’s much else that will:
- The Chinese cyber attacks on Google (and at least 20 other large companies) got through because the exploited code worked only in IE6, on Windows 2000 and XP.
- The German and French governments have both asked its citizens to upgrade their IE6 browsers to prevent attacks happening to them.
- Microsoft released a security advisory warning against attacks specifically against Internet Explorer 6.
Mashable includes the three items above in its list, but the last one is the most compelling:
This will not be the last massive IE6 security breach: This flaw was unknown before Google’s groundbreaking China announcement. And it’s not the first flaw ever found with the browser — there are at least 142 vulnerabilities in IE6, 22 of which are not yet patched. Would you use armor that had 142 weak spots?
Internet Explorer 6 is a run-down browser with very little support for exploits. It’s more costly for businesses to leave it lying around like a ticking time bomb than exert effort to upgrade their systems.
The good news is, we’re getting bigger institutions stepping up against IE6. Let’s hope their spheres of influence really are that effective. You can’t get much bigger than European governments, Microsoft, or Google.
And by jQuery-esque I mean easy! The premise of Jetpack, Mozilla Labs’s latest creation, is that anybody who knows HTML, CSS and JavaScript can create Firefox add-ons.
It takes 80 lines of code to block ads on websites as shown in the demo above, and 14 lines to edit images from within Firefox. Granted, it just sends the data to Pixlr which does all the hard work, but lowering the obstacles to develop some fairly nifty scripts is a commendable effort, just as what jQuery did with JavaScript, Sass with CSS, and HAML with HTML. It’s made even more compelling with Bespin, Mozilla’s HTML5-powered web-based code editor.
Perhaps I’m still in a “standardize everything” mood, or envy this new doodad since I’m now using Chrome as my default browser, but don’t you sometimes wish all browsers could do this? Do the same set of things? We’re getting to a point where the level of HTML and CSS support is the same across every browser, so it makes me wonder what’s the next step for the idea of cross-browser compatibility.
It will probably depend on what the web browser means to its various makers. Google has unveiled the Chrome OS, which will run on a specialized version of Chrome. Opera is focused on its “web servers for everyone” feature in Opera Unite. (And Internet Explorer is playing catch-up, mostly.) Browsers are basically the gateways to the whole Internet, but they’ve become more ambitious than that and their vendors will attend to those ventures first before convening to create new cross-platform goodness.
Google sfida Microsoft con Chrome by Federico Fieni
Guess whose turn it is to bring Internet Exploder into the 21st century. Google has been dipping its fingers and toes everywhere, including the browser market. But it wasn’t content with creating its own; it just had to meddle with everyone’s favorite browser, IE. And based on the name, Google Chrome Frame quite literally puts Google Chrome into Internet Explorer (versions 6, 7, 8). That is, Chrome’s support for HTML5 and its JavaScript engine.
For ordinary users, it means having to download a plugin for IE so it works just as well as any other modern, standards-compliant browser does. For developers, it means adding a meta tag so their websites actually work work better.
Mozilla has done something similar.
A few months back, Mozilla released a <canvas> element plugin. It’s really not a new concept; clearly folks at Mozilla and Google are taking drastic measures so they can slap sense into IE.
Isn’t this Microsoft’s job?
And look how well they’re doing with that.
Let’s turn the tables on this one: would Microsoft even think of creating extensions for competing browsers? Would we even find this acceptable? Of course things are different; Firefox and Chrome work worlds better than Internet Explorer ever has. You don’t see Kill Firefox or Kill Chrome campaigns, do you?
This is not a cure-all
If you don’t have enough privileges to install plugins on your workstation, the plugin and meta tag combo is useless. It doesn’t solve the biggest roadblock to dropping IE6. And if you can install programs on your computer, why not just get Chrome anyway?
Though it’s a valiant effort to bring the IE6 user stats down by a few notches, web designers and developers would still have to test for browsers without Chrome Frame.
Can you say passive-aggressive?
But is it really a charitable deal with a hint of “desperate times call for desperate measures”? If anything, this move by Google (and Mozilla) is an elegant finger to Microsoft.
Google could just sit on its pretty throne, throw more resources into advertising its own browser, and wait ’til it eventually dominates the market. Search, email, advertising, online office suite, VoIP, real-time protocol: everything it touches turns gold. History is on Chrome’s side.
But there’s more to Google Chrome Frame as it seems to scream: “when will you ever get your act together, Microsoft!”—masked by a 24-karat, “we’re here to make the Web a better place” grin.
IE6 Must Die, the title of Mashable’s latest post, hit the Twitter trending topics (it’s the new “Digg frontpage”) a few days ago. It’s really a good thing raise awareness for the browser we’ve been dying to get rid of for years now. But as much we should appreciate every little bit towards this goal, we should pay more attention as to why IE6 isn’t dead yet.
This Digg Blog post, Much Ado About IE6, sheds a good amount of light into that. Those who use IE6 to access Digg were also invited to answer a short, three-question survey that would hopefully reveal why they’re still using the outdated browser.
The results are thus: (a) More respondents used IE6 at work: a whopping 90% compared to 56% at home. (b) When asked why they don’t use another browser, majority say they can’t: either they don’t have sufficient computer access or workplace rights to do so, or the computer they’re using can’t handle modern browsers.
Granted, Digg is not a mainstream source of statistics. The amount of IE6 visitors are only at 10%, and more importantly, this social voting/bookmarking site has a strong geek slant. We can still learn from this unofficial study. As Mark Trammell concludes in the blog post:
Giving them a message saying, “Hey! Upgrade!” in this case is not only pointless; it’s sadistic.
How about we stop focusing on those who refuse to upgrade and try to help those who are simply unable to? All the campaign sites against IE6 don’t amount to much until they figure that out.
Just like the future of web typography means teaming up with the big-name font foundries to come up with a real solution to font embedding on web pages, eliminating IE6 would require reaching out to big businesses and convincing them to do large-scale upgrades in the workplace. On the Web, that’s already begun: we have the likes of Google and Facebook urging people to upgrade as they are dropping support for IE6.
But for non-technology companies, who’s going to reach out to them? Microsoft? W3C? WaSP? Assuming we found someone who will do the dirty deed, can they be convinced to drop a significant chunk of their market? Assuming the dirty doers manage that, can that significant chunk of their market be also convinced to stop accessing their sites using IE6, when in all probability they can’t? Should they be ignored?
The vicious cycle continues. (So much for freedom.)
In yet another interesting turn of events, two of the biggest issues when it comes to web design and development make way for the newer, better versions of themselves.
Goodbye, IE6!
Asa Dotzler of Mozilla reports that IE6 usage has now been overtaken by IE8, based on the browser tracking data from Net Applications. This happened as recently as June 2009.
Of course, specific demographics on your respective websites will vary, but this trend is a sign of things to come. And we’re not talking about years anymore, but months.
I’d have to commend Internet Explorer team on their great marketing efforts to improve the IE8 adoption rate. Even if Microsoft’s latest browser is up to snuff compared to the likes of Firefox, WebKit (Safari/Chrome), and Opera—see these comparison charts for HTML5—it’s a big step.
This is it, guys. Freedom.
Goodbye, XHTML2!
Slashdot reports that the XHTML2 Working Group charter is expiring by the end of 2009, and it will not be renewed. The W3C has also decided to pour more resources into the HTML5 working group.
Those who weren’t paying attention to this seeming sibling rivalry between XHTML2 and HTML5 can now rest easy. Though I’m not sure if XHTML2 ever stood a chance given how all the web gurus were backing HTML5 as early as last year. Google is on board, too. And everybody else is starting cash in on its growing popularity.
The good thing about XTHML was that it enforced well-formed markup, with strict provisions for lowercase code, quoted attributes, and trailing slashes for empty elements. Thankfully HTML5 this coding convention too, and can be served as a serialized XML document dubbed XHTML5.
At least we wouldn’t be forced to choose between the two anymore. Competition is good, but not here. We need standards.
Unwanted competition eliminated
How convenient is it that we have two less things to worry about now? Very, but now that they’re gone, it’s time to make up for lost time:
- Microformats. (This is the easiest to jump into.)
- Fluid layouts.
@font-face and custom web fonts: this time it’s not just the browser makers that web designers and developers are up against, but the type foundries. TypeKit and Kernest are attempting to bridge that gap.- CSS nested declarations, variables, and operations: LESS
- CSS if statements: Modernizr
- Animated PNGs.
Exciting times, people!
