Anzeige

mit PhotoShop CS4 HTML/CSS Dateien erstellen

mit PhotoShop CS4 HTML/CSS Dateien erstellen | PSD-Tutorials.de

Erstellt von Pedda, 24.06.2012.

  1. Pedda

    Pedda Pedda

    Dabei seit:
    01.09.2008
    Beiträge:
    12
    Geschlecht:
    männlich
    Software:
    PhotoShop CS4, Bryce, Poser, PhotoImpact
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    Hallo,

    ich möchte gern für eine Webseite, in der ein Bild aus mehreren Teilen besteht, die entsprechenden html/css Dateien mit PhotoShop CS4 erstellen. Dazu gehe ich wie folgt vor...:

    Datei/Für Web und Geräte speichern, in dem Fenster sind diverse Einstellungen... ich klicke rechts oben auf den kleinen Button Menü und wähle Ausgabeeinstellungen bearbeiten...
    dort kann ich dann u.a. html wählen, mit Klick auf weiter dann die Slices (CSS generieren ist markiert) mit weiterem Klick sind dann noch andere Einstellungen, die ich aber vorerst nicht brauche.
    Mit Klick auf speichern wird dann die html-Datei erzeugt, in den CSS-Code enthält.
    Ich will aber eine einzelne CSS-Datei in einem separaten Ordner haben.
    Gibt es eine Möglichkeit, gleich eine CSS-Datei in einem separaten Ordner zu erstellen...?

    Noch eine Frage, wie kann ich mit PhotoShop CS4 eine ganze psd-Datei, inkl. mehrerer Ebenen, in html und css umwandeln bzw. konvertieren...?

    Gruß, Pedda
     
    #1      
  2. Andre_S

    Andre_S unverblümt

    Dabei seit:
    27.05.2011
    Beiträge:
    11.962
    Geschlecht:
    männlich
    Ort:
    B-W
    Software:
    Ps CC, Capture One, PhotoLine, NIK Topaz ...
    Kameratyp:
    FZ1000
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    a. Das geht nur manuel über eine entsprechende Verknüpfung
    b. Wenn du nichts slicen must mach ein Jpeg (bei Tranparenzen ein PNG odr Gif) und schiebe das in dein HTML - Dokument
     
    #2      
  3. patrick_l

    patrick_l Stereotyp(e)

    22
    Dabei seit:
    11.05.2008
    Beiträge:
    7.629
    Geschlecht:
    männlich
    Ort:
    NRW
    Software:
    CS6/CC2017, Affinity, Atom, Brackets, PHPStorm, Pug, Sass, Wacom
    Kameratyp:
    Canon DSLR [...]
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    Etwas mehr ist schon nötig. Im Kopfteil (head) müssten die CSS-Angaben kopiert und in einem externen Dokument (ext. CSS) eingefügt werden. Anschließend wie André schon richtig sagte, dieses entsprechend verknüpfen.

    HTML:
    1.  
    2. <!-- HTML5 -->
    3. <link rel="stylesheet" href="css/style.css">
    4. <!-- (x)HTML -->
    5. <link rel="stylesheet" type="text/css" href="css/style.css" />
    6.  
    Ist so auch nicht richtig. In HTML wird auch nichts einfach herein geschoben. Es gibt zwar WYSIWYG-Editore wie Dreamweaver, aber in der Regel ist der Code am ende recht schlampig.

    Das was Photoshop da an Code produziert ist im übrigen für die Tonne und wie bereits auch an anderer Stelle schon mal von mir erwähnt höchstens als Mockup zu gebrauchen.

    Wenn du deine / die Website ordentlich aufbauen willst, lerne die Grundlagen von HTML und CSS. Anschließend sauber per Hand das Grundgerüst deiner Site in HTML umsetzen und anschließend mit CSS formatieren (stylen).

    Grüße Patrick
     
    #3      
  4. Andre_S

    Andre_S unverblümt

    Dabei seit:
    27.05.2011
    Beiträge:
    11.962
    Geschlecht:
    männlich
    Ort:
    B-W
    Software:
    Ps CC, Capture One, PhotoLine, NIK Topaz ...
    Kameratyp:
    FZ1000
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    Ich denke jeder hat verstanden was ich mit "herein geschoben" meinte. Ob dies manuel oder per Editor geschiet ist jedem selbst überlassen. Das Dreamweafer beim einfachen integrieren eines Bildes "recht schlampigen Code" schreibt ist natürlich ein Gerücht, es sei denn dies erfolgt über eine Datenbankanbindung - da gibt es in der Tat schlankeren Code.
     
    #4      
  5. patrick_l

    patrick_l Stereotyp(e)

    22
    Dabei seit:
    11.05.2008
    Beiträge:
    7.629
    Geschlecht:
    männlich
    Ort:
    NRW
    Software:
    CS6/CC2017, Affinity, Atom, Brackets, PHPStorm, Pug, Sass, Wacom
    Kameratyp:
    Canon DSLR [...]
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    Ich habe es ja auch verstanden, aber all diejenigen die noch nicht mal die Grundlagen beherrschen könnte so schnell mal etwas falsch verstehen.

    Das habe ich auch nicht behauptet. ;)

    Was ich meine ist das ganze WYSIWYG-Konzept vom Dreamweaver und anderen Editoren mit ähnlichen Funktionen. Halt noch nicht ganz ausgereift. Am Ende auch oft ein sehr aufgeblähter Code.

    Liebe Grüße, Patrick
     
    #5      
  6. Pedda

    Pedda Pedda

    Dabei seit:
    01.09.2008
    Beiträge:
    12
    Geschlecht:
    männlich
    Software:
    PhotoShop CS4, Bryce, Poser, PhotoImpact
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    was die Grundlagen von HTML betrifft, ich beherrsche sie zwar nicht wie ein Profi, aber ewas mehr als Grundkenntnisse habe ich.
    Allerdings habe ich Probleme mit CSS...

    @ Andre_S
    was bedeutet: und anschließend mit CSS formatieren (stylen)...?

    Gruß, Pedda
     
    #6      
  7. patrick_l

    patrick_l Stereotyp(e)

    22
    Dabei seit:
    11.05.2008
    Beiträge:
    7.629
    Geschlecht:
    männlich
    Ort:
    NRW
    Software:
    CS6/CC2017, Affinity, Atom, Brackets, PHPStorm, Pug, Sass, Wacom
    Kameratyp:
    Canon DSLR [...]
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    In HTML landen alle bzw. die eigentliche Inhalte der Seite/Site. Mit CSS wird das ganze dann formatiert. Sprich hier wird definiert wie die Seite aussehen soll. Angefangen von den Farben und der Größe deiner Texte als auch die benötigten Grafiken deines Layouts aus Photoshop.

    Grüße Patrick
     
    Zuletzt bearbeitet: 25.06.2012
    #7      
  8. Pedda

    Pedda Pedda

    Dabei seit:
    01.09.2008
    Beiträge:
    12
    Geschlecht:
    männlich
    Software:
    PhotoShop CS4, Bryce, Poser, PhotoImpact
    mit PhotoShop CS4 HTML/CSS Dateien erstellen
    AW: mit PhotoShop CS4 HTML/CSS Dateien erstellen

    habe ich mir fast gedacht, danke für die Auskunft.
    Gruß, Pedda
     
    #8      
x
×
×