Moppel: Feedback von den Profis

Beitrag lesen

SELF-Forum

Feedback von den Profis

Moppel
– Informationen zu den Bewertungsregeln

So,
wie mir der Martin noch einmal bestätigt hat, habe ich ein völlig unsinniges div-Layout gebaut. Die meisten divs seien überflüssig.
Ich würde gern, da es auch mein erstes Projekt ist, eine sinnvolle Architektur erstellen. Ich kann mir vorstellen, die Seite über eine große Tabelle zu erstellen, da das Hauptfenster nie nach unten länger wird, als die Navigation. Oder muss ich nur manche divs erstezen. Ich habe wirklich keinen plan davon, wie eine sinnvolle Architektur auszusehen hat, wenn das Resultat exakt so sein soll. Das Layout wird nur noch hinsichtlich derFarben verändert. Rahmen etc soll so bleiben.
Hier nocheinmal der Code: Zur Seite
Hier noch einmal mein Code:

/* Global gültige Layouts */  
html { background-color:#960f0f; }  
body { margin: 0;padding: 0;width:100%;height:100%; }  
a img { border : 0 none; }  
table { border:0px; border-collapse: collapse; }  
table td { padding : 0; vertical-align: middle; height:57px; }  
  
/* Div-Container fuer die Struktur der Seite */  
/* Bereich mit Logo und den Fotos */  
#Header { Width:957px;margin: 5px auto;position: relative;border:0px; }  
#Logo1 { Width:227px;Height:160px;float:left;border-left:2px solid #FFFFFF;border-right:1px solid #FFFFFF;  
border-top:2px solid #FFFFFF;border-bottom:1px solid #FFFFFF;background-image:url(../Grafiken/Logo1.bmp); }  
#Logo2 { Width:240px;Height:160px;float:left;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;  
border-top:2px solid #FFFFFF;border-bottom:1px solid #FFFFFF;background-image:url(../Grafiken/Logo2.jpg); }  
#Logo3 { Width:240px;Height:160px;float:left;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;  
border-top:2px solid #FFFFFF;border-bottom:1px solid #FFFFFF;background-image:url(../Grafiken/Logo3.jpg); }  
#Logo4 { Width:240px;Height:160px;float:left;border-left:1px solid #FFFFFF;border-right:2px solid #FFFFFF;  
border-top:2px solid #FFFFFF;border-bottom:1px solid #FFFFFF;background-image:url(../Grafiken/Logo4.jpg); }  
  
/* Bereich mit der Navigation unter den Fotos */  
#Textzeile { Width:957px;margin-left:auto;margin-right:auto;margin-top:0px; border:0px; }  
#Text1 { Width:227px;Height:34px;line-height:34px;float:left;border-left:2px solid #FFFFFF;  
border-right:1px solid #FFFFFF;border-top:1px solid #FFFFFF;border-bottom:1px solid #FFFFFF; }  
#Text2 { Width:240px;Height:34px;line-height:34px;float:left;border-left:1px solid #FFFFFF;  
border-right:1px solid #FFFFFF;border-top:1px solid #FFFFFF;border-bottom:1px solid #FFFFFF; }  
#Text3 { Width:240px;Height:34px;float:left;border-left:1px solid #FFFFFF;  
border-right:1px solid #FFFFFF;border-top:1px solid #FFFFFF;border-bottom:1px solid #FFFFFF; }  
#Text4 { Width:240px;Height:34px;line-height:34px;float:left;border-left:1px solid #FFFFFF;  
border-right:2px solid #FFFFFF;border-top:1px solid #FFFFFF;border-bottom:1px solid #FFFFFF; }  
  
/* Hauptbereich mit Navigation und Textfenster */  
#Main { Width:957px;margin-left:auto;margin-right:auto;margin-top:0px;border:0px; }  
/* Navigation */  
#Navigation { Width:227px;float:left;border-left:2px solid #FFFFFF;border-right:1px solid #FFFFFF;  
border-top:1px solid #FFFFFF;border-bottom:2px solid #FFFFFF;background-image:url(../Grafiken/Button.jpg); }  
#Nav1 { border-bottom:1px solid #960f0f;Width:207px;Height:36px;line-height:36px;padding-left:20px; }  
#Nav2 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:35px;line-height:35px;padding-left:20px; }  
#Nav3 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:35px;line-height:35px;padding-left:20px; }  
#Nav4 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:57px;padding-left:20px; }  
#Nav5 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:57px;padding-left:20px; }  
#Nav6 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:35px;line-height:35px;padding-left:20px; }  
#Nav7 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:35px;line-height:35px;padding-left:20px; }  
#Nav8 { border-top:1px solid #960f0f;border-bottom:1px solid #960f0f;Width:207px;  
Height:35px;line-height:35px;padding-left:20px; }  
#Nav9 { border-top:1px solid #960f0f;Width:207px;Height:35px;line-height:35px;  
padding-left:20px; }  
/* Grosses Textfenster */  
#Hauptfenster { Width:726px;Height:378px;float:left;border-left:1px solid #FFFFFF;  
border-top:1px solid #FFFFFF;background-image:url(../Grafiken/Hintergrund.jpg); }  
  
/* Fussnotenbereich */  
#Fussnote { Width:957px;margin-left:auto;margin-right:auto;margin-top:0px; }  
  
/* Textlayouts */  
/* Layouts für die Links */  
a.nav:link { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 11pt;  
font-weight: normal;text-decoration: none;color: white; display:block; text-align: left; }  
a.nav:visited { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 11pt;  
font-weight: normal;text-decoration: none;color: white; display:block; text-align: left; }  
a.nav:hover { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 11pt;  
font-weight: bold;text-decoration: none;color: #960f0f; display:block; text-align: left; }  
a.nav:active { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 11pt;  
font-weight: bold;text-decoration: none;color: #960f0f; display:block; text-align: left; }  
a.nav:focus { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 11pt;  
font-weight: bold;text-decoration: none;color: #960f0f; display:block; text-align: left; }  
a.textzeile:link { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: none;color: white; display:block; text-align: center; }  
a.textzeile:visited { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: none;color: white; display:block; text-align: center; }  
a.textzeile:hover { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: underline;color: white; display:block; text-align: center; }  
a.textzeile:active { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: underline;color: white; display:block; text-align: center; }  
a.textzeile:focus { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: underline;color: white; display:block; text-align: center; }  
a.pdf:link { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: black; display:block; text-align: left;  
padding-left:40px; padding-top:10px;line-height:25px; }  
a.pdf:visited { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: black; display:block; text-align: left;  
padding-left:40px; padding-top:10px;line-height:25px; }  
a.pdf:hover { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: #960f0f; display:block; text-align: left;  
padding-left:40px; padding-top:10px;line-height:25px; }  
a.pdf:active { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: #960f0f; display:block; text-align: left;  
padding-left:40px; padding-top:10px;line-height:25px; }  
a.pdf:focus { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: #960f0f; display:block; text-align: left;  
padding-left:40px; padding-top:10px;line-height:25px; }  
  
/* Layouts für die Textzeile */  
.Homepagelink { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: none;color: white; display:block; text-align: center; }  
.Textzeilenlinkaktiv { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: bold;text-decoration: none;color: white; display:block; text-align: center; }  
  
/* Layouts für die Navigationsleiste */  
.Navigationstextaktiv { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 11pt;  
font-weight: bold;text-decoration: none;color: white; display:block; text-align: left; }  
  
/* Layouts für das Hauptfenster */  
/* Layouts für die Ueberschriften */  
.Inhaltueberschrift { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 14pt;  
font-weight: bold;text-decoration: none;color: #960f0f; display:block; text-align: left;  
padding-left:20px; padding-top:18px; }  
.Inhaltueberschrift2 { font-family:'Verdana';font-style: italic;font-variant: normal;font-size: 13pt;  
font-weight: bold;text-decoration: none;color: #960f0f; display:block; text-align: right;  
padding-right:20px; padding-top:20px; }  
.Inhaltueberschrift3 { font-family:'Verdana';font-style: italic;font-variant: normal;font-size: 13pt;  
font-weight: bold;text-decoration: none;color: #960f0f; display:block; text-align: right;  
padding-right:20px; padding-top:20px; }  
  
/* Layouts für den Haupttext */  
.Inhaltkorpus1 { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: black; display:block; text-align: left;  
padding-left:20px; padding-top:30px; padding-right:20px;line-height:25px; }  
.Inhaltkorpus2 { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 10pt;  
font-weight: normal;text-decoration: none;color: black; display:block; text-align: left;  
padding-left:20px; padding-top:20px; padding-right:20px;line-height:20px; }  
.Inhaltkorpus3 { font-family:'Verdana';font-style: normal;font-variant: normal;font-size: 12pt;  
font-weight: normal;text-decoration: none;color: black; display:block; text-align: left;  
padding-left:20px; padding-top:10px; padding-right:20px;line-height:25px; }  
  
/* Layouts für die Fussleiste */  
.Fussnotentext { font-family:'Verdana' ;font-style: normal;font-variant: normal;font-size: 7.5pt;  
font-weight: normal;text-decoration: none;color: white; display:block; text-align: left; }

Im nächsten Thread noch einmal der HTML Code.
Ich wäre dankbar für jede Hilfe, wie man eine sinnvolle Architektur mit gleichem Endresultat baut.

Beitrag melden
–
Informationen zu den Bewertungsregeln
0 24

Feedback von den Profis

Moppel
  • seitenbewertung
  1. 2
    Beat
    1. 0
      Moppel
      1. 0
        Steffen
        1. 0
          Peter Pan
          1. 0
            Steffen
            1. 0
              Peter Pan
              1. 0
                Moppel
                1. 0
                  Moppel
                2. 0

                  Sinnvolle Struktur statt alter Sünden

                  Peter Pan
                  • meinung
        2. 0
          Moppel
          1. 0
            sepp
            1. 0
              Felix Riesterer
      2. 0
        EKKi
        • html
  2. 0
    Encoder
  3. 0
    Brillo Agent Nr. 1
    1. 0
      Der Martin
      1. 0
        Brillo Agent Nr. 1
        1. 0
          Der Martin
          1. 0
            Kai345
        2. 0
          Steel
  4. 0
    Moppel
  5. 0
    Felix Riesterer
    1. 0
      stewe