Page mit IE super, mit Firefox total daneben?

Lole · 19.11.2006, 17:21

Hallo!

Ich habe vor längere, als ich noch IE 6 benutz habe, eine Homepage für meine Klasse programmiert!

http://www.technobananen.de.vu/

Jetzt habe ich mich dazu entschlossen, das ganze mal zuende zu bringen! Inzwischen habe ich allerdings Firefox, und die Seite sieht plötzlich total schlimm aus!

Probierts mal mit beidem aus und sagt mir was ich falsch gemacht hab, bzw womit FF nicht zurecht kommt!

Ich fande die Site eig. ziemlich gelungen!

MfG Lole

P.S: oh gott wenn ich mir jetzt die Texte von damals durchlese!

Pirke · 19.11.2006, 17:25

Ja, die Seite ist im FF grausam, aber im IE sieht die bei mir net besser aus.

tele · 19.11.2006, 17:37

Bau einfach valides HTML. Wie das geht steht hier. Im zweiten Schritt solltest du von Frames weg und deine Formate und Gestaltungen mit CSS durchführen. ganz wichtig ist auch, deine Seite immer zu validieren.

Lole · 19.11.2006, 17:37

wes heißt net besser? Sind die Objekte da wenigstens nebeneinenader angeordnet oder stehn sie immernoch irgentwo rum und die Proportionen sind flasch?

Das is CSS und keine Frames! Das mit dem validieren versteh ich auch nicht!

tele · 19.11.2006, 17:59

Ah - das Frame-Mist drunrum ist von de.vu. Egal - bei dir fehlt schonmal die Doctype angabe, welche der eigentliche Anfang ist und die Art des Dokumentes angibt. Ohne die kann das gar kein richtiges html sein - egal wie du das schreibst.

Lole · 19.11.2006, 18:16

Hab die jetzt ma wies in Selfhtml steht eingefügt, aber trotzdem is da nichts anders. Muss ich das auch bei den *.css datein machen?

tele · 19.11.2006, 18:29

Hallo,

weder dein HTML Code noch dein CSS sind valide.

HTML:
http://validator.w3.org/check?uri=ht...n.piranho.com/

CSS:
http://jigsaw.w3.org/css-validator/v...piranho.com%2F

[EID]-Mr.GiZMO · 19.11.2006, 18:32

Also, ich möchte keineswegs beleidigend wirken, aber toll sieht das nicht aus.

Ich würde sagen, fang nochmal von vorn an.

Hier ein paar Tipps:

Grundidee:
- wer wird angesprochen?
- was soll gesagt werden?
- wie soll das gesagt werden?

Farbigkeit:
- Ich würde sagen 2 bis maximal 4 verschiedene Farben nutzen
- Bilder freistellen, bearbeiten und schön in Szene setzen und im passenden Format abspeichern (Fotos etc. als jpg, Bilder mit Schriften als png oder gif)

Schriften:
- nich zu groß
- nen schönen Schriftschnitt wählen (Verdana is immer schön für Web)

HTML/CSS
- lies ruhig mal nach, wie man heute mit HTML arbeitet (es gibt kleine Heftchen am Kiosk oder Bücher und auch Websites, die das erklären - Google hilft)
- besser ne kleine gute Seite, als eine, die sofort abschreckt!

Soweit von mir!

tele · 19.11.2006, 19:02

Danke schonmal für deine Zusammenfassung, allerdings muss ich an einer Stelle eine Ergänzung machen:

Zitat:

Zitat von [EID]-Mr.GiZMO

- nen schönen Schriftschnitt wählen (Verdana is immer schön für Web)

Verdana ist nicht generisch. Kann zwar als primäre Schriftart gewählt werden, sollte aber immer durch einen generischen Fallback abgesichert sein, z.B.:

Code:

p {
 font-family:Verdana,sans-serif;
}

Was ich noch empfehlen kann: Die Firefox-Extension "Web Developer" ist sehr geeignet um ein wenig mehr zu sehen, wenn es um verkorstes Layout etc. geht.

hier mal ein Screenshot:
http://www.tweakpc.de/gallery/data/5...bDeveloper.JPG

Auch Opera kann im Authorenmodus + User CSS als sehr mächtiges Werkzeug zur Seite stehen. Hier ebenfalls ein Screenshot:

http://www.tweakpc.de/gallery/data/5...eraOutline.JPG

PS: sollte mir irgendwer ein Ähnliches Werzeug für die IE6 Rendering Engine beschaffen können (sei das in einem Aufsatz wie Avant mit drin, bitte tipp an mich), werde ich das selbstverständlich honorieren.

Gruß

tele (der sich grad mit der Entwicklung von www.photo-digital-schmidt.de für rumschlägt und über diverse Ansprüche des besitzers schon Haare ausgerissen hat)

EoN · 19.11.2006, 20:44

Zitat:

Zitat von tele

PS: sollte mir irgendwer ein Ähnliches Werzeug für die IE6 Rendering Engine beschaffen können (sei das in einem Aufsatz wie Avant mit drin, bitte tipp an mich), werde ich das selbstverständlich honorieren.

Gruß

tele (der sich grad mit der Entwicklung von photo-digital-schmidt.de für rumschlägt und über diverse Ansprüche des besitzers schon Haare ausgerissen hat)

Für den IE7 gibts nen ähnliches PlugIn wie für den FF. Wenn Dir das was bringt, kann ich's gern nochmal raussuchen, sollte aber auch auf der MS Plug-In Seite auftauchen.

tele · 19.11.2006, 20:59

Hi,

ich denke IE7 ist da nicht so problematisch wenn es um die Interpretation von Code geht. Derzeit ist sowas für mich noch für den IE6 interessant, da der doch schon einiges (ich sag nur horizontale ausrichtung von block level elementen mittel text-align) anders darstellt.

Natürlich wird es zukünftig mit IE7 Zwangsupdates etc. auch für diesen interessant, also wär ich dir natürlich dankbar, wenn du es noch mal raussuchen würdest

Gruß

tele

PS: Auch auf die Gefahr dieses Thread zu kapern: Sollte noch wer feedback zu der oben angesprochenen Seite haben, wäre ich ebenso dankbar.

SofaSurfer · 19.11.2006, 22:32

Vielleicht hilt euch das hier beim Bau einer Webseite:

http://www.fit-fuer-usability.de/1x1/uebersicht.html

Lole · 20.11.2006, 08:56

ööööhhhh

Ich fang nochma gaanz neu an

Danke für die Hilfe!

cerebelo · 20.11.2006, 09:51

hohoho, erfolgreich gekapert, mon capitain... ;-p

Was mir auf die Schnelle an stylistischem auffällt:

Section about: die einzelnen Textelemente sind für mein Empfinden seltsam zueinander ausgerichtet. Also weder blockweise noch zentriert.

Section gallery: die Bilder sehen in der Vorschau, da unterschiedliche Formate, recht zusammengewürfelt aus. Eine nicht statische Lösung könnte hier eleganter sein. Also z.B. durchlaufende Diashow, oder durchlaufende Vorschau (Bilder von rechts rein/links raus), oder letzteres noch mit Mouseover-Effekt (Mauszeiger recht--> Bilder laufen nach links/Mauszeiger links--> Bilder laufen nach rechts,... ).

Section acquire: der Schrifttyp wirkt seltsam kühl und wenig passend zum künstlerischen Anspruch des Aufttraggebers...