Erik Jørgensen's
Home Page


 

This page serves mainly as redirection place. The lack of javascript facilities and the annoying bug with the switch button for html editing is too annoying to maintain this page as the main page. 

Instead visit the index.html page that serves as the home page.

To use the space I will describe how the CSS-template of the home page i specified.

 Step one: Find a suitable picture

On Flickr I had a picture, which I had taken at the water mill lake in Bruunshaab one evening in the spring. I decided to use it for the home page.

Step 2: Trim the picture

A banner should be as narrow as possible, so I had to trim the picture. I used the Paint.Net program for this. Gimp would have been another option

Step 3: Use  "Oil paint" filter and resize the image

The banner-picture had too many details. I experimented a little and found the "oil painting" filter to produce a suitable result. A small brush size and low coarseness was used. After the oil painting transformation, I resized the image to the final width defined in the css-template (see next step)

Step 4: Find a css-template

I visited the Open Source Web Design page, and found the Basics design by NickyD. I downloaded the files and used them as the basis for the modification

Step 5: Adapt the colors to the picture

This step includes an element of trial and error. The idea is to match the colours of the banner picture. However these colours should not compromise the legibility of the text

The colour coding is found using the colour picker in Paint.net.
  • Darkest color (outer frame). Choose the color from a red sunny part of the lake.
  • Medium color (navigation panel).  Choose the color from the medium dark part of the lake
  • Light color (Header panel). Choose the color from the light rosy part og the sun's reflection.

I had problems with the colour of the navigation panel. Finally, I found that the file bg.gif contains the background color of the navigation panel and the main body of the text as a line of 1 pixel height. Later, I had to change the width of the navigation panel. By redefining bg.gif I could change the width of the text block as well as the colour.  I saved the files in png format.

Step 6: Upload to google pages.

That's it, a new css-template 

Step 7? : Fix Google Bugs

This morning, when I checked the homepage, the layout was gone. I checked the discussion list, and saw that I was not the only one experiencing this and that it only occurred in Firefox. This evening I tried out a strange hunch I had. I relocated the *.css files to another web-location outside Google-pages and the layout reappeared ! For some strange reason the *.css could not be found on google pages, but when I specified the address directly, they were found. Thus hopefully, I have "solved" the problem.

Links