problem mit formatierung

[kami]

hallo.

ich habe gestern angefangen eine homepage zu schreiben und mir ist zwischendurch eingefallen das die seite bei einem größeren oder kleineren monitor mit anderer auflösung die formatierung verlieren würde. wie kann ich dem vorbeugen?

mfg
kami

[Struppi]

ich habe gestern angefangen eine homepage zu schreiben und mir ist zwischendurch eingefallen das die seite bei einem größeren oder kleineren monitor mit anderer auflösung die formatierung verlieren würde. wie kann ich dem vorbeugen?

In dem du mit relativen Größenangaben arbeitest.

Struppi.

[Der Martin]

Moin!

[...] das die seite bei einem größeren oder kleineren monitor mit anderer auflösung die formatierung verlieren würde. wie kann ich dem vorbeugen?

Willkommen in der wunderbaren Welt des Webdesigns!

Je nachdem, woran du bei dieser Frage gedacht hast, lautet die Antwort "Überhaupt nicht" oder "Durch ein günstiges Seitenkonzept".

Zunächst etwas Grundsätzliches. Die Größe des Monitors bzw. die Auflösung des Bildschirms spielt eigentlich überhaupt keine Rolle. Allenfalls die Größe des Browserfensters *könnte* für dich interessant sein - und die kann deutlich kleiner als die Bildschirmauflösung sein, aber in seltenen Fällen auch größer ("Virtueller Desktop"). Mach deshalb bitte nicht den häufigen Fehler, für ein bestimmtes Bildformat zu "optimieren".

Die wahre Stärke von HTML/CSS liegt nämlich gerade darin, dass es sich fließend den Gegebenheiten des Anzeigemediums anpassen kann, solange man das nicht unterdrückt.

Lerne zu akzeptieren, dass eine Webseite auf verschiedenen Bildschirmen, Fenstergrößen, Browsern, Betriebssystemen immer ein wenig unterschiedlich aussieht. Das ist kein Makel, sondern eine Stärke. Versuche immer, dein Design soweit flexibel zu halten, dass es nichts ausmacht, wenn ein Zeilenumbruch mal an einer anderen Stelle auftritt, als du ihn erwartet hast. Halte dein Design so flexibel, dass es auch mit einer Änderung der Schriftgröße klarkommt.

Das hört sich für einen Neuling alles sehr kompliziert an. Aber wenn man sich von Anfang an von der fixen Idee trennt, ein Layout hundertprozentig festlegen zu können, tut man sich und den Besuchern seiner Website einen großen Gefallen.

Ein Schritt, um das zu erreichen, sind relative Maßeinheiten, wie Struppi schon empfohlen hat. Eine anderer Weg ist, an möglichst vielen Stellen gar keine Maßangaben zu machen, so dass der Browser das Element je nach den gegebenen Bedingungen anordnen kann. Viele Anfänger (und auch so mancher Fortgeschrittene) im Webdesign versteifen sich darauf, ein Layout pixelgenau festlegen zu wollen. Sei locker! Akzeptiere, dass ein Kästchen mal ein paar Pixel breiter ist, dass der Abstand, der bei dir vielleicht 3px beträgt, woanders auch mal 5px sein kann. Ein exaktes Layout ist gar nicht immer nötig, und trotzdem kann man eine ansprechende Optik erreichen.

Und lass dich bitte nicht vorzeitig entmutigen. Wenn du einen Ansatz hast, zu dem du selbst stehen kannst, dann zeig das Werk hier mal (möglichst schon online, damit man sich's direkt anschauen kann), und du wirst sehr viele gutgemeinte Ratschläge bekommen, was du daran besser machen kannst - das ist an einem konkreten Beispiel immer einfacher als so allgemein. Natürlich werden einige auch nur einfach rummotzen - aber was stört es den Mond, wenn ihn ein Kojote anheult?

Viel Spaß beim Weitermachen,
 Martin

[kami]

ersmtal danke für die schnelle antwort. ich habe erstmal nur die startseite hochgeladen damit man sich einen kleinen überblick verschaffen kann.

www.kaffeekraenzchen-team.de.vu

ich habe leider NOCH nicht so viel ahnung von CSS, da ich mich bisher nur in HTML eingelesen habe und nebenbei noch etwas arbeiten muss. aber ich werde mir die CSS-abteilung hier noch zu gemüte führen.

vielen dank

mfg
kami

[Der Martin]

Hallo,

www.kaffeekraenzchen-team.de.vu

oder doch lieber http://www.kakrate.cwsurf.de/frame.html?

Ich sag mal: Ohje... Ein Frameset...  ;-)
Aber keine Angst, ich will gleich etwas konkreter werden.
Einen Rat möchte ich dir aber gleich zu Anfang geben. Du hast deine Hauptdatei, das Frameset selbst, frame.html genannt. Das kann man machen, ist aber ungünstig. Besser du nennst sie index.htm oder index.html, denn das sind die Namen, die der Server normalerweise von sich aus "ergänzt", wenn man die Seite ohne einen konkreten Namen aufruft. Im Moment sieht man, wenn man http://www.kakrate.cwsurf.de/ direkt aufruft, ein Listing aller dort abgelegten Dateien. Wenn du deine Hauptdatei in index.html umbenennst, würde man dann die eigentliche Seite sehen.

So, zum Thema Frames: Sie haben vielleicht für dich als Ersteller der Seite gewisse Vorteile (Modularisierung), aber für den Besucher eigentlich nur Nachteile. Lies mal http://www.subotnik.net/html/frames.html, da werden die wesentlichen Nachteile sehr anschaulich diskutiert.
Besser ist es, jede Seite für sich vollständig *mit der Navigation* auszustatten und auf die Frames zu verzichten. Mancher Editor kann, bevor die Dateien auf den Server hochgeladen werden, das Projekt aus einzelnen Bausteinen zusammensetzen, so dass es für dich als Autor immer noch gut überschaubare Module bleiben.

Schauen wir uns mal die frames.html an.
Da fehlt erstmal eine DOCTYPE-Deklaration.
Was das Javascript ganz am Anfang soll, wissen die Götter - es ist völlig überfüssig und produziert gar Unsinn. Meiner Ansicht nach bist du besser bedient, wenn du es weglässt.
Bei der Frameset-Definition hast du wohl irgendwas gründlich missverstanden. Du gibst an, dass das Frameset zwei Frames enthält (<frameset cols="90,*">), zählst dann aber insgesamt acht Frames auf. Die ersten zwei sind korrekt und werden beachtet, den Rest ignoriert der Browser sowieso. Weg damit. Warum du das Frameset danach zweimal schließt (</frameset>), ist mir auch nicht klar - wahrscheinlich ein Versehen.
Das leere body-Element danach ist übrigens falsch - wenn, dann müsste es innerhalb eines <noframes> Containers stehen und sinnvollerweise einzelne Links zu den jeweiligen Frame-Seiten enthalten. So haben Benutzer mit einem nicht frame-tauglichen Browser (oder Suchmaschinen!) auch eine Chance, die Seiten zu erreichen, wenn auch nur mit einer notdürftigen Navigation.

Jetzt zur home.html.
Auch hier fehlt der DOCTYPE, und auch hier das seltsame Script, dessen Sinn ich nicht weiter erforschen möchte.
Viel Inhalt ist ja nicht da, und das sieht soweit auch technisch korrekt aus. Es wird grundsätzlich empfohlen, alle Attribute in Anführungszeichen zu schreiben; du hast das nicht konsequent gemacht. Noch eine Sache fällt mir auf: Schriftgrößen in pt angegeben. Das ist zulässig, aber so ziemlich die ungünstigste Einheit für die Bildschirmanzeige. Besser geeignet sind die Einheiten % oder em, wobei 100% bzw 1em der im Browser eingestellten Standardschriftgröße entsprechen.

ich habe leider NOCH nicht so viel ahnung von CSS, da ich mich bisher nur in HTML eingelesen habe und nebenbei noch etwas arbeiten muss. aber ich werde mir die CSS-abteilung hier noch zu gemüte führen.

Dann rate ich dir, das Erlernen von CSS besser NICHT hinauszuzögern, sondern parallel zum HTML zu erlernen. Die beiden sollten untrennbar zusammengehören. Das Ziel sollte sein, im HTML-Dokument *nur* den Inhalt und die Struktur zu haben, und alles, was das Aussehen und die Gestaltung angeht, im CSS. Viele HTML-Tags und Attribute fallen dann weg, der Code wird übersichtlicher und leichter zu pflegen. Und "moderner" ist es auch noch. ;-)

Weiter so und schönen Tag noch,
 Martin

PS: Mir fällt eben noch auf, dass dein Navigationsframe mit seinen 90px sehr schmal ist, und im Internet Explorer kann ich ihn nicht einmal größer ziehen! Im Firefox kein Problem. Seltsam ...