Simple answer: No.

Point of CSS Hacks

CSS Hacks are quite useful.  IE interprets the box model differently than Firefox and sometimes requires different CSS styling to achieve comparative results to Firefox.  To pass CSS styles to IE only CSS bugs were discovered that allowed designers the ability to keep all their CSS code in one CSS file, but target a specific browser for bits of code.

This made it easy to pass IE styles to make it display properly.  The most famous and most widely used of the CSS Hacks is the * html hack.  By placing * html before the selector in your CSS you could target IE specifically with whatever styles it contained.  This was done because Firefox would skip right over the statement, but IE would read and apply it.  Although it was a pain to have to fix IE, CSS Hacks at least made our job as designers easier.

But then IE7 was released.

IE7 didn’t require the same styles that IE6 needed because Microsoft upgraded IE’s CSS standard compliance.  Thus all your * html styles that once fixed IE6 could be breaking IE7.  Combine this with the fact that IE7 seems to randomly choose when to follow * html styles, which in my experience has only been about 50% of the time, and you have a big problem.

Since then newer hacks have been found to target IE7, but they are flimsy at best.

So what’s the answer?  How can we insure that our styles for IE reach the proper browser and proper version?  Unfortunitly it now requires conditional logic to detect the browser used and feed it either a style tag or a CSS file.

CSS Conditional Logic

Using CSS Conditional Logic you can now target not only IE, but also specific versions of IE.  This is useful when IE 6 needs different code than IE 7.  You can read more about CSS Conditional Logic on Microsoft’s site.  Conditional Logic allows for greater control of your CSS styles.  It allows you to know 100% that your styles are reaching the exact browser you intended.

The downside of Conditional Logic is from a maintenance point of view.  In the span of fixing each browser you may find yourself now using three or more CSS files.  The usefulness of CSS Hacks was that it allowed you to keep all styles together.  Conditional Logic requires some styles to be on its own, either on the page or in a separate CSS file.

Which way is the best?

The fact that CSS Hacks can sometimes be skipped by the intended browser is a deal breaker in my eyes.  If I need a style to be applied to IE 7, I don’t want it to only work 75% of the time.  In my experience CSS Hacks simply can’t offer a 100% track record.  I’ve used them in the past and have had them fail far to many times.  CSS Conditional Logic offers a 100% guarantee that your browser specific styles will be picked up and used,  and when you’re working on big websites, a 100% guarantee is exactly what you want.

CSS is an amazing tool. It not only makes your HTML easier to read, but also quicker to update. Instead of having to change tags in multiple locations, CSS allows you to make one update and have it effect numerous elements on multiple pages. That is a power that straight HTML simply can’t offer.

But with the good comes the bad. Inline styles allow you to add CSS directly to a HTML tag thus saving you the effort of adding styles to the CSS file. The logic is this will keep you from having to edit two files at a time. You can edit your file and immediately see the results. No need to edit a second file to add styles. Easy right?

While this may sound like the way to go, it is not the best solution for a few reasons.

It negates the purpose of CSS

The point of using CSS in conjunction with HTML is to separate content from design. This keeps your code clean, concise, and easily maintained. It allows you to focus your HTML on meeting standards instead of looking good on the viewer. If you add inline styles to your code you create a maintenance problem right off the bat. Inline styles are the primary focus of the browser, so if you ever want to update the style that you coded inline, you will have to visit that page and update it. If you did this on multiple pages then you will have to open each of them and update them one by one. You might as well have used a font tag, you’re getting the same results.

Inline styles are served to all browsers

You can specify which CSS files a browser will receive. If you want IE6 to receive a different CSS file than Firefox, you have that capability. This is often used to fix display bugs that only affect certain browsers. The difference in the box model between Firefox and IE is a prime example of why the capability to specify CSS files is so important. Inline styles, on the other hand, have no such capability. What you code inline will be applied to all browsers. Not only will it be served to all browsers, but it will also be the most important style the browser sees. So no matter what your CSS file specifies for your tag, what ever is written inline will override it.

Print Style will pick up inline styles

Another unwanted result of using inline styles is that your Print Styles will be overridden by inline styles. So your page may look fine with your inline style when served to the screen, but when printed your inline styles could cause problems. CSS allows you to specify a specific CSS file for print. You can adjust all elements exactly like you do for screen viewing, but the style sheet will only be applied when printed. Inline styles give no such option. Regardless of medium, whether it be screen, mobile, or print, your inline styles will remain.

Inline styles gives you a taste of the power of CSS and the effect it can have on elements, but why go only half way? Why code inline styles only to copy and paste them to the CSS file in the end? Why not do things correct from the get go? The power of CSS mixed with HTML is enormous! You should use it to its maximum potential. You’ll save yourself a lot of time and headaches in the long run. Plus you will make designers like me happy because I won’t have to come back later and fix it.

Landis is a clean, classy, and professional WordPress theme whose primary color pallet is Green, Blue, and White.

The design uses a top page navigation and a left sidebar. The sidebar uses custom background shapes per section and is widget ready.

The theme has two custom settings which are controlled from the Admin Presentation page. This allows for custom styling of the Website Title and the second tag line. It also allows for updating of the splash image directly from the admin panel.

Note, you will need to create an uploads folder in your wp-content folder and make it writable. That is the folder that WordPress will upload your new images to.

Version: 1.1

Demo | Download

I’ve been using Flock as my web browser for a few weeks now. Has it passed my tests? Will it have a permanent home on my computer? Has it pushed Firefox off its high perch?

Being Social

Flock is billed as a Social Web Browser, so it should be no surprise that it allows you to add login information for the most popular social networking websites directly into the browser. This information allows Flock to access these accounts and display content to you in sidebars and topbars and to quickly add content to these services. After adding my information for the various sites I have accounts with, I found that don’t use them. I have a flickr account, a facebook account, and a youtube account, but I only use them a few times a year. There is one social network website I use daily, Last.fm, but Flock does not give sidebar access to it. So the social aspect of the social web browser was basically useless to me. Granted, to some these features are possibly a God send, but for me they collected dust in the corner.

Post Anywhere Blog

Flock allows you to post to a variety of blogs from within the browser window. It also gives you right click access to post various internet findings to your blog. These features were pretty cool, but I still found myself preferring to visit this site and post it manually. I attempted to use Tags in Flock, but found that they do not represent tags in WordPress. Instead it seems that flock decided to make its own system for tags which bypasses the way WordPress does them. Not that I use tags often, but if you make it an option it should at least act as expected.

For the most part blogging through Flock was easy and painfree and I’m sure will be the most used feature of Flock.

Web Browsing

Unfortunately this is were most Mozilla web browsers suffer on a PPC Apple computer. There is a problem with the way they display text and form elements. When using a textbox the cursor lags behind the text and is always a few letters back from where it should be. This makes posting to a forum almost impossible. Even as I type this into WordPress the cursor is about three characters behind. I also find that on a PPC text will sometimes be cut off in unexpected places. I don’t know why, but it makes surfing with Mozilla browsers all that more difficult.

Overall

Overall Flock wasn’t a bad browser, but it definitely wasn’t the browser for me. I prefer speed over gadgets. I prefer usability over flash. I prefer Firefox over Flock.

Sorry Flock, but you’re deleted.

I’m addicted to trying out web browsers. I love finding them and giving them a week to convince me to keep them on my computer. Some pass and enjoy long shelf lives (Opera, Firefox, Camino) and some fail and are deleted almost as fast as it took to download them.

Because I work on the web and web browsers are so important to me, I feel that it will be fruitful to post my findings from using the various browsers. I’ll post what I like, what I can tolerate, and what is a deal breaker from permanent residence on my hard drive.

My first test subject is Flock. It claims to be The Social Web Browser, but I’ll see if it is a Useful Web Browser.

Blogged with Flock

phpbb has become the standard goto forum solution for people looking for free forum software. It’s simple, it’s easy, it’s quick. And now it’s getting an upgrade. With RC7 phpbb is moving closer and closer to a 3.0 final release, and there are going to be a lot of 2.0 forum administrators looking and evaluating the software for possible use on their forums. I’m sure questions such as: Is the upgrade worth it, Will I lose all the posts currently on the forum, and What can I expect; will be asked.

I manage a small phpbb forum and after waiting for a while finally decided to install the latest RC release. At that point I had no idea what to expect, but hoped 3.0 would smooth out some of the rough areas of 2.0 and tighten everything up. The biggest thing I was hoping for was simplified template system, and a cleaned up admin control panel.

Once I had it installed and logged in the for the first time I was blown away! It’s finally everything I’ve wanted phpbb to be. Everything is in logical places now. Behind the scenes style and page structure are separated. There are features that once required heavy mods that are now working out of the box. It’s perfect, and it’s not even a final release yet!

Is the upgrade worth it? Absolutely! There no no possible way you won’t like phpbb3…..unless you are a vBulletin user.

Godfrey is a classy gray WordPress theme with custom shaped content areas and dual bottom information areas that display Recent Posts, Categories, Search Bar, Blogroll, and Meta Information.

Version 1.1 now supports color pallet changes from the Admin Panel.  From the new menu you can change the theme’s accent colors.

Godfrey utilizes a top navigation for easy page access and supports short blurbs with custom stylization to set them apart from full posts.

Out of the box Godfrey is setup to use the WP Audioscrobbler plugin, but can be customized to display anything you wish.

Version: 1.1

Demo | Download

Read a great article over at chromaSYNTHETIC regarding how to use JavaScript in a way that won’t kill your page for those viewing with JavaScript turned on. If you work with HTML and JavaScript be sure to check it out.

It’s amazing how far we’ve come with JavaScript. These days it is used under the hood of some of the most helpful and useful websites. It’s even running online applications that may one day replace our standalone computer applications. When I first started to use JavaScript in a web environment I believed it only useful for animations and browser effects. I never thought the day would come when JavaScript became useful for more than image preloading and rollovers.

The addition of JavaScript libraries, such as mootools, moo.fx, jquery, coding has never been easier. If you’ve been avoiding JavaScript because you’ve viewed it only as a fad or a gimmick, give these sites a look over and see what usefulness JavaScript is now bringing to the table. You may be surprised at how much time and energy it can save you.

Tables. The spur in the side of some designers, the godsend of others. Who’s correct? Well, both actually. While the haters of tables will claim that only ignorant people use them, the reasoning behind them is what is more important. The fact that someone uses them is more of a byproduct. I’ll explain.

The point of HTML is to make a website. Nothing more. No matter how you code the site, the outcome will be the same, a website. For the most part, what’s behind the mask doesn’t matter as long as the site works as planned. I liken it to a picture frame you want to hand on the wall. There are some frames that have a wire and some that have a metal hook. Is one better than the other? Not really. The point isn’t how you mount it on the wall, the point is that you want it mounted on the wall. Who cares how you do it.

Once you establish that a table less design isn’t better than a table design simply because it uses no tables, you can then begin to look at the benefits of both arguments. What makes table less designs more efficient? When are tables easier to work with? When is it okay to mix and match the two ideas?

I’ve found that for the most part, once you remove tables from your designs you open a design world that allows for more creative output. You no longer have to think about design in the aspect of boxes and columns. You can then begin to think about design aesthetically and worry less about how to build out the design. Of course you can’t design with reckless abandon, but you’ll discover that there are more design capabilities are available to you once you free yourself of thinking in tables.

That’s not to say that tables don’t have their place in the current design world. When working with data driven sites, you simply can’t beat using tables. Which is funny, because the original point of tables was to display data. It just so happen that designers used them for more advanced design capabilities than were available at the time.

The biggest turning point for me from table driven sites to div/css driven sites was time. As my designs became more complex, so did the updating process. Over time I found that simply adding a column to be a time consuming process due to colspan changes and various other issues. A div/css driven site doesn’t have this problem. If you want to add a new column, you can simple add a new div and stylize it. No need to go through the entire page updating tags.

Remember, the table vs no table argument is redundant because ultimately the outcome is the same, a functioning website. It simply boils down to what do you find easier, convenient, and useful. As long as the client is happy and everything is working, who cares what’s under the hood.

I have no idea how many of you three people who visit this site are web developers. In fact, I don’t care how many of you are web developers. If you have a site, code sites, program on sites, design sites, or rip off other people’s sites, then I’ve got to tell you about jQuery.

jQuery is a javascript library that simplifies what it takes to create nice javascript code. Want a cool slide effect? It’s one call in jQuery. Want to manipulate css? It’s one call in jQuerry. Want to find all instances of a class that is a child of a span? It’s one call in jQuerry. Essentually jQuerry makes your like much easier by allowing you to focus more on what it is you’re wanting to do and less on how to code what it is you want it to do.

Every web developer knows that coding javascript can SUCK! Browser issues alone are enough to drive people to drink the stuff under the sink. But these issues may be a think of the past. The geniuses behind jQuery have created it so that compatibility is built in. They test all their code to ensure that 100% compatibility is supplied.

They also offer pre-built plugins on their site. You IE6 viewers are using jQuery and don’t even know it. Because you are gimps who refuse to upgrade to Firefox I had to implement something to fix my png images on this design. I tried numerous scripts, but never found one that worked. jQuery had a plugin that fixed it with only a few lines of code. I didn’t have to program a thing.

I realize this sounds more like a commercial, but screw you I’m excited about this! I’ve already used it on a client’s website and they love the results! It saved time and delivered an excellent result. Isn’t that what it’s all about?

To learn more about jQuery, send $19.95 to tgpo. Sorry, no CODs. Or you can check out their online demos.