Skip menu!

2007-11-22 Breadcrumb trail: Home Software issues

Slavoglotta Sprogformidling

— that's me, too!


Code your images correctly — for future's sake!

This article explains some coding tricks to deal with images on web pages. It analyses every detail in writing the HTML and CSS code to display pictures on your web pages. The analysis will tell you all you need to have in mind if you want to know how to make your site future proof, but only if the future is no more than 5 years away!

Future proof imaging

Last week, a friend of mine, who is the web master of a minor professional association in Denmark, asked me about how to make a web site future proof, i.e., forwards compatible. At first, I thought it was a question of structuring the web pages, i.e., applying SGML coding like HTML or XHTML in a correct manner. After all, it has for long been agreed in the World Wide Web Consortium that XML in one or another realisation, notably XHTML, is the format of the future, especially due to its strict keeping data structure apart from appearance, usually written in the Cascading Style Sheets format (CSS).

HTML 5 vs. XHTML 2.0

On January 28, 2008, a committee under World Wide Web Consortium, the internet standardization organisation, published its first document about HTML 5, a new standard to write web pages. Reading it makes it clear that it is going to rival the other upcoming standard, XHTML 2.0. I'll vote for HTML 5 with its XML variety XHTML 5.

Mobile billeder

Baggrunde til SonyEricsson T610


Min datter på 8 år har lige overtaget min gamle Sony Ericsson T610. Hun var samtidigt blevet vild med nogle billeder, der kører som skærmskåner på min iMac. Dem har jeg ændret til et format, som hun kan bruge på sin mobiltelefon. De er vildt små — fra 3507 byte til 4694 byte, så det passer fint til en telefon, der kun har 400-500 kilobyte tilbage af sine 4 MB fra begyndelsen. Andre brugere kan bare hente her.

How to pick graphics from Mac applications

Every now and then I want to illustrate the way my Macintosh applications work by using their graphics. In the old days I used the old ⌘ -⇡- 4 trick to make a screen shot and then opened an image processor like Macromedia Fireworks to clean it up. However, there is a shortcut to the original images in Mac OS X, using the Terminal or just a plain web browser to display you the Contents of your applications.

My new iMac is a monster

[ iMac 2007 ]

I felt like Santa Claus was coming by, when a beautiful lady delivered me my latest computer acquisition — an iMac as of the late summer 2007 standards.

Reasons to prefer Internet Explorer as web browser on your Windows PC

I can come up with six reasons why anyone should prefer Microsoft Internet Explorer as their favourite browser, none of which convinces me.

Linguistic guidance

Should you ever want to contact me, here are the lists of languages you can use — and what languages you can expect the answer to be in. More

Self-portrait of Erik Thau-Knudsen from 2006-03-15 at home

How to pick graphics from Mac applications

  1. Using
    1. Explanations
  2. Using a WWW browser
  3. Using Safari

Every now and then I want to illustrate the way my Macintosh applications work by using their graphics. In the old days I used the old ⌘ -⇡- 4 trick to make a screen shot and then opened an image processor like Macromedia Fireworks to clean it up. However, there is a shortcut to the original images in Mac OS X, using the Terminal or just a plain web browser to display you the Contents of your applications.


Terminal has been integrated into the very first versions of Mac OS X. It was a kind reward from Apple Inc. for all the efforts that UNIX freaks put into the voluntary development of Darwin which forms the base of Macintosh OS X. You can find it in the Applications folder in the subfolder Utilities. Open it and navigate to the applications folder. If you're unfamiliar to UNIX commands, here is an example below:

The moment you open the program, you will meet a screen message resembling to the below one:

Last login: Wed Nov 21 22:26:20 on console
Eriks-monster-iMac:~ erikthau-knudsen$

The second line in the above text explains that you are operating on a computer named Eriks-monster-iMac and that you are in a folder belonging to the user itself (depicted with the tilde ~ symbol), i.e. who is logged in. Also it tells the user's nickname, in this case my erikthau-knudsen

Enter the following: cd /Applications and press Carriage Return. The command cd is an abbreviation of change directory and in this case, it brings you to the Applications folder of your computer. The output should be:

Eriks-monster-iMac:Applications erikthau-knudsen$

Then type the command ls for list directory and press carriage return (⏎). The output should be something like the below list:

iWork '08
Eriks-monster-iMac:Applications erikthau-knudsen$

You recognise all your favorite applications now surnamed .app . In the finder, these suffixes are usually not displayed, but Terminal does display the full names. Also, you see one folder, Utilities that has no suffix. Viewing the contents of an application is just like going on with the same procedure. Let's view Mail: type cd ⏎ and then ls ⏎.

The outcome should be:

Contents erikthau-knudsen$

Meaning that inside the folder is another folder named Contents. Repeat the action cd Contents ⏎ and then ls ⏎. Terminal will return you (in OS X.5):


Eriks-monster-iMac:Contents erikthau-knudsen$


a text file to be used by the Mail program.
an XML text file written in an Apple XML format called Property List 1.0. It contains instructions for the Mail program.
a folder containing only one file — the program itself, in this case Mail.
another application to be used for enabling time machine facilities that were introduced in Mac OS X.5 Leopard. 
Package Info: a very short file containing only one text string: APPLemal.
A folder for plug-ins that extend the program's features. As of version 3.1, this folder contains the files MailWebPlugIn.bundle and ToDoPlugIn.bundle
Another XML file in the Property List 1.0 format, containing the data about the application build numbers and name. 
This is the biggest folder and also where we shall enter later on. The total size of is 286.5 MB, and the Resources folder alone contains 276.7 MB. The Resources are basically localisations folders (English, Danish, German,  Chinese, etc., each amounting between 15.1 MB and 15.5 MB), image files, sound files, and a few other ones, like Property Lists and Cascading Stylesheets (.css). Localisations (i.e., language files) total about 268 MB. '

Proceed to the Resources folder using the cd and ls commands. The list is very extensive because it holds a total of 351 items and thus will not be reproduced here. Most image files are pretty small, even when written in TIFF. Versions of Terminal prior to the one in Mac OS X.5 (Terminal 2.0 [237]) allowed you to open the files using the command open [file name], but at least the above explanation has explained how to locate the image files of an application in Mac OS X.

Using a WWW browser

Since we've already concluded that an .app file is, in fact, a folder, we can navigate to it, as long as we go beyond the path to the file itself. So open a browser window (not Safari, which I will deal with later). Type the following in the address field (or Copy-and-Paste):


You would then see the following (in Opera 9.24 [da-DK localisation]):

[ Applications/ ]

Clicking Resources should bring you even further:

[ Opera's display of the Resources folder ]

Click to view an image file, but remember that you'll have to obey to the specifics of your WWW browser. Most of them can't display TIFF files, usually only GIF, JPG, PNG, BMP (bitmap), and some varieties of Windows Icon (.ico) files (as well as SVG files, provided that you install an Adobe SVG plug-in). A browser like Opera will, instead it will download the image to your harddisk.

And here is some fun stuff: It works in Classic Macintosh OS surroundings too! The beginning of the URL may be different, so you will have to find out about the annotation principles of the particular browser when working in, eg. Macintosh OS 9, but for the rest, the /Program name/Contents/. is enough to achieve the above results, using the principles of Apple's Personal Web Finder.

Chances are that the principles in this are totally platform independent, i.e., you should be able to access the same files in the .app folders also in Windows, Linux, Symbian OS, etc., provided, of course, you use the media or network protocol appropriate for your system. TCP/IP is ok.

Using Safari

Apple's own WWW browser Safari is so interwoven with the Macintosh OS X that it behaves somewhat different, and, in this case, more beneficial. In the address field, entering file://localhost/Applications/ will bring you to the Finder. e.g.:

[ path to Contents folder in Finder ]

Once you're in the Finder, you're freer to do almost anything to the file. Mac OS X.4 (Tiger) and later are even able to display the TIFF files in thumbnail windows and icons, see below:

[ Way to app.icns ]

In conclusion, Apple's Safari is a very powerful tool to hack into existing applications. Many Apple proprietary files can be hacked similar ways, e.g., Address Book (.abbu), iCal (.icbu), Key (.key). The procedure is almost the same:

file://localhost/Users/ your user name here/... file path .../ file name/Contents/

Good luck seeing the contents of your files. You will be surprised to learn what really takes up all the space of your files.

Erik Thau-Knudsen


| About this site | Copyright | Contact Bookmark and Share
Erik Thau-Knudsen • Skolegade 2A, 2. sal • DK-8600 Silkeborg • Denmark • Tel.: (+45) 8680 1882  • Mob. (+45) 4013 4133