Näytetään tekstit, joissa on tunniste style sheets. Näytä kaikki tekstit
Näytetään tekstit, joissa on tunniste style sheets. Näytä kaikki tekstit

sunnuntai 23. toukokuuta 2010

Custom style sheet for xkcd

In February I wrote about custom style sheets. Basically they allow you to modify any web site's visual appearance to your liking. So here is a custom style sheet file for the xkcd web comic for you to download. Here are the deployment instructions for Opera again:

  1. Direct Opera to xkcd.com
  2. Hit F12
  3. Select Edit Site Preferences...
  4. Choose the Display tab
  5. Into the My style sheet box, select the CSS file you hopefully just downloaded
  6. Hit OK, then refresh xkcd.com.

Here is a screenshot of an xkcd comic before the custom style sheet:


And here's a picture after installing the custom style sheet. Notice how the comic now fully fits into the first screenful:

The top bar has been moved below the comic and the title-text of the image has been rendered visible. Some elements have also been made transparent so that they are less distracting.

torstai 11. helmikuuta 2010

Custom style sheets

About a week ago I made a post about browsers, namely alternatives to Internet Explorer, and I recommended Opera. I also promised some tips on how to get more out of it, so here goes.

In a netbook the screen space is usually quite limited. However, many sites are designed with larger screen resolutions in mind and may have, for example, excessive margins or too large navigation menus. You may not even have thought about it before, but wouldn't it be quite nice to customize the layout of some sites a bit? With most browsers, including Opera, this is actually possible. You will need to know some hypertext markup language (HTML) and cascading style sheets (CSS) but that's pretty much all it takes. If you use style sheets created by other people then you don't even have to know those.

Anyway. Take geocaching.com. The individual cache pages actually have a lot of clutter: buttons, linebreaks, information that is just not used. Here's a screenshot of a cache page as they typically look like: 


You'll notice that there is so much extra information that the actual cache description barely even starts on the first screenful. Using a custom style sheet you can strip the unwanted elements out of the page:



How many differences can you spot and which version of the page would you rather use? To achive this result I used this style sheet. You may copy it and save it anywhere in your computer. How to take this file into use then? Here are the instructions for Opera:

  1. Direct Opera to www.geocaching.com
  2. Hit F12
  3. Select Edit Site Preferences...
  4. Choose the Display tab
  5. Into the My style sheet box, select the CSS file you hopefully just downloaded
  6. Hit OK, then refresh geocaching.com

Presto! Your geocaching.com browsing experience has vastly improved. :)