Joomla: Grundlagen der Webentwicklung
| HINWEIS! | |
 |
Hier soll nur eine ganz kurze Einführung mit Verweis auf Wikipedia Quellen entstehen. Alles weitere würde den Rahmen hier sprengen, und es gibt bereits ein WikiBook >>> Websiteentwicklung |
Inhaltsverzeichnis |
[Bearbeiten] Das Grundgerüst
[Bearbeiten] Der Code des Grundgerüstes
Eine Website besteht aus einem Grundgerüst. Das Gundgerüst für XHTML sieht so aus:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de" dir="ltr">
<head>
<title>Testseite</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<p>Hallo Welt!</p>
</body>
</html>
[Bearbeiten] Erklärung
Der xml-Tag und der Doctype-Tag sagen dem Browser, wie die Seite verarbeitet werden soll.
Der html-Tag leitet das XHTML-Document ein.
Im head-Tag werden zusätzliche Informationen angegeben. Diese werden nicht im Browser-Fenster angezeigt. Der title-Tag gibt den Titel der Seite an. Dieser erscheint in der Tab-Leiste, den Lesezeichen (auch Favoriten genannt) und in der Titelleiste des Browsers.
Im body-Tag steht dann der Inhalt des Dokuments. Mit dem p-Tag wird ein Absatz erzeugt.
Jeder Tag in XHTML hat einen Endtag. Beispiel: <p>Hallo Welt!</p> Ein Tag mit Endtag kann aber auch abgekürzt werden:
aus
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"></meta>
wird
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
[Bearbeiten] Wie sieht das dann im Browser aus?
Im Browser sieht das ganze dann so aus:
Hallo Welt!
Im Titel des Browser-Fenster steht "Testseite".
Probier es doch gleich mal aus:
- XHTML-Seite mit der Dateiendung .htm speichern.
- Datei mit dem Browser öffnen
[Bearbeiten] Hübsche Seiten durch CSS-Style
Noch sieht alles schwarz-weiß aus. Aber das kann sich ändern. Nun sagen wir dem Browser, dass der Text im Absatz fett und blau sein soll:
<p style="color: blue; font-weight: bold;">Hallo Welt!</p>
Das sieht dann so aus:
Hallo Welt!
Wie man mit CSS die Navigation verschönern kann erfährst du unter de.selfhtml.org.
Mit CSS kann man aber noch viel mehr machen. Mehr über CSS erfährst du unter www.css4you.de und unter Wikipedia: CSS
[Bearbeiten] Techniken von Joomla
Joomla verwendet hauptsächlich diese Techniken:
