HTML - Musik einbinden

Von b_funke |

Der HTML5 Code:
<audio autoplay controls="controls">
  <source src="http://www.rhein-main-experten.de/audio/hupen.wav" type="audio/wav">
 <source src="http://www.rhein-main-experten.de/audio/hupen.mp3" type="audio/mp3">
</audio>

Die verschiedenen "source" Angaben bieten Alternativen für Browser. Der Browser spielt das erste ihm bekannte Format ab.

In Frage kommen .wav, .mp3 oder .ogg Formate.

Responsive Design - HTML und CSS für mobile Geräte

Von b_funke |

Sie können ein anderes Layout für Ihre Webseite für mobile Geräte mit folgenden Anweisungen erzeugen:

HTML

fügen Sie in den Head des Dokuments folgendes ein:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes" />

Dies setzt die Breite des mobilen Gerätes als Anzeigebreite der Webseite

Sie können ein eigenes mobiles Stylesheet mobile.css einbinden mit

<link rel=”stylesheet” media=”only screen and (max-device-width: 480px)” href=”mobile.css” type=”text/css” />

HTML-Container und -Boxen

Von b_funke |

CSS positioniert HTML-Elemente als Vierecke  - sogenannte Boxen oder Container.
Ein HTML Element kann Text und Bilder, sowie eine CSS-Hintergrundgrafik enthalten.
HTML-Elemente können in der Ansicht  übereinandergelegt werden.

Mit Hilfe der HTML-Boxen bzw. Container werden Inhalte auf dem Bildschirm positioniert.

Im HTML Dokument (.html) werden Container üblicherweise mit
<div></div>  gekennzeichnet, in Frage kommt jedoch jeder HTML Befehl.

HTML, CSS und Programmierung

Von b_funke |

Mit CSS können Sie den Inhalt Ihrer HTML-Seiten vom Layout trennen.

Sollten Sie das Layout zu einem späteren Zeitpunkt ändern, können Sie dies einmal in der zentralen .css Datei tun. Das Layout aller mit der .css Datei verknüpften.html Webseiten ändert sich so automatisch.

Grundsätzlich gelten die im jeweiligen Browser-Styleheet hinterlegten Werte. Sie können eigene Angabe in einem Autoren-Stylesheet festlegen. Zusätzlich kann der Benutzer Stylesheet-Angaben für den von ihm verwendeten Browser festlegen.

HTML5 Seitenstrukturierung / Semantic Web

Von b_funke |

In HTML5 kommen folgende Strukturelemente hinzu, die der typischen Aufteilung von Vorlagen entsprechen.

<header> Kopf der Webseite
<nav> Navigation/Menü
<main>Inhaltsbereich
<section> Gruppe von Elementen
<figure>Anmerkungen, Codebeispiele, Abbildungen, Zeichnungen, Fotos und Videos
<article> der eigentliche Inhalt der Webseite
<aside> Zusatz zum Inhalt der Webseite
<footer>Fuß der Webseite

 

HTML5

Von b_funke |

Den HTML-Code (Hypertext Markup Language) setzen Browser um: In Layout,  Schriftarten, Hervorhebungen, Farben. Innerhalb des HTML-Codes können Grafiken, Fotos, Multimedia-Module geladen und Programme angestoßen werden - sowohl client- als auch serverseitig.

HTML Befehle umschließen den jeweiligen Text: Beginn und Ende einer Anweisung werden mit < > und </> gekennzeichnet:

<strong>dies ist wichtig</strong> bewirkt z.B. die Hervorhebung von dies ist wichtig.