Zukunftstag 28.04.2016 – HTML, die Sprache der Webseiten – HTML



Zukunftstag 28.04.2016 – HTML, die Sprache der Webseiten – HTML

0 0


html


On Github subugoe-zukunftstag / html

Zukunftstag 28.04.2016

HTML, die Sprache der Webseiten

HTML

Die Sprache des Internets

  • Alle Seiten im Internet sind in HTML geschrieben.
  • HTML ist eine Auszeichnungssprache.
  • Alle Teile des Textes sind ausgezeichnet.
  • Die Auszeichnung geschieht mit Tags.

Tags

  • Tags sind Bezeichner, die in spitze Klammern geschrieben werden und Textteile markieren.
  • Es gibt Tags die geöffnet und geschlossen werden, und welche, die alleine stehen.
  • Doppelte Tags sind z.B. <body></body>
  • Einfache Tags sind z.B. <img src="bild.jpg" />

Aufgabe:

  • Schaut euch mal den Quelltext von ein paar eurer Lieblingswebseiten an, und kuckt, welche Tags ihr finden könnt.
  • Klickt dazu mit der rechten Maustaste auf die Seite und klickt dann auf soetwas wie "Quellcode anzeigen"

Wichtige Tags

  • HTML-Seiten bestehen aus zwei wichtigen Teilen:
    • Seitenkopf <head></head>
    • Seitenkörpe <body></body>
  • Im Seitenkopf werden Dinge "über" die Seite definiert, wie z.B.
    • die Sprache in der die Seite geschrieben ist
    • eventuelles CSS (das MakeUp) macht die Seiten bunt und hübsch
    • Javascript (der Motor) macht die Seiten dynamisch

Das HTML Grundgerüst

<!DOCTYPE html><html lang=de>  <head>    <meta charset="utf-8" />    <title>        Hier steht der Titel im Tab des Browsers    </title>  </head>  <body>        Hier steht, was man später auf der Webseite sieht  </body></html>

Eine Auswahl Tags innerhalb des body-Tags

<h2>Dies ist eine Überschrift</h2><p>Hier steht Text in einem extra Abschnitt (Paragraph)</p><ul>   <li>Listenelement 1</li>   <li>Listenelement 2</li>   </ul><img src="bildname.jpg" width="200px" /><a href="http://google.de">Dies ist ein Link zu Google</a>

Aufgabe

  • Öffnet einen Editor und schreibt eine eigene HTML-Seite mit den vorgeschlagenen Tags
  • Schreibt ein paar Pagagraphen über euch, oder ein Thema, dass euch interessiert.
  • Ladet ein paar Bilder vom Internet runter und baut sie in eure Seite ein.
  • Speichert eure Datei mit einem Namen der mit .html endet und ruft sie im Browser auf

Viel Spaß beim Schreiben von Webseiten!

:)