Kategorien
Webdesign/Gestaltung

Der 72-dpi-Mythos – aus aktuellem Anlass der facebook-Profilcover-Komprimierung wegen

Da gerade wild spekuliert wird, ob ein mit 96 oder 72 dpi erstelltes facebook-Profilcover besser durch die grottige facebook-Bildkomprimierungshölle geht, sei auf das hervorragende Essay von Gerrit van Aaken verwiesen: Der 72-dpi-Mythos.

Die Auflösung ist tatsächlich unerheblich, wenn ein Bild rein digital verarbeitet und angezeigt wird.

Wissenswert ist außerdem, dass wir hier von PPI und nicht DPI sprechen.

Und da wir gerade beim Thema sind gibt es noch ein paar Hinweise wie ihr euer facebook-Profilcover am besten anlegt:

  • 851×315 Pixel – so groß wird es dargestellt
  • keine harten Kontraste und Linien
  • als 100%-JPG oder 24-Bit-PNG ohne irgendwelche Alpha-Werte exportieren
  • die Richtlinien beachten

Zudem noch ein Mini-Tipp für die JPEG-Kompromierung: komprimiert wird in 8x8px-Blöcken, richtet eure Elemente also entsprechend aus.

[tweet https://twitter.com/ohne_a/status/177044167795552256 lang=’de‘]

Kategorien
Webdesign/Gestaltung

Sehr kluge Worte über die geplanten Autoupdates des Internet Explorer

Gerrit van Aaken hat sich die Sache mit den automatischen Updates des Internet Explorer, die Microsoft plant und angekündigt hat, mal angesehen und kommt zum Schluss:

Microsoft hat von daher vor allem eine Weichenstellung für die Zukunft getroffen. Es betrifft in erster Linie WinVista und Win7-Nutzer, die jetzt mit noch größerer Wahrscheinlichkeit etwas schneller die aktuellen IE-Versionen nutzen werden. Das ist unbedingt zu begrüßen!

Ich behaupte aber, dass unter Windows XP alles beim alten bliebt, und die bisherige Sterbegeschwindigkeit von IE6 und IE7 exakt gleich bleibt.

Mehr in seinem Blog: Die große Internet-Explorer-Autoupdate-Übertreibung. Auch wenn ihr euch schon gefreut habt, den IE6 und IE7 endlich los zu sein: ein schönes Wochenende!

Kategorien
Frontend: HTML5, CSS3, jQuery Webdesign/Gestaltung

insert <ins> with somewhat style

Mancher von euch hat vielleicht noch schon mal das <ins>-Element benutzt aber keine rechte Idee gehabt, es zu stylen. Ich hab das hier beim Pixelscheucher jetzt so gelöst, Optimierungsbedarf benötigt:

article p ins
	text-decoration:none;
	-webkit-transform: rotate(-1deg);
	-moz-transform: rotate(-1deg);
	-ms-transform: rotate(-1deg);
	-o-transform: rotate(-1deg);
	transform: rotate(-1deg);
	box-shadow: 1px 1px 1px #999;
	display:inline-block;
}

Was tut es? Nun, es macht aus dem <ins> ein inline-block-Element, rotiert es um -1° und verpasst ihm einen leichten Schatten nach unten rechts. Sieht dann nämlich wie nachträglich reingeklebt raus, denn <ins> steht ja auch für nachträglich eingesetzten Inhalt.

So sieht es live aus:

Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Worte wie Hamburgefonts, Rafgenduks oder Handgloves, um Schriften zu testen.

Und als Screenshot:

Screenshot ins-Element-Formatierung

(Normalerweise schreibe ich CSS-Anweisungen in eine Zeile, der Übersichtlichkeit halber jetzt mal nicht.)

Kategorien
Kommunikation Webdesign/Gestaltung

Frisöre und das Internet

Ich suchte nach Frisören – Synonym für Hairstylisten, Friseurinnen, Haarschneidemenschen – im Internet, da meine Frisörin irgendwie immer ausgebucht ist und es langsam dringend wird auf meinem Kopf Haare zu kürzen und ich ja gerne mal etwas ungeduldig bin (ohne anderen Menschen dabei großartig zu schaden.) Gar nicht so einfach. Klar, es gibt Qype, aber ich fürchte langsam, dass da viele Empfehlungen gefälscht sind und überhaupt. Auch wenn ich da Poweruser oder so bin. Zurück zum Thema:

Frisöre und das Internet. Mal davon ab, dass manchen Frisören kein Wortspiel mit Haaren und Köpfen und zu dumm ist, haben viele zudem noch miserable Internetseiten. Manche setzen noch auf Flash, andere haben Preislisten von vor drei Jahren, manche erst gar keine und ich möchte gar nicht wissen, wieviele Frisöre erst gar nicht mit einer einfachen Google-Anfrage zu finden sind. Hier besteht wirklich Nachholbedarf. Was jetzt irgendwie nach Politikersprech klingt. Mhh, egal.

Ich selbst bin übrigens abgeschreckt, wenn eine Frisör-Website zu gut aufgemacht ist und mir blonde Strahle-Mädels entgegenblicken, die nur darauf warten, meine Haare anzufassen und mit der Schere zu hantieren. In erster Linie möchte ich ja eigentlich nur einen Haarschnitt, vielmals wirkt es aber so, als würde jeder neue Kunde erstmal komplett durchgestyled werden und das RTL-Team ist auch live vor Ort um davon zu berichten.

Kategorien
Webdesign/Gestaltung

Web-Design heute

Ich wollte etwas Ordnung in meine Gedanken bringen und sortieren, was zur modernen Webseiten-Gestaltung dazugehört. Dazu muss ich sagen, dass ich vieles nicht ausprobiert habe, das ich mal hätte ausprobieren sollen.

Bild-Optimierung

SEO

Geschwindkeit

CDN

Kategorien
Linktipps Typographie Webdesign/Gestaltung

“[…] using only one font size throughout the site.“ – Elliot Jay Stocks‘ Redesign

Die Tage hat Elliot Jay Stocks seiner Website/seinem Blog ein neues Layout verpasst das mir sehr zusagt. Sehr interessant fand ich in den Zusammenhang folgenden Satz (Hervorhebung durch mich):

My apologies to my good friend and studio mate Jon Tan, because I completely nicked his idea for using only one font size throughout the site.

Das zieht er wirklich konsequent durch – bis auf die Kommentare – und überall ist der Text 16px groß, egal ob Überschrift, Fließtext oder Seitenleisten. Hervorhebungen sind durch permanente Großschreibung (Überschriften), Unterstreichung (Links), Schrägstellung sowie großzügige Abstände und Linien gekennzeichnet, Überschriften sind zudem gesperrt. Links sind zudem nicht in der Textfarbe sondern leicht grünlich (#9C6) unterstrichen. Als Schrift kommt die Skolar zum Einsatz.

Ich bin mir noch nicht sicher ob auch wirklich jeder die Überschriften gleich als Überschriften wahrnimmt, ich zumindestens habe es noch ein wenig schwer. Kann aber auch am Monitor liegen.

Kategorien
Frontend: HTML5, CSS3, jQuery Gestaltung und Design Mediengestalter-Ausbildung Webdesign/Gestaltung

Wahre Worte zur Webdesigner-Berufswahl

Designers who don’t want to write code: become a print, interior, industrial or fashion designer. FFS do NOT become a web designer! – Rachel Lehman

Kategorien
Webdesign/Gestaltung

Speicherst du noch für Web und Geräte oder optimierst du schon?