Collapsed Recent Entries

As I watched Josh scroll uselessly up and down trying to find a recent post on my blog I realized that my Blogger archives were for crap. My blog had way too many entries on the page, and the only reason was that once they hit the archives they are pretty much lost for good (except for google). I'm still too cheap to pay more than my $6 a month for hosting, so I had to find my solutions on the front end. Scroll down to see what I came up with.

One known outstanding bug, after you expand a post the permanent link continues to return false in Moz. The problem is in the showPost() function (javascript is in the page for now if you want to take a look), where a.onclick = function() { return true; } isn't clobbering the old event as it is in IE. I'm sure there are more problems, both technical and with the user experience, so feel free to point them out via my (lack of) contact form. D'oh! There's another side project I've yet to complete.

FYI for anyone who read my near-incoherent post about "flexible node retrieval" - I ended up using Andy's getElementsByClassName() to grab all the "permlinks" and turn them into "expand" links, and get a starting place from which to traverse the DOM and hide the post bodies.

Firebird 0.8 - Positive Reasons to Switch

Mozilla Firebird 0.8 is coming out soon. Getting one step closer to leaving beta with 1.0. I've been doing some thinking about how to persuade people to switch to Firebird. It is easy to say, "you should use Firebird because Microsoft is an evil corporation and it is dangerous for novice users to use Internet Explorer because security holes are ignored until they get publicity, and then they over-react in a stupid manner." But that kind of scare tactic isn't what my parents would want to hear. Change is difficult, especially for novice users who are at the most risk when using Internet Explorer. For example, my mom is still running Windows ME, a bloated piece of crap tacked onto Windows 98 and even more unstable. But has she asked my stepfather to upgrade her to win2k, or even his stable copy of win98? Nope.

So here are my thoughts thus far about positive reasons to get novice computer users to switch.

1. You can increase the text size of any website.
2. The download is only 6mb, but even then I'm going to mail out CD-ROMs when it hits 1.0. Modems are slow in Maine.
3. Tabbed browsing is a powerful tool for surfing over a slow connection. You can Ctrl + click on a link and let it load in the background while reading the current page.
4. Popup ads are blocked, but not popup windows that are functional parts of a website.
5. There are accessibility features like Type-Ahead Find that allows you to follow links without a mouse.
6. The Google toolbar lets you search the web, as well as images, news, the current site, and even your local college libraries.

The browser wars have reached a new era. Now it is time for web developers to make their move and convert everyone they know so that the web remains an open environment and doesn't become a proprietary tool of the evil empire.

Sushi Race

This is what flash is for. Not websites, but foolish little games.

Sneakers

Two men are hiking in the mountains. One suddenly stops, removes his hiking boots, and starts putting on sneakers. The other asks why he is doing that.

The first man answers, "I thought I saw a cougar stalking us."

The second argues, "You can't outrun a mountain lion, not even with sneakers."

The first responds, "I don't need to outrun the lion, I just need to outrun you."

It is reassuring that, when it comes down to important things like death to fetuses, finances and oral sex, Cybil and I see eye to eye. Sparked by an old friend's Livejournal we had both been researching and thinking about Peak Oil independently for about a week. Last night when we talked about it, and here is where the joke comes in, we both agreed that we would be the ones wearing sneakers should civilization as we know it come to an end.

SEO

I read this article about search engine optimization wherein it was recommended to, if one must use query strings to generate pages, use & rather than just & in the hrefs so that robots don't choke on the links.

I know, I know, use .htaccess to make user friendly URLs. Bah. I'll get to it eventually. There's a server move happening before that.

Update: looks like I read that ampersand thing somewhere else, here's the article I was thinking of:
Scribbling.net - Help the Googlebot understand your web site

Primitive Hunting Device

ät-lätl

A throwing device usually consisting of a stick fitted with a thong or socket to steady the butt of a spear or dart and extend the length it travels.

Update: A word of explanation is in order here. An atlatl is a primitive hunting device that some historians believe was used by early man to hunt the woolly mammoth into extinction. They basically function as an arm extension to increase throwing power. We built them in SIN (scholars in nature) after school at Hebron Academy and would use them to launch spears across the street while standing in front of the post office, or for target practice at snow banks or bales of hay.

Flexible Node Retrieval

I so didn't know enough about DOM scripting when I first read about gazingus' Flexible Node Retrieval to have any clue what he was talking about, or why it might be so useful. This post is just to say now I do, and a reminder to myself to read Andy, Simon, and Liorean's posts on the topic. So far I've only had need of jon's "getParentByTagName()" function, but I'm sure I'll need one of this at some point.

Rapid Production with Web Standards

Next week is going to be a test of using web standards to rapidly produce a website in a drastically different manner than traditional web design practices. Here's the situation. I have the basic information design, information architecture, the target audience and even the copy (in Dutch, to be translated into French for the bi-lingual site). What I don't have is the art from the print marketing campaign that will be driving traffic to the site. So, given the order in which I have received the materials and the impossible deadline (they won't even have the domain name in time), I have been left no choice but to use a web standards based method of production:

1. HTML production, build all the pages in symantic HTML with minimal div's and id's. Link them to empty stylesheets and javascript files.
2. Build forms and send them the back end programmer.
3. Let copy editors and legal review do their thing.

The following can now be in parallel with steps 2 and 3:

4. Build the basic layout stylesheet before above mentioned people completely freak out.
5. Code the DOM scripted expanding/collapsing navigation.
6. Now, finally open Photoshop/Fireworks and call in the other front end guy to help design the site and logo based on the print design that has hopefully arrived by mid-week (it was due Friday last).
7. Use CSS to integrate the new logo and graphical design of the site.

BioSurgery Site Launch

At my day job we just launched a web standards based site:

http://www.advancingbiosurgery.com/

Only the "U.S.A." site is up, Canada will be moving over to the new template next, followed by Europe.

Interesting story about how I got the content manager to learn HTML. When the designer handed over the photoshop comps he had a list of points he wanted me to keep in mind, one of which was preserving his typography and color themes in the 3 different product templates. I addressed each of his points, but when it came to the typography I said that I would write the most forceful stylesheet possible, but in the end the quality of the typography would come down to the quality of the HTML, and whether or not it was hand-coded.

Some side notes at this point. My team is in Los Angeles, while the content manager and designer are in another branch of the company up in San Francisco. The site is run on this clunky system called TeamSite which thankfully allows you to switch off the WYSIWYG and type in your own HTML.

Later in the production process the content manager got her TeamSite training. They told her, "just copy and paste your content from MS Word into our WYSIWYG." She talked to the designer who insisted that she call me because I had mentioned something about the typography being dependant on how TeamSite was used. I was thrilled when I got the call and learned that the designer of all people had made my argument for web standards, without even knowing what they are himself.

Now I'm hoping my new friend the american content manager succeeds in persuading her canadian counterpart to properly format their html. Save the worrying about Europe for later.

Inaccessibility Illegal in UK

Website owners face prosecution. No, this is a good thing. If only it were happening in the states. You would think that sue happy Americans would have jumped on this bandwagon and made laws allowing them to force big companies to hire me. There are laws for sites with governmental funding, but I want the corporate bucks.

faux hardwood floor & my knives in the kitchen

Hardwood Floor? The X-Files standee took the place of this armoire that I had a crazy scheme of turning into a patch of fake hardwood floor for the living room. Not going to make Good Housekeeping any day soon but the cats love sliding about, and when I walk around the house with the lights off or close my eyes I can dream of one day having a nice place with real hardwood floors.

Kitchen Knives? The Cutco knives are away being sharpened so a number of my blades have made their way into the kitchen. Let me introduce you. Starting on the left we have my Leatherman Wave. It's the only multi-tool with blades that open one-handed. I will not own a knife that requires two hands to open (yes, I have more that I'm not going to show here). Next we have your classic Buck sheath knife, a la Scream. Nothing special, but solidly constructed. Then we have my precious, a wide bladed whittling knife of Swedish stainless steal. I've wrapped the handle in a piece of suede. The blade is so sharp it ate several sheaths before I made it's current one. Next is another Swedish blade, a hunting knife with a reindeer antler handle. It's a nice solid blade, weighted perfectly for throwing. Last, but not least, the Kukri. Give me this blade and a single match (these days probably two) and I can start a fire. It works as a hatchet, can be used to contact split, and even functions as a draw knife to make shavings for tinder.

Handling Low-Res Images

This post has been pulled forwards in time because there was a CSS problem, or at least IE thinks there was, causing all floats to disappear within my div#content. The problem has been resolved, so here it is for those of you surfing with your testing browser (don't tell me you haven't got a real browser yet, or have you not heard of this Internet Explorer bug which they still haven't fixed?). Tangent aside, here's that advice again along with a demo.

New Plants Suggestions for Doug. Size the photographs from your camera phone closer to the size that they appear on the phone (1/4 current size). The jpeg artifacts will be less exaggerated so they'll look like web optimized images rather than just low quality. At that size they could be floated in with the text as shown here. Use margins around them because IE5.5 doesn't support padding on images. For an in depth discussion of the proper markup for floating images with captions visit Dan Cederholm's most recent SimpleQuiz. Here's my take:

<a class="thumbnail" href="plants.jpg">
   <img src="plants_thumb.jpg" />
   New Plants
</a>

My CSS behind this is pretty lame, figure it out yourself. Can't do worse than the kludgey stuff I came up with.

the behavior layer

PPK writes another excellent article about the much maligned third aspect of a web-based front end, JavaScript: Digital Web Magazine - Keep It Simple: The Behavior Layer. It's a purely theoretical piece, no sample code, but worth a read to make sure we're all thinking about these important issues.

IE overflow: visible Bug Workaround

So the only overflow value that internet explorer failed to implement is visible (see QuirksMode). But default is visible and that works according to PPK, right? Yeah, right if you're talking about text overflowing vertically, but wrong if you want an image to overflow horizontally into the margins.

<!-- 300px wide div -->

<!-- 300px wide div -->

<p style="position: relative; height: 91px;">
   <img style="position: absolute;" src="/photos/kukri.jpg" width="422" height="91" />
</p>

It's a total hack. You take the image out of the flow by setting it to position: absolute; (within the relatively positioned paragraph, see Douglas Bowman's Making the Absolute, Relative) and then make room in the flow by specifying a height for the paragraph. Although it does involve some inline markup it's actually fairly sustainable. On a site I'm doing at work I have a project manager writing HTML, whenever she has an image that could be too wide she gives the paragraph a class="wideimage" and specifies the height.

norm.org

Why does a society obsessed with personal hygene mutilate male babies when the only reason for such a willful disfigurement of children too young to defend themselves would be living in a desert climate where water is so scare that nobody ever bathes? At least somebody is doing something about it. But what am I complaining about, I had hippy parents.

Madonna

Photos from Madonna's controversial 1992-book 'SEX' by Steven Meisel. Catch this one before it gets blocked by WebSense. You know, I'd never surf porn at work if it weren't censored, but since it is I seek it out.

Definition of QA

QA

Quality Assurance

Fake Data Entry

<dl>
   <dt>QA</dt>
   <dd>Quality Assurance</dd>
   <dd>Fake Data Entry</dd>
</dl>

street address

The street address of one of the authors we review on Rakehell is "North End Cottage". How fucking cool is that? Of course she doesn't live in the states, which automaticall bumps up the coolness factor.

91.5 k u s c

A record 45 minute commute home today. Not driving too fast, just fast lane fast, with 2 or 3 choice lane changes. Have decided that I really like Renaissance music. Probably because of Northfield who I've listened to since shortly after I was born. Classical 91.5 fm KUSC has become my radio station of choice for the drive, only place I've been listening to music these days. Interferes with eavesdropping.

plants

We got some plants today. I was sorely tempted to get a set of cacti to protect the plants from the cats. Milton has already eaten and promptly thrown-up one palm leaf. It's not poisonous but not yummy either. Hopefully he'll learn.

sun fight

There is nothing more fun than fighting for that patch of sun.

photos

X-Files Standee

7 feet of pure insanity in our living room.

"You've got to be fucking kidding me"

Says the Milton.

Hangin' with Fritz

On the futon. Fritz is actually a monkey. Or a ferret. We're not sure which. Sometimes he lies with his neck stretched out and his chin on the ground and looks like a dragon.

Sane CSS Font Sizing

I've been meaning to do something with the text sizing on this and my professional site. Right now I'm just using straight up .8em's and saying "screw you" to IE users with their fonts set to "smaller" (they're mostly windows IT people holed up in a basement office hunched too close to their monitors in the dark, so fuck them, right?). But every hack I've seen has been just that, a hack. Now I've just read Owen Briggs' Sane CSS Sizes and I think it may be the solution I've been looking for. It doesn't require writing different code for different browsers, it just asks that you size text using em units, but begin from a more reasonable base size than the 16px default by specifying the body font-size in percents. Nobody knows why it works, but if there's anyone that can say it does work it's Owen with his 264 (plus) screenshots

css graphs

While I would heartily agree that these css graphs are much cooler looking that my JS-generated CSS BarGraphs, I would have to say that my graphs have a more solid semantic base (a table), whereas those graphs are just a bunch of nested divs.

bush videos

This summary is not available. Please click here to view the post.

strange case of the hanover high shocker

Ahhh, wasn't high school grande? Check out This story, perfect match for my new aim icon.

xhtml friends network

Now that people I know in person actually have their own websites, here's a reminder to add a little XFN to my links.

icon sex

AIM icons meet Kama Sutra. Most Excellent.

douglasgorman.com

Mr. Gorman has decided to stop working on a design for his site and just go with what he initially put together. Actually, when you think about it that's a great way to go about making a personal site. There's no point in building this big fancy framework with nothing to fill it. Since he's using XHTML + CSS he can just work on the meat of the site, the content, and tweak the design later with the style sheet. Here's my guess for his first CSS tweak:

body {
background: no-repeat fixed bottom right url(/images/photograph_bender.png);
}

cat photos

Some vacation photos of the cats. In the first picture they were really excited about the christmas tree and eager to help put the stand together. In the second I caught Fritz doing his cute stretching one arm while napping thing. He always senses the camera and looks up.

• christmas2003.jpg (29K)
• caughtstretching.jpg (28K)