Optimize Your Links For Print Using CSS: Show The URL
Join the DZone community and get the full member experience.
Join For FreeWhen moving around from page to page in your trusty browser, you get the benefit of hovering over links and viewing the link's target URL in the status bar. When it comes to page printouts, however, this obviously isn't an option. Most website printouts simply show the link as text with an underline. What good is that?
Links Should be Printable
One of the key elements that many people forget about when they are creating a web page of any kind is the fact that they should be making the links that are inserted printable.
You see, there are many people who will want to check out the information and research that you are providing them via the links inserted into your page. Unfortunately, they may not be able to look at those links as completely as they might want to if you are not making it easy and possible for them to print off the links.
Making links printable is a matter of getting into the CSS code and looking to make sure that any URLs that you have inserted are truly printable for your audience. It is fully expected that you will take the time to do this for the people who have bothered to show up and read your materials.
Truthfully, you owe them a sign of your appreciation for having come to see what you are creating in the first place.
Internet Explorer Often Ignores the Code
One thing to keep in mind when you begin to mess around with the CSS codes for your URLs is that it is entirely possible that Internet Explorer will ignore the codes that you put in there if you don't get them just right.
Internet Explorer is set up in such a way that it will ignore certain lines of code and other materials that people insert into their websites if Internet Explorer feels that the code is not relevant.
This is why you must be on top of everything to make sure Internet Explorer does force your code out when you know for a fact that the code that you are using is incredibly important to the usefulness of your website.
To provide extra help to your content viewers, you may want to include a snippet of information that lets them know that Internet Explorer may cause some problems when they are trying to print off links in the article. A quick line or two that encourages them to use a different Internet portal such as Firefox or Google Chrome may prove beneficial to all of your readers.
They need access to your information, but they may struggle to get it if they are only using Internet Explorer. Sadly, they may not even realize that this is a problem unless you point it out by making it clear that they need to switch browsers in order to print off the information that they require.
Take some time to throw in a quick line about why users need to shift over to using a browser other than Internet Explorer to get the information that they require.
If you do this, then they will be able to finally get the information you are providing without getting jammed up simply because of the browser they are using. One simple line and you can help fix so many of the problems that they are facing.
Providing URLs for links in the print version of your page can be extremely helpful to the reader. Using a small snippet of CSS code, you can get printouts to display link URLs right next to the link text.
The CSS Code
a:link:after, a:visited:after { content:" [" attr(href) "] "; }
The pitfall of this method of displaying links URLs for print is that Internet Explorer ignores this code. If showing link URLs is critical, I'd recommend using a javascript alternative. If not, add this snippet to your print stylesheet to make your page print-outs more informative.
Click here for an example!
JavaScript Alternatives Can Help
There are situations in which JavaScript alternatives can help you get around the auto-blockers that Internet Explorer has put up on some of these codes.
You may need to work around the traditional system in order to get the results that you need, but you should have a lot of success getting the code to look just the way you need it to if you use some alternative programs to achieve your results.
Sometimes, you just have to think outside of the box like this to get around the barriers that sadly exist within the computing space. We can all hope for a day when there aren't so many layers of protectionism between ourselves and the things that we want to put up on the Internet.
If we can just use some of the tools at our disposal as far as JavaScript alternatives and the like are concerned, then we may be able to make some progress in the right direction. It is a challenge to be sure, but there are a lot of ways that we might be able to build a better Internet and a better world in general.
Does Printing Still Matter for Links?
There are different schools of thought about how important the ability to print something off still is to people, but most land on the assumption that it is better to have printing abilities than to not have them.
People sometimes want to print something off so they can view it on their own time and even hand the printed copy off to someone else that they know that they believe might benefit from it as well. Why would you want to deny them the ability to do this?
The CSS code that is used on your links will be extremely important to the final ability of someone else to use it to print off what they see on the screen. This is why you should be extra careful to make sure the code is written just right.
There are situations in which your viewers may delight in the information that you provide them, but they may not have Internet access everywhere that they go. If they need to pull up your information without access to the Internet, then it is necessary for them to print off the files that they need from you.
Thus, you might want to spend some time getting your links into a form that allows them to be printable.
Not everyone who visits your website will care about printing something off, but the people that do care about it will notice the steps you took to make this possible for them, and they will surely appreciate what you have done for them.
Opinions expressed by DZone contributors are their own.
Comments