Abo
  • Services:

Markupwand: Photoshop-Dateien in HTML und CSS umwandeln

Das Startup Goyaka Labs hat mit dem Markupwand einen Dienst veröffentlicht, der Photoshop-Dateien im .psd-Format in HTML und CSS umwandelt, ohne dazu absolute Positionierungen zu verwenden.

Artikel veröffentlicht am ,
.psd-Dateien in HTML und CSS umwandeln
.psd-Dateien in HTML und CSS umwandeln (Bild: Markupwand)

Markupwand macht aus einer .psd-Datei HTML und CSS. Die Entwickler Alagu, Raj Natarajan und Suren aus Bangalore versprechen sauberen Code ohne absolute Positionierungen. Damit das Ergebnis sinnvoll weiterverwendet werden kann, setzten sie auf Compass und SASS. Ein Webeditor erlaubt es, die verwendeten Klassen zu benennen.

Stellenmarkt
  1. SYNCHRON GmbH, Stuttgart
  2. Diehl Metall Stiftung & Co. KG, Röthenbach an der Pegnitz

Damit Markupwand ein gutes Ergebnis erzielt, sollte die Photoshop-Vorlage in möglichst viele kleine Teile aufgesplittet werden. Jeder logische Textabschnitt sollte eine eigene Ebene erhalten. Jedes Icon oder Bild sollte ebenfalls auf einer eigenen Ebene angeordnet werden, aber auch nicht mehr. Andernfalls würde es nicht als ein Bild ausgegeben werden. Zudem sollte auf Hacks verzichtet werden.

Wer Elemente mit Formen erzeugt statt mit Bildern, erhält im Ergebnis mit CSS gestaltete Buttons statt fertige Grafiken.

Markupwand kann nach der Anmeldung mit einem Google-Account kostenlos genutzt werden. Noch handelt es sich um einen frühen Prototyp, die drei Entwickler planen diverse Verbesserungen. So soll es künftig nicht mehr notwendig sein, eine Seite in viele Teile zu splitten, und es soll möglich werden, auch Tags zu editieren, um semantisches HTML zu erzeugen. Auch die Zahl der erzeugten CSS-Regeln soll in Zukunft deutlich reduziert werden.



Anzeige
Blu-ray-Angebote
  1. 4,25€
  2. 9,99€

Insomnia88 25. Jul 2012

Erläuter mal, weshalb genau out?

Insomnia88 25. Jul 2012

Also kurz, für die Designer gedacht, die entwerfen aber ned coden können und...

hei_zen 24. Jul 2012

Ich bezweifle dass so ein Tool semantisch sinnvollen Code schreiben kann. Wie sollen z.B...


Folgen Sie uns
       


Detroit Become Human - Livestream

Detroit: Become Human hat unseren Chat und Livestreamer Michael Wieczorek überzeugt. Immer wieder und wieder wollten wir wissen, wie es in dem spannenden Sci-Fi-Krimi in unserer(?) Zukunft weitergeht.

Detroit Become Human - Livestream Video aufrufen
Sun to Liquid: Wie mit Sonnenlicht sauberes Kerosin erzeugt wird
Sun to Liquid
Wie mit Sonnenlicht sauberes Kerosin erzeugt wird

Wasser, Kohlendioxid und Sonnenlicht ergeben: Treibstoff. In Spanien wird eine Anlage in Betrieb genommen, in der mit Hilfe von Sonnenlicht eine Vorstufe für synthetisches Kerosin erzeugt oder Wasserstoff gewonnen wird. Ein Projektverantwortlicher vom DLR hat uns erklärt, warum die Forschung an Brennstoffen trotz Energiewende sinnvoll ist.
Ein Bericht von Werner Pluta

  1. Deep Sea Mining Deep Green holte Manganknollen vom Meeresgrund
  2. Klimaschutz Unter der Erde ist das Kohlendioxid gut aufgehoben
  3. Physik Maserlicht aus Diamant

Hacker: Was ist eigentlich ein Exploit?
Hacker
Was ist eigentlich ein Exploit?

In Hollywoodfilmen haben Hacker mit Sturmmasken ein ganzes Arsenal von Zero-Day-Exploits, und auch sonst scheinen die kleinen Programme mehr und mehr als zentraler Begriff der IT-Sicherheit verstanden zu werden. Der Hacker Thomas Dullien hingegen versucht sich an einem theoretischen Modell eines Exploits.
Von Hauke Gierow

  1. IoT Foscam beseitigt Exploit-Kette in Kameras
  2. Project Capillary Google verschlüsselt Pushbenachrichtigungen Ende-zu-Ende
  3. My Heritage DNA-Dienst bestätigt Datenleck von 92 Millionen Accounts

Mars: Die Staubstürme des roten Planeten
Mars
Die Staubstürme des roten Planeten

Der Mars-Rover Opportunity ist nicht die erste Mission, die unter Staubstürmen leidet. Aber zumindest sind sie inzwischen viel besser verstanden als in der Frühzeit der Marsforschung.
Von Frank Wunderlich-Pfeiffer

  1. Nasa Dunkle Nacht im Staubsturm auf dem Mars
  2. Mars Insight Ein Marslander ist nicht genug

    •  /