Beginnend HTML

5 Schritt:Schritt 1: Ihre Stiftung Schritt 2: Hinzufügen von Bildern zu Ihrer Webseite Schritt 3: Aktivieren von Dateierweiterungen Schritt 4: Wie Sie Ihre Software Schritt 5: Einbetten von Videos

Beginnend HTML
Bitte stimmen Sie für dieses Instructable in der Lehrer-Wettbewerb! Das wäre fantastisch.

HTML, wenn ich mich richtig erinnere, steht für Hyper Tense Markup Language. Korrigieren Sie mich, wenn ich falsch liege. Es ist eine grundlegende, wirklich einfach zu erlernen Codierungssprache zur Erstellung Grund Websites konzipiert, Es ist eine ziemlich frühe Form der Codierung und kann auf jedem Computer OS durchgeführt werden. Macintosh, Windows 98, XP, Vista, 7, Linux, Gecko, etc. Es ist die Open-Source-und eine, die ziemlich weit verbreitet ist und bekannt ist.

Ich werde Ihnen zeigen, wie Sie Ihre erste Web-Seite mit HTML zu machen. Ich werde auch dies so einfach wie möglich zu erklären. Heute habe ich versucht, anzugehen lernen Lua, ein Spiel Skriptsprache, und oh Mann, ich habe noch nie etwas so schwer zu verstehen, bevor Sie zu lesen. So werde ich es einfach auf dich zu nehmen.

Wir werden mit einem Schritt, der die nächste und erste Schritt (duh) ist zu starten. Es zeigt Ihnen, wie Sie den Grundstein für die Website, die Sie teilweise mit zu beginnen, oder einfacher gesagt, die Vorlage zu erstellen. Wenn Sie bereit sind, nur nach unten scrollen, um zum nächsten Schritt.

Auf dem Weg, ich werde auch erklären, einige gute Software, die Sie für die HTML-Codierung verwenden. Sachen wie Firefox / Chrome-Erweiterungen und solche Dinge.

Oh Mann! Das erinnert mich. System Anforderungen. Wie alles im Leben, gibt es Anforderungen. Liste der Dinge, die Sie benötigen:
Betriebssystem, funktioniert alles.
Ein Texteditor. Die, die ich bevorzuge es Aptana oder noch einfacher die in Notepad unter Windows aufgebaut.
Photobucket oder andere Foto-Sharing-Website angemeldet.
Internet Browser (vorzugsweise Google Chrome)
(Optional) Firefox-Erweiterungen: Web Developer Toolbar und Firebug-Erweiterung.
(Optional) Chrome-Erweiterungen: Notizblock und Angry Birds (. Denn wenn Sie sich langweilen Komm, jeder braucht eine Pause irgendwann).

Okay, jetzt, wenn Sie all diese Dinge haben, sind wir bereit zu starten Schritt 1: Ihre Stiftung



Beginnend HTML
Jeder Code beginnt irgendwo. Sie müssen nicht nur abholen und notieren Webseiten. Oh nein. Probieren Sie diese aus. Öffnen Sie Aptana oder was auch immer Wort Editor Sie verwenden, und fügen Sie diese in, speichern Sie es als Instructables.html auf Ihrem Computer.

<Html>
<Head>
<! - Instructables.html ->

<Title> lerne ich HTML! </ Title>
</ Head>

<Body>

<H1> Hallo Welt! </ H1>

<P>
Das ist mein Fundament. Es wurde von einigen ehrfürchtigen Kerl namens mir beigebracht
Stephen Ritchie auf Instructables.com. Er ist genial!
</ P>

</ Body>
</ Html>

Es ist Ihre Stiftung! Es ist gut, kann nicht sagen? Lassen Sie uns zu sezieren es ein bisschen.
Am Anfang und am Ende es gibt <html> und </ html>., Der ihm sagt, dass die Webseite versucht, ein HTML-Dokument ausgeführt werden. Innerhalb von denen ist <body> und </ body>, wo die Sachen tatsächlich geht. Es sind die Titel-Tags, die eine Seiten Informationen zu rendern. Er tut verschiedene Dinge. Schauen Sie auf den oberen Rand der Seite im Moment. Er sagt, wahrscheinlich 'Spielbeginn HTML "an der Spitze. Das ist Titel! Es kann auch informieren. Wenn ich jetzt bei Facebook anmelden, werden sie wahrscheinlich sagen, (3) Facebook.com 'sagen mir, ich habe drei Updates. Das ist eine Änderung des Titels. Dies beinhaltet Anwendungen, die dynamisch Dokumente zu erstellen. Sie können durch die Art und Weise, dass es klingt kompliziert, ist zu sagen, daher ist es unerheblich, und ich will nicht werden Sie lehren, dass.

Die <h1> und </ h1> Tags machen die Schrift in ihnen größer, was eine Überschrift oder in-page Titel (daher das "h"). <P> und </ p> sind Ziffern. Das bewegt sich die Schrift in seinem Inneren nach unten ein oder zwei Raum. Nachdem Sie diesen HTML-Datei zu speichern, gehen Sie vor und fügen Sie ihn in Ihrem Browser (Ansicht als Webseite) und du wirst sehen, was ich mit all dem. Wenn Sie nicht wissen, wie man die ersten beiden dazu mit der rechten Maustaste und wählen "Öffnen mit ..." und wählen Sie Ihren Internet-Browser.

Es ist Ihre Stiftung! Wenn Sie noch nicht bemerkt haben, endet jeder Tag mit einem '/'. Das unterscheidet, ob etwas beginnen oder enden, und natürlich der Schrägstrich endet. Denken Sie daran, dass die <p> 's sind Absätzen. Glaube nicht, dass sie selbst zu beenden, immer die extra 'p' und fügen Sie einen Schrägstrich am Ende des Satzes.

Wenn Sie immer noch alles, was ich sage, zu verstehen, Zeit, sich mit dem nächsten Schritt Schritt 2: Hinzufügen von Bildern zu Ihrer Webseite

Beginnend HTML

Beginnend HTML

So, Ihre erste Website haben Sie es! Gute suchen auch einen. Fühlen Sie sich frei zu ändern, was die Titel und Text sagen. Auch fügen Sie mehr, wenn Sie wollen. Ich würde eine fade 'Hallo Welt!' Übernehmen und etwas Text anfrage wie geil ich bin nicht sehr interessant für Sie. Wahrscheinlich wollen Sie Bilder hinzufügen, oder? Ihr Glück; Sie können! Hier ist, wie.

Finden Sie ein Bild im Internet möchten. Wenn Sie Ihre eigenen verwenden möchten, laden Sie sie auf einem Foto-Sharing-Site wie Photobucket. Sobald Sie ein Bild haben Sie mit der rechten Maustaste und wählen Sie "Copy Bild URL ..." (unter Windows. Ich möchte nicht über andere OS wissen).
Nachdem Sie Bild-URL kopiert haben, fügen Sie diese in den Körper Ihrer Website:

<Img src = IMAGE URL GOES hier>

Daher die großen Buchstaben, die Bild-URL und fügen Sie ihn Sie in der Mitte gibt.
TIPP: Wenn Sie hier sitzen fragen, was eine URL ist, geben Sie in www.Instructables.com. Das ist eine URL! Eine Web-Adresse.

Das ist so ziemlich alles. Ich könnte in eine Diskussion über die Bildbearbeitung über jetzt gehen, aber aufgrund der Tatsache, das ist ein Instructable über HTML, kann ich nicht tun. Vielleicht in einem separaten Instructable.

Wenn alles geklappt hat, sollte Ihre Webseite wie die oben sein. Ein Bild darin. Eine andere Sache, die häufig der Fall ist, so können Sie auch auf dem Bild zu sehen, ist ein "<" neben dem Bild. Ist dies der Fall, entfernen Sie einfach die '<' aus neben 'img src ='. Wenn Ihr Bild verschwindet, einen Arzt konsultieren.

Herzlichen Glückwunsch, Sie sind ein Anfang Web-Entwickler! Zeit, sich auf Schritt zwei Schritt 3: Aktivieren Sie Dateierweiterungen

Beginnend HTML
Dies ist ein kleiner Schritt, notwendig, wenn Sie speichern oder sehen eine Reihe von HTML-Dateien auf Ihrem Computer. Viele Programme benötigen, um eine Datei als .html erkennen, und wenn es nicht sehen können, dass, könnte es schwer haben. Sie auch nicht in der Lage, um HTML-Dateien, nur Textdateien speichern. Beispielsweise eröffnen Notizblock und schreiben Sie eine leere Datei und speichern Sie sie. ist am Ende .txt haben? Wenn ja, gehen Sie vor und lassen Sie diesen Schritt. Sie brauchen nicht zu einem dies zu lesen.

ABER, wenn es nicht sagen, dass ist dies eine einfache Lösung. Standardmäßig blendet Windows in der Regel all das den Benutzer, um den Computer besser aussehen. Aber glauben Sie mir, ist nichts los, um ein XP besser aussehen als ein Mac OS oder Ubuntu.

Hier ist, wie Sie dieses Problem zu beheben:

Öffnen Sie Datei-Manager.
(Arbeitsplatz bzw. Computer in Windows). Es ist ziemlich einfach. Öffnen Sie Ihr Startmenü oder gehen Sie zu Ihrem Desktop und es wird es in plain sight sein. Direkt in der Nähe Ihrer Papierkorb.

Wählen Sie Extras> Ordneroptionen.
Öffnen Sie den Ordner Tools, dann gehen Sie in die Einstellungen (Man kann sagen, wir sind immer technisch). Ein Dialogfeld sollte angezeigt werden. Danach wählen Sie die Registerkarte oben, die "Ansicht", sagt. Sie sehen, nicht wahr? Gehen Sie in die Systemsteuerung und Ordner-Optionen sollte dort sein.

Sie nicht die Extensions zu verstecken.
Im Dialogfeld sollten Sie eine Menge von Kontrollkästchen zu sehen. Deaktivieren Sie genau das Richtige. Es sollte so etwas wie "Hide Erweiterungen bei bekannten Dateitypen" in Windows zu sagen.

Sie sind damit fertig! Es tut uns leid, wenn Sie mussten durch all dem Schlamassel zu gehen. Nur eine Notwendigkeit, alle Programmierer tun müssen. Zeit zu überspringen zu über zu Schritt Vier Schritt 4: Wie Sie Ihre Software

Beginnend HTML
Wie Sie sehen, eine Menge von HTML beinhaltet Vorbereitung. Software kann eine Notwendigkeit für Entwickler manchmal sein. Dinge, die sie brauchen dringend. Notepad oder Aptana, wie ich bereits erwähnt, ist einer von ihnen. Sie können diese folgende Dinge zu tun, um zum Laufen zu bekommen:

Installieren Sie einen HTML-Textverarbeitung.
Microsoft Word ist schlecht! Vielleicht gut für Bücher zu schreiben oder Dokumente, aber nicht Web-Seiten. Gehen Sie mit Aptana, Notepad, Wordpad oder sogar zu starten Online versucht mit Google Text & Tabellen oder Wordpress / Blogger.

Holen Sie sich das Beste aus dem World Wide Web.
Sie benötigen einen wirklich guten Web-Browser. Das Beste für Open Content ist Firefox, es ist ein Entwickler träumen Browser. Aber es ist ein wenig komplex. Für ein besseres Fernseherlebnis und Geschwindigkeit, gehen Sie mit Google Chrome. Fall etwas anderes als Windows-Explorer und Safari.

Achten Sie darauf, un-hide Dateierweiterungen.
Sie wissen nicht, was das bedeutet? Wenn Sie dies nicht tun, werden Sie nicht aufgepasst. Gehen Sie zurück zu Schritt drei.

Schnellwahl auf Ihrem Desktop.
Der Desktop ist, wo alles wichtige geht, so stellen Sie sicher, dass Sie fügen Sie alle Ihre Software geht es!

(Optional Things) Apps und Software.
Dinge wie Web Developer Toolbar (Firefox & IE) oder Notepad und Google Text & Tabellen (Google Chrome) In allen Browsern für zusätzlichen Bedienkomfort bei der Programmierung.

Bist du bereit? Lassen Sie uns beginnen Codierung wieder, fahren Sie mit Schritt fünf: Einbetten von Videos Schritt 5: Einbetten von Videos

Beginnend HTML

Beginnend HTML

Beginnend HTML

Jetzt werden wir weitere wesentliche Komponenten zu Ihrer Website hinzufügen. Wer gerne Bilder und Texte? Sicher, es ist großartig, aber nach einer Weile erhalten Sie langweilig. Lassen Sie Videos hinzufügen! Ich werde Ihnen zeigen, wie man von YouTube einbetten. Zum Glück hat YouTube eine erstaunliche Service so dass Sie direkt in Ihre Webseite kopieren Sie ein Video, wie folgt aus:

Finden Sie ein Video, das Sie mögen.
Christina Grimmie gerade hochgeladen ihre Version von Silent Night? Auf keinen Fall! Oh, richtig. Sobald Sie ein Video Ihnen gefällt, klicken Sie einfach darauf und dann mit dem nächsten Schritt nach unten unterhalb dieser hier zu gehen.

Kopieren Sie den Code einbetten.
Es wird eine 'Share' Taste unter dem Video (Für den neuen YouTube) sein. Klicken Sie auf, dass Sie dann auf die Schaltfläche, die "Embed", sagt. Kopieren Sie den Code, jetzt gehen Sie zurück zu Ihrem HTML Internet- und fügen Sie ihn in den Körper.

Nun, würden Sie sich darum kümmern? Es gibt einen großen Video in Ihre Web-Seite jetzt! Wie geil ist das denn? Bisher haben Sie Embedded Videos, Bilder hochladen, heruntergeladene Software und machte Text zum Leben in eine .txt-Datei in HTML konvertiert. Sieht aus wie wir die Grundlagen abgedeckt! Willst du dieses Abenteuer weitergehen? Ich werde Entsendung einen Teil 2 HTML irgendwann, Moderate HTML.

Bis zum nächsten Instructable!