9x bewertet

Slicen

von smoothie  |  04.01.2010 um 23:06 h
Grafik Grundlagen
Typ: Grafik Grundlagen
Programm: Photoshop
Stufe:Einfach
Halli hallo liebe Giatu besucher,
erst letztens dacht ich mir so : was könnte man auf giatu ,noch zeigen.Ich dachte mir: Mein gott es gibt schon alles.Bis ich ein Gedankenblitz hatte.

slicen.Ich find eine Grundvorraussetzung für jeden Gfxer,denn so kann man sein Layout besser strukturieren und leichter coden.

Zuerst öffnen wir ein Bild in Photoshop (ich benutze CS3).Ich habe mir erlaubt eins Bild aus
Chibi-gfx zu klauen.Ich benutze dieses hier:

Bild
fangen wir an.Ihr habt es geöffnet.Nun benutz ihr euer Slicewerkzeug.Das Werkzeug sieht so aus:
Bild
Nachdem ihr das habt seht ihr über euch eine Spalte in der ihr Höhe und Breite angeben könnt.Das brauchen wir für unseres nicht.
Mit dem Slicewerkzeug wählt ihr eine Stelle eures gewünschten Bildes aus und lässt danach los.
Bild
Es ist ein bisschen schwer ,die geslicte stelle zu erkennen ,aber wenn man sein Äuglein ein bisschen anstrengt klappt das auch. Smilie
Wie man erkennen kann hat Photoshop die Stellen automatisch geslicet und aufgeteilt.
Bild
Wenn ihr fertig geslicet habt ,geht ihr auf Datei>Für Web und Geräte speichern und speichert das ab.Die geslicten bilder werden in einem Ordner (image) ausgegeben.

Jetzt haben wir schonmal alles geslicet.
Aber wie bekomm ich die HTML-Datei?
Es ist nicht schwer.Ihr geht wieder auf Datei>Für Web und Geräte speichern und drückt auf Speichern.Danach öffnet sich das fenster wo angegeben werden soll wo man die Datei speichert
Das interessiert uns nicht.Was uns interessiert ist dieser Bereich:
Bild
Ihr klickt dann auf Bilder und HTML.
Und voila ! Euer bild wurde geslicet und die HTML seite wurde fertig gestellt.

Bei fragen Bitte per PN oder kommentar.
Ich hoffe ich konnte euch helfen.
Smoothie



10 Kommentare




sehr schön. vielleicht könntest du noch einbauen, wie man sie direkt linkt ;)
am 05.01.2010 um 11:05 Uhr


Zeroine

Für Photoshop-Nutzer sicher ein nützliches Tutorial! :-)
Schön erklärt, aber an der Rechtschreibung solltest du noch ein Bisschen arbeiten. xD

+6 P
am 05.01.2010 um 13:10 Uhr


smoothie

@Zeroine :
ja ich weiß ,aber es war schon ziemlich spät als ich das Tutorial schrieb,vllt liegts daran oder ich kann wirklich nicht schreiben.Ich werde es demnächst korrigieren Smilie


@Naedia: versteh ich nich Smilie Smilie
am 05.01.2010 um 14:19 Uhr


wenn man slicet, kann man auch ein Teil via rechtsklick "Slice-Optionen" mit einem Ziel ausstatten. dann könnte man auch direkt was damit verlinken, aber ist ja nicht so wichtig, also egal XDD
trotzgem gutes tut :p
am 05.01.2010 um 14:42 Uhr


smoothie

achso das meinst du und ich dacht mir so : hää?? Smilie ...kann ich ja auch noch reineditieren ...
am 05.01.2010 um 16:41 Uhr


haha es war 11:05Uhr als ich das geschrieben hab Smilie sorry :p
am 06.01.2010 um 11:04 Uhr


vicyy

ich hätte mir gewünscht,wenn du das noch weiter erklärt hättest.
Bild
so sah das bei mir aus.
muss man da nicht irgendwie einen link setzen oder so?
am 16.02.2010 um 17:34 Uhr


Norah

Ich versteh immer noch nicht genau, wozu slicen gut ist, warum man das macht, wann man es einsetzt und was es einem bringt Smilie
Was stellt man jetzt mit den aufgeteilten Bildern an?

Sorry wenn ich da etwas schwer von Begriff bin Smilie
am 31.03.2010 um 18:13 Uhr


yummy

Beim Slicen kann mein sein Layout in kleinere Bilder unterteilen, was dann vorallem für Besucher von Vorteil ist, denn es dauert nicht so lange bis das komplette Layout geladen hat. So ladet immer ein Bild nach dem anderen und bildet puzzleartig das komplette Layout.
am 31.03.2010 um 18:28 Uhr


Norah

Ah ok, darunter kann ich mir was vorstellen.
Danke!
am 31.03.2010 um 23:50 Uhr