Automatische Größenanpassung und Hintergrundbild

Computer: Software & Programmierung HTML & CSS
#1

Hallo!

ich bastel grad an einer Homepage (www.point-europe.com) und da habe ich ein kleines Problem, das wahrscheinlich gar kein richtiges ist:

Auf meinem Notebook-Monitor sieht das gut aus, wenn ich das aber auf nem 19 oder 21 Zöller öffne, ist a) das Bild viel zu klein und b) der text nicht mehr an seiner Stelle. Kann man das automatisch an den verwendeten bildschirm anpassen lassen?? Der Text soll halt möglichst immer an der gleichen Stelle im Bild sein…

Wenn jemand einen Rat hat, den auch ein Neuling (ohne richtige Programmierkenntnisse) anwenden kann, würde ich mich sehr über gute Anregungen freuen!!!

#2

Hi!

Also, so einfach geht das nicht. Dein Bild hat nun mal eine feste Größe und die kannst du nicht an irgendeine beliebige Bildschirmgröße anpassen! Wie auch? Könnte evtl. mit einer Kombination aus Javascript und PHP gehen, wäre aber extrem umständlich und was ist, wenn Javascript deaktiviert ist (ich persönlich sehe zar keinen Grund für sowas, aber es gibt genügend Leutchen, die das warum auch immer machen. Mit Flash wäre sowas vielleicht auch machbar, aber da kenne ich mich nicht mit aus. Und für jede Auflösung ein Bild? Ist wohl, abgesehen von dem auch dann benötigtem Javascript, auch nicht das gelbe vom Ei, oder?

Also lass doch das Bild so, wie es ist und setzte es genau in die Mitte des Bildschirms! Wie das geht, habe ich einige Threads weiter unten („Text mit CSS erzeugten Box vertikal zentrieren?“) beschrieben.

Ich würde das so machen: ein Div in der entspr. Größe genau in die Seitenmitte, das Bild als Hintergrundbild definieret und in diesen Container dann das DIV mit dem Text. Dann ist immer alles an der richtigen Stelle!

Übrigens: soooo klein ist das Bild auf meinem 19 Zöller nu auch nicht!

Grüße aus dem schönen Elbflorenz

Robi

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#3

Hallo Robi und vielen Dank für Deine ausführliche Antwort.

Leider kann ich nicht wirklich was damit anfangen, hat das was mit Frames zu tun?
Oder kannst Du mir sagen, wo ich mehr Infos dazu finde, wie das geht?

Oder kennst Du eine Seite, wo man das umgesetzt hat??

Danke schon mal

GG

#4

Hi, einfachgutdrauf@goetz…
Du verstehst nicht, was Robi meint. Das ist auch nicht ganz so leicht zu erklären.
CSS sind Cascading Style Sheets, die einerseits die direkte Positionierung von Elementen auf einer Webseite regulieren können, andereseits teilweise wie bei objektorientierter Programmierung arbeiten. Das verstehst Du vermutlich nicht, da Du Dich, wie ich glaube, genauso auf die Versprechungen diverser Illustrierten verlässt, die behaupten, Du mußt kein HTML oder sonstwas kennen, um perfekte Webseiten zu erstellen, wie viele andere vor Dir.
Z.B.hat Robi geschrieben, es geht nicht, eine Größe für irgend eine Auflösung vorzugeben. Genau das Gegenteil ist der Fall. Die Frage ist nur, wie Du bei CSS die Größenangabe machst. Das geht in %, Pixel, oder Points, oder ganz triviel sogar in cm, mm, oder sonstwas. Wenn Du % oder pt angibst, bist Du relativ unabhängig von der Auflösung, Du hast warscheinlich 2 unterschiedliche Seitenverhältnisse (=z.B. Auflösungen 800:600 und 1280:96ß) vor Dir.
Um Dir das aber auseinander zu setzen, benötigen wir sehr viel Zeit und viel schreibe. Das kann ich nicht machen (wenn Du willst, kann ich Dir aber Buchtipps geben), da auch meine Zeit begrenzt ist, und das Thema extrem groß.

Gruß

[email protected]

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#5

Sorry, hab mir die Seite erst nachträglich angeschaut. Auch das geht zu machen, das sich das ganze anpasst. Da ist jedoch sehr viel Grafikarbeit zu tun.
Geh mal auf meine Webseite und schau Dir die Ränder der Tabellen an. Sind als solche zwar nicht zu erkennen, aber wenn Du in den Quelltext schaust, dann wirst Du diese finden. Du mußt Dein Bild abspeichern, dann in Tabellenkonforme Konstrukte umsetzen, diese aufteilen in Eckpunkte und Hintergründe.
Ist wirklich nicht ganz einfach, vor allem, wenn Du Dich in Grafikbearbeitung nicht auskennst und nicht die richtigen Programme hast. Aber mit etwas ausprobieren kannst Du das schaffen.
Viel Erfolg,
Gruß,
rantanplan (=tom)

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#6

Hallo Tom,

Z.B.hat Robi geschrieben, es geht nicht, eine Größe für irgend
eine Auflösung vorzugeben. Genau das Gegenteil ist der Fall.
Die Frage ist nur, wie Du bei CSS die Größenangabe machst. Das
geht in %, Pixel, oder Points, oder ganz triviel sogar in cm,
mm, oder sonstwas. Wenn Du % oder pt angibst, bist Du relativ
unabhängig von der Auflösung, Du hast warscheinlich 2
unterschiedliche Seitenverhältnisse (=z.B. Auflösungen 800:600
und 1280:96ß) vor Dir.

Die Rede ist hier primär von einem Bild. Ich weiß nicht, ob das für ein Bild ungedingt so gut ist, wenn ich die Größe in % angebe. Ein Browser vergrößert/verkleinert nicht optimal, die Qualität des Bildes dürfte da wohl sehr drunter leiden (ist natürlich abhängig von der Qualität des Bildes und dem Grad der Größenänderung). Vielleicht denke ich da in zu starren Grenzen, aber ich würde das nicht machen und bin von daher gar nicht erst auf die Idee gekommen, diese Möglichkeit vorzuschlagen. Die Resample-Funktion von PHP dagegen macht so eine Größenänderung durchaus recht gut.

Und warum nicht eine feste (Mindest-) Größe lassen? Seitenmittig plaziert schaut das (in diesem Fall) durchaus gut aus.

Gruß

Robi

#7

Hi nochmal!

Leider muss ich mich dem, was Tom sagt, anschließen: klar kann ich ohne jegliche Kenntnisse mit diversen Programmen eine Website zusammenbasteln. Die Betonung liegt hier aber wirklich auf dem zusammenbasteln. Wenn aber sogar die grundlegenden Kenntnisse fehlen, nutzen meist selbst die besten Tipps nicht viel, wenn ich sie nicht verstehe.

Also auch meine Empfehlung: gründlich HTML und CSS lernen, gute Bücher gibt es genügend. Einfach mal mal bei den diversen Buchanbietern (Amazon etc.) danach suchen!

Gruß

Robi

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#8

Also alles in Allem wäre die einfachste Lösung, das Bild in einem guten Grafikprogramm (Photoshop od. das kostenl. Gimp) auf die max. größt mögliche Skallierung zu bringen die du benötigst um sie dann mittels CSS oder anderen Mitteln runter zu skallieren. Ein Verlust tritt nämlich immer nur bei hochskallieren ein, jedoch nicht beim runterskallieren.

Sollte dies nicht möglich sein, sollte man bei der Planung der Seite, welche normalerweise 60% eine Seite ausmachen sollte, diese Dinge berücksichtigen und sich ggf. für eine andere, passendere Grafik entscheiden.

Gruß Michael