/ Sonstiges: Pixellineal

[Christoph Schnauß]

hallo Forum,

ich habe grade mit einem Auftraggeber zu tun, der mir für seinen Webauftritt und sein Intranet anhand eines "StyleGuide" auf vielen Dutzend (PDF-)Seiten vorschreibt, wieviele Pixel Abstand Überschriften zu Texten, Bilder zu Containerseiten, Fußzeilen zu Inhaltscontainern usw. zu haben haben. Das geht so weit, daß ich für die beschriftung eines "Labels" exakt 6 Pixel einzuhalten habe, bis dann der entsprechende Button erscheinen darf.

Nun ist "Pixel" keine wirklich exakte Maßeinheit für den Monitor (im Druck sieht das vermutlich anders aus, da macht diese Maßeinheit Sinn). Ich möchte es also auf "em" umstellen und habe dabei auch gesehen, daß eine Agentur, die zu nicht wirklich zufriedenstellenden Ergebnissen kam, bereits solches irrsinniges Zeugs wie "79.86868686em" in die vorhandene CSS hineingeschrieben hat. Ich darfs nun richten. Gegen ziemlich gutes Geld.

ABER: es wird am Ende eine Qualitätskontrolle geben, was ja im Prinzip nix Schlimmes ist, sondern - sofern da ein einigermaßen kompetenter Kollege sitzt - sogar begrüßt werden muß. Vielleicht findet der ja noch irgendwas, was man übersehen hat und streicht es an, so daß man sich nach Behebung des Fehlers nicht weiter schämen muß ...

Hier ist bei meinem Auftraggeber aber leider damit zu rechnen, daß der (mir bisher völlig unbekannte) Kollege ein "Pixellineal" anlegt und zum Beispiel nachmißt, ob ich zwischen zwei hellgrau eingefärbten DIVs tatsächlich das geforderte eine Pixel Abstand eingehalten habe, ob zwischen einer H1-Überschrift und dem darunter beginnenden DIV tatsächlich 7 Pixel Abstand eingehalten wurden usw.

Mir ist nun bereits des öfteren der Begriff Pixellineal begegnet. Allerdings habe ich immer noch keines, das mich tatsächlich überzeugt.

Wie seht ihr das? Ist so ein Ding tatsächlich zu irgendwas nutze, wenns um ein Seitenlayout geht? Und welches könnte man denn nehmen?

Grüße aus Berlin

Christoph S.

[wahsaga]

hi,

Wie seht ihr das? Ist so ein Ding tatsächlich zu irgendwas nutze, wenns um ein Seitenlayout geht?

Nein, vermutlich nur dann, wenn man Print für's Web machen will/soll.
Aber danach klingt's ja andererseits auch wieder ...

gruß,
wahsaga

[Klawischnigg]

Hi there,

ich habe grade mit einem Auftraggeber zu tun, der mir für seinen Webauftritt und sein Intranet anhand eines "StyleGuide" auf vielen Dutzend (PDF-)Seiten vorschreibt, wieviele Pixel Abstand Überschriften zu Texten, Bilder zu Containerseiten, Fußzeilen zu Inhaltscontainern usw. zu haben haben.

Das hat ihm sicher eine Werbeagentur eingeredet.

Nun ist "Pixel" keine wirklich exakte Maßeinheit für den Monitor

Kennst Du eine exaktere?

Wie seht ihr das? Ist so ein Ding tatsächlich zu irgendwas nutze, wenns um ein Seitenlayout geht? Und welches könnte man denn nehmen?

Ich verwende dafür PixLin, das ist ganz ok, wenn man soetwas braucht...

[rob]

Hi!

Mir ist nun bereits des öfteren der Begriff Pixellineal begegnet. Allerdings habe ich immer noch keines, das mich tatsächlich überzeugt.

Also ich arbeite mit dem Firefox-Addon MeasureIt.
Ob das was für dich ist, kann ich nicht sagen. Aber wenn der Firefox der Browser deiner Wahl ist, dann kannst du ja mal einen Blick auf das Ding werfen.
Es ist eigentlich nichts besonderes. Hat auch nicht viele Features. Ist halt nur ein Tool zum Vermessen...
Läßt sich aber als kleines Icon ganz gut in die Statuszeile integrieren und erfüllt seinen Zweck.
Ich finde das Ding recht praktisch. Schlicht und einfach.

Wie seht ihr das? Ist so ein Ding tatsächlich zu irgendwas nutze, wenns um ein Seitenlayout geht?

Wie ich das sehe? Vermutlich genauso wie du...
Ich ziehe Fluid Layouts vor. Ich möchte, daß meine Seiten unabhängig von einer bestimmten Auflösung funktionieren.
Egal ob ein User mit dem Handy oder einem riesigen Monitor surft.
Die "Optimierung" auf eine bestimmte Auflösung halte ich für großen Mist.
Aber nichts desto trotz finde ich dieses Firefox-Addon sehr hilfreich.
Dabei geht es mir allerdings meist nicht um pixelgenaue Gestaltung/Positinierung, sondern ich möchte des öfteren mal was nachmessen.

Tja und ab und zu kommt es auch mal vor, daß ein Kunde einen bestimmten Wunsch hat und ich ihm dann ein Design, daß er vielleicht in Photoshop erstellt hat, pixelgenau in eine Website umsetzen soll.
Dann bekommt er dies natürlich...

Schöner Gruß,
rob

[Klawischnigg]

Hi there,

Egal ob ein User mit dem Handy oder einem riesigen Monitor surft.

Ja, das sind dann die Anwender, die vor einem cinemaskopähnlichen Monitor sitzen und die vom den Nackenschmerzen her das Gefühl haben, ein Tennisspiel betrachtet zu haben, wenn sie zu lange auf Deine "flüssige" Seite starren...

[Johannes Zeller]

Hallo Klawischnigg,

Ja, das sind dann die Anwender, die vor einem cinemaskopähnlichen Monitor sitzen und die vom den Nackenschmerzen her das Gefühl haben, ein Tennisspiel betrachtet zu haben, wenn sie zu lange auf Deine "flüssige" Seite starren...

Wer einen großen Monitor hat, muss eben das Browserfenster kleiner machen. Das sollte nun wirklich jeder schaffen. ;-)

Schöne Grüße,

Johannes

[Klawischnigg]

Hi there,

Wer einen großen Monitor hat, muss eben das Browserfenster kleiner machen. Das sollte nun wirklich jeder schaffen. ;-)

Naja, ob das Aussehen der Seite dann von der Auflösung oder der Wahl des Viewports abhängt ist auch schon fast egal, obwohl ich natürlich einräume, daß letzteres einfacher zu ändern ist.

Was nichts daran ändert, daß das pixelgenaue Design in fast allen Fällen Unfug ist meist nur ahnungslosen Graphikergehirnen in Werbeagenturen entspringt. Wie überhaupt die meisten Seiten für die Auftraggeber und nicht für die Betrachter gemacht werden, die sich einen Dreck um irgendein Design kümmern, aber das ist eine andere Geschichte...

[Orlando]

Mir ist nun bereits des öfteren der Begriff Pixellineal begegnet. Allerdings habe ich immer noch keines, das mich tatsächlich überzeugt.

Free Ruler. Zum Messen von Unix Enlargement, nicht von DOSchen.

Roland

[Christoph Schnauß]

hallo Roland,

Free Ruler

"Note: Free Ruler is only available for Mac OS X." Hm. Damit hat sichs leider.

Grüße aus Berlin

Christoph S.

[Sven Rautenberg]

Moin!

ich habe grade mit einem Auftraggeber zu tun, der mir für seinen Webauftritt und sein Intranet anhand eines "StyleGuide" auf vielen Dutzend (PDF-)Seiten vorschreibt, wieviele Pixel Abstand Überschriften zu Texten, Bilder zu Containerseiten, Fußzeilen zu Inhaltscontainern usw. zu haben haben. Das geht so weit, daß ich für die beschriftung eines "Labels" exakt 6 Pixel einzuhalten habe, bis dann der entsprechende Button erscheinen darf.

Wenn der Styleguide Pixel vorschreibt, dann verwende Pixel.

Nun ist "Pixel" keine wirklich exakte Maßeinheit für den Monitor (im Druck sieht das vermutlich anders aus, da macht diese Maßeinheit Sinn).

Du verwechselst wieder mal alles komplett. Pixel sind für den Monitor die beste Einheit (wenn man mal freies Skalieren außenvor läßt), beim Ausdruck hingegen ist sie komplett fehl am Platz.

Ich möchte es also auf "em" umstellen und habe dabei auch gesehen, daß eine Agentur, die zu nicht wirklich zufriedenstellenden Ergebnissen kam, bereits solches irrsinniges Zeugs wie "79.86868686em" in die vorhandene CSS hineingeschrieben hat. Ich darfs nun richten. Gegen ziemlich gutes Geld.

Wenn du Pixelvorgaben hast, dann gibt es genau zwei mögliche Lösungen:
1. Kämpfe gegen die Pixelvorgabe.
2. Nutze Pixel zur Umsetzung der Pixelvorgabe.

Und ignoriere dabei einfach die Tatsache, dass der IE6 dann die Schrift nicht mehr vergrößert - es ist deinem Kunden sowieso egal. Design ist alles, Schriftskalierung ist nichts.

- Sven Rautenberg

[Christoph Schnauß]

hallo Sven,

ignoriere dabei einfach die Tatsache, dass der IE6 dann die Schrift nicht mehr vergrößert - es ist deinem Kunden sowieso egal. Design ist alles, Schriftskalierung ist nichts.

Nein, genau die "Schriftskalierung" ist etwas, worauf sogar allergrößter Wert gelegt wird.

Grüße aus Berlin

Christoph S.

[Sven Rautenberg (off site)]

hallo Sven,

ignoriere dabei einfach die Tatsache, dass der IE6 dann die Schrift nicht mehr vergrößert - es ist deinem Kunden sowieso egal. Design ist alles, Schriftskalierung ist nichts.

Nein, genau die "Schriftskalierung" ist etwas, worauf sogar allergrößter Wert gelegt wird.

Dann kann er keine Pixelabstände einfordern. Bzw. du sie nicht liefern. Denn Browser runden unterschiedlich - wie ich gerade schmerzhaft erfahre, sogar dann, wenn es darum geht, eine 12px-Schrift in einer 15px line-height zu platzieren. Abweichung von einem Pixel, die in Relation zu einem platzierten Hintergrundbild echt blöd aussehen kann...

Natürlich kannst du mit em-Einheiten bis in die sechste Nachkommastelle versuchen, was zu retten. Vielleicht klappt das dann auch bei den meisten Browsern. Unter bestimmten Konstellationen. Es wird nur tierisch unübersichtlich, weil du die ganzen Vererbungsprobleme mitberücksichtigen mußt. 6px sind eben nicht überall 0,5618723em, sondern hängen von der Schriftgröße ab, die sich in Relation dort befindet.

Um's nochmal klar zu sagen: Ich hab nichts gegen em. Das ist eine prima Einheit für anpassungsfähige Designs. Sie ist nur dann absolut ungeeignet, wenn das Design Pixelvorgaben macht, und für den Fall der Schriftgrößenänderung keine Angaben vorsieht.

Im Grunde genommen wird es das Beste sein, wenn du deinen Kunden fragst, wie du das Problem angehen sollst. Wenn der sich von den Pixeln lösen kann, kannst du problemlos em nehmen (und dich mit der Vererbungsproblematik rumärgern, was vermutlich die Herausforderung ist). Wenn er das nicht kann, dann wähle px und integriere irgendeine Art von Schriftgrößenresizer für den IE6. Das wäre meine Herangehensweise.

- Sven Rautenberg

[Christoph Schnauß]

hallo Sven,

genau die "Schriftskalierung" ist etwas, worauf sogar allergrößter Wert gelegt wird.
Dann kann er keine Pixelabstände einfordern. Bzw. du sie nicht liefern.

Jaein. Vielleicht sollten wir mal an Beispielen schauen, wann Browser "skalieren" können:
   body * {font-family:Helvetica,Arial,Sans-serif;}
bewirkt beispielsweise, daß Skalierung möglich ist - ist ja auch gar keine Maßeinheit vorgegeben.
   body {font: normal 13px verdana,arial,'Bitstream Vera Sans',helvetica,sans-serif;}

• was übrigens in ungefähr dieser Form in https://redaktion.selfhtml.org/chrome/common/css/trac.css Verwendung findet - bewirkt, daß _keine_ Skalierung möglich ist (eigentlich schade - warum habt ihr das so gemacht?).
     body {font: 69%/130% Arial,Helvetica,Sans-serif;}
  kann dann bewirken, daß innerhalb einer bestimmten Variationsbreite Skalierung möglich wird.

Browser runden unterschiedlich - wie ich gerade schmerzhaft erfahre

Sei versichert, daß ich dir derlei "schmerzhafte" Erfahrungen durchaus gönne, schließlich mache ich sie ähnlich auch gerade.

Natürlich kannst du mit em-Einheiten bis in die sechste Nachkommastelle versuchen, was zu retten.

Ich werde mich hüten. Daran scheint sich mein "Vorgänger" bereits die Zähne ausgebissen zu haben.

6px sind eben nicht überall 0,5618723em

Richtig, und genau deshalb halte ich es für blödsinnig, solche Angaben wie eben "0,5618723em" überhaupt erst vorzusehen.

Im Grunde genommen wird es das Beste sein, wenn du deinen Kunden fragst, wie du das Problem angehen sollst.

Das wäre, wenn der Kunde denn gesprächsbereit wäre, tatsächlich die beste Lösung. Sie funkttioniert nur nicht. Der StyleGuide ist nicht verhandlungsfähig (und gibt Pixel vor), und die Frage nach der Skalierbarkeit ist nicht verhandlungsfähig - Skalierung muß sein. Daß damit eine "Unvereinbarkeit" in den Vorgaben enthalten ist, gehört zu den Dingen, die nicht verstanden werden. Verhandlungsfähig sind einige ganz wenige Farben und Schriftgrößen für <span>. Verhandlungsfähig sind die eingesetzten HTML-Elemente - also, ob ich irgendwo <br /> für nützlich halte, darf ich entscheiden. Und ob ich solche Sachen wie <big> und <strong> einsetze oder stattdessen eben in der CSS die Erscheinungsform festlege, darf ich auch entscheiden.

Nunja, es ist ein "Projekt", das, was auch immer ich vielleicht vorschlage, Ende Juni beendet wird. Daß ich während der Arbeit am Projekt hie und da auf scheinar unlösbare Fragen stoßen könnte (die einzig und allein aus den Vorgaben resultieren), ist meinem "Kunden" nicht beizubringen.

[...] integriere irgendeine Art von Schriftgrößenresizer für den IE6.

Ähhh ... das interessiert mich jetzt aber. Ich habe keine Ahnung, was du mit "Schriftgrößenresizer" meinst. Im übrigen ist IE6 Vorgabe - alle im Konzern haben, wenn sie denn auf das Intranet zugreifen, gefälligst den zu benutzen. Nur in der Entwicklungsabteilung gibt es ein paar Revolutionäre, die sich trauen, ganz heimlich hin und wieder auch mal einen Firefox zu benutzen.

Grüße aus Berlin

Christoph S.

[Patrick Andrieu]

Hallo Christoph!

Ähhh ... das interessiert mich jetzt aber. Ich habe keine Ahnung, was du mit "Schriftgrößenresizer" meinst.

Vermutlich meint Sven eine JavaScript-Möglichkeit, die Schriftgröße anzupassen. Und ja, Du könntest hin und wieder die Seite der hier postenden Kollegen besuchen (Wink).

Viele Grüße aus Frankfurt/Main,
Patrick

[Christoph Schnauß]

hallo Patrick,

Und ja, Du könntest hin und wieder die Seite der hier postenden Kollegen besuchen (Wink).

Mach ich doch - gelegentlich. Bei dirwar ich auch schon - gelegentlich ;-)

Grüße aus Berlin

Christoph S.

[Christoph Schnauß]

hallo Sven,

Du verwechselst wieder mal alles komplett.

Selbstverständlich. Wie immer. Nix Neues für dich. Vermutlich meinst du, ich könne zwischen "px" und "pt" nicht unterscheiden - noch immer nicht.

Pixel sind für den Monitor die beste Einheit (wenn man mal freies Skalieren außenvor läßt), beim Ausdruck hingegen ist sie komplett fehl am Platz.

Es gab darüber bereits (im Archiv sicherlich auffindbare) Glaubenskriege hier im Forum.

Grüße aus Berlin

Christoph S.

[wahsaga]

hi,

Vermutlich meinst du, ich könne zwischen "px" und "pt" nicht unterscheiden - noch immer nicht.

Nun ja, dem Pixel die Berechtigung auf dem Monitor ab-, und dafür im Druck zusprechen zu wollen, hört sich ja zumindest danach an.

gruß,
wahsaga

[Christoph Schnauß]

hallo,

ignoriere dabei einfach die Tatsache, dass der IE6 dann die Schrift nicht mehr vergrößert - es ist deinem Kunden sowieso egal.

Wie bereits angegeben, ist das keineswegs "egal". Da das aber ausschließlich den IE 6 betrifft (alle anderen, die ich bisher probiert habe, können skalieren, auch IE7) gibt es halt die "übliche" Vorgehensweise, indem über einen conditional comment für IE 6 ungefähr sowas festgelegt wird:
  body {font: 70% Arial, Verdana, Helvetica, sans-serif;}
Dann kann auch der IE6 skalieren. Ein kleines Problem sind dabei die 70 Prozent, die nicht wirklich ganz exakt 12px entsprechen. Das scheint sich allerdings so gut wie gar nicht bemerkbar zu machen.

Design ist alles, Schriftskalierung ist nichts.

Ist das eigentlich deine feste und unwiderrufliche Haltung? Ich war bisher der Ansicht, daß Skalierung Bestandteil des möglichen Designs sein sollte.

Grüße aus Berlin

Christoph S.

[ottogal]

Hallo Christoph,

schau dir mal den Ruler von Stefan Heymann an - der leistet mir gute Dienste. (Auch seine anderen Tools verdienen einen näheren Blick!)

Gruß
ottogal

[Bud]

Hi Christoph.

Mir ist nun bereits des öfteren der Begriff Pixellineal begegnet. Allerdings habe ich immer noch keines, das mich tatsächlich überzeugt.

Von den hier vorgeschlagenen Messgeräten überzeugt mich auch keines. Ich benutze seit Jahren eine alte Version von Screen Calipers mit „Be Tiny“ als Skin und kann mir gar nichts besseres vorstellen.

Zu deinem Schriftproblem: So schlimm finde ich die Vorgaben gar nicht, wenn man sie ganz undogmatisch angeht. Es spricht doch überhaupt nichts dagegen, die Schrift in em und die Abstände in Pixel zu definieren. Damit bekommen sie ihre pixelgenauen Abstände und Schriftskalierung noch dazu. Wenn dein Auftraggeber es so will, gib’s ihm doch. ;-)

vg Bud

[andreas]

Hallo,

ich habe grade mit einem Auftraggeber zu tun, der mir für seinen Webauftritt und sein Intranet anhand eines "StyleGuide" auf vielen Dutzend (PDF-)Seiten vorschreibt, wieviele Pixel Abstand Überschriften zu Texten (...)

Ist also ein Kontrollfreak... machs wie Sven sagt (lieber nicht kämpfen), Setze die Vorgaben pixelgenau um, füge einen Javascript-Stylsheet-Wechsler hinzu für die Schriftgrößen, streich das Geld ein und kauf Dir was schönes. Diskutiere mit solchen Leuten nicht rum, wenn er später seine Meinung wechselt, sagst Du, "Vertrag!". Die richtige Vorgehensweise demonstrierst Du ja auf deinen eigenen Seiten...

Gruß, Andreas

[andreas]

Hallo,

Nachtrag:

Setze Dich mit dem Dir "bisher völlig unbekannte"n Kollegen in Verbindung und diskutiere eventuell entstehende Fragen unter "Experten"...

Der Zeitpunkt für Grundlegende Änderungen am Auftrag scheint mir bereits verstrichen, beim nächsten Auftrag weißt Du's ja dann besser, ob man hier vielleicht doch noch etwas diskutieren kann, kannst Du besser als ich beurteilen... Hauptsache, Du krallst Dir den Auftrag ;-)

Gruß, Andreas