LautundKlar Webdesign Blog

Buttons mit CSS gestalten

Ein Bild basierender CSS-Button (schöne Übersetzung), der sich an die Textgröße bzw. Textmenge, die er beinhaltet automatisch anpasst:

Creating bulletproof graphic link buttons with CSS

Skalierbare CSS Buttons mit PNG-Grafik und JavaScript:
Scalable CSS Buttons Using PNG and Background Colors

Popularity: 35% [?]

Safari für Windows

Der Internet Explorer für den Mac hatte ja eindeutig versagt und wird auch seit langem nicht mehr weiter entwickelt.

Apples Browser Safari hingegen, zählt zu den schnellsten und besten Browsern überhaupt. Schön zu hören, dass es den Safari jetzt auch für Windows gibt:
Safari für Windows

Apple.com in neuem Gewand

Nicht nur der Safari für Windows ist neu, nein auch die Apple Webseite wurde nach über 6 Jahren komplett neu gestaltet.

Sehr reduziertes, schnörkelloses Design, mit übersichtlicher Navigation mit Slider und Accordion Navigation, die den Umfang der Seite und die Produktvielfalt gut bewältigen: www.apple.com

Popularity: 32% [?]

Full Page Test – Websites testen

Der “Full Page Test” lädt eine komplette HTML Seite einschließlich alle Objekte (Bilder, CSS, Javascript, RSS, Flash und Frames/Iframes).

Er simuliert das Laden einer Webseite im Web-Browser. Die Ladezeiten der einzelnen Objekte werden übersichtlich in Diagrammen dargestellt. Jeder Test zeigt auch allgemeine Statistiken über die geladene Seite, wie die Gesamtzahl der enthaltenen Objekte, die gesamte Ladezeit und die Gesamtgröße einschließlich aller Objekte.

Ein praktisches Tool das einem zeigt, dass eine Webseite mit allen Grafiken sowie CSS- und Javascript- Dateien (und sonstigen Objekten) doch schnell recht groß werden kann: Full Page Test

Popularity: 28% [?]

15 Tipps & Tricks zu Photoshop

Das Arbeiten mit Adobe Photoshop kann mit einigen Shortcuts erheblich erleichtert werden. Hier nun 15 praktische Tipps die im Umgang mit Photoshop auch einiges an Zeit sparen helfen:

1. Durch Drücken der Tabulator-Taste werden die Toolbar und alle anderen Fenster ausgeblendet, mit Shift+Tab bleibt die Toolbar sichtbar.
2. Durch Doppelklick auf den grauen Hintergrund wird das Datei-öffnen-Fenster aufgerufen, mit gleichzeitig gedrückter Shift-Taste öffnet sich der Datei-Browser.
3. In Photoshop kann man alle Cancel /Abbrechen-Buttons in einem Fenster durch Drücken der Alt-Taste in einen Reset-Button umwandeln.
4. Durch Doppelklick auf den oberen blauen Balken der Fenster in Photoshop, werden diese minimiert.
5. Um eine gerade Linie zu zeichnen, einmal am Anfangspunkt klicken, dann am Endpunkt nochmals mit gedrückter Shift-Taste klicken.
6. Beim Transfomieren eines Bildes mit Strg+T, bewirkt das zusätzliche Drücken der Alt-Taste, dass die ursprüngliche Ebene dupliziert wird und die Transformation auf die duplizierte Ebene angewndt wird. Mit Strg+Shift+T wird die letzte Transformation erneut durchgeführt.
7. Man kann in Photoshop auch Winkel messen: Hierzu einfach mit dem Messure Tool (i-Taste und das entsprechende Werkzeug auswählen) eine Linie ziehen und am Endpunkt mit gedrückter ALT-Taste (im gewünschten Winkel zur ersten) eine zweite Linie ziehen. Somit wird der Winkel zwischen den beiden Linien gemessen.
8. Mit gedrückter Leertaste wird jedes Werkzeug zum Hand-Tool bis man die Leertaste wieder losläßt.
9. Mit gedrückter Strg-Taste wird jedes Werkzeug zum Move Tool bis man die Strg-Taste wieder losläßt.
10. Durch Drücken der F-Taste, kann man zwischen den drei Screen-Modi wechseln, wodurch man mehr Platz zum arbeiten erhält.
11. Mit dem Zoom Tool kann man mittels Strg+Leertaste einzoomen und mit Alt+Leertaste auszoomen.
12. Gedrückte Strg-Taste und “+” oder “-” ändert die prozentuale Vergrößerungstufe eines Bildes. Mit zusätzlich gedrückter Alt-Taste wird das gesamte Fenster vergrößert bzw. verkleinert.
13. Alt+Backspace und Strg+Backspace füllt die gesamte Bildfläche oder Auswahl mit der Vordergrundfarbe bzw. mit der Hintergrundfarbe. Shift+Backspace blendet das Otionsfenster ein.
14. Mit der Pipette kann man ganz einfach die Vordergrundfarbe auswählen, wenn man dazu noch die Alt-Taste drückt wird die Hintergrundfarbe gewählt. Drücken der X-Taste bewirkt, dass zwischen Vorder- und Hintergrundfarbe gewechselt wird.
15. Mit Strg + D kann man Auswahlen aufheben, mit Strg+Shift+D kann man die aufgehobene Auswahl wieder einblenden.

Popularity: 34% [?]