h4x3d.com

- h4x3d.com

Archive
Design

I have released 3 themes in late February, click the images to get to the themes pages:

bonsai growth!

qpoz.png

corporatefk + business

corporate.png

fastr

fastr.png

Beautiful spring theme to come this march,

Stay locked,
jez

All themes are released under these Creative Commons terms of use.

Read More

As I wrote two days ago semester two began and I moved around furniture in my room including the crazy and heavy waterbed.
I have mounted my LCD screens to the walls to save some space.

Here are some pictures:
LCD screen mounted on wall, used with desktop pc:
02-07-07_1724 (by julian.klewes)

Here from another POV:
02-07-07_1919 (by julian.klewes)

In case you are wondering what I am using as table-ish thing for my keyboard/mouse:
02-04-07_1209 (by julian.klewes)

That’s an old sign my mate bongselecta gave me…
It can be switched from “wall mounted mode” to “table mode”.
02-04-07_1404 (by julian.klewes)

TV mounted on wall (high):
02-07-07_1919 (by julian.klewes)

Desk where I study:
my desk where I learn (by julian.klewes)

My bed, an urban picture and a plan called lucy:
my waterbed (by julian.klewes)

Please excuse the bad picture quality, I took these pictures with my mobile.

Read More

There are several ways of preserving bandwidth when you are running near your bandwidth quota:
For those of you who have not bandwidth limit per month, read this article as well, because I am going to tell you how to speed up your pages big style

Different approaches can be used to increase the time your website is displayed on your users computers.
You can measure the time it takes for your page to load with Firebug, an extension for Firefox. Once downloaded, installed, Firefox restarted (use the brain hack to keep open Tabs), you will find a small icon in the lower right area of your browser. Click enable, if it asks, then you can start viewing your page using the “Net” -tab (all) of Firebug. It will tell you how long the page took for loading. You will be surprised by the wide spectrum of details you will get to know about your website. E.g. using fat script libraries such as (full) scriptaculous or prototype take quite some time to load. Often whole libraries are included for effects that only need a handful of functions (lightbox!). More under a.4 later on.

a. reduce the over-all size of files/data that will be transfered when accessing your site


   a.1 images (jpg/png/gif)
   a.2 markup (php/html/css)
   a.3 stylecheets (css)
   a.4 javascript (js)
   a.4.1 overview of different lightweight javascript libraries/frameworks
   a.5 general (plugins, temporarily removing 'fat files')

a.1 Save bandwidth and optimize speed reducing images (jpg/png/gif)

Many websites use a high amounts of images, and there is nothing bad about it,
as long as a suitable compression is used. There is a difference between images compressed with jpg (jpeg), png and gif.
While jpg is great for images that feature loads of different colours, gradients and generally speaking pictures (photos), png and gif make more sense if an image does only consist of few different colours (max. 256 for good results). Gif images have to be used if you are going for transparent or semi transparent images. PNG can be transparent as well, but there are issues with the Internet Explorer, so I’d not recommend using png for transparent images. A jpg compression of 60 is often far enough, no need to go by even higher, because most of your users will most likely not see any difference. The difference file size concerned is massive.
You can easily safe some kilobytes there. REMEMBER: less kb to download = faster display of site. Safing photos in gif or png file format makes them ugly and big, so stick to jpg.

a.2 Save bandwidth and optimize speed using valid markup (php/html/css)

While this seems to be hard for many designers and programmers, one should try to produce valid markup.
Valid markup displays faster on many computers. Don’t over comment your source on websites.
It might be a good idea to keep local commented copies of your files, but in the web that’s only resource and thus speed hogging.

I’d recommend this online HTML tidy program for checking your markup, as well as the official w3c markup validation service [For CSS]
A great online tool to strip comments from your code (html/js) is memtronic’s packer
as well as dean edward’s packer.

a.3 Save bandwidth and optimize speed using compressed CSS

Compressed CSS is loaded like ordinary CSS, but simply faster. REMEMBER: less filesize = less load time of page
If your pages’ CSS is loaded faster, the site is earlier displayed on your visitors’ PC. He/she is then more likely to not leave your page in the first 10 seconds if he/she sees the content. It is essential to aim for the below 10 seconds (check the time your users remain on your website with Google analytics). There are some CSS compressors that work and others that proclaim they work, but don’t. Here are three, that definately work more or less depending on the complexity of coding.

CSS compressors
Flump cake css optimiser
icey’s css compressor
css formatter and optimser

a.4 Save bandwidth and optimize speed using compressed js

Many WordPress scripts want you to include big and fat javascript on your blog. Usually those can be compressed, downsized and optimized. I mentioned two compressors before: memtronic’s packer
and dean edward’s packer.
A by far even better compressor is dojo shrinksafe.
You can use these compressors to remove descriptive lines, comments and examples from the source. Usually compressed files will still work. If they don’t, use another option or different compressor. Be sure to compress valid js markup only.

a.4.1 Overview of javascript libraries and compress JS

So basically we all know scriptaculous and prototype. Some also know mootools (and moo.fx), but my personal #1 is byte.fx with an overall size of 3kb.
Prototype and scriptaculous can be compressed to some extent, Steve Kallestad did that and offers these compressed files on his site:

The downloads are available at:

Be sure to check them locally before you take these versions for an online test-walk!

a.5 Save bandwidth and optimize speed deactivating or tweaking plugins

Many wordpress plugins are filled with explanations, comments and examples.
These can be removed to save additional space and thus increase the download speed of your website.
Use the mentioned above compressors to compress plugins like Lightbox or Flash-embedding plugins.
If you ever run low on bandwidth, deactivate unneeded plugins (and later on re-activate them!) for the needed time.
You will be surprised by the amount of traffic the lightbox.js does generate.
Also check your site for deadlinks, sometimes a deadlink generates a 404-error page. If you got custom error-pages that render a nice “not found”-page, this is a massive traffic and bandwidth generator. Locating these files and fixing their deadlinks is essential to maintaining a slick site.

b. enable server-side options to tweak the way stuff gets transfered

  b.1 gzip compression
  b.2 *Sql tweaks / WordPress 2.1

b.1 Save bandwidth and optimize speed using server-side options

If you can get your hoster or admin to enable mod_deflate (former mod_gzip), you are most likely to save tons of bandwidth, because of serving compressed content. Note: not all browsers support this. Read all full tutorial on that here.

b.2 Save bandwidth and optimize speed using sql-tweaks (WP 2.1)

In January this year, WordPress 2.1 was released:
They state:
[...] Much more efficient database code, faster than previous versions. Domas Mituzas from MySQL went over all our queries with a fine-toothed comb [...]
But if you want some real fast WordPress a-like CMS, go for Flatpress, a SQL-less CMS (currently under development). Static files, such as html, load faster than any dynamic ones. just as a golden rule.

c. move the server to a location where most of your visitors come from

  c.1 mirrors and foreign hosting

c.1 Relocating your website

Sometimes it makes more sense relocating your website to the country of #1 traffic origin or offering a mirror server then merely tweaking your site. If you’d for example have a Fansite dealing with an American (US) actress or model, but run your website from Europe, then most of your targeted audience (Americans) will have a slower site experience than if you’d place a server on the American mainland. Even ‘mainland’ is not equal mainland, due to the huge geographic distance of the east and westcoast. Thus offering mirror might be a wise idea. So based on the origin of site request either www1 or www2 is accessed.

I will be moving to DREAMHOST (LAX, USA), but not merely because of the later stated issue of traffic origin. In the next few days this site will be moved (early February), so if you experience any trouble, please be patient, feel free to comment or drop me a mail at jez at this domain (h4x3d.com). I hope you enjoyed this article and also checkout my five tips for your daily work life.
Read More

Bilder aus Berlin (2006), Slideshow below
(hover upper right corner to show menu)
(mit der maus in die obere rechte ecke um das menu anzuzeigen)

[kml_flashembed movie="/monoslideshow.swf" base="/" height="225" width="300" fvars="dataFile=http://www.h4x3d.com/monoslideshow_berlin.xml"/]







































awww-cute-girl.jpg

art-berlin-checkpoint-charlie.jpg
art-like-shot-of-trainstation.jpg
a-rail.jpg
antique-lions.jpg
6mil-euro-jew-art.jpg
a-plane-on-a-roof.jpg
6-mil-deffo-worth-it-berlin.jpg
6-mil-euro-jew-art-berlin.jpg
art-outside-potzdamer-platz-theater.jpg
aviation-fly-plane-fly-from-the-rooftop.jpg
bahn-rent-a-bike-gps-berlin.jpg
bahn-rent-a-bike-gps-berlin1.jpg
bahn-rent-a-bike-gps-berlin2.jpg
bahn-rent-a-bike-gps-berlin3.jpg
blackandwhite-shot-station-berlin.jpg
blueman-group-eyes.jpg
bridge.jpg
bridge-and-sky.jpg
british-embassy.jpg
british-embassy1.jpg
cine-star-imax.jpg
coca-cola-provoke-the-east.jpg
coca-cola-provoke-the-east-berlin.jpg
construction-site-berlin-embassy-usa.jpg
construction_new_us_embassy_berlin.jpg
das_brandenburger_tor_ist_mega_klein.jpg
dead-serious-jez.jpg
der-klumpen-berlin-cc.jpg
der-shoe.jpg
dieu-et-mon-droit-embassy-uk.jpg
direkt-an-der-spree.jpg
evil-fucking-elephant-berlin.jpg
flag-berlin-reichstag.jpg
fussgaengerbruecke-reichstagsufer.jpg
garnicht-baggy-echt-nicht.jpg
gate-ficken.jpg
germany-land-of-ideas.jpg
gespiegelt-im-deutschebank-fenster.jpg

gespiegelt-im-deutschebank-fenster1.jpg
h5n1.jpg
h5n1-2.jpg
hallo-lena.jpg
hand-fist-graffiti-on-truck-berlin.jpg
hier_entsteht_die_neue_us_botschaft.jpg
high-building-spree.jpg
i-dont-get-it-wtf-berlin.jpg
i-like-this-elephant-berlin.jpg
i-like-this-wall.jpg
i-own-this-shoe.jpg
if-u-need-a-hq-loreal-logo-copy-this.jpg
impressive-roof-berlin.jpg
jez-chilling-sony-center-berlin.jpg
jez-shoe-wooo.jpg
jez-so-damn-tired.jpg
kanzleramt.jpg
kanzleramt-side-shot.jpg
kanzleramt1.jpg
kuppel-sony-center.jpg
lehrter-bahnhof-oder-so.jpg
lehrterbahnhof-oder-so.jpg
lena-ist-im-weg.jpg
lena-shoe.jpg
lena-wtf0.jpg
luisenstrasse-berlin.jpg
moving-via-train.jpg
moving-via-train-shot-through-win.jpg
myhump-myhump-my-ladylike-hump.jpg
need-to-skate-this-one.jpg
nice-floor-berlin-kanzleramt.jpg
nice-govermental-building.jpg
no-idea.jpg
now-this-is-art-nice-ladders.jpg
opel-corsa-polizeiwagen-berlin.jpg
physik-museum-roof-berlin.jpg
random-shot-metro.jpg
regierungsgebaeude.jpg
regierungsgebaeude-berlin.jpg
regierungsgebaeude-bogen.jpg
regierungsgebaeude-bogen1.jpg
regierungskindergarten-an-der-spree.jpg
reichstag-flag-europa-deutschlang-im-wind.jpg
reichstag-himmel.jpg
sick-ss-bastards.jpg
some-crazy-lion.jpg
some-nice-paper-art-on-a-sign.jpg
some-shoe-in-berlin-rather-big.jpg
sony-center.jpg
sony-center-wide-angle-shot.jpg
ss-car-inwhich-ss-guy-was-killed.jpg
ss-weapons-uniform-bad-stuff.jpg
terror-protection-bombs-berlin-embassy-usa.jpg
terror-protection-embassy-block-street-berlin.jpg
terror-protection-embassy-block-street-berlin1.jpg
terror-protection-embassy-block-street-berlin2.jpg
theater-am-potzdamer-platz.jpg
triste-wiese.jpg
ubahn-station-berlin.jpg
wear-hats-use-eyes.jpg
what-ever-angle-u.try.jpg
wondering-where-this-stair-leads-china-club.jpg

Read More

pixar bird animation shot

The beautiful pixar bird animation, so cute!
Pixar really did a great animation job on those bird!

Did you see this cute fluffy tennis ball chicken bird commercial?

Read More
And I will strike down upon thee with great vengeance and furious anger those who attempt to poison and destroy my brothers! And you will know I am the Lord when I lay my vengeance upon you!
Source:DeviantART

Read More

Read More

This piece of art was explicitly designed/created for WordPress themes.
Click the image to view a full screenshot of the site.

redgrowth design

redgrowth design

Website: Please read on at http://www.h4x3d.com/themes/bonsai#redgrowthlive there you will find all theme related information about this wordpress theme. Also download links, demo links and more screenshots.

Please note: I am the original author of the above mentioned file, but not responsible for the individual page content on the follow-up pages. If you have questions about possible infringed material, please contact the individual site owner!
Work samples, stats and a link to the website can be found above.
Curious about other design samples? See my full portfolio

Read More

This piece of art was explicitly designed/created for WordPress themes.
Click the image to view a full screenshot of the site.

favoloso design

favoloso design

Website: Please read on at http://www.h4x3d.com/themes/favoloso/ there you will find all theme related information about this wordpress theme. Also download links, demo links and more screenshots.

Please note: I am the original author of the above mentioned file, but not responsible for the individual page content on the follow-up pages. If you have questions about possible infringed material, please contact the individual site owner!
Work samples, stats and a link to the website can be found above.
Curious about other design samples? See my full portfolio

Read More

This piece of art was explicitly designed/created for WordPress themes.
Click the image to view a full screenshot of the site.

bonsaigrowth design

bonsaigrowth design

Website: Please read on at http://www.h4x3d.com/themes/bonsai/ there you will find all theme related information about this wordpress theme. Also download links, demo links and more screenshots.

Please note: I am the original author of the above mentioned file, but not responsible for the individual page content on the follow-up pages. If you have questions about possible infringed material, please contact the individual site owner!
Work samples, stats and a link to the website can be found above.
Curious about other design samples? See my full portfolio

Read More