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. ADLab, keine Angabe
  2. Bosch Gruppe, Hildesheim

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
Top-Angebote
  1. (PCGH-Note 1,6 - Bestnote!)
  2. (u. a. ROG Rapture GT-AC5300 + Black Ops 4 für 303,20€ + Versand statt 345€ im Vergleich, RT...
  3. 79,90€ + Versand (Bestpreis!)
  4. (u. a. GTA V für 16,82€ und The Elder Scrolls Online: Morrowind für 8,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
       


Sky Ticket TV-Stick im Test

Wir haben den Sky Ticket TV Stick getestet. Der Streamingstick mit Fernbedienung bringt Sky Ticket auf den Fernseher, wenn dieser den Streamingdienst des Pay-TV-Anbieters nicht unterstützt. Auf dem Stick läuft das aktuelle Sky Ticket, das im Vergleich zur Vorgängerversion erheblich verbessert wurde. Den Sky Ticket TV gibt es quasi kostenlos, weil dieser nur zusammen mit passenden Sky-Ticket-Abos im Wert von 30 Euro angeboten wird.

Sky Ticket TV-Stick im Test Video aufrufen
Segelflug: Die Höhenflieger
Segelflug
Die Höhenflieger

In einem Experimental-Segelflugzeug von Airbus wollen Flugenthusiasten auf gigantischen Luftwirbeln am Rande der Antarktis fast 30 Kilometer hoch aufsteigen - ganz ohne Motor. An Bord sind Messinstrumente, die neue und unverfälschte Daten für die Klimaforschung liefern.
Ein Bericht von Daniel Hautmann

  1. Luftfahrt Nasa testet leise Überschallflüge
  2. Low-Boom Flight Demonstrator Lockheed baut leises Überschallflugzeug
  3. Elektroflieger Norwegen will elektrisch fliegen

Single Sign-on Made in Germany: Verimi, NetID oder ID4me?
Single Sign-on Made in Germany
Verimi, NetID oder ID4me?

Welche der deutschen Single-Sign-on-Lösungen ist am vielversprechendsten? Golem.de erläutert die Unterschiede zwischen Verimi, NetID und ID4me.
Eine Analyse von Monika Ermert

  1. Verimi Deutsche Konzerne starten Single Sign-on

Zahlen mit Smartphones im Alltagstest: Sparkassenkunden müssen nicht auf Google Pay neidisch sein
Zahlen mit Smartphones im Alltagstest
Sparkassenkunden müssen nicht auf Google Pay neidisch sein

In Deutschland gibt es mittlerweile mehrere Möglichkeiten, drahtlos mit dem Smartphone zu bezahlen. Wir haben Google Pay mit der Sparkassen-App Mobiles Bezahlen verglichen und festgestellt: In der Handhabung gleichen sich die Apps zwar, doch in den Details gibt es einige Unterschiede.
Ein Test von Tobias Költzsch

  1. Smartphone Auch Volksbanken führen mobiles Bezahlen ein
  2. Bezahldienst ausprobiert Google Pay startet in Deutschland mit vier Finanzdiensten

    •  /