Hallo,

kurz zu mir, da dies mein erster Post hier ist:

ich bin beruflich Bankkaufmann, arbeite da im Bereich EBL (elektronische Bankdienstleistungen) und war schon immer von allem was mit dem PC und Internet zutun hat fasziniert. Vor nun fast 3 Jahren bat mich unser Karnevalsverein eine Internetseite zu machen, bis dato hatte ich davon null Ahnung. Zusammen mit einem Bekannten erstellte ich an einem Wochenende mit dessen Programm Dreamweaver die Internetseite, so wie Sie heute auch noch ausschaut (wird wohl das nächste Relaunchprojekt). Bis vor kurzem war ein Quelltext und reiner Text-Editor ein Grauen für mich, bis ich irgendwann mit Websitebaker (CMS) anfing zu experimentieren.

Vor 2 Wochen bat mich ein Bekannter, der eine Spedition betreibt, eine Seite für ihn zu relaunchen und ich habe es gewagt dies allein mit Notepad++ zu realisieren. Und was soll ich sagen, die Nächte wurden immer kürzer, der Kaffeekonsum stieg rasant an und nun habe ich es vollbracht, eine Seite die ich was das Design betrifft schon ganz gut finde. Allerdings reicht schön aussehen nicht aus, nein sie sollte auch etwas taugen. Ich habe sie schon validiert (wonach auch immer ) und sie sieht im IE6, IE7, Firefox 2.x und Opera 9.x immer gleich aus. Die Seite muss unter 2MB Gesamtgröße bleiben, da mehr der Webspace nicht hergibt, der bereits existiert.

Allerdings habe ich meine style.css schon arg vergewaltigt, damit die seite so aussieht wie ich sie optisch haben wollte. so wurde oft ein dicker rand in zellenfarbe genommen, um text vertical zu positionieren und für die horizontale Navi habe ich doch noch ne tabelle verwendet(hier bin ich für tipps dankbar), auch wenn das scheinbar verpönnt ist (ich werde euch nie nie nie die karnevalsseite zeigen , mit diesem Dreamweaver haben mein Bekannter und ich nur Tabellen fabriziert).

Ich habe lange überlegt ob ich mich eurem harten urteil stelle, aber mir macht das ganze soviel spass und ich würde gern noch mehr lernen.

Es würde mich also freuen wenn ihr mir eure Meinung sagen könntet (bitte bedenkt das ich noch am Anfang stehe und nicht jeden Fachbegriff kenne).

Schonmal vielen Dank für die geopferte Zeit:

Willkommen bei Hesse-Transporte

Michael

P.S. micme.de "Webdesign" klingt schon sehr anmaßend, vor allem da ich noch ganz am anfang stehe. Allerdings ist es mein Ziel irgendwann das Thema so zu beherrschen, das ich vielleicht noch für weitere Leute die Internetseite überarbeiten kann. Man wächst ja an seinen Zielen und jedem Projekt und mittlerweile habe ich mehr Zeit mit Gimp, Websitebaker und in CSS-Foren lesender Weise verbracht, als mit meinen lieben MMORPGS ^^ Also bitte nicht auslachen ^^

is ein no-go!
Änder das ab. Wenn es nur abstand zwischen elementen bewirken soll, dann machs mit margin der beiden anderen elemente (die den abstand haben sollen)!

__________________
Meine Spielwiese: http://blog.kanedo.net
Ich bei Flickr? Da: Flickr: Fotostream von kanedo-projekt
Für open Source Liebhaber: open Com

Auch ich Zwitschere als @kanedo

Schon geändert, vielen Dank für die schnelle Antwort. Am Anfang wollte das nicht so wie ich wollte, daher hatte ich diese "Krücke" eingebaut.

Die Navigation ist eine Liste, keine Tabelle. Sicher, dass du das Element #navi brauchst? Du hast doch ein Element für die Navigation, nutze doch dies.

Die Links in #footer_oben sind keine Überschrift und sollten deshalb nicht als solche ausgezeichnet werden. Nimm auch hier eine Liste (<ul>) und schmeiß das umschließende <div> raus. Das gleiche gilt für #footer_unten.

Wieso ist #footer nicht auch in #container?

Zudem verwendest du zu viele <div>, um anderen einzelene Elemente zu umschließen. Doch dies macht nur in ganz wenigen Situationen Sinn und sollte deshalb vermieden werden.

Gibt eine Grund wieso du nicht XHTML 1.0 Strict nutzt?

<meta>-Tag für die Zeichenkodierung fehlt.

Fehler im CSS-Dokument: Ergebnisse des CSS-Validators http://hesse.micme.de/ (CSS level 2.1)

PS: Im IE6 sieht noch nicht alles so gut aus. Lücke zwischen Navi und Rand.

__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ

Die Auszeichnung als Überschrift erfolgt nur, weil sie identische style-Vorgaben haben und ich es nicht doppelt definieren wollte. Das mit dem Footer unter dem "container" habe ich gemacht, da ich als Anfänger noch nicht gut mit float zurechtkomme, manche Elemente wachsen in einigen Browsern durch andere hindurch wärend es in anderen dann genau das macht was es soll. so lasse ich den container wachsen, wenn sich der content vergrößert (wenn auch manuell und nicht automatisch ) und der footer bleibt wo er hin soll: unten und wächst mir nicht mitten in die Seite.

So ähnlich verhält es sich auch mit den umschliessenden div´s: oft habe ich diese gebraucht, um entsprechenden Abstand / Ränder hinzubekommen.

Aber vielen Dank für die Hinweise, ich werd versuchen was daran zu ändern, auch wenn ich wieder stunden vor "zerschossenen" Bereichen verbringen werde...

und die fehler im css dokument... nunja damit kann ich sehr gut leben, denn was dort angegeben ist muss ja so sein um den halbdurchsichtigen effekt zu erzielen, anders weiß ich das nicht zu lösen.

edit: habs mir gerade mal im IE6 angeschaut, ist ja furchtbar. sowas meine ich, das ist zum verwzeifeln: man bastelt stunde um stunde und es sieht in drei browsern gut aus, dann kommt sowas. navi net durchsichtig und subnavi passt der rand nimmer. und kein plan wie man das ändern soll, ohne in den drei browsern wo es passt sich wieder alles kaputt macht. Aber so ists halt immer wenn man etwas neues lernt: drei schritt vor, zwei zurück...

Nicht wirklich. Habe mir, als ich mit css anfing, irgendwann mal eine "Basisvorlage" erstellt, sowohl für die html als auch die css Datei mit der ich beginne. Hab da nie etwas dran gedreht, kann ich aber ändern wenn sowas erforderlich ist.

Gibt es auch ein paar Meinungen zum Design? (technische Hinweise sind natürlich auch weiterhin sehr willkommen, soll ja besser werden!)

Dann mach es jetzt ordentlich und definiere es nochmal.
Lies dir die verlinkten Artikel in FAQ Punkt 2 durch.
Auch eine Liste kann Ränder und Abstände bekommen.
Das sind nunmal keine CSS2.1 Eigentschaften.
Die Lücke sollte der 3px-Jog-Bug sein und die Durchsichtigkeit bekommst du nur schwer hin, da der IE6 deine, auch vom Validator bemängelten, Eigentschaften nicht kennt. Versuche für ihn einen png-8 Ersatz zu schaffen.
Kann nicht schaden, ist etwas strenger und du musst nicht wirklich mehr beachten.
Ach so, denk an die Zeichenkodierung.

__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ

Feine Sache, danke für die Hinweise, da hab ich ja schonmal was abzuarbeiten. Wie genau meinst du das mit der Zeichenkodierung? Wie gefällt das "Design" im allgemeinen, also grobe Anordnung, Farbgebung (der Inhaber wünscht sich das Blau) usw.? Über Geschmack kann man sich ja immer streiten, ich bin ganz zufrieden mit meinem Erstlingswerk, aber andere Meinungen würden mich auch interessieren.

Grüße Michael

Zeichenkodierung: Metaangaben: Der Elementtyp meta – Einführung in XHTML, CSS und Webdesign

zur Seite:
Wieso zwei identische Navigationen? Lass die linke weg, wenn dort nichts neues steht.

Vergrößer mal die Schrift, fällt dir was auf? Richtig, deine Elemente haben oft feste Höhen, dann wächst der Text beim Vergrößern raus, sehr unschön.

Soll der Text so klein bleiben, wie bei "Testtext"? Wenn ja, dass ist zu klein.

Angenehmer Hintergrund, gute Kontraste.

__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ

Wollte es auf der "Startseite" nicht leer lassen, deswegen 2 identische Navis auf der einen Seite. Kann man drüber streiten, ohne sieht es so leer aus. Vielleicht setze ich da noch eine Grafik ein, so dass es nicht so leer wirkt.

Mit der Schriftgröße muss ich ganz ehrlich sagen, da hab ich noch nicht drauf geachtet, war froh das es überhaupt erstmal hingehauen hat. Werde aber auch da versuchen mich hineinzulesen, sieht wirklich sehr unschön aus. Könnte doch aber auch die Schrift "festmachen" (reicht da wenn ich statt em px verwende?) dann ists zwar nicht barrierefrei aber wenigstens zerspringt nichts.

Der "Testtext" ist noch vollkommen unformatiert und daher so klein. Da mache ich dann weiter wenn das Layout erstmal steht, da wird auf jeden Fall was geändert.

Bin richtig froh hier geschrieben zu haben, den ich dachte die Seite wäre schon ganz passabel, aber da hab ich eindeutig nur auf die Spitze des Eisbergs geschaut

Freut mich das dir Hintergrund und Kontraste gefallen.

Wegen der durchsichtigen Navigation: mir ist aufgefallen wenn ich die Datei lokal öffne, ists im IE6 wie in anderen Browsern auch, durchsichtig. Nur rufe ich es über die url auf, wirds schwarz. komische Sache...

edit: @ Blackhawk: am Rande - du wohnst Ost-Hessen? Dann kommst ja aus der Nähe, wohne in West- / Südwest-Thüringen (da wo die A4 die Bundesländer wechselt)

Hi, micme!

Technisch ist ja schon einiges besprochen, ich hack mal auf dem Layout/Erscheinungsbild rum.

Was willst Du machen? Ein Aquarium? Obwohl ein schönes Aquarium gar nicht blau ist. Hier hast Du eindeutig blaue Phase, sieh mal:
blaue Autos, blauer Himmel, blauer Header, blauer Hintergrund, blaublaublaublau

Blau ist eine extrem sachliche und daher kalte Farbe. Dies sollte nur im Kontext mit Belehrungen oder Finanzen/Steuern Listen usf verwendet werden.
Mag ja sein, die Firma hat blaue Autos, und ein blaues Logo, aber Deine Seite erstickt daran.

Mach Dir mal Gedanken (eine Mindmap), wie:
Was ist eine Spedition?
Was tut diese?
Wie macht diese, was sie tut?
Wer tut es?
Wann?

Damit analysierst Du mal (Basic!!!) die Firma.
Und Du siehst ganz schnell, das Deine Farben nicht mehr passen.
Informiere Dich über Farbwirkung und - ja lacht nur - auch Farbpsychologie!

Es ist das Gesamtpaket (Code - Relevanz - Optik - Geduld) das darüber entscheidet, ob Du gut besuchte Seite baust.