psst.. this blog is on hiatus.

Solution to slow-opening PDFs and Adobe Acrobat crashing your browser

Via Anil Dash, the solution to a long-standing annoyance of mine. Adobe is in a tight race with Microsoft for feature bloat, as evidenced by the ridiculous start-up time of Adobe Reader. Add to that the fact that viewing PDFs in your browser crashes the damn thing about 50% of the time, and basically I want to urinate on the entire PDF standard. But on to the solution:

  1. If you have Adobe Reader 6, upgrade to 7. It’s actually less bloated.
  2. Use Adobe Reader SpeedUp to disable all of the useless plugins that Adobe Reader loads on startup.
  3. Disable Adobe Reader from displaying PDFs in your browser. You know it’s just asking for trouble. In Adobe Reader 7, go to Edit > Preferences, select Internet, and uncheck the box for “Display PDF in browser.”

Sick of referrer spam

I’m sick of seeing my nice web stats polluted by referrer (referer) spam. Some clown at gb.com decided to go nuts with spamming my site, so via a quick Google to this site, I set up this mod_rewrite rule in my .htaccess file to blow up the spammers.

RewriteEngine On
RewriteCond %{HTTP_REFERER} gb\.com [NC]
RewriteRule \.*$ - [F,L]

UPDATE 1/9/04: ILoveJackDaniels.com has an excellent page on combatting referrer spam.

UPDATE 1/25/04: Fighting spam with .htaccess is an unwinnable battle, but if you’re committed to it, I suggest adding this rule to block .info and .biz domains that contain hyphens:

RewriteCond %{HTTP_REFERER} [a-z]+\-[a-z]+\.(biz|info) [NC]

It’s also a good idea to block domains that go nuts with hyphens in the subdomain and domain, since these are almost always the spawn of spammers. I suppose you could catch a false positive here, but it’s unlikely.

RewriteCond %{HTTP_REFERER} [a-z]+\-[a-z]+\-[-a-z]+\.[-a-z]+\.(com|net|org|biz|info) [NC,OR]
RewriteCond %{HTTP_REFERER} [a-z]+\-[-a-z]+\.[a-z]+\-[-a-z]+\.(com|net|org|biz|info) [NC]

Really, though, you should check out my far more informative proposal to combat referrer spam.

Adding context to in-page links using CSS3’s :target pseudo-class

Here’s a less-than-stellar usability situation that’s plagued the WWW for years.

A reference manual or guide is published on the Web as a single HTML page. It’s a large page, many screens long, with a table of contents and in-page anchor links that take you to points in the page (perhaps even “chapters”). Maybe the page is littered with “return to top” links. In any case, all of the navigation is contained within the single page.

It’s entirely appropriate to publish this manual as one document, but now you want to send your friend a link to Chapter 3, Section 1 to answer his question. That will take him to the middle of this long, long page. That’s efficient, yes, in that it will take your friend right where he needs to go on the page. But it’s also potentially confusing; he clicks on the link and wonders, “What page is this? Where am I? What manual is this? Who published this?”

Solving the “In-page anchor problem” with CSS

Now I’ve come across a handy CSS trick to solve this problem. It’s been in the back of my mind for years, so it gives me a special satisfaction to explain it.
(more…)

Hyperlinking best practices, pt. 2: Distinguishing external links with CSS3 and regular expressions

In part 1 of this three-part “Hyperlinking best practices” blogging miniseries, I talked about the most effective way to visually present hyperlinks. Now, in part two, I’ll describe how to visually convey to users whether a link is external to a website (that is, it is not located on the same domain) or internal (part of the same site).

Background: Why does it matter whether a link is “external” or “internal?”

If you’re on a website and you’re reading stuff on it, you probably want to be there. You might want to know that by clicking a link, you’d leave that site and visit another website, where the quality of the content would be unknown. Perhaps you’d be more willing to follow a internal link, thinking, “I like this site!” and less willing to follow an external link, thinking, “That’s probably a porn site with popups!” This is the premise behind distinguishing external, offsite links from internal links. Supplying users with this contextual information helps them make decisions about whether it’s worthwhile to click a link. One way to convey this information visually is with CSS3’s attribute selectors.

(more…)

Hyperlinking best practices, pt. 1: Visual presentation of links

I’ve struggled for a long time with how to best visually represent links on a Web page. (Yes, I know; I’m saddled with the weighty matters of the world.) Anyway, I’ve been turning it over in my mind for a while, and I finally put thought to action yesterday and implemented some hyperlinking best practices here on underscorebleach.net.

I figured I’d save you the trouble of contemplating the intracacies of hyperlinking usability and instead do a big write-up. So here’s a three-part series, with the next two parts soon-to-come.

  1. Visual presentation of hyperlinks (this entry)
  2. Distinguishing internal links from external, offsite links
  3. “Branding” links to particular areas of your site (to be added later.. maybe)

(more…)

Quasi-frames with CSS: A layout with a different flavor

Many moons ago, when I was but a lad of 14, I was mesmerized as a classmate told me of new technology hitting the World Wide Web: frames. To say the least I was impressed. This frames stuff was hot. (Incidentally, that classmate was the son of Larry Smarr, former director of NCSA.)

But we users of Netscape 2.0 were young and naïve. Now we know better; frames suck(ed), for a variety of reasons. But frames were still useful, particularly in the way they presented content. The navigation was clear; the header was clear; the content was clear. As the user moved from page to page, much of the content remained static, imparting a feeling of security. Today, with the almost total depature of frames, the security blanket of frames has been lost.

Recovering the “security blanket”—with CSS

Today, I drew up a quick CSS layout for a coworker. It forced me to get back to the basics with CSS layouts, and I remembered a time a few years ago when I tried with limited success to use the position:fixed CSS property in a previous design. But as I composed this simple layout—header, nav, content area, and footer—I thought back to the position:fixed experiment. Maybe there was something useful there, after all. And maybe, a few years later and with a few more Web standards, well, standard, I could make it work.

So I mocked it up, real-simple like, and here ’tis:

Quasi-frames with CSS
(View source for HTML and CSS)

(more…)

Preventing image hotlinking: An improved tutorial

A few months ago, I wrote up a little tutorial on stopping hotlinking (or hot-linking, also known as bandwidth theft) called Selective hotlinking prevention through .htaccess”>”Selective hotlinking prevention through .htaccess.” The idea was simple: prevent random users from stealing bandwidth while allowing defined directories to be hotlinked, e.g. for posting images on a message board. The technique described in the previous entry is still valid, but I’d like to describe an improved and more efficient approach to hotlinking prevention.

(more…)