Bewertung: Inhalt und Layout

[Mario348]

Ich möchte gerne von euch wissen, wie ihr meine Homepage findet.

Beurteilt werden sollten der Inhalt und das Layout.

Vorschläge für ein Icon nehme ich gerne entgegen!

 

[incendium]

1: LINK?

2: wenn du den aus deiner signatur meinst: Geht nicht

 

[Mario348]

Tut mir leid, nun funktioniert's :-D.

 

[Tobias]

Finde die nicht so gut.
Irgendwie so unübersichtlich!

 

[Raven]

-header wirkt wie in schlechter qualität
-farben wirken unpassend (schwarz weiß verlauf + orange)
-anzeigefehler in der navi
-navi zu umfangreich -> bring ordnung rein, mach die navinamen kurz und einprägsam,fasse seiten zusammen oder mach ne subnavi
-counter überflüssig
-frames wirken unprofessionell

 

[Mario348]

Was schlägt ihr vor? Etwas konkreter bitte...

 

[incendium]

finde ich auch nicht gut.

Was meinst du mit konkreter?

wurde doch oben schon geschildert. es passt einfach nicht zusammen. Es wirkt unprofessionell.

 

[Mario348]

Wie "schlechter Header"?
Welche Farben wären besser (Hintergrund)?

 

[Raven]

also zu allererst keinen farbverlauf ... ich würd durchgehend ein mitteldunkles grau benutzen auf dem schwarze schrift noch gut lesbar wäre. Der header wirkt einfach irgendwie verschrumpelt (verpixelte kanten)

 

[Mario348]

Das mit dem verpixelten Header "musst" du mir genauer beschreiben...

 

[Icy]

Hmm also erstmal fällt mir auf, dass du Frames benutzt. Das ist natürlich nicht gerade vorteilhaft und praktisch, deswegen solltest du dich mal in CSS einarbeiten bzw. wenn du es bereits kannst, dies auch bei dem Grundgerüst deiner Seite anwenden.
Der Header ist sehr ungeordnet und wirkt etwas chaotisch, da würde ich mehr Struktur reinbringen. Im Opera kann man im Header übrigens vertikal scrollen und man sieht unter den Buttons einen Blauen Banner ("Kostenloser EIntrag in 1111 Suchmaschinen"). Der Counter passt auch nicht in den Header.
Der Content-Bereich passt wie meine Vorredner schon sagten wegen dem Farbverlauf nicht. Das Schwarz und das Weiß beißen sich.
Ganz valide ist die Seite auch nicht.

MfG Icy

 

[Raven]

Das mit dem verpixelten Header "musst" du mir genauer beschreiben...

guck dir mal die kanten an, und sag mir ob diese wirklich rund sind ...

 

[Mario348]

Nun habe ich Einiges verbessert...

Wie ich das Problem mit dem oberen Frame beheben soll, weiss ich immer noch nicht.


Könnt ihr mir eine gute Seite nennen, auf der beschrieben ist, wie ich Frames durch CSS ersetzen kann?
Habe bisher nichts Gescheites gefunden...

 

[Raven]

intensivstation :: CSS Templates :: Templates

EDIT: aber ich versteh auch nicht wieso du frames dringend brauchst ... ich meine es wär wesentlich benutzerfreundlich wenn die navi einfach oben und der content darunter auf einer seite wären. So muss man viel mehr scrollen und man sieht immer nur einen recht kleinen teil des contents.

 

[Mario348]

Aber das mittlere Frame wird doch benötigt, da wird ja der Inhalt geladen?!

 

[newlord]

Nein - Was spricht dagegen, dass Menü und den Inhalt in eine Datei zu schreiben? Wenn es dabei blos um die Ausrichtung bzw. Positionierungen geht, dann nutze den Link welcher von Raven gepostet wurde, oder lese dir mal diese Seite [ Einführung in XHTML, CSS und Webdesign ] durch.

Ich selbst habe lange Zeit mit Frames bzw. IFrames gearbeitet, bis ich meine Seite in einem anderen Forum vorgestellt habe und dort regelrecht in der Luft zerrissen wurde. Kaum nen Tag später hatte ich ein behelfsmäßiges CSS Layout zusammen und mir wurde Schlagartig klar, dass dies weitaus weniger Aufwand ist. Zwar musste ich immer mal wieder nachschauen wie was geht, weil ich noch nicht so recht sicher in der Herrangehensweise war, aber nachdem ich mich Tag für Tag da reingekniet habe, wurde das sozusagen zur Routine.

Das mal zu meinen Erfahrungen dazu und um dir mal die Unterschiede zwischen einem Quellcode aus Tabellen und einem Quellcode mit CSS zu zeigen: Analyse einer Kundenpräsenz

MfG

NewLord

 

[Mario348]

Habe bis jetzt einfach nicht herausgefunden, wie ich ein Layout mit 2 Zeilen bastle...

 

[Raven]

#head {width:800px; height:300px;}
#content {width:800px;}

 

[Mario348]

1. Wie kann ich machen, dass das untere Frame den Rest an Platz verbraucht?
Bsp: Frame1 (Navigation): Höhe x, Länge unendlich
Frame2 (Inhalt): Höhe 100%-x, Länge unendlich?

2. Wie kann ich die ID's vergeben?


index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="shortcut icon" href="http://www.arudc.ch/favicon.ico">
<meta name="keywords" content="Downloads, Tips, neuste RADEON-Grafikkartentreiber, Windows Vista-Infos, Viren und Malware, Stressabbau-Downloads , Musik, Browser-Downloads , Webradio, Gästebuch, Maps, Remote">
<meta name="description" content="Kostenlose Downloads und Tips f&uuml;r den PC. Rubriken: neuste RADEON-Grafikkartentreiber, Windows Vista-Infos, Viren und Malware, Stressabbau-Downloads , Musik, Browser-Downloads , Webradio, G&auml;stebuch, Maps, Remote ">
<meta name="DC.Description" content="Kostenlose Downloads und Tips f&uuml;r den PC. ">
<meta name="title" content="Alles rund um den Computer">
<meta name="language" content="German, de, deutsch">
<meta name="author" content="Mario Bienz">
<meta name="publisher" content="arudc.ch">
<meta name="copyright" content="arudc.ch">
<meta name="revisit-after" content="after 20 days">
<meta name="page-topic" content="Kostenlose Downloads und Tips f&uuml;r den PC">
<meta name="page-type" content="Gratisdownloads & Tips">
<meta name="audience" content="alle">
<meta name="robots" content="index,follow">
<meta name="generator" content="http://www.arudc.ch">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


<frameset rows="230,*" border="0">
<frame src="oben.html" name="oben" scrolling="no" border="no" framespacing="no">   
<frame src="home.html" name="mitte" scrolling="auto" border="no" framespacing="no">

</frameset>

</head>
<body>
</body>
</html>

oben.css

body {

   background-color:#000000;
}


.style00 {
   font-family:UniversalMath1 BT, Helvetica, sans-serif;
   font-size:1em;
   font-color:#ffa500;
   text-align:center;
   
} 


 #tabsH {
      float:left;
      width:100%;
      background:#000;
      font-size:93%;
      line-height:normal;
      }
    #tabsH ul {
      margin:0;
      padding:10px 10px 0 50px;
      list-style:none;
      }
    #tabsH li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsH a {
      float:left;
      background:url("image/tableftH.gif") no-repeat right top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabsH a span {
      float:left;
      display:block;
      background:url("image/tabrightH.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#FFF;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsH a span {float:none;}
    /* End IE5-Mac hack */
    #tabsH a:hover span {
      color:#FFF;
      }
    #tabsH a:hover {
      background-position:0% -42px;
      }
    #tabsH a:hover span {
      background-position:100% -42px;
      }


<div id="tabsH">
  <ul>
    <li><a href="home.html" title=""><span>Home</span></a></li>
    <li><a href="neuste radeon grafikkarten.html" title=""><span>Neuste Radeon Grafikkarten</span></a></li>
    <li><a href="windows vista infos.html" title=""><span>Windows Vista Infos</span></a></li>
    <li><a href="viren und malware.html" title=""><span>Viren und Malware</span></a></li>
    <li><a href="stressabbau downloads.html" title=""><span>Stressabbau Downloads</span></a></li>
    <li><a href="musik.html" title=""><span>Musik</span></a></li>
    <li><a href="browserdownloads.html" title=""><span>Browserdownloads</span></a></li>
    <li><a href="webradio.html" title=""><span>Webradio</span></a></li>
    <li><a href="remote.html" title=""><span>Remote</span></a></li>
    <li><a href="gästebuch.html" title=""><span>Gästebuch</span></a></li>
    <li><a href="newsletter.html" title=""><span>Newsletter</span></a></li>
    <li><a href="kontakt.html" title=""><span>Kontakt</span></a></li>
</ul>

</div>

oben.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<base target="mitte">
<title>oben.html</title>
<link rel="stylesheet" type="text/css" href="oben.css" media="screen">
<link rel="shortcut icon" href="http://www.arudc.ch/favicon.ico">
<meta name="keywords" content="Downloads, Tips, neuste RADEON-Grafikkartentreiber, Windows Vista-Infos, Viren und Malware, Stressabbau-Downloads , Musik, Browser-Downloads , Webradio, Gästebuch, Maps, Remote">
<meta name="description" content="Kostenlose Downloads und Tips f&uuml;r den PC. Rubriken: neuste RADEON-Grafikkartentreiber, Windows Vista-Infos, Viren und Malware, Stressabbau-Downloads , Musik, Browser-Downloads , Webradio, G&auml;stebuch, Maps, Remote ">
<meta name="DC.Description" content="Kostenlose Downloads und Tips f&uuml;r den PC. ">
<meta name="title" content="Alles rund um den Computer">
<meta name="language" content="German, de, deutsch">
<meta name="author" content="Mario Bienz">
<meta name="publisher" content="arudc.ch">
<meta name="copyright" content="arudc.ch">
<meta name="revisit-after" content="after 20 days">
<meta name="page-topic" content="Kostenlose Downloads und Tips f&uuml;r den PC">
<meta name="page-type" content="Gratisdownloads & Tips">
<meta name="audience" content="alle">
<meta name="robots" content="index,follow">
<meta name="generator" content="http://www.arudc.ch">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">



</head>
<body>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">



<div id="tabsH">
<img src="image/titel.gif" align="center" width="818" height="103" alt="Alles rund um den Computer">
  <ul>
    <li><a href="home.html" title=""><span>Home</span></a></li>
    <li><a href="neuste radeon grafikkarten.html" title=""><span>Neuste Radeon Grafikkarten</span></a></li>
    <li><a href="windows vista infos.html" title=""><span>Windows Vista Infos</span></a></li>
    <li><a href="viren und malware.html" title=""><span>Viren und Malware</span></a></li>
    <li><a href="stressabbau downloads.html" title=""><span>Stressabbau Downloads</span></a></li>
    <li><a href="musik.html" title=""><span>Musik</span></a></li>
    <li><a href="browserdownloads.html" title=""><span>Browserdownloads</span></a></li>
    <li><a href="webradio.html" title=""><span>Webradio</span></a></li>
    <li><a href="remote.html" title=""><span>Remote</span></a></li>
    <li><a href="gästebuch.html" title=""><span>Gästebuch</span></a></li>
    <li><a href="newsletter.html" title=""><span>Newsletter</span></a></li>
    <li><a href="kontakt.html" title=""><span>Kontakt</span></a></li>
</ul>

</div>
<br>

<div id="box2">
<!-- Beginn Bannercode submitter.de -->
<CENTER><A HREF="http://www.submitter.de" target="new">
<IMG SRC="http://www.submitter.de/banner/banner1.gif" NOSAVE BORDER=0 HEIGHT=50 WIDTH=200 ALT="submitter.de - Kostenloser Eintrag in &uuml;ber 1111 Suchmaschinen!"></A> </CENTER>
<!-- Ende Bannercode submitter.de -->
</div>


<!-- Counter von http://fc.webmasterpro.de : dieser Code zeigt ihre Besucherzahl an und zählt mit -->
<script type="text/javascript" src="http://fc.webmasterpro.de/counter.php?name=mario348&amp;style=none" id="fcScriptmario348"></script>
<noscript><div><img src="http://fc.webmasterpro.de/as_noscript.php?name=mario348" alt="" /></div></noscript>


</body>
</html>

Es sollten auch wie bisher alle Seiten im unteren Frame geladen werden...

 

[Raven]

höhe 100% würde in dem fall nix bringen, da die höhe entweder genau angeben werden muss (px,pica etc.) oder man lässt height einfach weg und der container passt sich automatisch dem inhalt an.

<div id="head" style="width:100%;height:400px;background:black;"></div>
<div id="content" style="width:100%;background: rgb(150,150,150);"></div>

versuch auf dem code deine seite aufzubauen. Aber wirklich empfehlen würde ich dir nochmal bei css intensivstaion zu schauen und dort eine struktur herauszunehmen.

Jedenfalls viel erfolg^^