For the geeks

About the site (detailed).

Salt and pepper added. For curious eyes only.

Best viewed in..

Oh yeah, I love this part. ‘Cos I’m gonna shout out to those still using Internet Explorer 6: “YOU’RE MISSING BIG!

Seriously, I’m not even gonna bother to post up a ’spot the difference’ screenshot comparison on what you’ll be missing on my blog if you use IE6. A browser replacement is long overdue for you IE6 guys out there. C’mon, it’s not that hard, you’ve plenty of alternatives to choose from. Even if you’re still keen on sticking to that incompetent IE brand, at least upgrade to IE7.

The unfortunate truth is that no matter how buggy and shabby IE6 is, its really hard to ignore them - IE6 users.

I set the minimum requirements of this blog for my target audiences with data collected 30 days ending 13th Jan 2008 on my old blog. It may not be exactly the same right now, but it gives you a rough picture of your readers’ setup so that you can set your minimum ‘Best viewed in’ requirements.

Browser Stats (ember.stafa.us 13/1/08)

Browser stats

As you can see, IE6 users make up a whopping 32% of my visitors. Following closely behind Firefox users at 37%. Its sad that there are still a lot out there who hadn’t bother to even upgrade their browsers, let it alone switch to an alternative. Yet these bunch can’t be ignored as audiences as to their sheer number.

Thankfully for you, I’m not going to be that incompetent web developer who keeps these users in the dark. My blog still supports IE6 but only as a slightly depreciated version. Meaning, you’ll miss some tiny little cool stuffs here and there but not anything serious enough to impair you from reading any of my posts. =D

So despite the number of IE6 readers I have, I’m gonna put the final ‘Best viewed in’ list of browsers as:

IE7, Firefox 1.0+, Opera 9+, Safari 2+ (OSX) and Safari 2+ (Win).

More often that not, my blog is viewable in the following browsers:

IE6 (partial), IE7 (full support), IE8b1, Firefox 1.+, Opera 9+, Safari 2+ (OSX) and Safari 2+ (Win).

Now on the to monitor resolution part.

This one is pretty easy to accomodate since there is a trend of ever increasing resolutions supported by new monitors. And thankfully for us web developers, monitors have rather short lifespans (at least shorter than a particular version of a browser). That way, monitor upgrades happen all the time and with it, the monitor resolutions.

Monitor Resolution Stats (ember.stafa.us 13/1/08)

Monitor resolution stats

The minimum requirements are pretty obvious here. There’s still an annoying minority of 800×600 res users, but I’m gonna be a little incompetent (forgive me will ya?) here and ignore them. Seriously, there isn’t anyone I know that still uses that dino-aged resolution for daily browsing.

1024×768 res users are still forgiveable. Heck, I still have an old desktop running on that resolution.

That said, my ‘Best viewed in’ list for monitor resolutions are

1024×768 - Mininum

1280×1024 - Optimum

So yes, my blog layout has minor breaks at 800×600 resolution. But its still readable to say the least.

Valid XHTML 1.0? Hell yeah!

First off, I do support the efforts of standards compliant coding. Hey, I took the effort to make sure my code validates as XHTML 1.0 Transitional. But before I make this rather bold claim, let me clarify that only the newer pages validates. By newer I mean content posted after March 2008. With any luck, *some* of the older pages might validate too. =P

The base coding itself is valid XHTML, but often you’ll see that my older pages and posts break validation due to the absence of “alt” attributes on post images. Well, it hasn’t been a practice for me to apply alt attributes to each and every picture for a long time nor I am bothered to re-apply them in effort to makes sure site-wide validation.

There are tons of pictures on my blog and I have better things to do that apply “alt” attributes to every single photo I have.

Rest assured though, you’ll find that the newer posts validates just fine. =D

Not valid CSS? Why not? (See edit)

Edit (10/4/2008): I decided to ditch all those opacity effects for valid CSS. =) So yes, tehCpeng.net now validates both in XHTML and CSS. Thus, everything below this line under the same sub-header is now invalid. But I’d still leave it here though.

——

Maybe it’s worth noting that even the original Hemingway theme doesn’t ship with valid CSS. Since my new theme is based on Hemingway, naturally, it, too breaks CSS validation.

The only few instances that breaks CSS validation is the usage of CSS3 opacity properties (for modern browsers) and the alpha filter (for IE). Both of which isn’t valid CSS properties but achieves the same effect: controlling the opacity of an object. Eg:

#search:hover{
opacity:1.0;
filter: alpha(opacity=100);
}

Try it out! Its applied on the searchbar on the top right if you can’t figure it out already. If all works well, the searchbar is supposed to light up when you hover over it. Pretty cool effect huh? =P

The original Hemingway theme uses the -moz-opacity property for the searchbar hover-light-up effect but that only works in Firefox and you guessed right, breaks validation too. So I thought of making the effect cross-browser compatible and sacrifice (the already broken) CSS validation in the process. Hey, since the creator Hemingway is willing to sacrifice rules for style why couldn’t I? =D

Edit: The searchbar hover effect (along with other opacity effects) doesn’t work in IE8 beta 1.

Another pain in the ass that breaks CSS validation would be the fix for PNG transparency in IE. Other than that, its all valid CSS code!

Typography

Yes, I take typography very seriously. They make all the difference. tehCpeng.net uses the Lucida Grande as its primary font. Lucida Grande is supplied natively with OS X but not in all versions of windows. If the font around here looks weird, or if you wanna experience tehCpeng.net in its full typography glory, get the Lucida Grande font for Windows here.

In support of:

Firefox 2

Wordpress

No-www

Valid XHTML!

Valid CSS!

ServerFreak Web Hosting Solutions

Edit: (08/03/2008) Added IE8b1 support results.
Edit: (10/4/2008) I decided to ditch all those opacity effects for valid CSS. =)


  1. tehCpeng.net » Blog Archive » The Inaugural Post 19.03.08 / 12am

    [...] Um okay, I could go on and on but check out these new pages that will hopefully complete an introduction to my new blog. =D - About the site. - In more detail. [...]

  2. Eli James 20.04.08 / 9pm

    Lucida Grande? That’s … an interesting choice. I suspect I’m looking at the Trebuchet MS version of your page, *Checks your stylesheet* - hrmm. You do like sans-serif fonts, don’t you?

  3. ember 20.04.08 / 11pm

    OMG. Go get yourself a set of Lucida Grande through that link I posted above, or just download the Safari for Windows browser.

    If you’re on a Windows machine you should, at least, have Lucida Sans but since you’re reporting that Trebuchet MS is displaying instead is kinda weird.

    And yeah, I’m a huge sucker for sans-serif fonts. =D *checks your blog* Looks like you’d prefer serif fonts eh? xD

  4. Eli James 21.04.08 / 6pm

    Hehe. Guilty as charged. I just like curvier fonts. Suits my writing better.

    Yeah I believe it might be Lucida Sans, but I’ve installed the Mac font set as requested and am now enjoying Macciness. You’re using Apple, then?

  5. ember 21.04.08 / 6pm

    Yeah I agree it suits your blog. Heck, I might even try a theme based on serifs in the future! Inspired I am. =)

    Ohoho, nope. I’m with 95% of the rest of the world on a faithful Windows box.

  6. Suffian 24.09.08 / 7am

    Nice blog design, dude. Well planned and nicely coded. Btw which part of Taiping are you from? My grandma is from Asam Kumbang.

Drop something.

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>




Safari hates me

clipimg

Recently

Categories