Webkrauts: Für mehr Qualität im Web.

Artikel

Sanfte Rundungen mit Fireworks

Von Zeit zu Zeit benötigt man in Webseiten-Layouts Kreise, Ellipsen, Bögen und dergleichen. In Abbildung 1 wird durch das Antialiasing (Treppenglättung oder Kantenglättung) zwar der Rand geglättet, aber das Ergebnis ist nicht zufriedenstellend; es sind noch deutlich »Treppchen« sichtbar. Wünschenswert wäre also eine Methode, eine gebogene Kante ohne »Treppchen« zu erzeugen. Mit Fireworks und einem kleinen Trick funktioniert das tadellos.

Die Lösung

Der in Fireworks gezeichneten Form (in diesem Beispiel eine Ellipse) wird ein Rand zugewiesen. Der Rand erhält dieselbe Farbe wie die Form. Als Randeigenschaft verwendet man »Weich abgerundet« (englisch: »Soft rounded«) mit einer Randstärke von 2 Pixeln. Das Antialiasing und der weich abgerundete Rand erzeugen eine sehr saubere Kante und eliminieren den ungewollten Stufeneffekt.

Und so sieht dann das fertige Ergebnis aus. Eine schöne gebogene Form ohne jegliche Stufen.

Zum Autor:

René Grassegger arbeitet seit 2000 als Webdesigner. Zur Zeit plant, designt und erstellt er Typo3 gestützte Webseiten für Unternehmen. Sein Credo ist: Webdesign aus Leidenschaft!

Info:

Sanfte Rundungen mit Fireworks ist Beitrag Nr. 335

Autor:

René Grassegger am 10. Dezember 2007 um 00:00

Kategorie:

Adventskalender 2007

Kommentare

Bitte die Hausregeln beachten. Alle Kommentare werden auf werbliche Links/Nicknames geprüft und gegebenenfalls gelöscht.

1. 1.
   

   Nützlicher Tipp, gefällt mir. Danke.

   Kommentar by Daniel - 10. Dezember 2007 um 00:26

2. 2.
   

   Danke für den Tipp! Ich werde mal probieren, ob andere Software da vielleicht auch mitspielt!

   Kommentar by Marvin - 10. Dezember 2007 um 00:58

3. 3.
   

   Wird oder wurde die Weiterentwicklung von Fireworks durch den Aufkauf von Adobe eigentlich eingestellt?

   Kommentar by Sven Wagener - 10. Dezember 2007 um 10:05

4. 4.
   

   Super Tipp – und funktioniert auch in Gimp: Bei den Einstellungen für die Auswahl außer "Kantenglättung" auch "Kanten ausblenden" markieren und Radius auf 2 einstellen.

   Kommentar by René Fertig - 10. Dezember 2007 um 12:48

5. 5.
   

   Ich kann nur soviel sagen, dass einige Änderungen hinzugekommen sind seit der letzten Version. Ob die von Adobe oder noch von MM gemacht wurden kann ich nicht sagen.

   Was direkt von Adobe kommt ist die jpg-Engine von Photoshop die anscheinend Fireworks CS3 spendiert wurde.

   DW CS3 hat sich nicht viel interessantes geändert aber Fireworks hat einige nette neue Features.

   HTH
   René

   Kommentar by Rene Grassegger - 10. Dezember 2007 um 16:44

6. 6.
   

   Für Fireworks-User ist diese Funktionalität selbstverständlich. Ich hoffe, das Adobe diese wirklich hervorragende Programm nicht wegrationalisiert, und kann jedem empfehlen es mal auszutesten. Die die meisten von uns nutzen wahrscheinlich nur 40-50%, der Funktionalität en von Photoshop oder Illustrator, In Fireworks sind diese("beschränkten funktionalitäten"), meiner Meinung nach perfekt vereint.

   Kommentar by Julian Mengel - 11. Dezember 2007 um 23:33

7. 7.
   

   Hallo Julian,

   ich verwende es seit seit über 5 Jahren und es ist sehr vielseitig, mit der totalen Ausrichtung auf Web. Ich verwende auch viel Photoshop, aber so schnell und einfach wie mit Fireworks gehts meistens nicht. Außerdem bin ich mit der Vektor/Bitmap Arbeitsweise sehr zufrieden.

   Die Userbase ist zu groß, dafür ist Adobes eigenes Programm "Image Ready" gefallen und Fireworks wurde behalten. Ein Schritt den ich nur begrüßen kann.

   Auch ein nettes Feature sind die vorgefertigten Libraries in FW, z.b. Formularelemente.

   Früher habe ich Sie selbst gezeichnet oder per Screenshot geklaut und umgebaut.

   Auch das Animieren von Gifs geht mit FW viel besser von der Hand als mit Image Ready.

   Zu meckern hat man aber z.b. Bei der Behandlung von Schriften + Anti Aliasing, das kann Photoshop einfach schöner finde ich.

   Auch ein paar kleine Photobearbeitungsfunktionen wären noch nett gewesen.

   Störend finde ich an FW CS3 den Resourcenverbrauch. Der meiner Meinung nach deutlich gestiegen ist.

   Da ich vorkurzem auf CS3 umgestiegen bin und mein bis dahin verwendter PC (2.4 GHz, 2 GB RAM) deutlich zu schnaufen hatte.

   Mit Dualcore 2.1 GHz/2 GB RAM ist aber wieder alles in Butter.

   lg
   René

   Kommentar by Rene Grassegger - 12. Dezember 2007 um 09:51

Kommentar-Feed für diesen Beitrag

Entschuldige, das Kommentarformular ist zurzeit geschlossen.