Tag: web standards

Categories
internets uncategorized web design

Google Chrome obeys alternate CSS

NOTE: this post is ancient, but still gets a good bit of traffic, so i need to let readers know:

This issue was fixed long ago.

So Google Chrome is out. That’s great! It’s really a cool, fast, secure browser.

Unfortunately, it appears to break sites in one very important way: it obeys alternate stylesheets, just as if they were normal, active stylesheets. This breaks sites who print their alternate CSS links after active ones (like mine – for now).

I’ve sent this in as a bug to Google, and i’d recommend that others do the same (select “report bug or broken website” from the page icon to the upper right).

At the moment, the only thing to do is to list alternate stylesheets before active ones, or exclude alternate links altogether.

However, there are (naturally!) problems with each method…

Listing alternate CSS (which would still be obeyed) could still cause style conflicts, if there are any rules which are not contradicted (read: overwritten) by later stylesheets below the alternate ones.

On the other hand, not listing alternate stylesheets disables additional functionality in user agents such as Opera, which allows users to select from a menu what style they’d prefer to view a site in – which is arguably the best, most accessible method of switching stylesheets (if you’re using one of those user agents, that is).

For my money, i believe the former is the best option. This means i may have to do some code “cleaning,” which i should have done anyway. In fact, rather than removing extraneous CSS rules, i’ll be adding rules which do not exist in, say, X.css to Y.css, in order to counteract any style collisions by overwriting them with alternate rules.

Btw, for those who need it, here’s the User Agent string i captured:

Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13

[UPDATE] Matt Wilcox helpfully pointed out that this isn’t exactly a Chrome bug, but a leftover Safari one which has apparently been around for years, according to a decently shrewd Google search. Lesson: test in Safari, even if you think it’s a Practically Perfect Browser.

I have fixed it locally but am waiting for at least a few more hours in order to use this site as an example. Hey, it beats making a quick mock-up. Sort of. (My teachers always thought i was most useful as an example to warn others – well, i do what i can!)

And a big thanks to the great Jeffrey Zeldman for helping get the word out to designers about this. Of course, 99% of people making web sites won’t be affected, but for those of us using alternate styling, it’s a nasty thing to have happen.

[UPDATE 2] To clarify, Safari and Chrome both use the Webkit rendering engine, as well as parts of the Mozilla FIrefox codebase. Not to point fingers or anything. I’m just sayin’ is all.

[UPDATE 3] I couldn’t take it anymore. I fixed things here so there shouldn’t be any issues. I use a browser sniffer to detect the user agent and deliver either modern CSS or a crappy facsimile thereof for older, less standards-compliant user agents. As long as i keep up to date, no problem… of course, the drawback is obvious. I must keep up to date. Anyway, i’ve completely eliminated the alternate styles for both Chrome & Safari, at least until this bug is fixed in the Webkit renderer. In the meantime, i’ll put together a tester page and link it here.

Categories
uncategorized

Google Chrome obeys alternate CSS

Originally published at jeremyjarratt.com. You can comment here or there.

So Google Chrome is out. That’s great! It’s really a cool, fast, secure browser.

Unfortunately, it appears to break sites in one very important way: it obeys alternate stylesheets, just as if they were normal, active stylesheets. This breaks sites who print their alternate CSS links after active ones (like mine – for now).

I’ve sent this in as a bug to Google, and i’d recommend that others do the same (select “report bug or broken website” from the page icon to the upper right).

At the moment, the only thing to do is to list alternate stylesheets before active ones, or exclude alternate links altogether.

However, there are (naturally!) problems with each method…

Listing alternate CSS (which would still be obeyed) could still cause style conflicts, if there are any rules which are not contradicted (read: overwritten) by later stylesheets below the alternate ones.

On the other hand, not listing alternate stylesheets disables additional functionality in user agents such as Opera, which allows users to select from a menu what style they’d prefer to view a site in – which is arguably the best, most accessible method of switching stylesheets (if you’re using one of those user agents, that is).

For my money, i believe the former is the best option. This means i may have to do some code “cleaning,” which i should have done anyway. In fact, rather than removing extraneous CSS rules, i’ll be adding rules which do not exist in, say, X.css to Y.css, in order to counteract any style collisions by overwriting them with alternate rules.

Btw, for those who need it, here’s the User Agent string i captured:

Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13

[UPDATE] Matt Wilcox helpfully pointed out that this isn’t exactly a Chrome bug, but a leftover Safari one which has apparently been around for years, according to a decently shrewd Google search. Lesson: test in Safari, even if you think it’s a Practically Perfect Browser.

I have fixed it locally but am waiting for at least a few more hours in order to use this site as an example. Hey, it beats making a quick mock-up. Sort of. (My teachers always thought i was most useful as an example to warn others – well, i do what i can!)

And a big thanks to the great Jeffrey Zeldman for helping get the word out to designers about this. Of course, 99% of people making web sites won’t be affected, but for those of us using alternate styling, it’s a nasty thing to have happen.

[UPDATE 2] To clarify, Safari and Chrome both use the Webkit rendering engine, as well as parts of the Mozilla FIrefox codebase. Not to point fingers or anything. I’m just sayin’ is all.

[UPDATE 3] I couldn’t take it anymore. I fixed things here so there shouldn’t be any issues. I use a browser sniffer to detect the user agent and deliver either modern CSS or a crappy facsimile thereof for older, less standards-compliant user agents. As long as i keep up to date, no problem… of course, the drawback is obvious. I must keep up to date. Anyway, i’ve completely eliminated the alternate styles for both Chrome & Safari, at least until this bug is fixed in the Webkit renderer. In the meantime, i’ll put together a tester page and link it here.

Categories
creative internets uncategorized web design

You can quote me on that

For those designers who want to do the fancy-pants block-quotes thing, here is the CSS. Note that you have to put a DIV element in there to give it padding and close the quotes. That’s because the current specification for CSS do not allow for more than one background image for any single element. This may change in the future, but for now, we must write fairly non-semantic markup in order to achieve the cool effect.

blockquote {
background: transparent url(path/to/quote-left.img) left top no-repeat;
}
blockquote div {
background: transparent url(path/to/quote-right.img) right bottom no-repeat;
padding: 0 50px;
}

… And this is what it looks like:

I used to be really, really humble.

It just made me big-headed.
x jeremy jarratt

I added a :hover behavior to mine. What will you do?

Categories
creative internets uncategorized web design

Big Urgent Tweak Test

Look out for my B.U.T.T.! I’ve just finished uploading some tweaks to make the Big Urgent Wish theme a little nicer. Please, as always, wear your helmets, and let me know if anything falls on your head. I could always use a good laugh.

I hope to have a sanitized version available soon.

Categories
creative internets uncategorized web design

Validation

Whew! So far, Big Urgent Wish passes XHTML 1.0 Strict and CSS level 3*!

I have only done the index page, though, so more work is no doubt needed.

 

*although, due to the opacity: .6 in the CSS for the thickbox plugin I’m using, it doesn’t validate as CSS level 2

Categories
creative internets uncategorized web design

Big Urgent Garbage Hunt

The B.U.G. hunt is on! See if you can find all the problems with my new layout… I’ve already identified the ugly 3rd-tier dropdown menu thing on the navbar at the top, but I haven’t had much time yet to test everything out. fixed Later tonight I’ll tweak it and try to get it to behave itself a little better. Please post your comments here (be sure to include your OS/browser). And thanks!

(Things are bound to be a little on the messy side for a few days while I convert this thing over to the new theme.)

EDIT: Yikes! Single posts & pages are also totally unstyled! fixed

Categories
current events internets uncategorized

Get Internet Explorer 7

I highly urge you to get Internet Explorer 7. It is far and above any previous version of IE which you may have found somehow pleasurable. In addition to enhanced security, it features tabbed browsing, support for RSS feeds, and is much more standards-compliant than its predecessor.

And it’s really not all that bad. I’d still recommend Opera or Firefox, though.

Get Internet Explorer 7

Categories
current events internets uncategorized

IE7 on the horizon?

Today at work, two co-workers told me that they had Windows Updates, which made mention of or reference to IE7, ready to install on their home PCs.

Anyone know what this is about?

Categories
internets memories web design

Attack of the digital zombies

Well, it’s been taking forever, but finally!, my portfolio is online and pretty much more or less all (well, most) of those old dead sites are recreated and re-animated and essentially living again, albeit with synthetic blood this time around. Don’t look them too closely in the eyes, as there is no more soul in them as there is in an idiot, slack-jawed goldfish.

It’s been quite a learning experience… in fact, it really is amazing that i got away with such junk HTML in some of those sites. Actually, on the most prominent website i ever did, i actually used double-quotes within inline CSS. Which effectively turned off succeeding CSS rules, and invalidated the whole mess. It’s quite lucky, i’d guess, that anything worked at all in some cases.

There’s just a couple more sites to put up.

Categories
creative internets memories web design work

rebuilding legacy sites for a portfolio

I’m working on getting my legacy sites ready for an online portfolio to be presented here on this site.

The unfortunate thing about being a relatively-inexperienced web designer/developer is that most of your clients will be fairly small outfits and that much of your work will be necessarily pro-bono, or close to it. This means that many of them won’t be around for a very long time. In my case, none of them are. I think the Tecumseh Local Music Boosters may still maintain a site somewhere, though probably one with tildes in the URI that i’ll never be bothered to really track down, because it’s probably no longer my work being displayed there.

On to the point: this means that i have to re-build all of those old sites from the archives. Which, in turn, means trying to get code written a pretty long time ago (by www standards) to work. That’s not much of a problem, in most cases, because i at least had the foresight to include some useful future-compatible functions, the most underrated of which is the doctype declaration.

Regrettably, i don’t remember how some of the functions worked, and i don’t have much time to figure it all out.

The worst part, though, is that the one of the coolest sites, for a sadly defunct print magazine, won’t work locally, and i think it’s because i no longer have any idea what kind of a server environment it was written for.

So take this to heart, fellow amateurs: always, always, always include copious comments in your PHP, and archive a copy of the phpinfo() that you generated at the time (when you were literally losing sleep trying to iron out that one nagging bug). Mirror the damn thing live if you have to. This will save you in the long run, when the site goes belly up, and you have to prove to potential employers or clients that it existed outside of the sick, narcissistic fantasy world inside of your head. You won’t look like a blowhard when you can at least produce a working copy. Right now, i’d settle for just some screenshots of that magazine site.

Speaking of which, i can at least produce a static HTML version, using archive.org for the markup and my backup image files for the graphics. So all is not completely, irretrievably lost.

But i’d rather get those bugs ironed out. I just need a lot more time than i can actually come up with lately.

Categories
internets

IE7

According to MezzoBlue’s Dave Shea IE7 is really, honestly going to fix (almost) all of those things we’ve been whining and complaining about for, well, years now. Some of the mouth-wateringly acceptable features IE7 will now finally be capable of, out of the box: PNG’s alpha-channel transparency (thank fucking god), fixed positioning, and the :hover pseudo-class now works on (supposedly) any element!

IE7 beta is available, and the rendering engine is, basically, as finished as it’s likely to get; any changes from this point out will have to do more with bug fixes and security. I’m going to download it and see it for myself.

And if you do not upgrade on the day it is released, you’re a monkey’s arse and i will – mark my words – no longer be making web sites with your lousy browser experience in mind.

Categories
web design

more cleaning

…and now the site passes XHTML validation (with some few per-post errors)! i moved a couple things, added a copyright, changed the lists on the sidebar very slightly, and generally cleaned house.

i swear to “Bob” i will also eventually put content up under the new links (up top).