Quov: Farbgebung

Da ich momentan in den letzten Züge liege was den html/css code betrifft, und somit die Farbgebung der Homepage in den Vordergrund tritt, ich aber ein absoluter Pessimist bin, und daher zu gerne zu Graustufen tendiere, brauche ich eure Hilfe :>

Die Seite soll einigermaßen freundlich wirken, aber auch nicht zu abgedreht(Viele inharmonische Farben, pink whatever).
Mit dem Header hab ich bereits versucht einen Blaustich in die Hp einzuarbeiten - gefällt mir auch soweit - allerdings ist mir die restliche Gestaltung zu matt.

Also wenn ihr Anregungen habt, spontane Intutionen von bestimmten Farben in Hexa-Dezimal dann her damit. Jede Meinung ist erwünscht, es gibt schließlich nicht DAS Design, Unterstützung ist das A und O.

Anbei sei angemerkt: Grundsätzlich ist mir die Farbe egal - allerdings sollte sie zu einem persöhnlichen Profil eines Mannes passen, daher am besten Schwarz/Blau Kombinationen enthalten.
(Lila,Grün z.B. wäre nichts für mich...ich hoffe, ihr versteht was ich meine)

Schonmal Danke für eure Inspiration ;)

Lg

Klick mich

  1. Grüße,
    grau tut es auch - aber vermeide monotone flächen - versuch den hintergrund etwas "spannender" zu gestlaten - mit "Noise" - also schwachen Unregelmäßigkeiten in der textur.
    MFG
    bleicher

  2. Schonmal Danke für eure Inspiration ;)

    Deine Farbgestaltung ist primär vom Inhalt abhängig.
    Mit schwarz hast du ja eine passend neutrale Leinwand-Farbe für Bilder gewählt.
    Ich würde mich zuerst von all den Bordern verabschieden.
    Deine Aufgabe ist es eher, den Übergang vom Schwarz zur weissen Canvas für den Text zu gestalten.

    Übrigens:
    <div id="nav">
    <ul id="nav">
    <li><a href="index.html"><span id="nav">S</span>...

    Eine ID darf nur einmalig pro Dokument vorkommen.
    Korrigiere das, bevor sich dein CSS unerwartet verhält.

    mfg Beat

    --
    ><o(((°>           ><o(((°>
       <°)))o><                     ><o(((°>o
    Der Valigator leibt diese Fische
    1. 1.(von Beat)

      Ich würde mich zuerst von all den Bordern verabschieden.
      Deine Aufgabe ist es eher, den Übergang vom Schwarz zur weissen Canvas für den Text zu gestalten.

      Übrigens:
      <div id="nav">
      <ul id="nav">
      <li><a href="index.html"><span id="nav">S</span>...

      Eine ID darf nur einmalig pro Dokument vorkommen.
      Korrigiere das, bevor sich dein CSS unerwartet verhält.

      2.(von bleicher)

      grau tut es auch - aber vermeide monotone flächen - versuch den
      hintergrund etwas "spannender" zu gestlaten - mit "Noise" - also
      schwachen Unregelmäßigkeiten in der textur.

      Zu Beat:

      Die Idvergabe müsste nun passend sein, sofern der folgende Code validid ist.

      <ul id="navigation">  
                              <ul id="navigation">  
      		   		<li><a href="index.html"><span id="navigation">S</span>tartseite</a></li>  
      				<li><a href="about.html"><span id="navigation">Ü</span>ber mich</a></li>  
         		 		<li><a href="pics.html"><span id="navigation">F</span>otos</a></li>  
          			<li><a href="guestbook.html"><span id="navigation">G</span>ästebuch</a></li>  
      				<li><a href="kontakt.html"><span id="navigation">K</span>ontakt</a></li>  
      				<li><a href="links.html"><span id="navigation">L</span>inks</a></li>  
      	  
        			</ul>
      

      Zu deinem zweiten Punkt - genau ist da mein Ankerpunkt. Wie würdest du das realisieren? Durch einen simplen Verlauf, den du mit einem Grafik tool in den Hintergrund setzen würdest? Oder Graustufen die von div zu div übergehen? Genau der Übergang ist mein Problem..^^

      Zu bleicher:

      Würdest du also die "kurze" Ladezeit dadurch ersetzen, dass du du die Hintergründe der Seite durch .jpg's ersetzt die bspw. mit Photoshop mit Filtern zur Strukturierung durchzogen sind?
      5mb mehr für Hintergrund sind halt schon einiges..

      Lg

      1. Grüße,

        Würdest du also die "kurze" Ladezeit dadurch ersetzen, dass du du die Hintergründe der Seite durch .jpg's ersetzt die bspw. mit Photoshop mit Filtern zur Strukturierung durchzogen sind?
        5mb mehr für Hintergrund sind halt schon einiges..

        20px mal 20px kachelbare grafik tut es auch.

        ich meine kein gemälde "Letztes ABndmal" als "Noise" - sondern wirklich "dunkelgrau auf etwas dunklerem grau - es soll nicht zu sehr ins auge stechen, aber in der Natur exisitieren eigentlich keine "ideal monotonen" flächen - diese M"onotnoie" wird daher als "fad" und "langweilig" ampfunden.

        zu dateils empfehle ich x-beliebige kunstbücher mit einführungen zur farblehre&co habe ich auch nur durchgeblättert ;P
        MFG
        bleicher

      2. Die Idvergabe müsste nun passend sein, sofern der folgende Code validid ist.

        <ul id="navigation">

        <ul id="navigation">
            <li><a href="index.html"><span id="navigation">S</span>tartseite</a></li>
        <li><a href="about.html"><span id="navigation">Ü</span>ber mich</a></li>
            <li><a href="pics.html"><span id="navigation">F</span>otos</a></li>
             <li><a href="guestbook.html"><span id="navigation">G</span>ästebuch</a></li>
        <li><a href="kontakt.html"><span id="navigation">K</span>ontakt</a></li>
        <li><a href="links.html"><span id="navigation">L</span>inks</a></li>

        </ul>

          
        Nein ich sehe 6 mal das Wort "navigation" als Wert für id.  
          
        Du kannst dir diese Auszeichnung eh sparen und statt dessen  
        a:first-letter{}  
        verwenden.  
          
        
        > Zu deinem zweiten Punkt - genau ist da mein Ankerpunkt. Wie würdest du das realisieren? Durch einen simplen Verlauf, den du mit einem Grafik tool in den Hintergrund setzen würdest? Oder Graustufen die von div zu div übergehen? Genau der Übergang ist mein Problem..^^  
          
        Da ich den Inhalt deiner Seite nicht kenne, bestenfalls nnur vermuten kann, wäre ich hier ein schlechter Ratgeber.  
          
        Ich würde aber auf zwei Punkte besonders achten:  
        - Bei starkem Kontrast zwischen Text-hintergrund und dem Hintergrund im angrenzenden Bereich ausreichend padding für den Text.  
        - Arbeite mit Konventionen, das heisst, verwende bereits etabliertes.  
          
        Mir ist die Rolle deiner Bilder im head nicht klar. Sie wirken dekorativ und als Bilder zugleich. Ist das Absicht? Wenn ja kannst du mit einem ähnlichen image-artigen Element Distanz zwischen dem schwarzen und dem weissen Bereich schaffen als eine kontrast-neutrale Zone.  
          
        mfg Beat
        
        -- 
        
        ><o(((°>           ><o(((°>  
        
           <°)))o><                     ><o(((°>o  
        Der Valigator leibt diese Fische
        
        1. Nein ich sehe 6 mal das Wort "navigation" als Wert für id.

          Du kannst dir diese Auszeichnung eh sparen und statt dessen
          a:first-letter{}
          verwenden.

          Ich bin zu blöd für diese Welt -.-

            
          a:first-letter{  
          color:#FFFFFF;  
          }
          

          hat nicht die geringsten Auswirkungen, und ehrlich gesagt wüsste ich auch nicht, wie ich dieses speziell für die ul mit der id navigation lösen würde.

          Da ich den Inhalt deiner Seite nicht kenne, bestenfalls nnur vermuten kann, wäre ich hier ein schlechter Ratgeber.

          Über mich als Person, meine Vergangenheit und Anschauungen soll informiert werden. Im Klartext, eine ganz normale private Homepage.

          Ich würde aber auf zwei Punkte besonders achten:

          • Bei starkem Kontrast zwischen Text-hintergrund und dem Hintergrund im angrenzenden Bereich ausreichend padding für den Text.
          • Arbeite mit Konventionen, das heisst, verwende bereits etabliertes.

          Ist das Padding für den Inhaltsbereich immoment nicht ausreichend? Die Seite sollte für Auflösungen > 1024*xxx optimiert sein, weshalb mir eine Breite von 824px für das ganze am sinnigsten erscheinte.

          Mir ist die Rolle deiner Bilder im head nicht klar. Sie wirken dekorativ und als Bilder zugleich. Ist das Absicht? Wenn ja kannst du mit einem ähnlichen image-artigen Element Distanz zwischen dem schwarzen und dem weissen Bereich schaffen als eine kontrast-neutrale Zone.

          Nunja, der Header ist das, was ich mit meinen mageren Photoshop-Kenntnisse auf die Reihe bekommen kann. Im Prinzip sind sie immoment nur dafür da um Farbe ins Spiel zu bekommen, und die Seite "anschauenswerter" zu machen

          Lg