Advanced CSS web design is not for the faint of heart or the easily annoyed

January 31, 2010

cssHow many times have you looked at a block of CSS being used on your site and wondered what in the heck is going on with all that? Is all that stuff really necessary? Did whoever put all this crap together really know what they were doing? Should I dare modify it?

Though quite functional with CSS technology, I am far from being a CSS expert but after looking at many style sheets I am left wondering what ever happened to the concepts of code reuse (at the very least implying readability,) compactness, and maintainability.

I’ve seen WordPress themes that come with 2000 plus lines of CSS. Through experience I now tend to avoid those like the plague as they tend to break when upgrading browsers or your CMS software. Clean, compact, straightforward CSS is what you want. Granted, a lot of different fancy web design features will require a lot of CSS and in those instances look for adequate documentation.

If you simply load a nice theme you like with no plans of ever customizing it, these concerns may not seem important. But if you like to continuously improve or customize your site, rule out those themes with unruly style sheets regardless of how much you like how it looks. Follow this advice and you will save yourself a ton of headache down the road.

And speaking of analyzing CSS…

In technology terms, Douglass Bowman’s article Sliding Doors of CSS written way back in 2002 is an ancient document. However, if you are interested in a great CSS tutorial that steps you through the mind-numbing intricacies involved in developing an advanced design feature using CSS the article is one of the best I’ve read. I gained useful insight into the shenanigans used by these CSS gurus to accomplish cool web design layouts.

On the other hand, this excerpt…

Keen eyes may have noticed white tab corners showing up in the previous example. These opaque corners are currently preventing the image in the back from showing through the left corner of the image in front. In theory, we could attempt to match the corners of the tab images with a portion of the background behind them. But our tabs can grow in height, which pushes the background behind them lower, shifting the background color we tried to match. Instead, we change the images, making the corners of our tabs transparent. If the curves are anti-aliased, we matte the edges to an average of the background color behind them.

Now that the corners are transparent, a piece of the right-side image shows through the corner of the left-side image. To compensate for this, we add a small amount of left padding to the list item equivalent to the width of the left-side image (9px). Since padding was added to the list item, we need to remove that same amount from the anchor to keep the text centered (15px – 9px = 6px):

…clearly demonstrates why I don’t create CSS layouts from scratch.

  • Share/Bookmark

My first Twitterlanche

August 27, 2009

http://ow.ly/lphd

Anyone who reads Instapundit knows what an Instalanche is. Certainly if you have ever been on the receiving end of one you know. An Instalanche is when Glenn links to your site and you get an outrageous number of hits over a couple of days. Were talking tens of thousands. Many of the lower-tier websites go down for bandwidth overages. (A blog I used to write, enormous incongruities, actually received a link from the Instapundit but it was only worth a couple a hundred hits. My instalanche that wasn’t. I sold that blog last year to someone that wanted to take it down. In hindsight, now that I’m trying to rebuild some page rank on several new websites, I think I sold EI too cheap because the site had a pagerank of 4.)

So my Twitterlanche came from, you guessed it, Twitter. All my posts from this blog and my outdoor blog are automatically tweeted. A post I made on Gulf Coast Texas Outdoor Blog got a retweet and in less than half a day I’ve had dozens of incoming Tweeters. I know dozens doesn’t sound like much, but we are talking relative here and it’s not even been a full day yet. The outdoor blog is rather new and I haven’t spent much time on it in several months. I don’t know if the Twitter referral has staying power, like Google Page Rank, but the Twitter traffic is a huge spike. I’ll update if the Twitter traffic continues in noticeable quantities.

The moral of the story: You don’t have to be a user of Twitter, or even understand how it works or why people would use it, but for maximum exposure to a potential mass audience you absolutely must include it in your website marketing strategy. It’s a gold mine once you figure out how to take advantage of it.

  • Share/Bookmark

Server Side Includes

August 22, 2007

It seems me SSI is not working properly on cgwwff. Suddenly my footer with all the nav buttons and sitemeter and whatnot isn’t showing. Dammit it’s always something.

UPDATE: It was the old XBitHack trick. My .htaccess file was”renewed” somehow in the process of all the domain changes and blog reconfigurations and the problems therewith. I was using the XBitHack for cgwwff to implement server side includes for my footer without having to change the file name of all the pages to an .shtml file extension, which is required for the server to process includes. XBitHack tells the server to scan all pages with the executable bit set so I can just chmod +x *.html and presto all my web pages will be scanned for the include footer directive.

It’s important to enable this for only those pages that need it as a slight burden is placed on the server for each page scanned for includes. No since in incurring an unnecessary burden on the server for pages that don’t even have an include, eh.

  • Share/Bookmark