Jasongraphix » Site

Pink for October

Jason Beaird — Thu, 08 Oct 2009 02:11:30 +0000

Yes, I know. We’re a good way into the month already, but I wanted to show my support for National Breast Cancer awareness month by going Pink for October. I’ll probably put a link in here soon to switch back to the trusty blue theme. For the mean time though, you all must bask in the pinky pinkness that is currently jasongraphix.com.

Finding Broken Links

Jason Beaird — Mon, 27 Jul 2009 02:00:12 +0000

Last week I asked this question on Twitter:

“Dear #lazyweb: What does everyone use for site-wide scans for broken links?”

I was curious because we have a couple ginormous sites we’ve created recently at work that we wanted to scan. I got back a couple recommendations for the Mac app, Integrity and one for Xenu Link Sleuth, the PC app that the Integrity creator lists as their inspiration. Case closed. Lazyweb wins again, right? Well, the next day, I got another reply:

You might want to try Linkpatch for catching broken links on your site, much better than 1-time crawl- http://linkpatch.com
- @brightwurks

Linkpatch is a subscription-based web service that monitors your site’s 404 page and sends an email report each time someone lands there. While I can still see the usefulness of site-wide scanning applications like the two listed above for finding broken outgoing links, Linkpatch seemed like a great concept for keeping up with broken, moved, or mistyped incoming links. They have a free account option for monitoring a single site, so I decided to give it a try.

Setting up Linkpatch was dead simple. I just created an account and pasted a unique JavaScript tracking script into my 404 template. A few hours later, I got my first 404 report. According to the email, someone was trying to get to http://jasongraphix.com/archive/images/oreo4.jpg, an image URL from before I redesigned the site in February. I made sure to create permanent redirect records in my .htaccess file for all my old blog posts, but never did anything about directly linked images. All of my blog images have moved from /archive/images to /static/uploads, so adding one line to my .htaccess file fixed a problem I didn’t even know existed.

RedirectMatch permanent ^/archive/images/(.*) /static/uploads/$1

Sure, if I had been paying more attention to my stats, I might have known about the broken image links, but getting an email report (seen on the right here) made it much more obvious.
Thanks, @brightwurks!

Version Six

Jason Beaird — Wed, 11 Feb 2009 05:04:19 +0000

There was a time long ago ~~in a galaxy far, far away~~ when I was very proud of my strange and quirky personal space on the web. It was a testing ground for new techniques, a sandbox for experimental ideas, and most importantly, it was my own. I didn’t really care what anybody else thought about what I was doing, I just wanted a place to do my thing. When I wrote, I did so primarily for my own recollection. When I made changes to the back-end structure of my site, it was mainly to teach myself new tricks.

This sense of exploration came partially from my own fascination with the Web itself, but it was also inspired by the work of the many web designers I followed. I loved to design, I loved seeing what other people were designing and I loved tinkering with HTML and CSS. It wasn’t long before I turned my focus outwards. I still posted random personal things from time to time, but I started trying to write about topics that would benefit the community that I had learned so much from. This quote from Curt Cloninger’s 2001 book: Fresh Styles for Web Designers really summarizes the aspirations I had for my site at that time.

“When they’re not working on their day jobs, most top-notch web designers are pushing the web design envelope after-hours or on their own personal sites -manipulating current technologies and expanding the medium’s design vocabulary.” – Curt Cloninger

I really felt, for a while, that I was living that quote. My site always reflected my current design ideals and even though I still posted goofy content, it was always fresh. It was that period in the life of this site that led to feature articles, a successful book, and many other awesome opportunities. Somehow, somewhere along the way though I neglected the very sense of exploration that afforded me all those opportunities.

After nearly 3½ years with the same design, I’m proud to finally be releasing version six of jasongraphix.com. I’ll post more in the coming weeks about the redesign process, but for now I’m just eager to get it out here. I also want to give credit to Kyle Neath for the Hemingway WordPress theme that served as the structural foundation for my redesign, Nathan Smith for the 960 Grid System sketch sheets and Photoshop templates that helped me get things started, and all the other web designers out there who keep this industry from getting boring.

Burninating my Feed

Jason Beaird — Wed, 10 Dec 2008 14:53:56 +0000

Just a quick post to let you all know I’ve moved my RSS feed to Feedburner. Please take a moment to swap out the URL in your reader with http://feeds.feedburner.com/jasongraphix

If you don’t do this, you will always get to see this lovely post as my latest. That is, until the old feed URLs don’t exist anymore. Why wouldn’t they exist anymore? Wouldn’t you like to know? Actually, I’m quite proud to announce that I’ve started on a major redesign ofthis site. At the same time, I’m a little leery about admitting that fact as I have no idea how long it will take. It might be January, or it might be the Spring, or it might even be when Expression Engine 2.0 is publicly released – who knows? All I can say is that “I’m working on it!”. So re-subscribe to the new feed address, have a cup of hot cocoa and enjoy the holiday season.

Dreamhost Decennial

Jason Beaird — Thu, 01 Nov 2007 00:12:50 +0000

They’re is doing it again! To celebrate their 10 year anniversary, Dreamhost set up a coupon code to save $110.10 off their standard $119.40 yearly rate, which gets you a full year of hosting for less than ten bucks.

I first signed up with them back in July of 2005 when they were running a similar deal, and I am more than satisfied with the service I’ve received since then. While they have had a few problems over the last several years, you can’t find a better bargain for the price. When a deal like this comes along though, it gives the old “you get what you pay for” idiom whole new meaning.

Dreamhost used to have a set of 4 tiered plans for different levels of hosting, but now they just have one massive standard plan which includes:

500GB of Disk Space (Increasing weekly by 2GB)
5TB of Bandwidth (Increasing weekly by 40GB)
1 Free Domain Registration
Ability to host unlimited domains/subdomains
Unlimited Emails, MySQL Databases, and FTP/Shell Users.
One-Click Installer for: WordPress, phpBB, ZenCart, Joomla, and more.
Ruby on Rails support
…and a whole lot more

Even if you are happy with your current hosting plan and have no plans of migrating to a new host, the free domain registration alone makes this deal worthwhile.

Go to Dreamhost and click on the lemony, web 2.0 “Sign Up NOW!” starburst
Select “Pay Yearly @ $9.95/mo: 9% off + no setup = $119.40“
Choose your domain name and enter your personal info
Enter “101010” in the Promo Code box
Checkout for only $9.30!

Enjoy!

CMS Indecision

Jason Beaird — Wed, 16 May 2007 21:13:07 +0000

Once upon a time, long, long ago, this blog operated on a simple CMS that I built with PHP and MySQL. That system, with all of it’s wondrous bugs, lasted approximately 10 months before I crumpled it up and started over with Movable Type and valid XHTML. Long before I started connecting the wires though, I wrote this classic post about why I was choosing Movable Type over WordPress. It’s funny reading things that I wrote from that long ago. So much has changed. Since then, I’ve built several sites (both client work and personal) using each of these systems, and I actually prefer WordPress much more now. In fact, I’ve already started monkeying around on a subdomain trying to make sure I could migrate this site over when I get around to redesigning. And you know what? It would work great! WordPress does a fantastic job of importing Movable Type posts and with one simple .htaccess file I can permanently redirect all my URLs over to use much nicer ones. The admin is more intuitive, the documentation is through, and you can find plugins for anything you’d ever dream of doing. So why would I go with anything else? Well, I have two contenders in mind that I haven’t really given enough thought to: Textpattern and Expression Engine.

I haven’t really messed with any of the other CMS options as I figured I would just go with what I know. If I always did that though, I’d never learn anything new.

Malarkey – May 11th – http://www.stuffandnonsense.co.uk/malarkey/more/hello/ (ee)
D. Keith Robinson – May 7th – http://www.dkeithrobinson.com/entry/may_7th_reboot/ (ee)
Bartelme – March 25th – http://www.bartelme.at/journal/archiverealign_redesign/ (ee)
Snook – May 6th – http://snook.ca/archives/design/v8_supercharger/ (CakePHP – custom)

Freshly Minted with Pathstats

Jason Beaird — Wed, 02 Aug 2006 17:58:29 +0000

After putting it off for a long while now, I finally upgraded to version 1.29 of Mint. Initially I planned to upgrade, but instead I decided to drop the MySQL tables and start from scratch, installing only peppers (Mint plugins) that I intend to use.

As I was cruising through the latest peppers at Peppermint Tea, I came across a post that the author of the Pathstats Pepper was giving away 250 copies of it for free on his 25th birthday. His birthday was on July 19th and as of the 26th, he had only given away 165, so I went ahead and snagged my free copy. Even though he normally only charges $3.80 (the price of a Marble Mocha Macchiato at Starbucks), I probably would not have payed to give the plugin a shot. After toying around with it for the last few minutes though, I’m starting to feel the love. Here’s what the Pathstats panel looked like after a few minutes online:

As you can see, 6 of the 7 visitors shown were “one hit wonders”. They came, they saw, they left. That’s usually the way most search engine visitors behave, which is why I advocate conditional advertising targeted at these types of visitors. If they do happen to wander on to another page of my site, the ads are turned off because the PHP that tells the site whether or not to show ads is based on the referring URL. There is one visitor however who saw more than one page of my site before leaving. Oddly enough, that person came from a query at MSN for “removing popcorn ceilings” and then they browsed around for over 6 minutes. To see the navigation path of any of the users within Pathstats, all you have to do is click on a row to expand it. If you click on the image above, you can see the expanded view of my amazing 6 minute visitor. I can see this little pepper being a handy tool for analyzing site traffic. Sure, Google Analytics can do that, but it’s so bulky and saturated with unnecessary features. That’s why Mint is still my most used method of website stat tracking.

Conditional Advertising

Jason Beaird — Wed, 19 Apr 2006 14:59:24 +0000

I have entered the dark side. I now serve Google Adsense ads on my site. :) I mentioned this idea last week and that I only wanted to serve contextual ads, and only to the 87% of people who were visiting my site via search engine referral. As it turns out, conditionally serving ads wasn’t very hard at all. I woke up early on Saturday and before my wife woke up, I had it all working.

To keep the code simple I determined whether or not someone was coming from a search enging by checking for “q=” or “p=” in their referring url. MOST search engines use one of these 2 variable names in their query string for the search terms.

Here’s how I set it up in PHP with Movable Type:

Check for “q=” or “p=” in the referer and set a variable in the header include. Simplified PHP: Thanks Ryan.

//Should we show Google Ads?
$referer = $_SERVER["HTTP_REFERER"];
$showads = preg_match("/[qp]=/i", $referer) > 0;

Edit my MT Individual Entry Archive template to insert a “large rectangle” ad unit between every 15th comment in the comment loop.
```
 % 15 == 0){ ?>
```

That’s it. Pretty simple really. Google only allows you to display 3 ad units per page, but they control that themselves. So, even if you have 20 javascript ad sense requests on a page, Google will only render the first 3. So on pages that have over 45 comments, there will be ads below the 15th, 30th, and 45th comment and that’s it. On pages that have less than 15 comments, only the sidebar ad will show up.

Example of page with only comment ads:
Google “Popcorn Ceiling Removal” and click on my page.

Example of page with only sidebar ad:
Blingo Search “win at blingo” and click on my page.

I read through the AdSense Terms & Conditions and this type of conditional display of AdSense for Content blocks doesn’t seem to violate any rules. If anyone finds out somehow that it does, please let me know. I would recommend this technique to anyone who gets a lot of search engine traffic to specific posts on their personal site. I don’t think it’ll help you build your adsense empire (LOL), but I’ve been making a few bucks a day since I set it up.

Blogging For Profit?

Jason Beaird — Fri, 14 Apr 2006 16:16:07 +0000

When it comes to making money from my personal site, I generally shy away from the idea. I’ve been a banner-ad/popup/sidebar-ad hater since I first started using the web, so why would I EVER want to put such them on my own site. Well, for one, I’m curious. I’d like to know what the payout is on these things. While you’ll NEVER see a girating pig with state abbreviations on my site begging you to refinance now (who clicks on that crap?), I’ve thought a few times about adding Yahoo or Google ads that might be relevant to the content of a particular post.

How Not to Annoy Your Regulars

Personally, I don’t find Google AdSense style ads that annoying. Sometimes I even click through them if one of the links look interesting, but they usually blend into the site so well that I look right past them. However, I still don’t think bloggers should ever present ads to their regular users. Who is left, you ask? Search engine visitors. According to Google Analytics, over 87% of my visitors are first timers:

According to Mint (Yes, I’m a stats junkie…) Most of those people are coming in via searches for random things like popcorn ceiling, publix sushi, and my favorite, the blingo search for I want to win at blingo. Somehow I get top-ten plus search engine rankings for a lot of really random keywords.

While I don’t want to serve ads to anyone who reads my rss feed, or visits the site via links from my friends sites, I don’t feel bad about serving relevant text ads to the throngs of people who want to ask me all kinds of silly questions about getting rid of their popcorn ceiling. Don’t get my wrong, I appreciate those visitors, so I won’t go serving them girating pig refinance ads. However, if they came here via a search, maybe they’d get something out of some related AdSense links. My plan is to serve ads below my sidebar for anyone coming from a search engine. I’m not sure exactly how I’m going to do this yet but there are a lot of engines out there. I’ll probably look for query string clues like &q= on the referrer url rather than going by domain. I’m open to suggestions though if anybody has a better idea.

So Which Service Should I Use?

I’ve applied for a beta membership for the Yahoo! Publisher network which Dustin Diaz says is far superior to the Google program, but then, Dustin works for the big Y! Anybody else have any experiences with AdSense they’d like to share to convince me one way or the other. Dustin, feel free to add your 2 cents as well, I was just pickin’ on ya. :)

NPCRTAGBIL

Jason Beaird — Fri, 04 Nov 2005 16:05:57 +0000

I had a few people say they liked the animated logo rollover in the upper right corner of my new design. How did I do it? Well I’m glad you asked. It’s a Non-Preloading CSS Rollover Transparent Animated Gif Background Image Link. What? Too many adjectives? No way! The more the better, so…Yea! It’s bound to be at least as popular as Diet Cherry Vanilla Dr. Pepper.

Let me first say that designing a new css theme for an existing XHTML site (especially when I’ve learned a lot since I wrote the original XHTML) is a pain in the butt. I would much rather start from scratch with a new XHTML template and all new css…but in this case, I just wanted a new theme and I avoided the temptation to re-write all the XHTML. Well, when I was creating this new theme for the site, I noticed that I had a link with my logo in it as part of the xhtml. In the 1900s theme, I was hiding that link, since I only wanted it to serve as a header/home-button for the non-styled version of the site. For the new theme however, I planned on putting in some css to hide the img tag inside of it and use it as an absolutely positioned design element for the site. When I made my Photoshop mockup, I planned for this with the “Making this place feel like home.” starburst logo thingy you see to your upper right.

In my typical “that’s just not good enough” fashion, I decided that… it wasn’t good enough. I decided to make the image into a rollover and that I was going to use the tried and true non-preloading method of doing css rollovers that involves creating a background image with the hover and non-hover states adjacent to one another, and toggling the background position in the CSS in the :hover state for my link. I would explain this here, but it has been well documented here, here, here, here, and here.

OK, So that’s the Non-Preloading CSS Rollover Background Image Link. What about the Transparent and Animated part? In short, Animated came first and Transparent was a necessary evil. I made this nice little 3 frame gif animation of the starburst rotating and incorporated it into the rollover image and realized once I got it in place that it covered up part of my ceiling beams. So I decided to take advantage of the full power of the mighty GIF format to make it Transparent AND Animated. After all that explanation, I give you the final image, the Transparent, Animated part of my Non-Preloading CSS Rollover Transparent Animated Gif Background Image Link:

Weighing in at only 20kb, I think it’s an impressive little 3 frame transparent animated gif. I could sit and watch it spin all day long.