Ich weis nicht wie es euch geht, aber ich bekam immer kleine Schweißausbrüche sobald ein Kunde in einem skalierbarem Layout abgerundete Ecken für Boxen oder dergleichen haben wollte.
Nicht dass solche Rundungen nicht schick aussehen würden, doch aus semantischer Sicht bzw. aus Sicht auf Punkto “Wartbarkeit” war das für mich bisher immer ein Graus.
Was sich früher durch monströse Tabellenkonstrukte eh mehr schlecht als recht umsetzen ließ benötigte bis vor kurzem auch bei tabellenfreien Layouts meist bis zu vierfach verschachtelte DIV-Elemente, pro Box versteht sich.
Weil ich eigentlich immer versuche meinen Quelltext so übersichtlich und schlank wie nur möglich zu halten habe ich mich daher bisher oft vor den Rundungen gefürchtet.
Damit macht das gerade entdeckte jQuery-Plugin jQuery Roundcorners Canvas nun anscheinend endlich Schluss. Das Plugin scheint alle Faktoren die man an solch ein Script stellen könnte zu vereinen:
- kein zusätzliches Markup im Quelltext
- leicht konfigurierbar
- Ecken werden weich dargestellt (Antialiasing)
- es werden keine Grafiken benötigt
- es sind ebenfalls abgerundete Ränder möglich
- Rundungen können nur auf einzelne Kanten gesetzt werden
- funktioniert sowohl im IE6, IE7, Firefox, Safari und Opera
- ohne JS werden normale Kanten angezeigt
- zusätzliches Ladevolumen im Firefox mit GZip ca. 3KB, im IE6/7 ca. 7KB
Zum Ladevolumen muss zusätzlich natürlich noch das jQuery-Framework gerechnet werden.
Sicherlich, bei einer einzelnen und relativ festen Box macht das Plugin wahrscheinlich keinen wirklichen Sinn. Soll jedoch eine Box in der breite/höhe flexibel sein und zudem Ihre Farbe evtl. auch einmal schnell wechseln können, so ist das Plugin sicherlich eine echte Bereicherung.
Wo ich noch keine Schlüsse ziehen konnte ist die Performance. In der Demo konnte ich jetzt auf die schnelle keine Geschwindigkeitseinbußen feststellen, aber vielleicht sieht das auf älteren Systemen ja anders aus?
