Html - Webseiten schauen auf Mac OS X anders aus als unter Windows

duth · 10.02.2006

Hallo!

Ich hätte da mal ne frage... ich bin vor ein paar montaten auf OS X umgestiegen, weil ich mir ein ibook zugelegt habe...
ich habe schon früher unter windows mit dreamweaver websites erstellt, und es hat alles super funktioniert.

ABER: wenn man meine seiten auf einem MAC anschaut, dann verschieben sich so manche dinge!! - Sogar mit dem Internet Explorer für MAC.

schaut mal selber... z.b.: www.duthdesign.at
gleich am anfang der start - die enter taste ist auf einem windows rechner schön in der mitte, und auf meinem mac (oder auch auf jeden mac) ist die taste etwas nach oben verschoben!!! .. gilt nicht nur für das eine, die page, die nach dem drücken der enter taste kommt, verschiebt sich auch !teilweise!

Wie kann ich dem vorbeugen?? und / oder wie kann ich mit meinem mac sehen, wie die page ein windows typ sieht?

Dankeschön duth

acid · 10.02.2006

Könnte sein das es durch die vielen Leerzeichen im Code hervorgerufen wird. Ich würde das Einrücken mit CSS Lösen, genau wie die ganze Seite eigentlich auch (ist ja nicht zu kompliziert...)

wegus · 10.02.2006

Das Web ist keine Textverarbeitung oder ein DTP-System!

Es gibt also weder definerte Seitengrößen, noch definitiv vorhandene Schriftarten oder Ähnliches (doch ich weiß das es CSS gibt

). Gerade die Unabhängigkeit davon ist es ja, was das Web ausmacht.

Programme wie Dreamweaver oder GoLIve stecken einen enormen Aufwand da hinein dies zu minimieren. Gegen Null wird man so etwas nicht bekommen! Ein abolutes Layout per Web wird man in PDF oder anderen Seitenbeschreibungssprachen machen. Sicher nicht in HTML!

miss.moxy · 10.02.2006

duth schrieb:
Sogar mit dem Internet Explorer für MAC.

Hallo.
Den würd ich gleich mal vergessen

Schau mal, dass du das Layout mit CSS definierst. Dann müsste es weniger Unterschiede geben…
Testen auf verschiedenen Systemen ist meiner Meinung nach nur wirklich auf den jeweiligen Plattformen gut möglich. Ansonsten gibt es Sachen wie KLICKKLICK …

duth · 10.02.2006

Ok... hab ich mir schon gedacht, dass ich da mehr mit CSS machen sollte!
Bin halt kein Scripter .... mehr Grafiker!!

Und was haltet ihr von "transparenten Bildern" als Platzhalter.. z.b. statt unendliche Leerzeichen halt dann ein Transparentes Bild mit 1px mal 30px??

Danke

Incoming1983 · 10.02.2006

duth schrieb:
schaut mal selber... z.b.: www.duthdesign.at
gleich am anfang der start - die enter taste ist auf einem windows rechner schön in der mitte, und auf meinem mac (oder auch auf jeden mac) ist die taste etwas nach oben verschoben!!!

Das stimmt nicht. Ich sitz hier auch grad an einem Windows Rechner, und der Enter Link ist vertikal nicht mittig, sondern weiter oben.

Desweiteren sind Fehler auf der Seite, u.a. fehlen auch Angaben über den doctype und das Encoding.

Wie kann ich dem vorbeugen?? und / oder wie kann ich mit meinem mac sehen, wie die page ein windows typ sieht?

HTML ist eine Beschreibungssprache, die wird natürlich von jedem Browser unter jeder Plattform etwas anders gerendert. Solltest du aber wissen, wenn du schon Seiten selber gemacht hast.

duth · 10.02.2006

ja... is schon klar dass ich da noch lange nicht perfekt bin, und mit noch etwas mit dem encoding auseinandersetzen muss... mir is halt am anfang nur mal wichtig, dass die seite mal fürs aug gut aussieht!

Burning_Dice · 10.02.2006

duth schrieb:
Und was haltet ihr von "transparenten Bildern" als Platzhalter.. z.b. statt unendliche Leerzeichen halt dann ein Transparentes Bild mit 1px mal 30px??

Wenn du als Grafiker nicht noch zusätzlich einen anderen Menschen, der coden kann, bezahlen willst, musst du doch wohl damit anfreunden und es lernen.

Übrigens sind Leerzeichen / Leerzeilen schon mal GANZ schlecht, da die verschiedenen Browser ihre Fontsätze verschieden darstellen (auf dem Windows-IE erscheint z.B. Typo immer etwas größer als auf den anderen Browsern), ein 1x1 Pixel großes transparentes Gif, das du mittels HTML dehnst, ist da schon die sicherere Variante. Zumal man ja laut W3C einer Tabelle noch nicht mal ne Höhe geben darf. Da muss schon der spacer.gif herhalten.

ostersau · 10.02.2006

duth schrieb:
Und was haltet ihr von "transparenten Bildern" als Platzhalter.. z.b. statt unendliche Leerzeichen halt dann ein Transparentes Bild mit 1px mal 30px??

wie die Vorredner schon gesagt haben, ist HTML eine Beschreibungssprache.
Somit wirst Du Unterschiede haben, wenn du sie nicht explizit "ausmerzst".

Gerade der IE unter Win ist ein Problemfall. Obwohl am meisten verbreitet, ist er derjenige Browser, der am die Vorgaben des HTML sehr eigensinnig umsetzt.
Der IE unter Mac kannste vergessen, er ist ein Auslaufmodell und wird seit Jahren nicht mehr weiter entwickelt.
Was die transparenten Bilder angeht.... Hmmm, ich persönlich würde Dir davon abraten. Auch das Tabellenlayout Deiner Seite ist sagen wir mal "nicht up to date".
Die Entwicklung geht dahin, mit css zu positionieren, und wenn Du Webdesign machst, wirst du wohl nicht umhin kommen, Dich damit zu beschäftigen.
Dreamweaver und Co beherrschen zwar mittlerweile css recht gut, dennoch sollte man auch wissen, was die einzelnen Anweisungen bedeuten und bewirken. und soooo schwer ist css auch nicht

Incoming1983 · 10.02.2006

duth schrieb:
ja... is schon klar dass ich da noch lange nicht perfekt bin, und mit noch etwas mit dem encoding auseinandersetzen muss... mir is halt am anfang nur mal wichtig, dass die seite mal fürs aug gut aussieht!

Das ist leider der falsche Ansatz. Das Aussehen ist am Anfang irrelevant.
HTML Seiten müssen auch nicht "gut aussehen". Der Sinn davon ist, daß man Informationen so verpackt, daß sie leicht und schnell zugänglich sind.
Wichtig in dem Zusammenhang auch, daß die Seiten korrekt sind.

Dazu wichtige Links:
http://de.selfhtml.org
http://www.w3.org/MarkUp/

milchschnitte · 10.02.2006

das ist ja gerade die kunst, eine seite so zu programmieren, das sie auf allen browsern GUT aussieht, nicht GLEICH. oftmals machen einem aber die kunden einen strich durch die rechnung mit ihren hirnamputierten vorstellungen...

msslovi0 · 10.02.2006

Burning_Dice schrieb:
Da muss schon der spacer.gif herhalten.

Nein. Mit Sicherheit nicht!

Matt

msslovi0 · 10.02.2006

duth schrieb:
Ok... hab ich mir schon gedacht, dass ich da mehr mit CSS machen sollte!
Bin halt kein Scripter .... mehr Grafiker!!

Gerade dann sollte dir CSS sehr gelegen kommen.

Und was haltet ihr von "transparenten Bildern" als Platzhalter.. z.b. statt unendliche Leerzeichen halt dann ein Transparentes Bild mit 1px mal 30px??

Gar nichts. Beide Ideen sind mindestens gleich schlecht. Das Web wird kein A4-Papier werden. Weder mit   noch mit Platzhalterbildern.

Matt

julian_st · 10.02.2006

Incoming1983 schrieb:
HTML ist eine Beschreibungssprache, die wird natürlich von jedem Browser unter jeder Plattform etwas anders gerendert. Solltest du aber wissen, wenn du schon Seiten selber gemacht hast.

Das stimmt, allerdings werden durch w3c.org die Standarts definiert, mit denen Seiten eigentlich gleich gerendert werden sollten. Ich wüsste im Momemt keinen Browser, der sich zu 100% dran hält, jedoch tuts (schönes Wort

) der IE auf jedenfall nicht. Manchmal hilft es, im Doctype HTML Strict anzugeben, damit werden die Standarts wenigstens ein bisschen besser eingehalten (die meisten nehmen Transitional).

Das Problem an Html ist eigentlich, dass die Browser zuviele Fehler zulassen. Anstatt bei einem Fehler abzubrechen, versuchen die das irgendwie zu interpretieren.

Hier ein paar Links:
http://validator.w3.org/check?uri=http://www.duthdesign.at/
http://w3c.org (gibt noch andere Tools wie z.B. Css Validator)
http://css4you.de (sehr hilfreich wenn man seine Seite mit CSS machen will)

duth · 10.02.2006

Dankeschön, für die nützlichen Links, und Tips an euch alle!
Werd mich mal hinsetzen uns etwas Css studieren... Ein "ganz Neuling" bin ich ja eh nicht, hab ja schon z.b.: Schriftgrößen und Farben mit CSS festgelegt!

Ok. Ciao duth

msslovi0 · 10.02.2006

duth schrieb:
Dankeschön, für die nützlichen Links, und Tips an euch alle!
Werd mich mal hinsetzen uns etwas Css studieren... Ein "ganz Neuling" bin ich ja eh nicht, hab ja schon z.b.: Schriftgrößen und Farben mit CSS festgelegt!

Wobei es auch da Verbesserungsbedarf gibt:

Code:

	font-family: verdana;

Da fehlt die generische Schriftfamilie.

Und du solltest nicht für jede Datei eine andere css-Datei einbinden. Das macht bei Änderungen nicht nur mehr Arbeit, der Browser muss auch jedes mal was anderes laden. Wenn du nur eine große Datei hast muss er zwar am Anfang mehr laden, kann dann aber die gecachte Version nehmen.

Matt

milchschnitte · 10.02.2006

msslovi0 schrieb:
Nein. Mit Sicherheit nicht!

nö, das is quatsch. spacer-gifs sind immer noch am sichersten, denn css wird immer noch nicht von jedem browser gleich interpretiert. warum also keine spacer-gifs?

msslovi0 · 10.02.2006

milchschnitte schrieb:
nö, das is quatsch. spacer-gifs sind immer noch am sichersten, denn css wird immer noch nicht von jedem browser gleich interpretiert. warum also keine spacer-gifs?

Es ist richtig, dass mancher Browser eine etwas komische Interpretationsgabe bzgl. css hat. Das Problem gab es aber vor css auch schon, nur waren es damals die HTML-Tags, die anders interpretiert wurden. Trotzdem ist niemand auf die Idee gekommen, die Seite nur noch aus pdf-Dateien zu erstellen, "weil das am sichersten ist".

Spacer-Gifs sind crap. Wenn du mit spacer-Gifs Abstände erzwingst verlagerst du Designelemente in dein HTML-Dokument und dafür war HTML nie gedacht, ist es auch nach wie vor nicht und wird es auch nie sein.
Während HTML die Struktur beschreibt nimmt man css für das Design. Punkt.

Oder willst du mir etwa sagen, das man so eine Überschrift formatiert:

HTML:

<p><i>Das ist die Überschrift</i><i><br />
</i><img src="images/strich.jpg" width="230" height="3"/><br />

Oder Navigationen so:

HTML:

<table>
  <tr>
    <td><a href="">Home</a></td>
  </tr>
  <tr>
    <td><a href=""><b>Über uns</b></a></td>
  </tr>
  <tr>
    <td><a href="">Kontakt</a></td>
  </tr>
  <tr>
    <td><a href="">Impressum</a></td>
  </tr>
</table>

Oder Text so:

HTML:

<p><font size="3" face="Trebuchet MS" color="#ff0000">Der Text ist in rot</font>

Eben. Macht auch keiner. Warum sollte man dann also Spacer-Gifs benutzen, die darüber hinaus das Markup unnötig aufblähen und halt mal eben gar keine semantische Relevanz haben.

Matt

milchschnitte · 11.02.2006

<img src="spacer.gif">

wo bläht das auf? kostet doch fast NULL bandbreite.

Manjo · 11.02.2006

Spacer blähen unnötig auf! Mit css erreicht man das gleiche... Manchmal mit einigen Tricks, um die Fehler in Browsern auszumerzen.

CSS-Praxis von Kai Loborenz (ISBN 3-89842-577-0) 34,90 Eus

kann ich empfehlen, wenn Du ein deutschsprachiges Buch möchtest zum Thema CSS. Gut gelungen ist, dass auf die Eigenarten (Fehler) der verschiedenen Browser eingegangen wird und Workarounds angeboten werden. Auch die Browser-Kompatibilitäts-Karte als Übersicht ist klasse.

Tabellen haben sicher ihren Sinn... aber nicht als Layoutmittel (auch wenn ich das, wenn's mal schnell eben sein muss, immer noch gerne nehme ;-) )

Stylesheets mindern v.a. den Traffic, wenn man eine externe CSS-Datei für die gesamte Seite baut, und trennen eben klar HTML und Design!

Gruss,

Manjo

Html - Webseiten schauen auf Mac OS X anders aus als unter Windows

duth

Aktives Mitglied

acid

Aktives Mitglied

wegus

MU Team

miss.moxy

Aktives Mitglied

duth

Aktives Mitglied

Incoming1983

Aktives Mitglied

duth

Aktives Mitglied

Burning_Dice

Aktives Mitglied

ostersau

Aktives Mitglied

Incoming1983

Aktives Mitglied

milchschnitte

Mitglied

msslovi0

Aktives Mitglied

msslovi0

Aktives Mitglied

julian_st

Aktives Mitglied

duth

Aktives Mitglied

msslovi0

Aktives Mitglied

milchschnitte

Mitglied

msslovi0

Aktives Mitglied

milchschnitte

Mitglied

Manjo

Aktives Mitglied