Using an image as a background lets you have a lot more control over certain elements (like anchors). One of the main problems with images as backgrounds for anchors, however, is when you have a separate image as the rollover state. When the anchor is hovered over, you can see a brief blink while the rollover image is loaded for the first time. Of course, you can use a JavaScript pre-loader, but this seems like too much trouble to me. This post will show you how to combine the two images so they get loaded once, at the same time, when the page loads.
As a side note, you should check out my post on Better Text Replacement with CSS to get an idea of how to properly replace elements with background images.
First off, let's say we want to replace the logo link in our header with a standard logo and a rollover logo. Here are our two images (I'm using the logo from my blog):
Our HTML code might look like this:
And, our CSS code would look like this:
It's a simple empty anchor that is display:block; and has the first image as the background, then another background image for the rollover. The second image won't load when the page loads. It loads the first time it's requested; when you hover over the logo. This will cause a very brief flicker while the image is loaded.
The solution to this problem is insanely simple. All we need to do it combine the two images into one, then just re-position the background image when we hover over the anchor. Here is our new combined image:
Our HTML stays the same, but our CSS changes slightly:
Since each of our separate logo images were 81px tall, we just combine them to make an image that is 162px tall. Our CSS will only show the top 81px of the image initially, then will shift the image up by 81px to show the rollover state.
Why do sites still use the www subdomain? Some people, including most of us here at Plexus, think that it's deprecated. It's really only a subdomain, and there's absolutely no reason that it should still be used. But, I don't want to get into an argument about whether it's needed or not, I'm just going to show you how to redirect the www subdomain to no subdomain.
All you have to do is add the following lines to your .htaccess or .conf file:
# Redirect www.site.com to site.com with 301
RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
RewriteRule ^(.*)$ http://%1/$1 [R=301,L]
That's it!
In the interest of fairness, I've decided to also show you how to redirect no-www to the www subdomain.
# Redirect site.com to www.site.com with 301
RewriteCond %{http_host} ^site.com [nc]
RewriteRule ^/(.*)$ http://www.site.com/$1 [r=301,nc]
Remember, with great power comes great responsibility. With that said, you should NEVER use that second code sample unless you absolutely have to (ie when Firefox gives an error about the security certificate only being valid for www.site.com).
I've been guilty of accidentally adding a local configuration file into Subversion in the past. At best it will only cause another user's project or file to be conflicted or throw an error. At worst it will keep the remote project from updating as expected (causing some interesting server problems).
I've often wondered if there were a way to remove the file from the remote Subversion repository without deleting it from my local working copy. Turns out, it's a lot easier than I thought just by adding the --keep-local option.
svn rm log/development.log --keep-local
NOTE: This option is only available in versions of subversion >= 1.5.
Sometimes, you need to exclude certain files or folders from your Subversion repository. This is usually just as simple as not adding the files via svn add. But, those files and folders still show up when you run svn status as non-tracked files. This may be fine for most people, but what if you want to mark those files as excluded and never see them again (at least via Subversion commands)? That's where the svn:ignore property comes in handy.
Let's say you'd like to exclude all files in the log folder.
svn propedit svn:ignore log/
Then just add * as the entry to ignore all files in that folder. You can also set file patterns to ignore all types of files and folders.
NOTE: If you get the following error:
svn: None of the environment variables SVN_EDITOR, VISUAL or EDITOR is set, and no 'editor-cmd' run-time configuration option was found
You need to set your SVN_EDITOR. For a one-time workaround, you can run one of the following commands to set your default svn editor:
If you want to permanently set your svn editor, you can add an entry to your ~/.bash_profile file (on Mac only).
As a bonus, you can see all of the excluded files by running svn status --no-ignore.