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 set 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 improve upon them. My first attempt at preloading images without JavaScript may indeed be “pretty crappy,” […] Continue reading »

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 border that wraps […] Continue reading »

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 spacing via single blank space. Three key areas where single spacing is seen in this example: after […] Continue reading »

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 are plenty of hacks and workarounds designed to “fix” IE’s PNG image-display problem. Unfortunately, every currently available solution […] Continue reading »

Perishable Press HTAccess Spring Cleaning, Part 1

While developing the 3G Blacklist, I completely renovated the Perishable Press site-root and blog-root HTAccess files. Since the makeover, I have enjoyed better performance, fewer errors, and cleaner code. In this article, I share some of the changes made to the root HTAccess file and provide a brief explanation as to their intended purpose and potential benefit. In sharing this information, I hope to inspire others to improve their own HTAccess and/or configuration files. In the next article, I will […] Continue reading »

CSS Hackz Series: Minimum Width, Maximum Width for Internet Explorer 6

Opening the CSS Hackz series is the infamous CSS-expression hack for achieving minimum and maximum widths in Internet Explorer 6. Here is how to set the maximum width for IE 6: #target_element { width: expression((document.body.clientWidth > 778)? "777px" : "auto"); max-width: 777px; } Here is how to set the minimum width for IE 6: #target_element { width: expression((document.body.clientWidth < 335)? "333px" : "auto"); min-width: 333px; } Continue reading »

Obsessive CSS Code Formatting: Opening and Closing Brackets

Following my recent post on CSS code formatting, I was delightfully surprised to have received such insightful, enthusiastic feedback. Apparently, I am not the only person passionate about the subtle nuances involved with the formatting of CSS code. So, to continue the conversation, let’s explore several techniques for writing the opening and closing brackets of CSS declaration blocks. Continue reading »

Pure CSS: Better Image Preloading without JavaScript

After reading my previous article on preloading images without JavaScript1, Nanda pointed out that adding extra markup to preload images is not the best approach, especially where Web Standards are concerned. Mobile devices, for example, may experience problems when dealing with the following preloading technique: /* ADD THIS TO CSS */ div#preloaded-images { position: absolute; overflow: hidden; left: -9999px; top: -9999px; height: 1px; width: 1px; } <!– ADD THIS TO XHTML –> <div id="preloaded-images"> <img src="https://perishablepress.com/image-01.png" width="1" height="1" alt="Image 01" […] Continue reading »

Obsessive CSS Code Formatting: Patterns and Trends

Call me strange, but I format each of my CSS rules according to the following structure/pattern: div#example element { margin: 5px 15px 5px 0; border: 1px solid #444; line-height: 1.5em; text-align: center; background: #222; font-size: 10px; display: block; padding: 5px; color: #888; float: left; } div#another div.example element { border: 1px solid #444; margin: 7px 0 17px 0; letter-spacing: 1px; font-weight: bold; background: #222; font-size: 1.1em; cursor: pointer; display: block; padding: 3px; width: 308px; color: #888; clear: left; float: left; […] Continue reading »

WordPress Themes: Alphabet Series

Since the launch of Perishable Press way back in 2005, I’ve been working on a series of “alphabet themes”, where each new WordPress theme design is named with a different letter of the alphabet. This began in 2005 with the first alphabet theme, “A” for Apathy. Several months later, the next theme design was “B” for Bananaz. Then “C” for Casket, and so on and so forth. An entire set of 26 WordPress themes, one for each letter of the […] Continue reading »

More Killer CSS Resets

Just a note to let everyone know that I have updated my previous CSS reference article, A Killer Collection of Global CSS Reset Styles. The updated version features two more excellent CSS resets, as well as the updated Meyer reset and a link to Eric’s official CSS Reset page. The two new reset styles are the Tripoli Reset and Tantek’s Reset. Continue reading »

CSS/(X)HTML Tutorial: Hovering Accessibility Jump Menu

Recently, a reader named Don asked about this theme’s accessibility (accesskey) jump menu located at the top of each page. Several people have commented that they like the way the jump menu “lights up” upon gaining focus. Whenever a user hovers their cursor over the region at the top of the page, all links in the jump menu change to a more visible color. Then, as the cursor moves over the various menu items, each jump link is further highlighted […] Continue reading »

XHMTL/CSS Remix: Creative Commons License

[ Screenshot: Creative Commons Deed - Remixed ]

Not too long ago, I played with the idea of releasing article content under a Creative Commons (Attribution-NonCommercial-ShareAlike 2.0) License. At the time, I wanted to host my own copies of the two associated CC license pages. During the process of uploading the pages to my own server, several minor adjustments (regarding image paths, etc.) needed to be made to the source code. After tweaking a few things in the XHTML code, I began snooping around in the pages’ CSS […] Continue reading »

Perishable News: Site Upgrades, Upcoming Interview, and PageRank Update

Ever since writing that last review article, I have been feeling the need to cut loose, relax, and blog about something a little more “down-to-earth,” like recent things that have been happening around here. If you are new to Perishable Press, rest assured that I try to keep these “site/personal news” update posts down to a minimum. Whenever possible, I save up a bunch of interesting off-topic things that I want to talk about, and then cram them all together […] Continue reading »

Minimalist Web Design Showcase: ShaunInman.com

[ Screenshot: Shaun Inman's si10 Design for ShaunInman.com ]

“Exploring Minimalist Thought and Expression in Contemporary Web Design” Welcome to our ongoing series of articles exploring minimalism in modern web (and graphic) design. With this post, we continue our exploration of the Web’s most inspiring and intriguing minimalist presentations. Staying true to the spirit of minimalism, each showcase will be kept as clear and concise as possible, focusing on tangible and practical aspects of each featured site. We will discuss aesthetics and functionality on both sides of the browser, […] Continue reading »

Improve Site Performance by Increasing PHP Memory for WordPress

During the recent ASO server debacle, I raced frantically to restore functionality to Perishable Press. Along the way, one of the many tricks that I tried while trying to fix the dreaded “white screen of death” syndrome involved increasing the amount of PHP memory available to WordPress. This fix worked for me, but may not prove effective on every installation of WordPress. If you are unsure as to whether or not you need to increase your PHP memory, consult with […] Continue reading »

« Newer Posts • 1…67891011 • Previous Posts »