Rubular: a Ruby regular expression editor and tester

This tool is indispensable when dealing with regex. Plug in a sample search string, and then start banging on the regex to match it. There are some differences I’ve found between regex in Ruby vs. Javascript, but even then it helps to get you most of the way there.

Rubular: a Ruby regular expression editor and tester.

H/T to Justin for pointing me in this direction some time ago.

Wither IE6!

Over on CSS Tricks, there’s a discussion brewing about why people still use IE6. Chris breaks it down into four different user types: Those who have to due to IT policies; those whose computers don’t support IE7 (although they would probably support Firefox); those who have actually avoided upgrading to IE7 and who may actually prefer IE6; and those who don’t know any better and for whatever reason haven’t had their system auto-upgraded yet.

Continue reading “Wither IE6!”

Reverse of the Title!

I’ve noticed a paradigm shift recently in my trollings of ye olde interweb. More and more sites are reversing their titles! Thus far in my experience, it’s been mostly personal sites, blogs and agency shops that are doing it, but these are the sites run by the people making the larger sites. What do I mean by reversing titles? I mean putting the name of the CONTENT before the name of the site instead of the other way around.

Continue reading “Reverse of the Title!”

Some Fixes for the UVM Web Template

Using Javascript, here are a couple of fixes we came up with for issues regarding the UVM web template:

  1. Linking a banner graphic back to your site’s home page
    If your site uses a graphic for the the banner image (instead of the standard block of color), it’s nice to offer your users a way back to your site’s home page by allowing them to click on your banner. This is especially true if you’re not using a departmental logo.

    Here’s how we did it with some basic Javascript:

    function bannerLink() {
    
    	var home = "http://www.uvm.edu/ctl";
    	
    	document.getElementById("banner").onclick = function() {
    		window.location = home;
    	}
    	document.getElementById("global").onclick = function() {
    		window.location = home;
    	}
    }
    

    First, we set a variable for our site’s home:

    var home="http://www.uvm.edu/ctl";

    Then we set up onclick event handlers for each of the elements in question, “banner” and “global”:

    document.getElementById("banner").onclick = function() {
    	window.location = home;
    }
    document.getElementById("global").onclick = function() {
    	window.location = home;
    }

    Place that bannerLink() function in a .js file so you can link to it from each page and then call it using an onload handler of the body.

  2. Styling the footer below the main menu
    Did you ever notice how even though you might have set a background color for the footer of your site, the footer bar below the menu doesn’t change? Again, using some basic Javascript, we can change that:

    function setFooter() {
    	var bkgd = "#DE9442";
    	document.getElementById("footer").style.background = bkgd;
    }
    

    First we’ll set a variable to hold the color (this is the orange of the CTL site footer), and then set the footer background to be that color.
    Stash the setFooter() function in your .js file and call it with a body onload handler.

We actually combined the above functions into one init() function so that we could do multiple things when the page loads.