Thumbnail erstellen mit Rahmen und/oder runden Ecken

[TempuzFugit]

Hallo zusammen,

ich suche für meinen Mac ein Programm, mit dem ich Thumbnails von Bildern für meine Webseite erstellen kann. Diese Thumbnails sollten aber runde Ecken haben oder es sollte ein Rahmen hinzugefügt werden können. So ähnlich wie bei visuallightbox. muss keine freeware sein.


Gruß
Chrissie

 

[Dante101]

Gimp (Freeware) oder Photoshop (kostenpflichtig)

 

[TempuzFugit]

Gibts ein Programm mit denen ich mehrere Fotos auf einmal bearbeiten kann?

 

[Synoxis]

Das kann die Stapelverarbeitung von Photoshop

 

[Gokoana]

Gibts ein Programm mit denen ich mehrere Fotos auf einmal bearbeiten kann?

Nicht auf einmal – immer nur eins nach dem anderen, was mit der bereits erwähnten Stapelverarbeitung von Photoshop ganz gut funktioniert.

 

[Kiteman]

Hi,

spar Dir die Arbeit. Thumbnails mit Rahmen für die Webseite macht man heute unkomplizierter mit CSS, ausser es soll noch mit Netscape 3.0 Gold funktionieren

Das heisst wenn Du morgen einen anderen Rahmen willst, weil das Web Design sich ändert musst Du nicht wieder alle Bilder erneut im "Stapel" ändern und aufladen, sondern änderst nur das über CSS gesetzte Hintergrundbild.

Hier ein Bsp. mit einem Bilderrahmen als Hintergrund und das Bild im Vordergrund.

http://www.apartment.gotaormina.com/de/ferienwohnung

Viele Erfolg
Kiteman
www.noesis.de

 

[Gokoana]

Kurze Zwischenfrage: Ich habe für einen Kunde eine Internet-Seite gestaltet, in der alle Bilder einen etwas breiteren Rahmen mit runden Ecken haben, entsprechend dem CD des Unternehmens.

Derjenige, der die Seite mittels Typo3 programmiert sagt mir nun, dass alle Bilder vorher in Photoshop mit diesem Rahmen versehen werden müssen.

Ich habe keine Ahnung vom Programmieren irgend welcher Internet-Seiten, stelle mir wahrscheinlich deshalb alles zu einfach vor, zum Beispiel wie in Quark XPress, wo Bilder einfach importiert werden und anschließend Rahmenbreite, Eckenradius, Bildmaße usw. definiert werden.

Dein Beispiel lässt mich jedoch hoffen, dass ich tatsächlich nicht so falsch liege.

Übrigens: Offene Toilettendeckel sehen immer furchtbar aus und bei Werbung, die verkaufen soll, noch sehr viel furchtbarer.

 

[TempuzFugit]

Hi,

spar Dir die Arbeit. Thumbnails mit Rahmen für die Webseite macht man heute unkomplizierter mit CSS, ausser es soll noch mit Netscape 3.0 Gold funktionieren

Das heisst wenn Du morgen einen anderen Rahmen willst, weil das Web Design sich ändert musst Du nicht wieder alle Bilder erneut im "Stapel" ändern und aufladen, sondern änderst nur das über CSS gesetzte Hintergrundbild.

Hier ein Bsp. mit einem Bilderrahmen als Hintergrund und das Bild im Vordergrund.

http://www.apartment.gotaormina.com/de/ferienwohnung

Viele Erfolg
Kiteman
www.noesis.de

Gibts irgendwo ne einfache Anleitung, um einen Rahmen per css einzufügen ?

 

[Kiteman]

Kurze Zwischenfrage: Ich habe für einen Kunde eine Internet-Seite gestaltet, in der alle Bilder einen etwas breiteren Rahmen mit runden Ecken haben, entsprechend dem CD des Unternehmens.

Derjenige, der die Seite mittels Typo3 programmiert sagt mir nun, dass alle Bilder vorher in Photoshop mit diesem Rahmen versehen werden müssen.

Ich habe keine Ahnung vom Programmieren irgend welcher Internet-Seiten, stelle mir wahrscheinlich deshalb alles zu einfach vor, zum Beispiel wie in Quark XPress, wo Bilder einfach importiert werden und anschließend Rahmenbreite, Eckenradius, Bildmaße usw. definiert werden.

Dein Beispiel lässt mich jedoch hoffen, dass ich tatsächlich nicht so falsch liege.

Übrigens: Offene Toilettendeckel sehen immer furchtbar aus und bei Werbung, die verkaufen soll, noch sehr viel furchtbarer.

1. Typo3 da wird nichts programmiert, das heisst scripten. 95% werden heute allemal konfiguriert und mit meist langweiligen Templates versehen, die von der Stange sind und angepasst werden. Das erzeugen eines HTML Codes sowie das formatieren mit CSS (Stilvorlagen) ist weder scripten noch programmieren. Typo3 ist mächtig und in vielen Fällen für gewählte Aufgabe überdimensioniert, da werden dann oft einfache Lösungen aufgrund der Größe des System völlig vergessen.

Im Prinzip haben aber alle moderne CMS eine Trennung zwischen HTML Code und der Formatierung (CSS). Über externe CSS Dateien können alle Elemente (DOM) in einem Web Design angesprochen werden und daher prima manipuliert werden. Je nach System und Template kann man eine eigene CSS Datei hinterlegen, die zum Schluss von der WebSeite im <header> geladen wird und ggf. vorherige Stile überschreibt mit dem "Wunschdesign".

Resümee:
Was der da sagt stimmt nicht, man kann Bilder in ein Verzeichnis laden und dann per CSS ein Hintergrund Bild definieren. Schwierig wird es nur, wenn der Bereich oder die Bilder nicht eindeutig mit einem CSS Selektor spezifiziert werden können. Da wäre aber auch eine Lösung möglich über JavaScript oder einem gutem JavaScript Framework wie jQuery.

2. Danke für den Hinweis über Ausstattungsmerkmale idF. Toilette, das hat mit dem Thema nichts zu tun. Aber sieh das anders herum, die Leute sehen gleich das alles sauber ist, was nicht immer der Fall ist.
Außerdem hat man nicht immer die Wahl bei angelieferten Fotos. Aber wenn es Dich stört, kannst Du das gerne retouchieren.

so long
Kiteman

Quellen:

Allgemein
http://www.w3schools.com/css/css_background.asp

Nettes Tutorium
http://blog.plasticmind.com/css/css-image-framing/

Tutorium von A list apart (meistens sehr gut)
http://www.alistapart.com/articles/cssdropshadows/

 

[Kiteman]

http://www.alistapart.com/articles/cssdropshadows/

 

[Gokoana]

Vielen Dank für die ausführliche Erklärung.

Ich kläre das mit dem umsetzenden Unternehmen ab. Es hätte mich auch maßlos geärgert, wenn unsere Gestaltungen sich nicht umsetzen liessen.

… wenn es Dich stört, kannst Du das gerne retouchieren.

Wenn Du die Retusche bezahlen kannst, können wir darüber gern sprechen.

Spaß bei Seite: Du solltest Deinen Kunde auf solche Dinge hinweisen, denn offene Deckel vermitteln nicht Sauberkeit – auch nicht unterschwellig – sondern ausschließlich Schlampigkeit.

Weise ihn in aller Freundlichkeit darauf hin und er wird Dir mindestens genau so dankbar sein, wie ich es für Deine Tipps bin.

Man liest sich!

 

[Synoxis]

Gokoana, normalerweise genügt es wenn du bei jedem Thumbnail einfach eine CSS-Klasse nutzt. Die Frage ist dann eher wie kompliziert dein Rand um die Thumbnails sein soll?

 

[Gokoana]

Gokoana, normalerweise genügt es wenn du bei jedem Thumbnail einfach eine CSS-Klasse nutzt. Die Frage ist dann eher wie kompliziert dein Rand um die Thumbnails sein soll?

Keine Thumbnails, sondern …

… alle Bilder einen etwas breiteren Rahmen mit runden Ecken haben …

 

[Synoxis]

Dann eben alle Bilder, ändert aber nichts an der Vorgehensweise

 

[Gokoana]

Inzwischen habe ich erfahren, dass es nicht ganz so einfach ist, Bilder mit einem individuellen Rahmen, z.B. einen mit runden Ecken zu versehen, sondern dass solche Dinge immer mit einer Fläche, die diesem Rahmen entspricht, erreicht wird, auf den lediglich ein Foto sozusagen draufgelegt wird.

Schade. Ich dachte es wäre tatsächlich einfacher, denn auf diese Weise müsste jedes Bild zwei Mal verwendet werden, wie es im oben genannten Beispiel mit der Ferienwohnung der Fall ist. Hier wurde der Rahmen platziert und auf diesem Rahmen sitzt der quadratische Ausschnitt des jeweiligen Bildes, das sich beim Anklicken öffnet.

Zur Selbstverwaltung mittels CMS ist das für meinen Kunde ein wenig zu kompliziert, da er eben jedes Foto zwei Mal hochladen müsste: Einmal als Ausschnitt, um mit dem Rahmen mit den runden Ecken platziert zu werden und einmal in der hohen Auflösung als Gesamtbild.

 

[Synoxis]

Normalerweise müsste es auch mit einem Bild gehen, die Bilder müssen nur eben die richtige CSS-Klasse zugewiesen bekommen und das kannst du ja schließlich im CMS "einstellen".

 

[Gokoana]

… das kannst du ja schließlich im CMS "einstellen".

Ich stelle nicht ein. Ich lasse einstellen.