Here is a list of all articles categorized as “Websites” In addition to these fine entries, be sure to check out our featured articles in the next column. If you enjoy the content, you may subscribe to our main content feed to stay current.

Unobtrusive JavaScript: Auto-Clear and Restore Multiple Form Inputs on Focus

In an effort to organize my pile of offline notes, I will be posting a number of quick, “to-the-point” tutorials on a number of useful topics. In this post, I share an excellent method for auto-clearing and restoring multiple form field inputs using a bit of unobtrusive JavaScript. This method was discovered at xy.wz.cz. There are two steps to this technique, which should take no longer than five minutes to implement. Step 1: Prepare the Form Begin ...

Use Your Browser to Edit Any Live Web Page Using a Single Line of JavaScript

This was just too juicy to pass up. Blogstorm recently blogged about an easy JavaScript technique for making any website editable. After checking it out for myself, I just had to share it here at Perishable Press. Here it is: javascript:document.body.contentEditable='true'; document.designMode='on'; void 0 Paste that single line of code into the address bar of any modern browser ...

CSS Hackz Series: Targeting and Filtering Internet Explorer 7

Continuing the CSS Hackz Series, I present a small army of hacks for targeting and filtering Internet Explorer 7! Here, “targeting” IE 7 means to deliver CSS and/or (X)HTML to IE 7 only, while “filtering” means to deliver CSS and/or (X)HTML to every browser that is not IE 7. In other words, ...

Provide a Link for Visitors to Verify Your Feedburner Subscriber Count

Recently, I received a bizarre email accusing me of calling someone out on their fake Feedburner subscriber count. Apparently, some desperate blogger had been claiming to have something like 30,000 Feedburner subscribers when in reality they only had around 700. From what I could tell, the fraudulent site was displaying a counterfeit Feedburner subscriber-count badge using some fancy CSS image-replacement or something. Whatever. I really could ...

Obsessive CSS Code Formatting: Organization, Comments, and Signatures

One of my favorite aspects of producing clean, well-formatted CSS code is “meta-organizing” the document using comments. In CSS, comments are included in the stylesheet like so: /* i am the walrus */ When used constructively, CSS comments serve to break down documents into distinct regions, provide key information about specific declarations, and bring order to even the most complex stylesheets. In my experience, a well-commented stylesheet improves efficiency and ...

CSS Hackz Series: Clearing Floats with the Clearfix Hack

I use the CSS clearfix hack on nearly all of my sites. The clearfix hack — also known as the “Easy Clearing Hack” — is used to clear floated divisions (divs) without using structural markup. It is very effective in resolving layout issues and browser inconsistencies without the need to mix structure with presentation. There are countless variations of the clearfix hack around the Web, and ...

Perishable Press HTAccess Spring Cleaning, Part 2

Before Summer arrives, I need to post the conclusion to my seasonal article, Perishable Press HTAccess Spring Cleaning, Part 1. As explained in the first post, I recently spent some time to consolidate and optimize the Perishable Press site-root and blog-root HTAccess files. Since the makeover, I have enjoyed better performance, fewer ...

Does Google Hate Web Standards?

Consider the Google home page — arguably the most popular, highly visited web page in the entire world. Such a simple page, right? You would think that such a simple design would fully embrace Web Standards. I mean, think about it for a moment.. How would you or I throw down a few lists, a search field, and a logo image? Something like this, maybe:...

A Way to Preload Images without JavaScript that is SO Much Better

Responding to my first attempt at preloading images without JavaScript, CSS-Guru David Bowman graces his audience with a most enlightening triage of comments. Apparently, the image-preloading technique explained in the article is “major overkill” and “totally ridiculous.” Of course, I will be the first to admit that I am no expert in CSS, but I do enjoy sharing my discoveries and watching as people ...

Quick Reminder About Downlevel-Revealed Conditional Comments..

NOTE: This entire article amounts to nothing more than an in-depth learning experience. After writing the article, I realized (painfully) that either format for the second iteration of the downlevel-revealed comment for XHTML is perfectly fine and displays no ill effects or unwanted characters in any browser. Thus, this article is essentially useless, but I am posting it anyway because I just hate deleting several hours of hard work.. As more and more people ...

How to Cache Mint JavaScript

NOTE: This post was written many months ago under the erroneous assumption that caching Mint’s JavaScript was a good idea (for Y-Slow compliance, performance, et al); however, after a brief chat with the man himself, Shaun Inman, I was quickly informed that this was a bad idea: caching Mint JavaScript files will cause Mint to stop functioning. But, for what it’s worth, and for the sake of retaining potentially useful information, ...

Sharpen Your Site by Removing Unwanted Link Border Outlines

Lately I have noticed several sites that display those unsightly dotted outlines on high-profile link elements. Typically, these link outlines plague various header elements such as banner images, navigational links, and other key features. This behavior frequently haunts highly graphical site designs and is often associated with various image replacement methods that position the original anchor text offscreen, generally far beyond the left edge of the browser window. When visible, such presentations display a ghastly, four-sided dotted ...

Unexplained Crawl Behavior Involving Tagged Query Strings

I need your help! I am losing my mind trying to solve another baffling mystery. For the past three or four months, I have been recording many 404 Errors generated from msnbot, Yahoo-Slurp, and other spider crawls. These errors result from invalid requests for URLs containing query strings such as the following: http://perishablepress.com/press/page/2/?tag=spam http://perishablepress.com/press/page/3/?tag=code http://perishablepress.com/press/page/2/?tag=email http://perishablepress.com/press/page/2/?tag=xhtml http://perishablepress.com/press/page/4/?tag=notes http://perishablepress.com/press/page/2/?tag=flash http://perishablepress.com/press/page/2/?tag=links http://perishablepress.com/press/page/3/?tag=theme http://perishablepress.com/press/page/2/?tag=press ..plus hundreds and hundreds ...

Taking Advantage of the X-Robots Tag

Controlling the spidering, indexing and caching of your (X)HTML-based web pages is possible with meta robots directives such as these: I use these directives here at Perishable Press and they continue to serve me well for controlling how the “big bots” 1 crawl and represent my (X)HTML-based content in search results. For other, non-(X)HTML ...

Obsessive CSS Code Formatting: Indentation and Spacing

In the intriguing discussion following the first obsessive CSS formatting article, Jordan Gray brought up the age-old question regarding spacing: tabs or single spaces? I smugly responded that the issue has long-since been resolved, with tabbed spacing as the obvious winner. Let’s take a look at some serious CSS spacing examples.. 1) Strictly Single Spacing Here we have several code blocks showing consistent ...

Blacklist Candidate Number 2008-05-31

Welcome to the Perishable Press “Blacklist Candidate” series. In this post, we continue our new tradition of exposing, humiliating and banishing spammers, crackers and other worthless scumbags.. Just under the wire! Even so, this month’s official Blacklist-Candidate article may be the last monthly installment of the series. Although additional BC articles may ...

CSS Hackz Series: PNG Fix for Internet Explorer

In this CSS Hackz Series article, I outline several solutions for displaying alpha-transparent PNG (a.k.a. PNG-24 format) images in everybody’s favorite broken browser, Internet Explorer. Specifically, IE versions through 6 (excluding IE 5 for Mac) fail to support alpha-channel transparency for PNG images. In these versions of IE, every pixel containing alpha-transparency is displayed with an ugly, flat gray color. Fortunately, there ...

« Older results • Newer results »