Find Motive

Its almost 2008 and the use of generic file controls on web forms are still in major use today. Why are we still using this old ugly technology when there are much better solutions?

Reasons not to use them
- They’re ugly
- There is no way to limit the file types displayed in the “Browse” window
- You can’t make them look good very easily as they lack alot of CSS support
- They’re ugly
- You can’t see how much of the file you have uploaded.
- No way to select multiple files to upload at one time without multiple file controls
- They’re ugly

Solution
There are multiple solutions, but the one I always use and is the most widely supported is using flash to upload files from a web browser. Using flash I can tailor the upload process to the site’s UI and design needs.

SWFUpload is a great premade script that allows you to upload files with flash.

Even though I avoid using the file control as much as I can, I still find it useful sometimes…sometimes.

CSS has always been my least favorite part of developing a site. When I am writing a site from the ground up, I will make my layouts using inline styles to speed up prototyping and once I have finalized on my layout I will then go back through my design and write the CSS for it.

I am curious how other developers/designers out there go about their CSS. Leave a comment and let me know. I am open for suggestions on my method.

Back when I first started doing web development I used Javascript Image objects and onMouseOver and onMouseOut to make image rollovers for web pages. This worked well, but was kind of clunky and required 2 separate images.

Now I use CSS with only one image to do these same rollovers. You are basically just shifting the background image's X coordinate to give the rollover effect.

The following browsers support this:
IE 5.5+, Firefox 1.07+, Opera 7.23+, Mozilla 1.7.12+, Netscape 6.02+, Safari 2.0+, Konqueror 3.4.3+

Example

The Image

CSS

HTML