Sie sind nicht angemeldet.

    1

    Sonntag, 11. April 2010, 21:01

    Green Webdesign



    Habe es eigentlich nur gemacht, damit ich mit (X)HTML und CSS üben kann, aber wollte auch mal wissen, wie es geworden ist. :)

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »DeeViL« (11. April 2010, 21:19)


    2

    Montag, 12. April 2010, 12:32

    Grün schonmal nicht, das ist wohl ehr türkis. Zudem viel zu grell, zu große Lightnings und sonst überhaupt nix besonderes.Farben finde ich grässlich, viel zu grell und monoton.
    Naja, sorry, aber das warn Griff ins klo!
    Gruß
    SirDouble
    °º¤øSignaturø¤º°

    Musik-Artwork: 50%




    You wanna hate me then hate me!

    „Man darf die Mehrheit nicht mit der Wahrheit verwechseln.“
    Jean Cocteau



    °º¤Vote 4 Grufixø¤º°

    3

    Montag, 12. April 2010, 13:18

    Farben finde ich grässlich, viel zu grell und monoton.
    Naja, sorry, aber das warn Griff ins klo!
    Gruß
    SirDouble


    Hätte es nicht besser ausdrücken können.
    Tut mir echt Leid aber das ist ein "Geht garnicht"
    :banned:

    4

    Montag, 12. April 2010, 15:58

    Farben finde ich grässlich, viel zu grell und monoton.
    Naja, sorry, aber das warn Griff ins klo!
    Gruß
    SirDouble


    Hätte es nicht besser ausdrücken können.
    Tut mir echt Leid aber das ist ein "Geht garnicht"
    Dein Beitrag geht auch gar nicht...

    ES GIBT KEINE SCHLECHTE FARBEN! Nur schlechte Farbkombinationen. Du solltest evtl. versuchen, noch ne zweite Farbe als dieses Grün / Türkis / Whatever einzubauen. Der Hover beim Hyperlink ist zu dunkel, nimm da lieber dunkelgrau als schwarz. Joah, sonst halt n äußerst langweiliges Design, aber immerhin hast du keine Schriftglättung verwendet und dadurch bist du schon mal 10000000000x bessser als die meisten anderen Anfänger hier. : )

    Edith sagt:
    Aber die Schrift im Content sollte auf keinen Fall bold sein, das ist unangenehm zu lesen.
    Webentwicklung (HTML + CSS, PHP, JS, MySQL), Design (Photoshop, Illustrator), Java .. :zahn_weg:

    5

    Montag, 12. April 2010, 16:47

    Also, ich finde das Design ziemlich ideenlos.
    Als ob Du einfach vor Langeweile mit irgendetwas angefangen hast, ohne ein Ziel vor den Augen.
    Man merkt das schon allein daran, dass Du 2x eine Navigation hast..
    Da kann doch mehr machen ;)
    Weil, das ganze Design kann man ja schon allein bloß mit CSS machen.
    Da ist kein einziger Verlauf, oder runde Ebenen.
    Kein Glanz, keine Lichteffekte.
    Schau Dir mal dazu paar Tutorials an ;)

    6

    Montag, 12. April 2010, 17:40

    Weil, das ganze Design kann man ja schon allein bloß mit CSS machen.

    Ich schätze mal du meinst HTML ;)

    @razkoo: Da hast du natürlich Recht, aber in dieser Kombination ist es einfach Ideenlos.
    Keine Effekte, Keine Eyecatcher einfach langweilig.
    :banned:

    7

    Montag, 12. April 2010, 17:50

    Das es so schlecht ist wusste ich nun auch nicht. :D
    Aber das Design ist mir eigentlich egal. Habe es nur gemacht um damit zu üben.

    8

    Montag, 12. April 2010, 18:30

    naja es sieht so aus als hättest du es nur schnell schnell geacht u was zu üen zu haben.

    also als hättest du dir keine zeit für details genommen, aer zum üben reichts alle mal :D

    9

    Montag, 12. April 2010, 18:53

    naja es sieht so aus als hättest du es nur schnell schnell geacht u was zu üen zu haben.

    Wollte schon, dass es nicht totaler Schrott ist, aber sehr viel Mühe habe ich mir auch nicht gegeben und ich bin eh nicht in Sachen Webdesign der beste. :D

    10

    Montag, 12. April 2010, 19:12

    sieht aus als bräuchte ich ne neue tastatur, die hälfte der Tasten funktioniert nicht ehr richtig -.-

    und es ist ja kein totaler schrott ;D

    11

    Montag, 12. April 2010, 23:18

    Also die Farbwahl trifft bei mir jetzt auch nicht unbedingt auf gegenliebe. Wirkt einfach viel zu erdrückend. Es fehlt an einer Kontrastfarbe.

    Aber wie du schon sagst, steht nicht der Nutzwert des Designs im Vordergrund sondern der Lerneffekt. Zwar hats dann eigentlich nichts im Showroom verloren, da es hier um das Optische geht, aber als Lernobjekt ist es meiner Ansicht nach ganz gut geeignet. Es sollte sich leicht umsetzen lassen und mit nem bisserl CSS3 kannst du da auch optisch noch nen bisserl was rausholen!
    Willst du das Grufix-Board unterstützen? Dann ließ dir diese Hilfe durch!







    Kein Support via PN, E-Mail, Skype oder ICQ. Ein Forum ist zum posten da! ;)

    12

    Dienstag, 13. April 2010, 17:35

    Zwar hats dann eigentlich nichts im Showroom verloren

    Ich wollte es auch zuerst nicht im Showroom posten, aber dann habe ich es doch gemacht, weil ich in paar Wochen vielleicht auch anfangen will in Sachen Webdesign was zu machen, also das ich die Designs grafisch erstellen und dann umsetzen kann und dazu wollte ich mal wissen, wie dieses schon einmal geworden ist. ;)

    Habe mich an das umsetzen gewagt, aber die Contentbox rechts bekomme ich einfach nicht rechts neben die Navigationsbox.
    Hier mal die Codes:

    Quellcode

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" lang="de">
      
      <head>
    
    	<meta http-equiv="content-type" content="text/html; charset=windows-1250" />
    	<title>Türkis Design - Übung</title>
    	<link href="style.css" type="text/css" rel="stylesheet" />
      
      </head>
      
      <body>
    
    	<div id="header">
      	<img src="Bilder/page-header.jpg" alt="Beispielname.de" width="370px" height="103px" />
    	</div>  
    	
    	<div id="main-navi">
      	<ul>
        	<li><a href="#">Startseite</a></li>
        	<li><a href="#">Startseite</a></li>
        	<li><a href="#">Startseite</a></li>
        	<li><a href="#">Startseite</a></li>
      	</ul>
    	</div>
       	
    	<div id="sub-navi">
      	<div id="sub-navi-header">
        	<div id="sub-navi-ueberschrift">
          	Navigation
          	<div id="hyperlinks">
              	<ul>
                	<li><a href="#">Hyperlink</a></li>
                	<li><a href="#">Hyperlink</a></li>
                	<li><a href="#">Hyperlink</a></li>
                	<li><a href="#">Hyperlink</a></li>
                	<li><a href="#">Hyperlink</a></li>
                	<li><a href="#">Hyperlink</a></li>
                	<li><a href="#">Hyperlink</a></li>
              	</ul>
          	</div>
      	</div>
      	
      	<div id="content-box">
        	<div id="content-box-header">
          	<div id="content-box-ueberschrift">
          	Navigation
          	</div>
        	</div>
      	</div>
    	</div>
    	
    	</div>
    
      </body>
    
    </html>


    Quellcode

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    
    /* CSS Document */
    
    body, html {
      margin: 0px;
      padding: 0px;
      font-family: Verdana, Arial, Helvetica, sans-serif;
    }
    
    body {
      background-color: #007A6D;
    }
    
    #header {
      position: relative;
      width: 370px;
      height: 103px;
      margin: 0px auto;
    }
    
    #main-navi {
      background-image: url(Bilder/page-main-navigation.gif);
      position: absolute;
      width: 100%;
      height: 46px;
      background-repeat: repeat-x;
    }
    
    #main-navi ul {
      margin-left: 100px;
    }
    
    #main-navi li {
      list-style: none;
      float: left;
      padding: 0px 0px 0px 10px;
      font-weight: bold;
      font-size: 0.8em;
    }
    
    #main-navi a:link, a:visited, a:active {
      text-decoration: none;
      color: #ffffff;
    }
    
    #sub-navi {
      float: left;
      margin-top: 103px;
      background-color: #39beb0;
      width: 175px;
      height: 300px;
      padding-top: 1px;
      margin-left: 150px;
    }
    
    #sub-navi-header {
      background-color: #168479;
      width: 173px;
      height: 32px;
      margin-left: 1px;
    }
    
    #sub-navi-ueberschrift {
      color: #1fbead;
      font-size: 0.7em;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-weight: bold;
      text-align: center;
      padding-top: 8px;
    }
    
    #hyperlinks {
      list-style: none;
      padding: 10px;
    }
    
    #hyperlinks a:link, a:visited, a:active {
      text-decoration: none;
      color: #ffffff;
    }
    
    #hyperlinks a:hover {
      color: #000000;
    }
    
    #hyperlinks li {
      padding: 5px;
      margin-right: 66px;
    }
    
    #content-box {
      background-color: #39beb0;
      width: 600px;
      height: 300px;
      padding-top: 1px;
      margin-left: 300px;
    }


    Habe ich es überhaupt richtig gemacht mit den ganzen div-Tags oder ginge das auch einfacher und schlanker?
    So sieht es aus, aber die Contentbox soll auf der gleichen Höhe wie die Navigationsbox links sein...

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »DeeViL« (13. April 2010, 19:08)


  • Grufix-Board.de - GFX Webdesign Foto & Coding Community

    Grafik-Tutorials | Coding-Tutorials | Ressourcen | SEO | Webdesign | HTML5
    W3C Validator