Busy week / Css Links Galore

Well, I've been working on the SgDotNet website, converting everything using <div>, and I must say, I'm a convert. <div> rocks. But I'm still not sure whether I've over-designed it and had a bad case of divisitus, but from the tutorials I've been reading, it looked quite alright, in a "component" level. But as a full page, it looks rather packed with <div>. Everyone who looked at the code says it looks extremely neater, more structural and logical, with <div> ids to describe what those segments are.

So, as promised, I was playing around with this Hello application to put up pictures for bloggers, but apparently it's not THAT quite useful. It served its purpose anyway, so there you go, some photos down there. But what the hell. It's there, and hope you enjoy the pictures. I'll post the gallery link once the pictures are up on the SgDotNet gallery.

Onward to XHTML standards! Here's some useful links, or rather A useful link to a fantastic XHTML coding/tutorial website. http://www.alistapart.com. Fantastic tutorials they have there, on CSS.

A few common things I'd like to point out to web client-side coders. CSS liquid layout. Here's a great article from "A List Apart". From Table Hacks to CSS Layout: A Web Designer’s Journey. Some links that gives you ready layout templates. The Layout Reservoir. Little Boxes. Oh, not to mention "The Noodle Incident", a wonderful website on CSS which the "Little Boxes" link came from. He has some rants and a book on CSS, so I might be checking out sometime soon when I pop over to the library. Another link, Glish.com's CSS is another fantastic website on CSS layouts, and his famous "Look Ma, No Tables".

That's for CSS liquid layout. Another thing I'd like to point out is creating menubars out of <ul> and <li>. Here are a few links. Drop-Down Menus, Horizontal Style and Suckerfish Dropdowns from "A List Apart". I love that website. Lots of tutorials on CSS. I used the Suckerfish Dropdown's javascript and some layout techniques from Drop-Down Menus, Horizontal Style. Basically I had to delete everything, and started from scratch by writing all those <ul> and <li> without any styling, then slowly adding piece by piece. The trick to getting the horizontal working is position: relative; I think, but I can't quite remember it. So yeah, read those articles and you'd be half a guru.

Another thing I needed was how do I create boxes surrounding my text, and how to slice it and display it using CSS. Here's a great article that helped me do it with with the navigation bars at the side. CSS Design: Creating Custom Corners & Borders and CSS Design: Creating Custom Corners & Borders Part II. Again, both articles are from "A List Apart".

A few tips that helped me through the browser problems of "96% of the entire world is using" browser, but yeah. Here's Tantek Çelik’s CSS Box Model Hack to fix some misunderstandings of the standards by that browser. There is another one, but I can't quite recall it now. Anyway you have to use that technique if you ever have any margin or padding. YOU MUST! Another tip is from WaSP which gives you some methods on how to "upgrade" or "degrade" your website on older browsers. Fighting for Standards in Our Browsers.

I was also reading Eric Meyer on CSS: Mastering the Language of Web Design and More Eric Meyer on CSS (Voices That Matter) which in fact are more tutorial/walkthrough books than descriptions. But the latter book helped quite a bit on the menu bars I had to create for the SgDotNet website. I've yet to find any useful tutorial/walkthrough from the former book.

I actually finished reading "Designing with Web Standards" at the beginning of this week, and have been using a few of it's techniques quite often to convert the SgDotNet website over to CSS layout, and I'll do a "Summary" cum "Review" on the book soon enough. It'll be on pdf and I'll post the link here, and there will be a html copy up on the SgDotNet website once I'm done with it, which the schedule states, 1st December 2004. Good luck to me.

Oh yes, as mentioned before, and promised, I'll be writing an article on how <div> and CSS would be beneficial to user custom controls, and it will be up hopefully by next week when I've completed converting the website. That's 2 articles I'm promising. I'll also post up the link on the Generics on .Net Framework 2.0 presentation that I'll be doing for the SgDotNet User Group Meeting on 9th December 2004 soon enough. Wish me luck.

Oh btw, just to clear up some air, this blog is really meant to store all my findings and links and book titles so that I don't forget about it. Some place to archive everything that I've researched on, and hopefully will be beneficial for you guys. I won't be writing much on my life, so sorry about that. Basically my life does revolve around everything that's posted. Such a no-lifer huh.

I guess that ends this session. Will be posting again soon!