Karin & Thomas Dorner´s - HOMEPAGE

[ Blau ]	[ Weiss ]	[ Violet ]
[ Rot ]	[ Gelb ]	[ Orange ]
[ Grün ]	[ Grau ]	[ Braun ]

[ Websichere Farbtabelle ]

Text	Schrift
Hintergründe	Rahmen
Abmessungen	Abstand
Randabstände	Listen
Positionierung	Tabellen
Klassifizierung	Outlines

Die richtige Maskierung der Sonderzeichen sollten bei gutem HTML-Stil nachwievor nicht vernachlässigt werden. Aussdem gibt es eine Menge Zeichen um designtechnisch eine Seite noch zu verbessern ohne dabei Grafiken verwenden zu müssen.

[ Tabelle anzeigen ]

Um die umständlichen Fontattribute <FONT SIZE=xx FONT-COLOR=xxxxxx> nicht bei jeder Änderung auf sämtlichen Seiten zu wiederholen, bin ich auf die Lösung mit Cascading Style Sheet umgestiegen. Die Vorgehensweise ist eigentlich recht einfach.

1. Textdatei mit der Endung .css erzeugen. Eine solche Datei kann in etwa so aussehen:

2. CCS Datei im BODY Teil der HTML-Datei einbinden

<link rel=stylesheet type="text/css" href="meinfont.css">

3. Text innerhalb der Datei mit <DIV> oder <SPAN> formatieren

<DIV class="times10blue">

	Mein Text in TimesNewRoman mit 10pt;
</DIV>

Das war es auch schon. Wenn mann diese Syntax genau einhält, ist es ein leichtes das gesamte Layout mehrerer Seiten schnell und einfach zu modifizieren. Einfach eine neue Schriftart in der CSS Datei definieren oder vorhandene Formatierungen ändern und sämtliche HTML Dateien können diese Attribute verwenden.

1. CSS definieren:
Dem animierte Text muss unbedingt eine ID zugewiesen werden, um danach als Objekt angesprochen werden zu können !
Hier scheiden sich leider wieder mal die Geister zwischen InternetExplorer und Navigator ;)

<div id="testrun" class="verdana10" style="position:relative; top:10px;
color:yellow;left:200px;font-size:20pt">

2. Javascript-Funktion

Mit Hilfe der navigator, screen und window Objekte kann man diverse Informationen über die Browserversion bzw das verwendete OS des Besuchers abfragen. Kann manchmal ganz nützlich sein für diverse Brückenseiten bei verschiedenen Bildschirmauflösungen.

Die Abfrage der IP Nummer des Besuchers kann man mit Javascript nicht mehr so einfach realisieren, dazu braucht es schon PHP oder CGI Progs die am Server ablaufen.

IP Nummer : 18.191.44.23
Servername : tokado.at

Ladezeit dieser Seite : 0,00004 Sekunden

Datumsfunktionen gibt es ja mittlerweile wie Sand am Meer. Ich stell meine hier trotzdem zur freien Verfügung...
(Ausgabe siehe links oben)

<script LANGUAGE="JavaScript>

var dayarray=new Array("Sonntag","Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag")
var montharray=new Array("Jänner","Februar","Mäz","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember")

function getthedate()
{
 var mydate=new Date()
 var year=mydate.getYear()
 if (year < 1000)
 year+=1900
 var day=mydate.getDay()
 var month=mydate.getMonth()
 var daym=mydate.getDate()
 if (daym<10)
 daym="0"+daym
 var hours=mydate.getHours()
 var minutes=mydate.getMinutes()
 var seconds=mydate.getSeconds()

if (hours==0)
 hours=12
 if (minutes<=9)
 minutes="0"+minutes
 if (seconds<=9)
 seconds="0"+seconds

// fontattribute und XY-Position z.B. in myDateClass definieren
// oder direkt mit Style="..." reinschreiben
var cdate="<div class='myDateClass'><b>"+dayarray[day]+", " +daym+". "+montharray[month]+" "+year+" -  "+hours+":"+minutes+":"+seconds+"</div></b>"
if (document.all)
 document.all.clock.innerHTML=cdate
else
 document.write(cdate)
} // end getthedate() ---------

if (!document.all)
getthedate()

function displaydate()
{
if (document.all)
 setInterval("getthedate()",1000)
}

// jetzt nur noch das Teil in <BODY onload="displaydate()"> einbinden

Mittels CascadingStyleSheets kann man auf einfache Weise die Farben der mausgrauen Formularfelder ändern.

Vorname:
Nachname:
Adresse:

Radio-Button und Checkbox Diese Elemente können mittels Hintergrundbild in einer Tabelle sehr schön formatiert werden. td align="center" valign="middle" width="60" style="background:url('form_circle.gif') no-repeat center;"
Checkbox

::.. Hinweise zu der Site ..::

Gelernt habe ich HTML, Javascript und PHP/MySQL nur autodidakt. D.h. vorerst mal in einschlägigen Fachmagazinen herumgestöbert und alles mögliche selbst ausprobiert; denn nur vom Lesen kann man es nicht lernen (learning by doing). Die größte Hilfe für mich war aber sicherlich die Bibel von Stefan Münz SELFHTML. Bei der Erstellung dieser Site wurden in den Anfangsphasen nur ein Texeditor (EditPad) verwendet. Seit einigen Jahren (2000) verwende ich aber ein wirklich empfehlenswertes Programm von CoffeeCup . Ein Grafikwerkzeug wie z.B PaintShopPro xx (oder wer sich´s leisten kann auch Photoshop x.xx) sollten auch nicht fehlen und natürlich immer aktuelle Browserversionen von InternetExplorer und Netscape.

Interessante Links zum Thema Webdesign, HTML, Javascript, PHP & MySQL