Technobabbles Strips for a Day
You might notice something different about this site for the next 24 hours or so if you're a regular reader. The page looks different, doesn't it? I'll explain why right now.
See, I have a feed subscription to someone named Dustin Diaz, who runs his own blog. He started CSS Naked Day in 2006, and had another one last year with over 1,600 participants. This year, April 9th is the date, and I'm participating as well.
CSS Naked Day shows off how much CSS has changed Web design. Sites that use standards-compliant and semantic markup will be perfectly functional without styles. Those that abuse tags to get certain effects might not be so lucky. For more details, visit the Day's site.
I removed the CSS for a minute or two on April 8th as a test to see how it would look during the event. If you visited during that short time, around 05:30 that morning (CDT), you would have seen a CSS-free page. It looks the same right now. Technobabbles' look will be back to normal around midnight April 10th.
I'll admit I did leave a few snippets of styling in place -- inline styles in posts and sidebar modules (which are at the bottom for this one day due to the lack of CSS) would be too difficult to find, remove, and then restore for one day. There are hundreds of them. I also don't have much control over the styles imported by sidebar widgets, so they will look normal, if a bit stretched.
For those of you reading in a feed reader, why don't you click through and take a look at how the site looks without any styles?
Sorry, Microsoft and IE7
I owe Microsoft and IE7 an apology. Last month, when I complained that IE7 wouldn't layer properly, that was really my fault for thinking I needed to fix something that wasn't broken. I set different background coordinates in the IE7 stylesheet (which is now empty thanks to my testing) and messed it up myself. So ignore that post if you came across it, or do in the future, because it's wrong. I guess my developers' hate for IE kept me from trying the most obvious solution: removing the fix and seeing if it was actually broken. Sorry, Microsoft.
Looks Like IE7 is Finally Arriving, But Windows Vista Bites
Reviewing the site stats for this blog, I see a distinct prevalence of visits from IE7 users over IE6. Firefox still seems to dominate my hits, but Internet Explorer's own little battle of the versions seems to be turning. A few months ago, not many people I knew used IE7; now I can see the trend clearly. It looks like the day may be coming when I can dump support for IE6 completely as regards my Web development and focus on IE7 fixes. Like the old IE5, version 6 of the venerable, annoying (to developers) browser may soon see its support dwindling in the website world. Not too many sites bother staying compatible with IE5 these days, since it's not used much (my stats show no IE5 traffic at all, though I did get a hit from Firefox 0.9). Holding IE6's hand with complex CSS layouts might be something I won't have to do anymore come this time next year. I'd be ecstatic; I'm really tired of having three stylesheets...
While the newest version of IE is winning, however, Windows Vista seems to be losing to its older brother, XP. In the last few months, traffic from XP was more than five times the traffic from Vista. I think all the problems Microsoft has had with their newest baby have hit people where it hurts -- the bugs threaten productivity -- and kept them from upgrading. With Service Pack 1 in beta testing, the new OS might finally take off in the next few months, but I don't expect to see too much growth before the new year.
It's really quite interesting to see what browsers and operating systems people use. Lifehacker mentioned statistics for their site a while back, citing Firefox as the most popular browser on that site. It also has the lead on this one, ten percent ahead of IE between July 1 and now. Interestingly, the Macintosh OS has a lead over Linux, but it's small; Mac OS has 16 visits, while Linux has 12. Under those, there are three "(not set)" visits, which apparently didn't provide browser data. It will be quite interesting to see how these stats change in the coming months... Will Vista catch up to and/or surpass XP? Will IE take over Firefox? We shall see come December 31, when I'll check the stats from today until then and note the changes in trends.
Update (12/2): The results have been tallied for the end of 2007. See who won!
Internet Explorer 7 Doesn’t Layer Properly
In the process of developing a new website I have, I discovered a major flaw in Internet Explorer 7 (IE7) that shows itself when a floated element has background-color: transparent set in the CSS properties. It appears that if the element is floated inside another element with an opaque background, that background becomes transparent also in the area under the transparent element, effectively showing the page background. I have tested this with tiled image backgrounds, however it may show up in colored backgrounds as well.
I spent about two hours tonight alternately searching for solutions on Google and discussing the problem with another designer. Neither of us came up with a solution. Nevertheless, this issue needs to be fixed, or else I will be forced to come up with some completely new colors for the site I'm designing, just so IE7 doesn't hide content that is the same color as the page background but should be on a different color.
Update: I just fixed the problem by removing an unnecessary fix CSS rule, which was actually the source of the problem.
Navigation Makeover
I have made some major changes to the navigation on my website. I made it so it can be tiered, and have collapsible sections. It works in IE6 and FF2 on XP, and Safari 2 on Mac, but I do not know definitively about IE7 XP/Vista. If anyone can help test the design, please let me know in the comments. Thanks!
So Many Goodies
Over the last two days, I've added tons of new goodies to my website. First off, I redesigned the navigation (still a few tweaks to go in IE7), with tiered levels. I also added AJAX login, settings, and logout, replacing the old links. This and the new picture gallery (in the members' section) are both based on a new jQuery plugin, Thickbox. I'm also planning on adding jQuery rounded corners so they'll show up in both IE and Firefox (and any other browser that either has Canvas or can have it added with JS).
It May Suck, and It May Explode the Internet
...but Micro$loth Suckernet Exploder (I mean Microsoft Internet Explorer, of course
) can finally work with my website! After applying a couple CSS tricks I found in various resources (books and the Internet), I managed to make the site work (almost) perfectly in IE 5.5 and up. Internet Explorer 7 is, of course, the best implementation, but IE 6 and IE 5.5 are close, with just a few pixels here and there off. There is a strange gap in the border between the content and the navigation, but that disappears in IE 7, so I won't worry about it too much. Everyone's updating, right? (Except me, of course, school-computer bound as I am.) So now, for the first time ever, you can view my website in (almost) all its glory (pretty much) with any browser. Firefox is still better, though, but the lack of rounded corners isn't a real hindrance.
Website…Upgraded (Again)
Over the past couple days, I've been delving into the additional features provided by the extremely powerful jQuery JavaScript library. Some of the best things are fades and other animations, which I've used to enhance the warning and message banners that appear on the site from time to time. They now fade in gracefully when the page finishes loading, and slide out the top after a short while. You can see the effect, whether you have an account or not, at http://web.augsburg.edu/~werlm/cada/?msg=outnote (msg=outnote designates that a banner should appear). You should have Firefox to actually view the website.
[Drools] Rounded Corners… Columns… Templates… Dang! It’s CSS3 :(
I've been exploring the features of CSS3 over the last few days, and I'm loving it absolutely. Too bad it won't be really supported until 2010. It has so many useful features, like native column support, rounded corners, cross-browser opacity control, and all kinds of other useful and cool things. Too bad none of the current browsers on the market support any of the features. Mozilla and Firefox come close with proprietary -moz commands, but all the other browsers (those not based on Mozilla) don't display them. It could be a while before CSS3 is turned into a standard, but I can't wait.
Website (Redux)
'Ello, everyone. A while ago, I blogged about updating one of my websites with an LCARS template (you know, the Star Trek interface?). I also posted an update to that same post that said the upgrade was canceled. I regret to say that this is true; I didn't have time to implement the design. It would have required editing graphics files, using all kinds of absolute positioning, etc. It just wasn't worth the trouble. I did say there was a new template in the works, though. That is true; I've been working on it for a while now, say two or three weeks solid.
It's starting to look pretty cool. It's a center-column, fluid-width layout done in pure CSS. And the best part: It degrades in IE. Not "degrades well," mind you, just "degrades." IE6 adds space where there shouldn't be any, and it doesn't support the :hover effect used on the navigation links. Nor does it support the "generated content" that I am planning to use (CSS rules like "a[href$=.pdf]:after {content: " (PDF)"}"); it was implemented in CSS2, and IE6 doesn't have full support for that standard. I regret to say, almost, that IE7 removes many of these bugs. It displays the :hover correctly; there is no extra space (just two borders adjacent instead of overlapping); and the PDF LINK (PDF) would appear instead of just PDF LINK. Unfortunately, Microsoft has done a good job on IE7's CSS support, so I'll just have to live with it. All versions under 7 will get a nice little surprise on top, besides the missing functionality.
Anyway, I am planning to release the new website, fully formed, some time before 4th quarter starts. Whether it will be in the current location or a new one (I'd like to run a MediaWiki wiki, too) I haven't decided, but it will look a whole lot better than the boring, search engine-hating, kludgy, framed design I have right now.



