Bilder auf Homepage gestreckt

Garack

Captain
Registriert
Mai 2006
Beiträge
3.648
Hallo,

Diverse CMS haben ja Templates vorgefertigt. Die meisten nutzen Headerbilder mit ca. 1000 mal 200 Pixeln.

Ich will nun meine Bilder da reinquetschen, diese sind mit über 4000 mal 1000 Pixeln aufgenommen.

Leider werden alle Bilder egal wie ich sie bearbeite gestreckt dargestellt.

Sollten die Pixel nicht ausreichen ?

Wie bekomme ich eigene Bilder auf so eine Größe?
 
Beim Verkleinern auf die "aspect ratio", also das Größenverhältnis der Längen, achten. Oder was soll die Frage?
 
Hallo,

1000 x 200 Pixel entspricht einen Verhältnis 5:1
4000 x 1000 Pixel entspricht einem Verhältnis 4:1

Wie viele Pixel deine Bilder haben, spielt keine Rolle. Das Verhältnis muss stimmen, dann wird auch nichts verzerrt.

Um bei deinem Beispiel zu bleiben. Mach aus deinem Bild ein Bild in der Auflösung 5000 x 1000 Pixel dann kannst Du es als Banner nutzen. Vielleicht noch anschließend auf 1000 x 200 verkleinern, damit die Dateigröße nicht unnötig groß wird.

Grüße,

Blubbs
 
Das Verhältnis zwischen 1000x200 und 4000x1000 ist auch ein ganz anderes.

Hier veranschaulicht:
unbenannt-1r5z2t.jpg

Der grüne Bereich ("1000x200") ist der Header. Der rote Bereich ("4000x1000 oder auch 1000x250")geht über den grünen Bereich hinaus und zeigt dein vorhandes Bild. Irgendwie muss das nun reingepresst werden :D

Ich würde garkein 4000x1000 Bild nehmen und es so in das Web stellen - das sind unmengen an Traffic und schaut meist nicht so schön aus, weil es dann runtergerechnet wird.

Daher empfehle ich dir mittels eines Grafikbearbeitungsprogramm das Bild zu verkleinern und zurechtzuscheiden.
 
Genau das versuche ich, aber das Bild bleibt immer gestreckt.

Kann es sein das meine Kamera im JPEG Format ja komprimiert ich die Bilder nicht mehr zurechtschneiden kann?

http://www.picnik.com/app#/home/welcome


Versucht es mal selber. Nehmt ein Digitalphoto mit genügend Pixeln und versucht es auf 1000 mal 288 zu bekommen ohne das es schrecklich verzerrt aussieht. Unten ist der Punkt Größe anpassen, und zwar flexibel.

Auch mit Bildbearbetungssoftware bekomme ich es nicht hin.

Meine Kamera nimmt in 3400 mal 2500 Pixeln auf ( ungefähr).

Auch wenn ich es erst in andere Größen umrechnen lasse, bleibt es schrecklich verzerrt.
 
Zuletzt bearbeitet:
Garack schrieb:
Versucht es mal selber. Nehmt ein Digitalphoto mit genügend Pixeln und versucht es auf 1000 mal 288 zu bekommen ohne das es schrecklich verzerrt aussieht. Unten ist der Punkt Größe anpassen, und zwar flexibel.

Hallo,

das ist klar. Wenn das Verhältnis zwischen x und y nicht stimmt, kannst Du vergößern und verkleinern wie du willst. Das Bild ist dann eben verzerrt. Du musst, bevor Du es auf die richtige Grüße von zB 1000x200 Pixel bringst, es auf dieses Format bringen. Mit zurecht schneiden. Konkret für dein 4000x1000 Bild würde es bedeuten, du bringst es auf 4000x800 Pixel. Du musst eben 200 Pixel in der Höhe ganz wegschneiden.

Grüße,

Blubbs
 
Es gibt ja bei http://www.picnik.com/app#/home/welcome oder anderen programmen, sogar paint die Möglichkeit das Seitenverhältniss beizubehalten. Dann komm ich nie auf 1000 mal 288.

Konkret:

http://v5.cache5.c.bigcache.googlea...otos/original/20763647.jpg?redirect_counter=2


Dieses Bild hat genau die Pixelverhältnisse meiner DigiCam.

Ich glaube nicht dass einer dieses Foto auf 1000 mal 288 bringen kann ohne dass es verzerrt aussieht.

Versucht es mal, es geht nicht.

rechtsklicken, bild speichern. Dann picnik starten und zuschneiden (resize unten).
 
Wie soll das auch gehen?

Such dir einen Ausschnitt des Bildes, der ein Seitenverhältnis hat, das 1000/288 entspricht.

Verkleinere/Vergrößere dann auf 1000x288
 
Ja aber wie?

Wie bekomme ich mit meiner Cam ein Photo auf eine Webpage mit genau 1000 mal 288 ?

Wenn ich wegschneide bleben ca. 10% vom Bild über bei korrekter Skalierung. Es gibt aber Bilder im Web mit 1000 mal 288. Wie machen die das?
 
Hallo,

du verstehst das Problem dahinter noch nicht so ganz.

Du kannst ein Bild von zB 2000x1000 Pixel nicht verzerrungsfrei auf 1000x288 Pixel bringen, da das XY Verhältnis beider Bilder nicht gleich ist. Änderst Du das Bild nicht vorher und bringst es auf die gewünschte Größe, ist er verzerrt.

Du musst das betreffende Bild zurecht schneiden. So wie ich im letzten Posting geschrieben habe. Ohne Zuschnitt bekommst Du Verzerrungen.

Wenn Du es nicht zuschneiden kannst, kannst Du mit jeder Bildbearbeitung auch eine *poportionale* Größenänderung wählen. Dann bekommst Du aber Ränder Oben/Unten oder Links/Rechts.

Und nun konkret. Zeig das Bild, was Du als Banner haben willst und sage welche Pixelhöhe/breite der Banner haben muss. Dann kann man dir konkret helfen.

Grüße,

Blubbs

Ergänzung:

Bilder zugefügt. So geht es zB. Das ganze Bild geht eben nicht alles Banner. Nur eben mit Rand...
 

Anhänge

  • Banner1.jpg
    Banner1.jpg
    75,2 KB · Aufrufe: 139
  • Banner2.jpg
    Banner2.jpg
    96,6 KB · Aufrufe: 124
  • Banner3.png
    Banner3.png
    209,2 KB · Aufrufe: 137
Zuletzt bearbeitet:
Ich verstehe dass schon und vielen Dank für die Mühe, aber ich glaube ihr versteht meine Frage nicht ganz.

Es gibt ja Bilder in 1000 mal 288 und zwr in voller Größe, das Internet ist voll davon.

Mal ganz einfach: Ich will auch so eins, wie geht das? Ich will ein Photo machen und dann das was ich fotografiert habe ich voller Größe als 1000 mal 288 Bild haben. Es muss ja gehen sonst gebe es die ganzen Banner Header nicht.

Ich habe geschrieben dass man dafür ggf. kein JPG. von der Cam erhalten sollte da JPEG komprimiert ist und sich die Pixel nicht beliebig rumrechnen lassen. BMP oder RAW wäre möglich? Spezialkamera?
 
Hallo,

Ich habe geschrieben dass man dafür ggf. kein JPG. von der Cam erhalten sollte da JPEG komprimiert ist und sich die Pixel nicht beliebig rumrechnen lassen. BMP oder RAW wäre möglich? Spezialkamera?

Das zeigt, Du verstehst es leider nicht. Keine Kamera nimmt in ein Verhältnis von 3:1 auf. Und es hat auch nichts mit dem Format JPG, RAW oder BMP zu tun. Einzig mit dem Verhältnis X:Y.

Wenn Deine Kamera eine Panoramafunktion hat, dann könntest Du dem Format nahe kommen. Oder Du nimmst das Bild in der Form auf, dass von der Szene 3 Bilder aufnimmst. 3 Bilder die einen von links nach rechts unterschiedlichen Bildausschnitt aufnehmen und dann fügst Du die drei Bilder zu einem zusammen. Das wäre dann die Panoramafunktion von Hand.
Grüße,

Blubbs
 
Hallo,

Ja. Entweder per Panorama oder eben zugeschnitten.... Oben/Unten weg. Dann hast Du dieses Format. Und wie die meisten aussehen, wurde da oben und unten weg geschnitten.

Grüße,

Blubbs
 
Zuletzt bearbeitet:
Das Programm, was du such könnte Seam Carving sein: http://www.youtube.com/watch?v=6NcIJXTlugc

Ob das bei all den Bildern zum Einsatz gekommen ist, bezweifle ich. Da wurden eher Bildbereiche abgeschnitten, so dass man auf das richtige Verhältnis kommt (wie ja schon mehrfach erwähnt wurde).
 
BlubbsDE schrieb:
Ja. Entweder per Panorama oder eben zugeschnitten.... Oben/Unten weg.

Genau das ist es. Panorama erkennt man recht fix, meistens wird einfach nur zurechtgeschnitten.

Hier nochmal dargestellt:

Das Bild (1000x250) passt nicht in den Header (Rot).

asd9xywa.jpg


Wenn man nun ganz einfach alles oberhalb und unterhalb des Bereiches wegschneidet kommt man wieder auf 1000x200 und bekommt folgendes Ergebnis:

asd3nrz4n.jpg


Ganz ohne "besondere Kamera oder Panorama".

Und hier das Ergebnis, wenn man versucht die 1000x250 in die 1000x200 zu pressen.

asd21ozmo.jpg
 
@b3nn1

Dein Beispielbild passt ja fast. Das ist es nicht so schlimm. Nehmen wir das Bild vom TE.


Originalbild:

20763647-jpg.268717


Dieser Größenbereich darf verwendet werden:

banner1-jpg.268714


So sieht es zurecht geschnitten aus: (Man kann natürlich jeden beliebigen Ausschnitt nehmen)

banner2-jpg.268715


Und so sieht es aus, wenn das Bild einfach in das richtige Format *gequetscht* wird:


banner3-jpg.268716


Grüße,

Blubbs
 

Anhänge

  • Banner1.jpg
    Banner1.jpg
    58,1 KB · Aufrufe: 418
  • Banner2.jpg
    Banner2.jpg
    57,5 KB · Aufrufe: 506
  • Banner3.jpg
    Banner3.jpg
    210,9 KB · Aufrufe: 493
  • 20763647.jpg
    20763647.jpg
    205 KB · Aufrufe: 509
Zurück
Oben