Die erste Webseite bringt eine Menge an Fragen mit sich...

[strohhalm6]

Hallihallo,

da ich neu bin, stelle ich mich kurz vor.
Ich heiße martin, bin 22 ahre jung und bereit ein neues themengebiet zu erforschen.

So habe ich mich hals über kopf hineingestürzt und einfach losgelegt(learn by doing), zur hilfe dienen einige lektüren, photoshop für diverse grafiken und der dreamweaver.
Da der dreamweaver mir persönlich zu unübersichtlich ist und ich eine gewisse ordnung am ''arbeitsplatz'' brauche habe ich diesen vorerst beiseite gepackt und schreibe nun in einem einfachen editor.

Kommen wir auf den punkt, das was ich euch hier vorstelle ist meine erste webseite, welche auch dementsprechend fehler enthalten kann.
Zum einen wird mir mein menü im internet explorer anders dargestellt als im firefox, es wird verschoben.
Die schriftart des menüs sagt mir auch irgendwie nicht zu, werden fonts die ich seperat herunterlade und einbinde auch auf anderen pc's angezeigt?
Zu guter letzt hätte ich noch gerne vertikale striche zwischen den einzelnen navigationselementen, ich finde dazu auch nichts passendes im internet.

Soweit bin ich gekommen:

selfmade-corsa


ich bedanke mich vielmals im vorraus...

 

[threadi]

Bevor Du weitermachst solltest Du dir den HTML-Code nochmal genau anschauen. Der ist nämlich fehlerhaft, was letztlich auch zu Fehldarstellungen führen kann. Dir fehlt zudem ein Doctype, was auch für die Darstellung wichtig ist. Also bitte nochmal die Grundlagen anschauen: SELFHTML: HTML/XHTML / Allgemeine Regeln fr HTML / Grundgerst einer HTML-Datei

Ziel sollte es sein, dass der W3C-Validator dir ein grünes Licht zeigt:
[Invalid] Markup Validation of http://strohhalm6.bplaced.net/ - W3C Markup Validator

Unabhängig davon solltest Du aber auch einige inhaltliche Sachen beachten:
Du verwendest absolute Positionierung - verzichte darauf. Besonders für Einsteiger wirkt das oft einfacher, führt aber viel schneller zu Problemen als dir lieb ist. Verwende statt dessen die CSS-Eigenschaften float, margin und padding dazu um Elemente nebeneinander anzuordnen.
Deine Bilder sind offenbar nicht auffindbar. Du musst sie natürlich auch per FTP auf den Server laden. Außerdem solltest Du auf Leerzeichen und Sonderzeichen (wie ä, ö, ü ..) in Dateinamen verzichten.

Noch zu deinen Fragen:
Schriftarten die auf deinem PC sind, sind auch nur auf deinem PC. Wenn Du eine Schriftart in deiner Webseite verwenden willst, die nicht üblich und nicht weit verbreitet ist, dann schau dir die CSS-Eigenschaft font-face an: CSS font-face

Da ich momentan unter dem Link nur ein weißes Viereck sehe, kann ich die Navigation und den Aufbau natürlich nicht beurteilen und deine Fragen dazu nicht beantworten.

 

[strohhalm6]

Bevor Du weitermachst solltest Du dir den HTML-Code nochmal genau anschauen. Der ist nämlich fehlerhaft, was letztlich auch zu Fehldarstellungen führen kann. Dir fehlt zudem ein Doctype, was auch für die Darstellung wichtig ist. Also bitte nochmal die Grundlagen anschauen: SELFHTML: HTML/XHTML / Allgemeine Regeln fr HTML / Grundgerst einer HTML-Datei

Ziel sollte es sein, dass der W3C-Validator dir ein grünes Licht zeigt:
[Invalid] Markup Validation of [url]http://strohhalm6.bplaced.net/ - W3C Markup Validator[/URL]

Unabhängig davon solltest Du aber auch einige inhaltliche Sachen beachten:
Du verwendest absolute Positionierung - verzichte darauf. Besonders für Einsteiger wirkt das oft einfacher, führt aber viel schneller zu Problemen als dir lieb ist. Verwende statt dessen die CSS-Eigenschaften float, margin und padding dazu um Elemente nebeneinander anzuordnen.
Deine Bilder sind offenbar nicht auffindbar. Du musst sie natürlich auch per FTP auf den Server laden. Außerdem solltest Du auf Leerzeichen und Sonderzeichen (wie ä, ö, ü ..) in Dateinamen verzichten.

Noch zu deinen Fragen:
Schriftarten die auf deinem PC sind, sind auch nur auf deinem PC. Wenn Du eine Schriftart in deiner Webseite verwenden willst, die nicht üblich und nicht weit verbreitet ist, dann schau dir die CSS-Eigenschaft font-face an: CSS font-face

Da ich momentan unter dem Link nur ein weißes Viereck sehe, kann ich die Navigation und den Aufbau natürlich nicht beurteilen und deine Fragen dazu nicht beantworten.

Ich hab es jetzt hinbekommen das die seite, zumindest im firefox, meinen vorstellungen entsprechend angezeigt wird.
Das mit der positionierung aufgrund anraten anderer auch zuerst versucht, es hat sich aber beim verstellen der werte nichts gerührt und ich war froh diese möglichkeit gefunden zu haben.
Danke das du dir zeit genommen hast, deine links werde ich mir morgen mal in aller ruhe anschauen, meine rübe qualmt nämlich.:mrgreen:

Wie gesagt firefox sollte jetzt alles korrekt anzeigen, wenn du lust und zeit hast kannst du ja mal einen blick reinwerfen und mir deine meinung dazu geigen.;Jump

In dem sinne...gute n8

 

[threadi]

Ja, jetzt kann ich im Firefox etwas sehen. Allerdings sind dort immer noch nicht vorhandene Grafiken enthalten. Und das Bild in der Mitte ist viel zu groß fürs Web. Merke dir auch noch, dass Du Bilder jeglicher Art möglichst auf die Größe bringst wie sie im Web angezeigt wird. Nicht jeder Besucher wird sich ein 16MB Bild runterladen :]

Und bei mir wirkt die Webseite dennoch immer noch verschoben, keine Ahnung was Du eigentlich erreichen willst. Auf absolute Positionierung zu verzichten würde wie gesagt einiges einfacher und vor allem sicherer in der Darstellung machen.

Und du hast weiterhin große HTML-Fehler drinne.

 

[strohhalm6]

Hausaufgaben fertig....
ich danke dir nochmals threadi, der validator hilft mir unbeschreiblich, so hab ich das ganze projekt nochmals neu aufgesetzt und befinde mich jetzt im grünen bereich.

Allerdings haben sich auch wieder einige fragen aufgetan.
Zum einen schließen die vertikalen linien nicht bündig mit dem oberen rand der leiste ab, das ganze steuer ich über den punkt ''padding''.
Nur akzeptiert dieser keine kommastellen, was muss ich tun?

Zum anderen habe ich jetzt ein, meiner persönliche empfindung nach, recht ansehnliches menü.
Nur fehlen mir dort jetzt noch untermenüs, welche egal wie sehr ich mich bemühe nicht eingebaut bekomme.
Ja, ich habe heute den ganzen abend getüfftelt und mich belesen.
Das untermenü soll sich sich vertikal entfalten.

Selfmade-Corsa

Danke für eure bemühungen....

 

[threadi]

Jetzt sieht der HTML-Code "besser" aus, nur ist die Umsetzung wieder nicht optimal. Du positionierst alles absolut, selbst das Menü. Daher kommt es jetzt auch zu diesen ungenauen Pixelverschiebungen. Du solltest das Menü wie auch alles andere nicht absolut positionieren, dann kriegst Du auch das mit den Linien richtig hin.

 

[strohhalm6]

Jetzt sieht der HTML-Code "besser" aus, nur ist die Umsetzung wieder nicht optimal. Du positionierst alles absolut, selbst das Menü. Daher kommt es jetzt auch zu diesen ungenauen Pixelverschiebungen. Du solltest das Menü wie auch alles andere nicht absolut positionieren, dann kriegst Du auch das mit den Linien richtig hin.

Soll ich die positionierungen komplett entfernen oder auf eine andere ausweichen?

 

[threadi]

Wie geschrieben: verzichte auf absolute Positionierung. Wenn Du mal etwas nebeneinander haben willst, verwende float.

 

[strohhalm6]

Wie geschrieben: verzichte auf absolute Positionierung. Wenn Du mal etwas nebeneinander haben willst, verwende float.

Das problem ist ja, das wenn ich die positionierung rausnehme, die grafiken nicht mehr übereinander legen.
Ich finde auch keine alternativmöglichkeit, alle sprechen von der absoluten positionierung.

 

[threadi]

Dann setz die Grafiken als Hintergrundbilder ein.