Rog's world online
Sun
9
Aug '09

I like the <big> tag

Rog posted in Web Stuff

Why does <big> get the short end of the stick? It’s been deprecated while <small> gets to continue.

I know X/HTML purists would say none of the ‘phrase element’ tags are needed. Sure, all of the same effects can be done in CSS with styles attached to <span> (or you can make a site entirely in <div> tags), but there are some good arguments for simple emphasis markups like <small>, <i>, <strong>, <code>, etc.:

  • They’re semantically rich and descriptive. Even <b> and <i>, which often get little respect, have appropriate uses when you just mean to bold or italicize something. They are exclamations in a way, although <strong> and <em> (emphasis) are even moreso.
  • They’re useful for people who don’t know HTML, but still want to style their text in a blog comment or forums post. Most people understand small tags like <b> = bold. <big> and <small>, they’re self-explanatory.
  • For web designers, it’s easy and efficient to allow the simpler markup tags on input. We can filter out all of the attributes and have one less worry about XSS & injection exploits. Don’t make us resort to BBCode (*ugh*).
  • They’re convenient and they don’t harm anyone. They’re warm and fuzzy. I really cannot fathom what <big> did to get itself booted from the HTML club. If it was too large I could understand, or if it annoyingly blinked or scrolled like a marquee, sure. But it’s just a little more emphasis than strong.

Usually I’m on the side of standards, but on this one little (<big>) thing: I’m tempted to skip markup validation in order to provide my users with the convenience of an easily recognizable tag.

Note: Of course I can just present the tag to my users and convert it to <span class=”big”> but shhhh, I’m trying to make a point here. ;)

Thu
23
Jul '09

Upgrade the Interwebs

Rog posted in Web Stuff

While working on my site redesign for Gameslate, I’ve realized an interesting tidbit: All of the new, recently released browser versions are significantly faster, especially with JavaScript.

I’d kinda already noticed this when I installed Firefox 3.5, which was a huge improvement over 3.0, but what I hadn’t known was that the same has been true with IE 8 (much faster than IE 7) and development versions of Chrome. Safari will probably soon follow, but it’s pretty fast already. I don’t know about Opera, but generally there are widesweeping speed and stability improvements across the board.

It’s not some magical boost to your Internet connection, it’s just that these browsers are faster at working out how pages should be displayed. Given the rise in JavaScript usage with web applications / AJAX / etc., the performance improvement really helps.

Of course, I’m biased. I’d like to see people upgrade regardless. At least get rid of the truly crappy old browsers (IE5, IE6, IE7 all seriously suck to support). But even if you’re not interested in the coolness factors of CSS3, HTML 5 (dev), etc., I think upgrading is worthwhile.

Tue
30
Jun '09

Firefox 3.5: Shadows and Web Fonts

Rog posted in Web Stuff

Update: And the codecs issues for <video> have people (on the working group) in a tizzy. Talk about timing.


Firefox 3.5 is out today and it’s a doozy of an update. What’s the big deal? Well some pre-CSS3 toys and goodies are in it, some of which were already added to Webkit (Safari & Chrome).

Some notable features:

  • Audio, Video and Image embedding features are being added directly into Firefox via the <audio>, <video> and <canvas> tags. We’ve been viewing video on the web for eons, but it’s always been via plugins (Flash) or external programs (Quicktime, Windows Media Player, etc.), now the browsers are getting theses capabilities built-in (previously Firefox did not play sounds directly for instance). Standards for content directly in the browser are a bigger deal than they sound, because it will make cross-platform webapps so much easier to create.The Canvas features are especially cool, it’s not just a display method, it’s a drawing method for creating images.

    YouTube already has support cooking for the video tag to replace Flash videos. I haven’t checked Webkit’s status on these features, but if it’s similar to Firefox’s… fully web-based apps could replace many of the iPhone’s apps (although it depends how much Apple intends to adopt or block the standards & codecs). I can already imagine creating games with this stuff.

  • Web Fonts are possibly the biggest improvement to web-browsing since images. It’s been 16 years that we’ve been stuck with a small handful of ‘web-safe‘ fonts that exist on most PCs. There have been other kludges to embed fonts into websites as images, or provide links to download and install fonts manually, but Web Fonts embed directly: Allowing specific font faces to be shown by default with no compromising tricks.Web Fonts aren’t a shoe-in tho, there are still rights issues over who owns the fonts and which ones you can legally embed, but it’s past time when we should just be able to do it and decide typefaces for ourselves.
  • Rounded borders via -moz-border-radius. Images are typically used to round borders, cut up into sections for backgrounds on the page. More recently JavaScript has been popular for rounding borders within the browser, but having them directly as CSS is more convenient. Unfortunately Mozilla (Firefox) and Webkit are tussling over the implementation, but hopefully they’ll both settle on how to interpret the CSS3 standard border-radius. Meanwhile, using separate -moz and -webkit markup works nicely.

    Example:

    Browser

    How this should look like in your browser

  • Shadows via -moz-box-shadow. The inset and multiple shadow options make this feature very flexible, almost as much as Photoshop’s shadows. Combining shadows can make buttons that would usually be images, which is incredible. These make me want to recreate my theme here so I can simplify changes and save on bandwidth & display times to boot. The more we can do directly in the markup and without JavaScript or cutting up a bunch of images, the better.

    Simple Example (Firefox + Safari + Chrome):

    Browser

    How this should look like in your browser

    Complex Example (Firefox):

    Browser

    How this should look like in your browser

I’ve already applied some of these to my theme here. I started adding rounded corners to my comment bubbles, it was so easy I just kept going with the rest of the theme. It’s cleaner and a breeze to maintain compared to fiddling with a bunch of carved-up images. These gracefully fall-back to the older standards, so while IE will end up looking plainer, it’ll still be fully usable.

Firefox, Safari and Chrome in total make up about a third of web-browsers. While there are still inconsistencies, it’s great to see them advancing these features. Hopefully it’ll be a kick in the pants for Microsoft to get with the program and update IE likewise.

Tags: · ·