Grundsätzliche Frage: Web-Design mit Adobe XD?

Grundsätzliche Frage: Web-Design mit Adobe XD? | PSD-Tutorials.de

Erstellt von draupnir, 22.05.2020.

  1. draupnir

    draupnir Jens Ulrich

    Dabei seit:
    08.11.2008
    Beiträge:
    231
    Geschlecht:
    männlich
    Ort:
    Kelkheim (Taunus)
    Software:
    Adobe Dimension, Illustrator, Photoshop ; Cheetah 3D, CINEMA 4D; Corel Painter
    Kameratyp:
    Sony Alpha 7R
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Hallo zusammen,
    in der guten alten Zeit habe ich meine Websites in Adobe Fireworks grafisch gestaltet und vorbereitet. Meine div-Boxen dann manuell in Dreamweaver mit XTML und CSS2 erstellt und so weiter. Seit dem ist viel Zeit vergangen und viel Programm gekommen. Ich möchte das grundsätzliche manuelle Coden vermeiden und von einer grafischen Gestaltung zu brauchbaren HTML/CSS-Dateien kommen, an denen man dann noch genug rum schrauben muss.

    Meine Fragen dazu:
    1. Es ist sinnvoll sich in XD einzuarbeiten, um Websites von Grund auf vorzubereiten?
    2. XD hat von Hause aus kein HTML5/CSS3-Export. Es gibt Plug-Ins, die das machen? Welches ist empfehlenswert?
    3. Gibt es ein besseres Programm/Programmkombination um von einer grafischen Gestaltung zu HTML/CSS-Datei zu kommen?

    Danke für eure Antworten im Voraus.

    P.S. ich arbeite auf macOS 10.14 und am Ende sollen TYPO3-Website entstehen.
     
    #1      
  2. TutKit

    TutKit Vollzugriff

    Vollzugriff auf sämtliche Inhalte für Photoshop, InDesign, Affinity, 3D, Video & Office

    Suchst du einen effektiven Weg, um deine Geschäftsideen aber auch persönlichen Kenntnisse zu fördern? Teste unsere Lösung mit Vollzugriff auf Tutorials und Vorlagen/Erweiterungen, die dich schneller zum Ziel bringen. Klicke jetzt hier und teste uns kostenlos!

  3. lachender_engel

    lachender_engel Aktives Mitglied

    Dabei seit:
    23.03.2009
    Beiträge:
    1.340
    Geschlecht:
    männlich
    Ort:
    Die Welt
    Software:
    Adobe Creative Cloud CC, Notepad++, IrfanView, Jetbrains PhpStorm
    Kameratyp:
    Nikon D7200
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Für Deinen Zweck, nein.
    Nein.
    In dem Fall würde ich sagen ist Dein Vorhaben schon beendet. TYPO3 ist ein CMS-System Dort werden Inhalte vom Layout getrennt. Entsprechend müssen dort PHP-Blöcke eingebunden sein. Ich wage es zu bezweifeln, dass es einen Konverter gibt, der aus einer Grafik ein fertiges TYPO3-Theme macht.
     
    #2      
    Myhar gefällt das.
  4. draupnir

    draupnir Jens Ulrich

    Dabei seit:
    08.11.2008
    Beiträge:
    231
    Geschlecht:
    männlich
    Ort:
    Kelkheim (Taunus)
    Software:
    Adobe Dimension, Illustrator, Photoshop ; Cheetah 3D, CINEMA 4D; Corel Painter
    Kameratyp:
    Sony Alpha 7R
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Danke für die Antwort, aber auch für TYPO3 brauche ich ein Layout. Statt der <p>- und andere Inhalte stehen dort dann Variablen, die von TYPO3 gefüllt werden. Trotzdem muss das HTML/CSS-Gerüst ja passen, syntaxfehlerfrei und barrierefrei sein. :)
     
    #3      
  5. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.249
    Geschlecht:
    männlich
    Ort:
    Ö
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Dann wirst du nicht darum herumkommen jemanden zu bezahlen dir diese Templates zu erstellen. Der Grund warum es kein "drag and drop" Editoren mehr gibt ist schlichtweg der, dass diese dies kein wirklich syntaxfehlerfreies, barrierefreies HTML produzieren können.

    Sie können tabellen erstellen und divsuppen generieren, aber das ist für eine moderne Website nicht zielführen.

    Alternativ kannst du dir auch überlegen ein fertiges Theme/Template (wie auch immer das bei Typo3 heißt) zu verwenden/kaufen und dieses dann mit deinem Inahlt zu füllen.
     
    #4      
  6. groove

    groove Nicht mehr ganz neu hier

    Dabei seit:
    27.07.2010
    Beiträge:
    72
    Geschlecht:
    männlich
    Ort:
    Eggendorf
    Software:
    Adobe CC
    Kameratyp:
    Canon EOS 7D, Canon EOS-1DX Mark II
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Wenn du niemanden im Team hast, der mit TYPO wirklich umgehen kann, kann ich dir nur raten, die Finger davon zu lassen. TypoScript ist eine geniale, aber ganz eigene Welt. Von normalem Coding weit entfernt.
    lg
     
    #5      
  7. draupnir

    draupnir Jens Ulrich

    Dabei seit:
    08.11.2008
    Beiträge:
    231
    Geschlecht:
    männlich
    Ort:
    Kelkheim (Taunus)
    Software:
    Adobe Dimension, Illustrator, Photoshop ; Cheetah 3D, CINEMA 4D; Corel Painter
    Kameratyp:
    Sony Alpha 7R
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Danke für Eure Rückmeldungen. Das das Layout am Ende in TYPO3 laden soll, ist für meine Fragestellung völlig unerheblich. Den Schritt von HTML/CSS-Dateien zu einem TYPO3 Template schaffe ich.
    Meine Frage bezog sich auf einen cleveren Weg ohne manuelles Coden von einer grafischen Darstellung der Website zu HTML/CSS-Dateien.

    In zwischen habe ich einige Export-Plug-Ins in XD probiert und fand keines, was meinen Vorstellungen entspricht.
    Ich habe meine Layout zum Texten in Illustrator, bestehend nur aus Rechtecken erstellt, aber siehe da, von dort gibt es keinen (brauchbaren) Weg nach HTML. das war früher auch mal anderes. Einzig der CSS-Export ist gut. Doch der alleine hilft nicht wirklich weiter.
     
    #6      
  8. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.249
    Geschlecht:
    männlich
    Ort:
    Ö
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Mir ist kein Programm bekannt welches das machen kann. Selbst dreamweaver bietet das ja nicht mehr wirklich an. Einfach deshalb weil man so keine sinnvollen, angenehm zu bedienenende Websites erstellen kann.
    Was ich dir empfehlen kann: Verwende ein Framework für Layout wie zB bootstrap. Damit hast du dann den Vorteil dass du dir keine Gedanken machen musst ob es auch auf tablet/mobile passend aussieht.
    Früher war das deshalb anders weil da niemand darauf geachtet hat dass es auf jeder Auflösung gut aussehen muss.
    Du kannst natürlich auch weiterhin die Programme von früher verwenden, dann musst du dich aber darauf gefasst machen dass für zeitgemäße Geräte die Website wohl eher nicht passen wird.

    Ansonsten verwende einen page builder, für Wordpress gibt es da zB elementor und ähnliches, gibt es da für typo3 nichts?
     
    #7      
  9. draupnir

    draupnir Jens Ulrich

    Dabei seit:
    08.11.2008
    Beiträge:
    231
    Geschlecht:
    männlich
    Ort:
    Kelkheim (Taunus)
    Software:
    Adobe Dimension, Illustrator, Photoshop ; Cheetah 3D, CINEMA 4D; Corel Painter
    Kameratyp:
    Sony Alpha 7R
    Grundsätzliche Frage: Web-Design mit Adobe XD?
    Ich habe mich wieder rein gearbeitet und das alte Problem entdeckt: Die Programmen, die HTML/CSS aus grafischen Darstellungen umschreiben, nutzen im CSS den Befehl "position: absolute". Klar, das ist einfach und sieht erst mal richtig aus. Ideal für eine Präsentation von Seiten mit fixen Inhalt. Aber für Textseiten, die sich ausdehnen und/oder scrollen ect., ist das nicht brauchbar. Ein Anpassen in float-div-Boxen ist unumgänglich, also doch manuelles coden.

    Ich schauen mir aber noch an, wie Grafikprogramme responsive Webseiten erstellen. Vllt. ist da der Trick drin versteckt, daß es ohne "position: absolute" geht.

    J.
     
    #8      
Seobility SEO Tool
x
×
×