cssvault - inspiring creativity

Microsoft has finally made Internet Explorer 8 Beta publicly available for download, and all I can say is: WTF?

First of all, IE8 can only be installed in Windows Vista SP1, XP SP2, 2008 Server, and 2003 Server SP2. Which leads me to think that this is nothing more than a business ploy to get people to upgrade their *cough* legal *cough* Microsoft OS.

Next, what happened to passing the ACID2 test? After bragging about this milestone months ago, it is still failing for some. The exact reason is still unclear, but this inconsistency is disappointing nonetheless.

Third, what about SVG support? The web community has been stuck with raster formats LONG ENOUGH! How much longer must we wait until we arrive at a standardized vector format?

Finally, let’s look at IE8’s “new and exciting” features:

Activities

Activities are contextual services to quickly access a service from any webpage. Users typically copy and paste from one webpage to another.

Kind of cool, but plugins / extensions / add-ons in Firefox do the trick just fine.

WebSlices

WebSlices is a new feature for websites to connect to their users by subscribing to content directly within a webpage. WebSlices behave just like feeds where clients can subscribe to get updates and notify the user of changes.

Again, sort of cool. I am all for microformats, but RSS feeds are already a standard across all modern browsers in different platforms including mobile, so I doubt web developers will want to develop widgets that will only work on IE8.

Every “feature” listed after Webslices is basically pointless or a replication of a Firefox, Safari, or Opera feature. It’s sort of like the marketing team had to try very hard to come up with something to sell IE8 with. Nothing “new” or “exciting” here.

Favorites Bar

In Internet Explorer 7, the Links bar provided users with one-click access to their favorite sites. The Links bar has undergone a complete makeover for Internet Explorer 8.

So basically, the team spent countless hours designing a new favorites bar that looks just like every other favorites / bookmarks toolbar and added a new menu item that saves favorites directly into the bar and called it a new feature.

This feature, for one, has really left me speechless.

Next!

Automatic Crash Recovery

Automatic Crash Recovery (ACR) is a feature of Windows®Internet Explorer® 8 that can help to prevent the loss of work and productivity in the unlikely event of the browser crashing or hanging. The ACR feature takes advantage of the Loosely-Coupled Internet Explorer feature to provide new crash recovery capabilities, such as tab recovery, which will minimize interruptions to users’ browsing sessions.

Finally IE8 gets a feature that has been in Firefox for AGES! I guess this is their way of admitting that their browser crashes all to often.

P.S. How long did the designers come up with such a cool name as “Automatic Crash Recovery”? If I were them I’d try to trademark that before someone else does.

Improved Phishing Filter

Internet Explorer 7 introduced the Phishing Filter, a feature which helps warn users when they visit a Phishing site. Phishing sites spoof a trusted legitimate site, with the goal of stealing the user’s personal or financial information. For Internet Explorer 8, we are building on the success of the Phishing Filter with a more comprehensive feature called the “Safety Filter.”

I can’t believe this made it to the “New and Exciting Features” list. The marketing team is really on a roll.

Activities, WebSlices, Favorites Bar, Automatic Crash Recovery, and now Safety Filter? What’s next, the Super Cool Browsing History Manager? Seriously who comes up with these names?! While renaming Phishing Filter to Safety Filter would prevent Grandpa Joe from getting a migraine while trying to imagine why he must bring a filter the next time he goes fishing, I must say that this only leads to more confusion.

It would have been much more intuitive if the Phishing Filter were moved as an option below the Security Filter, because the Security Filter does so much more than prevent phishing attacks. For one, there’s the group policy option for blocking unsafe sites, and two … well that’s just about it.

That’s really just about everything that there is with the new IE8 Beta. If this is any indication of what the final product is going to look like, then I guess we are better off without it. As far as web developers are concerned, it’s just another browser to produce hacks for. Speaking of looks, it looks exactly the same as IE7. At least the Mozilla Firefox team made the effort to come up with a new look in Firefox 3.

On a serious note, hard core developers may wish to take a look at the IE8 Beta 1 Whitepapers, which as of today appears to be central to a single new feature: Better AJAX Development. Hooray. Yeah I know I said this was a serious note. But really guys, WTF?

I have been receiving a couple of inquiries on how to create do CSS forms so let me direct you to Jeff Howden’s two year old CSS-Only, Table-less Forms article. Yes you heard me right folks: two years old! Yet it still displays properly on the newest browsers, which only shows how resilient the code is.

By now you must be wondering about the “almost perfect” part in the title. This is simply because the CSS code does not validate. The culprit? Of course, it’s IE again, with the JavaScript-in-CSS expression() hack.

Oh, and if you have questions or suggestions for articles, you may reach me via dennison [at] cssvault dot com

Have fun!

WebDesignerWall has come up with a trick that uses nothing but a little CSS and PNG to apply gradient effect onto plain HTML text. The trick involves overlaying a blank block element that contains a translucent PNG gradient on top of the regular text.

As can be seen in this demo page, it actually looks pretty good.

There are a few limitations to this, of course. One being that the gradient will have to use the same color as the text’s background. Second, the background will have to be a solid color.

Finally, it requires the PNG hack to work on IE6, which relies on JavaScript. So, if the viewer happens to have JavaScript turned off, be prepared to see some cross-browser uglyness:

All in all a novel idea, but I’m not so sure I want to risk the chance of loosing a visitor though an accidental flash of ugly design.

CSS guru Eric Meyer has spent some time rethinking CSS reset and has come up with a new stylesheet:


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}


This will probably change but for those who are looking for a good, understandable CSS reset, this is a good start.

Another article demonstrating what could be done by combining effects such as opacity, shadows, and tiger striping.

Currently they are claiming that only Opera 9.5 beta renders the demo correctly — not really useful right seeing that Opera has been stuck at ~1.5% market share, and I am sure only a handful of them actually use the beta.

Posting this from my sleek and super fast Mozilla Firefox 3 Beta 2.

Update: Link to the article (thanks, mediter!)

Internet Explorer General Manager Dean Hachamovitch writes to inform everybody that the Acid2 face now gets rendered correctly in IE8 standards mode.

While it is important to note that while the test itself does not test all web standards, it is still a very significant achievement for the dominant web browser. More importantly, this means that IE8 now:

• Interprets positioning correctly
• Renders the box model correctly
• Parses attribute selectors correctly
• Supports the object element

What’s interesting to see is how IE8 will render hacks that were developed to fix IE6 and IE7’s “quirks”, since it appears that IE8 is just an updated version of the IE7 engine. It took them a while, and it’s about time. Now how about getting Firefox to pass the test?

With the recent Opera vs Microsoft fisco (short story: Opera filed an antitrust case vs Microsoft for monopolizing the browser market and not supporting web standards), members of the CSS Working Group such as Andy Clarke have begun suggesting that the group disband and reform anew.

He suggests that having members who are at the same time on the payroll of browser vendors compromises the group’s integrity and endangers the future of CSS and CSS3. Moreover, the gives a shocking insight that CSS standards were not arrived at through “a collaborative, non-partisan process” that eventually were made “available for browser makers to implement (or not) as they chose” but rather it was the opposite — that standards relied heavily on browser support — as it was in the case of CSS2.1.

Andy calls into question the decision of CWG member and Opera CTO Håkon Wium Lie to support the Opera vs Microsoft case, saying that it

… calls into question whether or not their representatives can, or are allowed by their employers to work together with their competitors in a spirit of cooperation. It calls into question the fundamental basis on which the CSS Working Group has operated up until this point …

He concludes by suggesting that “Opera’s action now makes the CSS Working Group unworkable and that immediate and sweeping changes are necessary.”

CoolTips replaces regular browser tooltips with fully stylable tool tips. It uses lightweight and unobtrusive JavaScript to replace conventional web-browser tooltips.

CoolTips automagically gets contents from the title attribute by utilizing the Prototype JavaScript framework. It uses script.aculo.us for animation. Both frameworks will need to be initialized to for it to work.

Link: CoolTips homepage

This problem has been around for ages, but it is an easy one to overlook. Internet Explorer does not expand the ' entity (part of XHTML 1.0 specifications) since it is an XML entity. So be very careful especially when using an HTML editor and use ' instead.

Here’s an example:

Seeing photos of the Meebo Mini just gets me excited about this wonderful little app. Check it out!

And they just launched Meebo Rooms a couple of months ago. Man, they just keep getting better and better!

Meebo