Articles tagged with “images

Perishable Press Quintessential Screenshot Gallery
One of my goals for the new Perishable Press redesign was to achieve cross-browser, pixel-perfect precision [ 1 ]. Of course, due to many variables (platform, operating system, browser, extensions, fonts, etc.), it is virtually impossible to achieve complete 100% perfection, but I am certainly interested in examining the design on as many different configurations as possible. Thus, last week after ...
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 ...
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 ...
Drop-Dead Easy Random Images via PHP
Recently, while restoring my collection of Perishable Press themes, I needed a fast, effective way to randomize a series of images. After playing around with several likely candidates, I finally devised the following drop-dead easy technique:...
Pure CSS: Better Image Preloading without JavaScript
After reading my previous article on preloading images without JavaScript 1, 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; ...
Fake Slifer Yu-Gi-Oh! Cards on Ebay
Believe it or not, one of my most popular posts here at Perishable Press is an article I wrote about a counterfeit Slifer Yu-Gi-Oh! card. Since its publication, I have received some very interesting information regarding the apparently extensive market for fake Yu-Gi-Oh! cards. Recently, reader Deana wrote to share her experience with an eBay purchase of a “very good counterfeit” Slifer card on eBay. As a savvy Yu-Gi-Oh! collector, Deana has purchased ...
Optimize WordPress: Pure Code Alternatives for 7 Unnecessary Plugins
In this article, my goal is to help you optimize WordPress by replacing a few common plugins with their correspondingly effective code equivalents. As we all know, WordPress can be a very resource-hungry piece of software, especially when running a million extraneous plugins. Often, many common plugins are designed to perform relatively simple tasks, such as redirect ...
Focus on the Details: Optimizing Images for Humans and Machines
In this article, I discuss how to get the most out of your site’s images by optimizing them for both people and search engines.. For many sites, images play an important role in the communication process. If used correctly, images have the power to make your articles come alive with clarity and vibrancy. Some visitors may merely notice the image and continue reading, while others will want to ...
88Teeth Site Redesign
[ Detail of 88teeth’s revamped “Manoid” ] Longtime friend and fellow-DLa member ThaneC recently has updated his personal/portfolio site, eightyeightteeth.com. ThaneC’s site has been completely redesigned and reorganized, featuring easy navigation and generous presentation of core content. Every page is overflowing with creative juice — thumbnail ...
Slideshow Code for Dead Letter Art
Pardon this post! I am posting this information online for personal references purposes. I may need to revisit this code at some point in the future, and if I post it here I will always know where to find it (trust me, it would disappear into the abyss if I tried storing it offline). So, although it is intended solely for myself, feel free to extract and use ...
CSS Throwdown: Preload Images without JavaScript
Clean, easy, effective. You don’t need no stinking JavaScript to preload your images. Nope. Try some tasty CSS and (X)HTML instead! Here’s how.. (only two steps!) Step 1 — Place this in your CSS file: div#preloaded-images { position: absolute; overflow: hidden; left: -9999px; top: -9999px; height: 1px; width: 1px; } Step 2 — Place this at the bottom ...
Allow Google Reader to Access Hotlink-Protected Images
[ google, reader, mobile, htaccess, allow, access, hotlink, protection, images, rewrite ] In our previous article, we explain the process of allowing Feedburner to access your hotlink-protected images. The article details the entire process, which covers the basics of hotlink protection and involves adding several lines of code to your htaccess file. In this article, we skip the detailed explanations and ...
Allow Feedburner Access to Hotlink-Protected Images
[ Keywords: feedburner, htaccess, allow, access, hotlink, protection, feed, images, rewrite ] Recently, we installed and configured the excellent WordPress Feedburner plugin by the venerable Steve Smith 1. The plugin basically redirects our various WordPress-powered content feeds to Feedburner, which then delivers them to subscribers. This method enables us to take advantage of Feedburner’s excellent statistical tools. Further, all of the action ...
Digging the Ditch Witch
[ Keywords: ditch, witch, chainsaw, trench, digger, warning, danger, sticker, decal, chunk ] Ditch Witch, I think I love you.. On my never-ending quest for fresh graphical chunks, many a ridiculous warning sticker have caught my eye. Upon encountering such gems, I immediately slip into stealth mode and plan for attack. Once the stage is set and the time is ...
Flash-Detection Triple-Threat
In our previous article, Alternate JavaScript Slideshow for SlideshowPro, we present an elaborate method for providing alternate content specifically for SlideshowPro. Although the method points toward a more generalized adaptation, its overall functional implementation remains focused on the presentation of slideshows. This article explores the generalization of the previously defined method for providing alternate JavaScript content when Flash support is not detected. Using skyzyx.com’s excellent Flash-detection script, ...
Alternate JavaScript Slideshow for SlideshowPro
For the unenlightened, SlideshowPro (SP) is a Flash-based slideshow-authoring system that delivers full-featured, high-end, Flash-based slideshows. Websites featuring SP slideshows present content in sophisticated fashion, inspiring users with elegant captions, beautiful transitions, and intuitive navigation. However, many visitors are unable to experience SP slideshows because they lack the requisite Flash support. SlideshowPro-based slideshows currently require Flash 7 or better to function. And, although Flash 7 is quite common, it is far from ubiquitous. In the ...
Dazzle, Marvel and Wonder
One of our favorite command-line screensavers, DAZZLE is a two-dimensional kaleidoscopic program featuring a timeless display of perpetually evolving psychedelic viewscapes. Users may interactively manipulate over thirty image-creation algorithms, or set the program to automatically generate hours of dynamically morphing displays of colorful patterns and geometrically complex graphics. ...the best kaleidoscope program we’ve seen yet. The beautiful use of colors, enhanced even further by the use of fading in and out, is, for want of a better ...
Feed your Image via Atom or RSS
This quick tutorial explains how to add images to both Atom and RSS feeds. Although both formats allow for image-inclusion, feed-reader support for image-display is currently quite limited. Hopefully, that will change in the near future.. Images for Atom Feeds Images included within Atom feeds must have a ratio of either 1:1 or 2:1. There are no other restrictions as to file type or size. Use the XML element for URL’s targeting 1:1 images. Otherwise, use the ...
Chunks 101: Introduction to Chunkology
We are continually on the prowl for fresh chunks -- whether it’s business or pleasure, day or night, scanning the immediate environment for tasty visual gems is a constant delight. Perhaps you find yourself lulling over tacky magazines at the dentist’s office, when suddenly -- out of the corner of your eye -- you notice it: a small triangular decal attached to the side of the waiting-room television warning people about something with an absolutely ridiculous icon ...
Counterfeit Slifer Yu-Gi-Oh Card
Recently, my son traded three common Yu-Gi-Oh cards for the coveted Slifer god card. He was very excited, thinking he worked the deal of a lifetime. Indeed, Slifer cards sell for around $35.00 apiece, depending on the dealer. Nonetheless, trading three worthless cards for a Slifer god card seemed like a phenomenal deal.. What we discovered next nearly dropped us to the floor -- the Slifer card was a counterfeit! Within moments of checking it out, Mom immediately ...
Preloading Images with CSS and JavaScript
Fast-loading pages reduce errors, conserve bandwidth, and please visitors. One way to decrease loading times and enhance performance involves maximizing image display efficiency. Your mantra for achieving image efficiency should be "reuse, optimize, and preload.". While each of these methods plays an important role, this article will focus on methods for preloading images. Consult your server error logs to identify web pages that may require image help. Note: preloading images does not reduce bandwidth! It only decreases ...
Folder Background Images in WinXP
This brief tutorial explains how to add a background image to any folder in Windows XP. First, make sure all hidden files are visible on your system. Then, open the folder for which you wish to add a background image. Within the folder, right-click and select Properties » Customize tab » Customize. There, choose any icon, click Apply and OK. That process should have created a "desktop.ini" file. Open that file with a text editor and add these lines ...
Press Color Archive
Our official location for dumping notable color swatches: | #1A1A1A | #383838 | #666677 | #E1E1E1 | #F0F0F0 | #F2F2F2 | #F3F3F3 | #FFFFEE | #CCDDAA
sIFR Notes Plus
Here are a few sIFR Notes for Perishable Press. Just what are we looking at here? Well, first it is important to understand the sIFR variables and the order in which they should appear: (sSelector, sFlashSrc, sColor, sLinkColor, sHoverColor, sBgColor, nPaddingTop, nPaddingRight, nPaddingBottom, nPaddingLeft, sFlashVars, sCase, sWmode) The variable, sFlashVars consists of the following sub-variables (these should be seperated with an & sign: # Align Flash text block textalign=center # Moves text any number of pixels to the right...
Lightbox Notes
To add Lightbox functionality to any single image: Add rel="lightbox" to the anchor tag. Add a title="" attribute to the anchor tag. Add an alt="" attribute to the image tag. To add Lightbox functionality to any series of images: Add rel="lightbox[value]" to the anchor tag of each image. Add a title="" attribute to the anchor tag of each image. Add an alt="" attribute to the image tag of each image. Any set of pictures with the same rel="lightbox[value]" will display with nav buttons.
Electric Sheep and the ASCII Matrix
Electric Sheep Paying homage to Philip K. Dick’s novel Do Androids Dream of Electric Sheep? via collective screensaver morphology: electricsheep.org. Plus, be sure to experience this moving ASCII rendition of the “bullet-dodging” scene from The Matrix: ASCII Matrix Scene.
Moses Lake Sunsets
One of the best things about living among the sand people.....

Contact Perishable Press

  • Contact Jeff via form

Search Perishable Press

About Perishable Press

Perishable Press is the virtual playground of Jeff Starr — visionary, founder and lead developer of Monzilla Media, a small web and graphic design company in the lush desert oasis of Moses Lake, Washington. Perishable Press features articles and tutorials on many aspects of digital design..

Read more..

Perishable on Twitter

automation is great: i've got photoshop batch processing 300+ images while FTP is simultaneously uploading them to the server..

Perishable on Tumblr

Tons of Firewalls

Tuesday, 7 October 2008, 1:45 am

Recently overheard on conservative talk radio (instructing listeners how to obtain a free promotional video from their new website):

“This website has tons and tons of firewalls, so you have to use your real email address to download the video..”

The Quiet Search Revolution

Monday, 6 October 2008, 12:15 pm

Just a thought.. As awesome as Google is these days, it would suck if they ended up owning the entire search-engine business. When they get to the point where all competition is impossible (due to their sheer size, financial resources, media influence, etc.), how many alternate search engines will have the resources for continuous improvement and top-quality search results? When this happens, we will have no choice but to do exactly what Google tells us to do.

As deeply ingrained as it is for everyone to instinctively and unthinkingly turn to Google for their search activity, it is time to leave a few alternate search tabs open for as much use as possible. Instead of using Google just because that’s what you always do, try your search on MSN, Yahoo, Ask, or any of the other independent search engines instead. Sharing traffic with other search engines is a nice, quiet way to keep the competitive spirit alive and well in the search-engine business.

Disappearing WordPress Posts

Wednesday, 1 October 2008, 7:50 pm

Today I experienced difficulties while trying to publish or even save new posts in WordPress. I would compose the post as usual, add all of the keywords, tags, meta tags, and so on, but as soon as I clicked the “Publish” or “Save” button, the post would just disappear from existence.

The weird thing is that during the drafting process, WordPress’ default auto-save feature showed that the post had been saved at expected intervals. Unfortunately, after trying to publish several different posts, WordPress showed absolutely no record of the posts ever being created. They simply vanished into thin air.

Fortunately, a little investigation revealed the culprit. If you should find yourself dealing with this same issue, here are some different things that you should try. First, re-upload fresh copies of your entire WordPress installation. I don’t know why exactly, but apparently various files can either go stale or completely disappear from the server. Overwriting or writing fresh files may do the trick.

If that doesn’t work, check your WordPress database for errors. In my case, a little investigation revealed that something had caused a couple of fatal errors in the wp_posts table. Fortunately, checking and repairing the table solved the issue.

Tumblr Battles

Wednesday, 1 October 2008, 5:30 pm

Please excuse the duplicate Tumbr posts.. seems there is no way to ping Tumblr to refresh/rebuild the RSS feed according to changes in post content. So, to resolve the issue I have discussed now like two or three times regarding paragraph elements and proper feed formatting, I have no choice but to repost a majority of my text posts.

This is necessary for the proper import and display of my Tumblr feed into WordPress. Currently, there are five items displayed at once, each styled according to proper inclusion of paragraph tags. Thus, whenever the Tumblr feed “forgets” to enclose single-paragraph posts with the proper tags, the result is an unstyled post entry displayed on my site.

Assuming that makes sense, you will please excuse my dust while I repost a few older entries in an attempt to reconstruct (the hard way) a properly formatted Tumblr feed.

More Optimization Measures

Wednesday, 1 October 2008, 5:27 pm

Another important step in improving the performance of my recent redesign involves the optimization of both CSS and JavaScript content. During development there were around 15 server requests for these two types of files, 10 JavaScript files and 5 CSS files. This was okay for my own use, but would not work for production purposes.

Optimizing these file types involves consolidation, compression, and caching. Consolidation of 10 JavaScript files into three is huge improvement. Now I deliver one JS file for the functionality of the site, one for Mint, and another for Analytics. Likewise for the stylesheets; after consolidation, a single stylesheet is delivered to all modern browsers. There are two additional stylesheets as well, but they are targeted at IE6 and mobile browsers and will not load elsewhere.

Once the files were consolidated as much as possible, it was time to optimize or “crunch” them. Using the sexy Flumpcakes CSS optimizer, I was able to reduce my stylesheets by around 25%. Likewise for JavaScript, I used xtreeme.com’s optimizer to shave an additional 20% off the size of my JS content.

Finally, once I had consolidated and compressed my JS and CSS files as much as possible, I wanted to further my optimization efforts by ensuring that these files were cached by the browser. By setting far-future Expires headers for everything but the statistical files, my site gains an additional performance boost by eliminating the need to reload preexisting content.

Read more on Tumblr..

Subscribe to Comments Recent Dialogue

  • Adam Singer: Thanks for this. You're right, if it isn't broken, don't fix it. I was about to update my permalinks and install a plugin to redire...
  • Marilyn: It looks great on my browser! I wish I had that much creativity in my head! It's gorgeous!...
  • Randy: "Too girly?" It looks like a great design. Define "too girly!"...
  • Christopher Ross: .htaccess based redirects are wonderful. I'm always baffled by web professionals who don't take the time to learn more about them....
  • federico: Hi Jeff... tnx so much...it worked perfectly... c u Federico...
  • Cooltad: The skin seems (mostly) fine in my expert opinion. Your one of the few people able to make a design with a transparent table and a b...
  • Neal: The free Intro to Linux book is a great place to start http://www.ischool.utexas.edu/mirrors/LDP/LDP/intro-linux/html/index.html ...
  • Louis: @Jeff: Your “Archives” page is slick, although I would expect a cleaner implementation from such a vehement advoc...
  • Jeremy: Well I think that you may be over-critical, I don't see a darn thing wrong with it - I like it a lot!...
  • Jeff Starr: Alright, this is exactly the kind of information I was hoping to get. Lots of great ideas and recommendations here. I will be reading...

Read more recent comments..

Subscribe to Content Recent Activity

Recent Articles

Popular Posts

Recent Updates

Random Articles

Explore the Archives..