The Design Philosophy Behind Farlops Industries

What’s this site all about?

I don’t know actually.

I’ll say it’s three things:

1. A collection of links to sites I am building and maintaining or have built and worked on.
2. A showcase and test-bed for my, hopefully, temperate Web noodling.
3. A repository for some of my creative urges and some of my friend’s creative urges

Obviously these are fluid and ever-changing documents. As such this site may change focus without notice. You’ve been warned.

The short of it is, I designed this site so it is usable by any browser. No important content will be lost or become unreadable if you happen to viewing this site with a screen reader or Lynx. It will only look bad in two browsers, IE 4 for Windows and IE 4.5 for the Mac, but that’s a risk I am willing to take.

| | |

Why use CSS?

You kind folks may wondering that right now, staring as you might be, at what appears, to some browsers, to be really boring looking pages. I have a few reasons:

1. By strongly separating presentational data from content, CSS makes it much easier for me to maintain this site. I control the look of all the
   documents on this site from one file. When I update a document’s content, I don’t have to worry about ruining some elaborate set of nested tables with a clumsy edit. I can throw out all kludges like spacer gifs, frames, layout tables, font and center tags. This makes the markup much smaller and easier to maintain.
2. Using style sheets is good for accessibility. People who are blind, partially sighted or mobility impaired will appreciate the fact that I made these documents linear, with all the navigational links at functionally at the bottom and all the content at the top. The pages may not look that way to people with style sheets turned on, but try using your keyboard to move through the links on any page here and you’ll see that content links come first and navigation links come last. Turn style sheets off, or look at the site with browser that doesn’t support CSS and see how the pages snap into a linear format. Style sheets allow me to present the pages in a multicolumn style and yet still allow those who don’t like multiple columns to turn them off.
3. Style sheets make my pages load faster. The browser just caches one
   file with the presentational stuff and uses that repeatedly. Because there
   is no presentational use of HTML, the markup is much smaller and the pages
   load much faster.
4. Style sheets are a non-proprietary standard. Now that post-fifth-generation browsers are available for most operating systems, my pages look mostly the same in all of them. Those not using the latest horrors from Microsoft, Mozilla, ICab, Konqueror or Opera will not be
   deprived of any content. I don’t have to maintain redirects or several sets of files optimized for each browser make. Luckily I’ve managed to hide my style sheets from most browsers with poor CSS support. The only browser that should render this site unreadable is Internet Explorer 4 for Windows and Mac. I am assuming I can take this risk.

Where’s the “dynamic HTML?”

Well, I’ll tell ya:

1. DHTML, or dHTML, depending on what camp you’re in, is a proprietary concept cooked up by marketing weasels. What some people call dynamic HTML is actually three things: Style sheets, page (or client side) scripts, and scriptable objects like Java applets, XML and HTML. Now these should be lumped together but, they shouldn’t be lumped together in the proprietary way the Microsoft or AOL/Netscape are
   doing it. The way they should be lumped together is something called the Document Object Model or, DOM. The DOM is a standard made up of the same components but these components are defined by the W3C standards committee. Style sheets are defined by the CSS2 recommendation. Client scripts are defined by the ECMA specification. And how those scripts interact with objects is defined by the DOM recommendation. The DOM matters, DHTML doesn’t.
2. Client-side script use has always been deeply problematic anyway. Often your are forced to code for the lowest common denominator–scripts that work in Netscape 2 or IE 3. This can be informally thought of as DOM level 0.
3. Most of it is a waste of bandwidth anyway. The expression “dancing baloney” springs to mind. I’ve seen a few page scripts that do worthwhile things but that was mostly forms validation or record set manipulation for a server-side database. I’ve seen fewer still page
   scripts that do useful things standing alone but, they aren’t cross-platform yet. Better to wait for full support of the DOM.
4. Not only do most page scripts do trivial things some of them do outright dangerous, invasive or annoying things. The advertising popups on supposedly free sites are a perfect example. Some page scripts, controls and applets are a threat to your privacy–some can inventory files, pass system information and plant cookies even though you might think you have those options turned off on your browser. Better to just turn it all off and avoid being plagued by popups, involuntary redirects and demographic tracking. But if you insist on leaving it on, here’s a few things you might try.
5. Although it can be, lot of it isn’t accessible to people with disabilities. Most of us may use mice but what if you are blind or
   paralyzed from the neck down? Many of these users have to navigate the web using a keyboard, or a similar input device, alone. Many scripts, controls and applets don’t fully expose themselves to keyboard control and this is bad for accessibility. Often most DHTML makes absolutely no sense in screen readers.
6. Since the world seems hell-bent on using client-side scripting, I now have page on how to design client scripts that are accessible. Some of this will focus on the IE document model. But I also plan to have some DOM compliant scripts too, which work in both IE 5 and Mozilla (Netscape 6+).

Navigation and Flash

Where’s all the navbars and tables of contents?

Simple–I don’t believe in overwhelming the user with navigational structures that supposedly help them find their way around. In some sites, this urge to supply the user with navigational links goes too far. Maybe 3 years ago most Web users didn’t know how to flip back to previous pages or how to use link history but, most are fairly sophisticated these days. If they want to see how my site fits together, they can consult my archives, sorted by date and category. Things are still too small to warrant a site wide search.

Of course I guess I could make the table of contents I do provide less arty and obscure but, hey, it’s a personal site.

How Come No Flash or Shockwave?

1. Flash is pure dancing baloney and makes no pretense at being otherwise. It totally sucks as an interface and never pretended to be such. If you wanna make shiny, sparkly things, Macromedia has got the tools for you.
2. The accessibility of Flash stinks. Macromedia is attempting to correct this but it will be a few years before all the Flash designers start
   designing things correctly. Better to use SMIL, SVG, DOM and CSS for multimedia.
3. It doesn’t really do anything useful so why waste my time learning it?

What tools were used to create this site?

This site sits and ticks and whirs in Baka’s Sparc 5 running the Apache server. I developed most of these files in a Windows2000 workstation using such jug-headed tools as Visual InterDev, FrontPage 2000 and Notepad. When I want to get some real work done, I use Funduc’s Search and Replace and ActiveState perl. I haven’t done much image creation or manipulation yet but, when I do, I use PhotoDraw2000–not a top of the line image creation tool I’ll admit but, it comes with Office 2000 so I may as well use it. I also use Liam Quinn’s A Real Validator to check the validity of my markup.

I also used two testing tools to improve the accessibility of my pages: A-prompt and Bobby. These tools essentially parse your markup and tell you when you are missing the accessibility features in HTML 4 and 3.2. You can then go in and correct the markup. Currently most browsers, and many accessibility aids, don’t fully support this new markup, but when they do, I’ll be ready.

I just recently added a powerful web log script called Greymatter. It’s open source and runs on your own server so, you don’t have to rely other
servers or services, free, ad-supported or not. Definitely go check out this script.

Links count as endorsement in this section of the design essay.

Layout, Images, Colors and Stuff Like That

I ripped off the colors, images and typography from a FrontPage97 theme. The theme was called “Zero” and it was the only one in the lot that
struck me as interesting. I kind of liked the cyberpunk feel.

FrontPage implemented the theme with layout tables and other presentational markup. I just ripped the images out and implemented the layout entirely in CSS. My graphic arts skills aren’t the best but perhaps as time goes on I may change the look of this site. Luckily CSS allows me to quickly change everything if I ever need to.