Die Software WebCode spricht den ambitionierten Web-Coder aber durchaus auch den Standard Web-Blogger an. WebCode unterstützt beim Design und bei der Umsetzung von Elementen für Internetinhalte.
Der ehrgeizige Seitenbetreiber greift in Zeiten von CSS 3 und HTML 5 so gut wie kaum auf Bilder für Designelemente zurück. Statt dessen wird bzw. sollte das Design ausschließlich mit CSS umgesetzt werden.
Doch mit den Möglichkeiten steigt auch die Komplexität und immer mehr Wissen und Zeit wird benötigt. Wieso sollte dann keine Software genutzt werden, die einem bei der Gestaltung aber auch gleichzeitig beim Schreiben von Code behilflich ist?
Eine grandiose neue Software, die dies kann, ist WebCode.
Aus meiner Sicht ist das bisher eine einmalige App, die einem bei dieser Aufgabe behilflich ist.
WebCode ist eine Vektor-Zeichen-App mit direkte Codeerzeugung und bietet umfangreiche Möglichkeiten. So lassen sich damit unterschiedliche Objektarten erstellen, die anhand von Eigenschaften angepasst werden können.
Als Beispiel möchte ich einen Button erstellen, mit abgerundeten Ecken, Schatten, Text und Rahmen. Grundsätzlich für den erfahrenen CSS-Profi keine schwierige Angelegenheit. Doch zum einen ist die Umsetzung mit Zeitaufwand verbunden, zum anderen birgt die Eigenumsetzung immer eine Fehleranfälligkeit mit sich und auch die Browser-Kompatibilität darf auch nicht vergessen werden.
WebCode erstellt aus den Design-Objekten validen HTML + CSS, JS- oder SVG-Code, der mit den gängigen Browsern funktionieren soll.
Es lassen sich damit aber nicht nur Standard Design-Objekte, sondern auch eigene Formen erstellen. Da diese mit Hilfe von CSS nicht umgesetzt werden können, greifen die Macher von WebCode auf das Canvas-Element + JavaScript oder SVG zurück.
Die Oberfläche von WebCode ist sehr intuitiv aufgebaut und ist an bekannte Entwicklungsumgebungen orientiert.
Über die Toolbar lassen sich die möglichen Objektarten und Werkzeuge auswählen.
Der ausgewählte Objekttyp wird dann im Hauptbereich mit der Maus per ziehen erstellt. Ist ein Objekt selektiert, können die möglichen Eigenschaften im linken Fensterbereich bearbeitet werden.
Hierfür gibt es intuitive Assistenten, die bei der Einrichtung von Attributen behilflich sind. So wird zum Beispiel ein Textschatten mit wenigen Mausklicken erstellt, mit einer direkten Live-Vorschau. Alle anderen möglichen Attribute werden per Auswahl geändert, wobei alle möglichen Werte vorgegeben sind.
Erstellte Objekte können unter anderem mit Hilfe von weiteren Funktionen, gruppiert, verbunden, vergrößert oder gedreht werden.
Ein gutes Beispiel wie sehr WebCode einen Zeit und Nerven spart, ist, einen Gradienten zu erzeugen. Mit WebCode lassen sich alle Schritte im Handumdrehen per Assistent per Interface erzeugen.
Unter dem Hauptbereich wird der erzeugt Code angezeigt. Dadurch ist gleich ersichtlich, welche Attribute geändert wurden.
Für die Codeerzeugung gibt es die Möglichkeit, zwischen HTML + CSS, JavaScript + Canvas sowie SVG auszuwählen. Der Code kann entweder direkt aus den Anzeigebereichen für die Weiterverwendung kopiert werden oder aber per Export-Assistent gespeichert werden.
Erstellte Farben, Gradienten, Schatten und Bilder werden für eine spätere Weiternutzung im Dokument abgespeichert.
Für Objekte, die in CSS nicht nativ umgesetzt werden können, wird eine Warnung angezeigt, so dass jederzeit einzusehen ist, ob der aktuelle Entwurf für die spätere Ausgabe sinnvoll ist.
Doch nicht nur CSS-Output gehört zu den Anwendungsgebieten von WebCode. Die Erzeugung von JavaScript und Canvas hilft bei der Erstellung von interaktiven Elementen oder außergewöhnlichen Formen. Der SVG-Export erstellt skalierbare Vektor-Bilder zum Beispiel für beeindruckende Info-Grafiken.
WebCode gehört nicht zu der Kategorie der 0,89 Cent Apps und ist in der Anschaffung etwas hochpreisig. Auf der anderen Seite hat Qualität seinen Preis und die eingesparte Zeit wird den Kaufpreis schnell wieder ins positive umwandeln.
Von daher für Schnellentschlossene hier die Chance zum sofortigen Download.
[appbox appstore screenshots 570644822]
WebCode ist von meiner Seite aus eine klare Kaufempfehlung für jeden, der seinen Webauftritt selbst gestaltet und pflegt. Anstatt mit Copy & Paste von Designelementen anderer Webseiten zu arbeiten, kann hiermit jeder selbst im Handumdrehen kreative und individuelle Webseitenelemente erstellen.
WebCode ist ausschließlich im Mac App Store erhältlich. Eine Testversion kann auf der Internetseite vom Hersteller PixelCut geladen werden.
Jetzt bist du gefragt!
Gefällt dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.
Sowohl der Artikel, wie auch die Anwendung gefallen mir ausgesprochen gut. Auch wenn ich nicht direkt Web-Entwicklung betreibe, brauche ich doch immer wieder mal einen guten CSS und/oder HTML und/oder SVG Editor. Da käme mir WebCode gerade recht.
Somit vielen Dank für die App-Vorstellung. WebCode steht auf meiner Einkaufsliste :)