HTML Web Desgin/Programmierung

Hawks646 · 7. November 2011

Hallo,

ich würd gerne mit Web-Desgin/ Programmerung anfangen.
Und bin auf der suche nach einen guten Buch, jedoch finde ich bei Amazon zb keinen wirklichen sicheren Kauf.
Natürlich habe ich schon die Seite SelfHtml besucht. jedoch habe ich immer gerne was zum nachlesen, in schwarz auf weiß

hat irgendwer einen Geheimtipp für mich, zum Einstieg?

Vielen dank für eure Hilfe

Magnus1986 · 7. November 2011

Galileo Open Book z.b.
Aber wenn du grad anfängst würde ich eher in Richtung PHP / .NET gehen oder vielleicht bei Interesse HTML5

nebulein · 7. November 2011

Naja also in den Büchern die ich von PHP habe, heisst es immer lern erstmal HTML von a-z und dann schauen wir weiter.

HTML ist nicht wirklich schwierig und ich habs mir nur mit selfhtml beigebracht. Ich bin ja ein Fan der von Kopf bis Fuß Bücher. Die Werke sind etwas teurer aber dafür mit Witz erzählt und Aufgaben die man lösen muss sowie von A-Z.

Hawks646 · 7. November 2011

also ich habe mir schon aus spaß mal das Webdesigner Magazin gekauft, und da haben mir auch schon sachen von html 5 sehr gefallen, die dort vorgeführt sind...

xXyzXx · 7. November 2011

self html ist auch nicht schlecht fürn anfang

Tion1392 · 7. November 2011

Wie hab ich das gelern?

Durchs machen

Ich hab zwar auch Bücher über den ganzen Kram, aber am effektivesten war es für mich, dass ich mit kleinen Projekten angefangen habe und dann immer bei jedem Problem das Internet sowie hier und da nen Buch durchforstet habe, ob es dafür ne Lösung gibt und wenn, wie sie aufgaubt ist. erst wenn ich das verstanden hatte, hab ich das dann auch ins Projekt eingebaut und im folgenden Projekten verwendet.

Buch ansich:
Über html hab ich gar keins ansonsten hab ich Bücher sepereat mit PhP&MySQL dann CSS und Javascript. Alles in einem Buch finde ich nicht so zielführend, weil da dann vieles angerissen wird, aber nichts so wirklich Gründlich. Aber die Frage ist, in welchen Bereich du in dern Webprogrammierung willst. So musst du bei Webdesign und der Programmierung bzgl. der Design-Anpassung weniger PhP können, als wenn du nen CMS selber schreiben willst.

Hawks646 · 8. November 2011

nebulein schrieb:
Naja also in den Büchern die ich von PHP habe, heisst es immer lern erstmal HTML von a-z und dann schauen wir weiter.

HTML ist nicht wirklich schwierig und ich habs mir nur mit selfhtml beigebracht. Ich bin ja ein Fan der von Kopf bis Fuß Bücher. Die Werke sind etwas teurer aber dafür mit Witz erzählt und Aufgaben die man lösen muss sowie von A-Z.

genau so was suche ich, ein buch von anfang bis ende ... mit aufgaben und lösungen etc

aber im allgemeinen könnte mir keiner ein buch empfehlen? da die meisten wohl echt über selfhtml usw lernen ..?

JanKrohn · 8. November 2011

Bisher habe ich die Erfahrung gemacht, dass man mit Büchern aus dem Markt+Technik Verlag eigentlich nichts falsch machen kann. Schau mal auf www.mut.de

Jedes Buch ist da auf einer Skala von "Anfänger" bis "Profi", außerdem gibt es für jedes Buch ein Probekapitel. Damit sollte eigentlich schon ausgeschlossen sein, dass Du versehentlich was falsches kaufst.

Mit den MUT-üchern habe ich bisher Java, CSS, .NET und PHP gelernt. Die Seite wäre jederzeit wieder meine erste Anlaufstelle.

Hawks646 · 10. November 2011

Meine ersten schritte... jedoch bekomme ich das mit der navigation nicht hin. ich hab aus meinen buch, den code übertragen, aber die Navigationselemente werden einfach nicht hübsch

probiere mich gerade nur aus und hänge da momentan drann

Die Menüelemente sollen eigentlich abgerundet dargestellt werden, mit einen farbverlauf mit grün, laut buch....

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<title> Fotografie u. Design</title>
<style type="text/css">

    #head{
    color:blue;
    }
#head:hover{
color:red
}
/* Layout */
body{ margin:0 auto; width: 800px; font-family: 'Convergence', sans-serif; }
#head{ height:50px;}
#navi{ height: 30px;}
#main{overflow:hidden;}
#end{border-top:2px solid #d90000}
 <!--
#navi ul{
         padding:0;
         margin:0;
         list-style:none;
         text-align:right;
         font-family: 'Convergence', sans-serif;
         font-weight:bold;

}  -->
<!-- #navi li{
         display:inline-block;
         padding-right:7x 0 0 0;
         margin:0 5px 0 0;
} -->
#navi li {
         display:block;
         color:#fff;
         text-decoration:none;
         padding=0 15px;
         -moz-border-radius-topright:5px;
         -moz-border-radius-top-left:5px;
         -webkit-border-top-left-radius:5px;
         -webkit-border-top-left-radius:5px;
         border-top-right-radius:5px;
         border-top-left.radius:5px;

        background: -moz-lineargradient(
        top.#54BA7C,#69FEBD);

        background: -webkit-linear-gradient(
        top.#54BA7C,#69FEBD);




         }
.text{float:left;width:200px;overflow:hidden;}
.text+.text{width:400px;overflow:hidden;}
.text+.text+.text{float:right;width:200px;overflow:hidden;}



#end{clear:both}


/* styles */
#head{background:black}

#end{background:grey;}
#left{background:green;}
#mtext{background:green;}




</style>
</head>
<body>
<div>
         <div id="head"><align="center">Welcome</div>
         <div id="navi">
         <ul>
         <li id="active">Home</li>
         <li><a href="">About</a></li>
         <li><a href="">Photography</a></li>
         <li><a href="">Design</a></li>
         <li><a href="">Web Development</a></li>
         <li><a href="">Contract</a></li>
         </ul>


         </div>

         <div id="main">
            <div class="text">
                 <h2>Spalte Links</h2>
                 <p>Link Spalte khjt suhih fkhkjfnhjkm bksdtmgivsdjghtdvdstli</p>
         </div>
          <div class="text">
          <h2>Spalte Mitte</h2>
                 <p></p>Großer Sachtext hierhjfzugzuisr  ug sirbg ui bguios o shtros h jhipt hit thirohä rh infhfithtjh xftihn xfhnxfil nfil</p>
         </div>

         <div class="text">
                 <h2>Spalte Rechts</h2>
                 <p>Link Spalte khjt suhih fkhkjfnhjkm bksdtmgivsdjghtdvdstlniftnfxnjf dtyoitbj othoiy uoh uydh oöydth uoydhudoth thuydo hudoybdiöy buiydbi</p>
         </div>



       </div>
<div id="end">Fußzeile</div>
</div>
</body>
</html>

Tumbleweed · 11. November 2011

Ohne das jetzt getestet zu haben...

Code:

padding=0 15px;

geht natürlich nicht. Ist eventuell auch nicht der einzige Tippfehler.

Abgesehen davon gehen einige dieser optischen Leckerbissen nicht auf allen Browsern, daher auch die moz und webkit Präfixe bei manchen. Welchen Browser benutzt du denn? IE 8?

Hawks646 · 11. November 2011

ne Firefox akt.
hab deswegen aber laut buch erstmal
background: -moz-lineargradient( <--- laut buch: ausreichend für aktuelle browser
top.#54BA7C,#69FEBD);

und
background: -webkit-linear-gradient( <-------------- speziell für firefox
top.#54BA7C,#69FEBD);

eingetragen

achja ich schreibe mit html-editor phase momentan alles wie man sieht in eine html datei. Aber ich denke nicht das später die ganze internet seite komplett in einer html datei ist oder(ist bei mir ja schon recht unübersichtlich)?

Und habe von freunden erzählt bekommen das Dreamweaver eigentlich sinnvoller wäre, stimmt das?

Tumbleweed · 11. November 2011

Hab gerade mal eine Runde gesucht und siehe da - du hast die Befehle falsch eingetippt, wie es aussieht. Es heißt da -moz-linear-gradient und -webkit-gradient. Da musst du schon genau sein.

Olli_illO · 18. November 2011

@Hawks646

Für den Anfang ist Phase (5?) schon optimal, um sich auf den Code und das Verständnis für selbigen zu konzentrieren. Dreamweaver ist super, bringt Dir in der "Kennenlernphase" von HTML und Co. aber noch keine wirklichen Vorteile (ohne jetzt zu wissen ob Phase (5?) php etc. überhaupt unterstützt)

Eagle-PsyX- · 18. November 2011

@Olli_illO
Ja es heißt Phase 5 und ja Dreamweaver unterstützt PHP sowie diverse andere Skript-Sprachen.

Ich würde aber eher gleich zu Notepad++ raten, dort kann man ja auch automatische Funktionsvervollständigung einschalten.

Suche

HTML Web Desgin/Programmierung

Hawks646

Cadet 4th Year

Magnus1986

Lieutenant

nebulein

Admiral

Hawks646

Cadet 4th Year

xXyzXx

Banned

Tion1392

Lt. Junior Grade

Hawks646

Cadet 4th Year

JanKrohn

Lieutenant

Hawks646

Cadet 4th Year

Tumbleweed

Captain

Hawks646

Cadet 4th Year

Tumbleweed

Captain

Olli_illO

Cadet 3rd Year

Eagle-PsyX-

Commander

Ähnliche Themen