“KDirStat – Directory statistics.

Shows where all your disk space has gone
and helps you clean it up.”

Installation in Debian and Ubuntu:

$  apt-get install k4dirstat

I think the screenshot says it all:

Every cube in the tree-map illustration represents a file or a directory. By their size its instantly visible where all the space is used up. You can click the big blocks to get a direct link to the file in the tree.

Analyse zu Facebooks Datenbestand ÜBER DICH

Hintergrund. Jede Person in der EU hat das Recht eine Kopie von allen Daten, die ein Unternehmen über die Person speichert, zu bekommen. Wie das geht findest du unter “Daten verlangen!”. Nachdem wir die ersten Antworten auf unsere Auskunftsersuchen angesehen haben, war klar: Das muss veröffentlicht werden. Wir wollen mit dieser Aktion Facebook transparenter machen und Usern eine Vorstellung von den Daten geben, die Facebook von uns speichert.

• Diagramme und Infos zu FB’s Daten :: www.europe-v-facebook.org/DE/Datenbestand/datenbestand.html

• Mitmachen!!! :: www.europe-v-facebook.org/DE/Daten_verlangen_/daten_verlangen_.html

CCC  reverse engineered the windows software and found many critical bugs and very bad code. The trojan opens infected systems to everybody, because the encryption implementation is broken. CCC even invented a demo frontend!

Now they publish all details and german news will release parts of the malware code tomorrow!!!1!! Read multipage FAZ article tomorrow print and online!!

Fefe informs and  links to the CCC press release:

Chaos Computer Club analysiert Staatstrojaner

FAZ article

Its expected, that the officials press the selfdestruction button very soon hahahaa

*party*

The prob is, that each Facebook button sends user tracking data to Facebook, just by visiting the site, without clicking any ‘like’/'share’… button. Heise implemented a system, which requests a click-confirmation before sending any userdata to Facebook/twitter/../../../.

We have been waiting for this code since a long time and implemented it in a similar way on our own sites so we are very happy about heise.de fighting for our rights once again!

This story reveals the true intentions of FB once again: they veeery keen on tracking the complete surf history of $any web-user: they know $every page you visit!1!

A very simple profile of a web user is worth min. >10€ on the ad-market – for sure much more if you can deliver tracking data like that..

References:

http://heise.de/-1230906

http://heise.de/-1333879

http://heise.de/-1335658

U can create the image as .png with the Gimp Software, here the tutorial:

http://egressive.com/tutorial/creating-a-multi-resolution-favicon-including-transparency-with-the-gimp

Drupal interface did not like the.ico format directly saved from GImp, did not appear so I have saved a .png in Gimp and converted …

2. Post Image converting:

Post about converting .png to .ico with the Terminal on Linux:

http://steve.kargs.net/hosting/create-a-website-faviconico-with-ubuntu-linux/

Designers: Dont Panic !

If the lines of code make bleed your eyes, but you still want to work with Open Source Software … work with Linux developer or

get Ubuntu Studio optimized for Graphic Design, then all the tools are already include into your Operative System.

In the case you have all the tools:

you ´ll need to go into the directory where you have the png

$ cd Documents/design/logo/

and use just the last line from the article

$ icotool -o favicon.ico -c favicon.png

The main problem is to align in vertical the letter to the top of the text,the property vertical-align apply on the first-letter pseudo-element only if the float is set to none, that is a waste, the target I want to reach is big Letter with text around.  if I dont float the results, it shows a line break after the first line high like the height of the first letter.

Mozilla Firefox is the only one understanding a margin or padding from the top, so thumb up for this browser.

The developer tools presented in other browsers than Firefox dont allow me to edit the CSS in live, in order  to see faster which solution I can take.  for the other browsers I used the edit & try option of http://www.w3schools.com

IE6

This pretty article http://www.satzansatz.de/cssd/pseudocss.html discusses the classic IE behavior for typo and spacing errors,  IE6 requires an empty space between the class/id name and the comma and a space between the class/id  and the {} to read the properties

SOLUTIONS: Lets fight the Browser compatibility

1. Using spans: create a span around the first letter is the mostly compatible solution, frequently used in the past, but does not work for dynamic created content, at least it does not without a script that add the span automagically
2. insert line height and work on margin-bottom!
3. Use a specified font for the first letter , where the uppercases are positioned into the font editor 4 pixel down to the bottom line (simply crazy for mostly common low payed jobs!)

thanks to this article (http://www.users.globalnet.co.uk/~arcus/html/dropcaps.html) I noticed that the margin bottom on the contrary of the margin-top it works in many browser!

Important is also the line height which forces the browser to think about the first letter like if was height like the text.

the results are still really different for each browser, that terrifies me and the letter  is frequently higher than the line. but acceptable.

HERE THE CODE:
/*TODO check IE6*/

p:first-child:first-letter{
float:left; /* Make the text flow around the letter */

font-size:3em;
margin:4px 4px 0px 0px;/*for firefox that is the only one reading the margin-top*/
margin-bottom:-0.25em;/*for the other browsers, Chrome, Opera*/
line-height:0.97em; /*Adjustment mainly for IE , help position the letter on the same height then the text,  that has 0.97em line-height/
}

the idea is to give a vertical dimension of an empty div of 50% to get the middle of the height, and a margin bottom negative of the value of half of the height of the content DIV that need to be centered. That means that the content need a fixed height to be positioned.

here the code

Those are the regular cross browser tests we make : Internet exploder 6, 8, 9; Safari, Chrome, Opera, Firefox

on linux, mac and pc.

Monitors dimensions: 1920×1080, 1280×800, 4:3 and 16:9, netbook and Sony Ericson mobile Walkman and Android mobile phone
Nevertheless after we used our machines we let run some test on this web utility http://browsershots.org/

———————————————————————————————————

Looks like the mostly used mobile browser is Opera Mobile – Opera mini,that since the end of 2010 replace “Web (mobile) Browser for S60″ the default browser for the mostly sold operative system Symbian OS (originally Nokia propertary made after Open Source!),. Has a stable position with “29.2% of worldwide smartphone market share in 2011″ (Wikipedia).

2nd  place is the Android that is increasing users!
3rd place for Iphone with iOS and Safari.
The mobile browsers are born around 1996, in text only mode, around 2006 start the usage of CSS2.1, but the hardware developed so fast that there is no old browser engine to fight with,  thee is just the choice or they cannot show a graphic layout or they render better of your others monitor.
So the list can be restricted to:

/* Safari, Chrome, Skyfire, Nokia Series 60, Polaris, BlackBerry, Android*/
background: -webkit-linear-gradient(bottom, #006353, #c7dad6);

/*Portable Firefox, Firefox Mobile Fennec 1.0 Alpha 3, SeaMonkey Portable 2.0.14*/
background: -moz-linear-gradient( center bottom, rgb(0,98,83) 50%, rgb(0,113,94) 50%, rgb(199,218,214) 99%);

/*Opera Mini & Opera Mobile*/
background: -o-linear-gradient(bottom, #006353, #00715e, #c7dad6);

/*IE mobile */
-msfilter:”progid:DXImageTransform.Microsoft.gradient
(startColorStr=’#81aea7′, EndColorStr=’#81aea7′)”

/* Safari 4-5, Chrome 1-9 */
background-image: -webkit-gradient(
linear,left bottom,left top,
color-stop(0.5, rgb(0,98,83)),
color-stop(0.99, rgb(199,218,214))
);

/* Safari 5.1+, Chrome 10+ */
background: -webkit-linear-gradient(bottom, #006353, #c7dad6);

/*Mozilla/Gecko (Firefox >= 3.6 etc) */
background: -moz-linear-gradient(
center bottom,
rgb(0,98,83) 50%,
rgb(0,113,94) 50%,
rgb(199,218,214) 99%
);

/* Opera 11.10+ */
background: -o-linear-gradient(bottom, #006353, #00715e, #c7dad6);

/*IE 5.5 – 7*/
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr=’#006353′, EndColorStr=’#c7dad6′, GradientType=0);

/*IE 8+*/
-msfilter:”progid:DXImageTransform.Microsoft.gradient
(startColorStr=’#81aea7′, EndColorStr=’#81aea7′)”

You could add even one more exception, for a while Opera used an external svg to create the gradient, but the work is not worth.

/* fallback, Opera <=10 */
background-color: #1a82f7;
background: url(images/linear_bg_2.png);
background-repeat: repeat-x;

http://gs.statcounter.com/#os-ww-monthly-201004-201104

http://en.wikipedia.org/wiki/Usage_share_of_web_browsers

http://en.wikipedia.org/wiki/Mobile_browser

thanks for the great work:

http://www.normansblog.de/demos/browser-support-checklist-css3

lonex-berlin.de/junex

Dieses Webprojekt wurde mit dem WordPress Blog-System realisiert.  Dazu wurde ein Template entwickelt, um die speziellen Layout-Funktionen zu realisieren. Die Info-Seite enthält Unterseiten mit animierten ‘Popups’ (Pop-ins?)

Den Kern der Seite bilden animierte Bildergalerien zur Darstellung des Portfolios von Lisas Arbeiten.

Lisa Buescher Webseite