http://www.grassl.info/HTML-DESIGN.rss Aktuelle Informationen, Neuerugen, Nachrichten zum Thema HTMLDESGIN und HTML-Programmierung. de-de 2008 (C) Jens Grassl Wed, 11 Jun 2008 13:30:00 GMT Ich möchte einen einfachen und schnellen Überblick über das DESIGN, Programmierung und Veröffentlichung von Webseiten geben. In einem skizzierten Überblick über den Ablauf bis zur Veröffentlichung. Zunächst möchte ich kurz eine einführende Erklärung über den Aufbau der einzelnen Seiten geben. Um eine Seite im richten Browser-Verständlichen Format zu erstellen, muss diese nach den Spezifikationen des W3C gemacht sein, diese sind nach dem International Standard ISO 8879 genormt. Denn nur mit solchen definierten HTML Befehlscode werden die Webseiten richtig vom Browser dargestellt und das DESGIN welches von dem Ersteller angestrebt wird richtig umgesetzt. Unter HTML-Dateien versteht man diese, welche der Web-Browser wie z.B. Firefox oder Internet-Explorer durch die Eingabe der URL z.B. http://www.grassl.info/index.php vom Webserver erhält und diese dann nach den HTML-Befehlen, welche für den Browser verständlich sein müssen in dem gewünschten Design auf dem Bildschrim wiedergibt. Eine solche HTML-Datei besteht aus einem Kopf-Bereich in welchen Informationen in Form von META-Angaben über das Dokument festgehalten werden. Diese sind wichtig für Suchmaschinen, da sie über eine festdeifinierte Zusammenfassung der Seite und ihren Informationen verfügen, mit Angaben über den Author, Inhalt und wichtigen Stichwörtern zum Inhalt. Der Dokumentrumpf ist nun der Teil wo die Texte und Informationen, wie weiterführenden Links über HTML in unterschiedlichen Design mit verschiedenen Schriften und Formen dargestellt werden. Hier wird somit das HTML-DESIGN der Seite gemacht. Wed, 11 Jun 2008 13:30:00 GMT HTML-DESIGN / HTML DESIGN Zunächst muss das Dokument durch das < HTML >, < HEAD > und < BODY > Tag definiert werden, damit die Browser es als solche erkennen. Bereits im Kopf-Bereich werden wichtige Angaben gemacht, obwohl dies für den Anwender nicht sichtbar ist. Die < META > Angaben beinhalten Informationen zum Inhalt und Author, sowie wichtige Keywords für Suchbegriffe. Als nächstes wird dann im < BODY > die Seite in HTML mit dem entsprechenden Design aufgebaut. Wed, 11 Jun 2008 13:30:00 GMT HTML-DESIGN / HTML DESIGN Hier wird der im Browser sichtbare Seiteninhalt angegeben und von der Darstellung gestaltet. Hier ist also der wichtigste Bereich für das HTML Design (HTML-DESIGN). Die Webseite wird ebenfalls in mehrere Bereiche aufgeteilt, welche über die HTML-Tags definiert sind. Hier können Tabellen, Ebenen, Überschriften, Texte und Bilder angegeben werden. Wichtig ist es mit Hilfe von Tabellen oder Ebenen die einzelnen Bereiche der Webseite aufzubauen, und mit der Farbgebnung und Bildwahl sowie -gestaltung das DESIGN der HTML - Seite zu gestalten. Die Tabellen werden mit < TABLE >, < TR >, < TD > Tags definiert. Diese stehen für die Zeilen- und Spaltenaufteilung. Es kann jede Zeile mit Hilfe von [rowspan] und [colspan] als Parameterangabe in gleiche oder beliebig viele Felder aufgeteilt werden. Bei gleicher Felderanzahl werden die [ROWSPAN] und [COLSPAN] Angaben nicht gebraucht. Mit Hilfe von < DIV > und < LAYER > angaben können die Bereiche soger an pixelgenauen Positionen und mit größen und höhen Angaben plaziert werden. Mann kann solche Tags ebenfalls ineinander verschachteln somit jeden gestalteten Teil der Webseite an die richtige Position setzen. Somit stehen für das HTML Design (HTML-DESIGN) alle Wege offen, die gestalteten Objekte richtig zu platzieren. Wed, 11 Jun 2008 13:30:00 GMT HTML-DESIGN / HTML DESIGN Die Bilder werden über das < IMG > Tag definiert die Texte stehen in dem < FONT > Tag und sind mit den Parametern [name], [size], [color] definiert, damit der Text in unterschiedlichen Schriftarten, Größen und Farben dargestellt werden kann. Diese Texte werden jetzt aus Gründen der richtigen Platzierung in Tabellen oder Ebenen-Bereiche geschrieben, damit die Gestaltung verwirklicht werden kann. Ebenfalls können mit verschiedenen Hintergrundfarben die einzelnen Bereiche der Tabellen und Ebenen hervorgehoben oder zurückgesetzt werden. Die Bilder können in der Größe verändert werden oder als angepaßte Größe an die Bildgröße dargestellt werden. Ebenfalls ist es wichtig mit < a > mit dem [href] Parameter die Links auf weiterführende Seiten zu produzieren. In der [href]-Angabe sind die Dateinamen mit den URL's für die gelinkten Seiten enthalten. Es können Server Interne- oder Externe-Links auf weitere URL's angegeben werden. Wichtig ist ebenfalls der [target] Parameter, da dieser angibt ob sich die Seite im gleichen Browser-Fenster öffnen soll oder sich in einem neuen Fenster aufbauen soll. Wed, 11 Jun 2008 13:30:00 GMT HTML-DESIGN / HTML DESIGN Da oftmals bei Komplexen - Anwendungen der einfache Aufbau als HTML-Webseite nicht genügt muss mit Hilfer einer weiteren Programmiersprache und deren Programm Funktionen oder Klassen, ein Skript geschrieben werden, welches die HTML-Seite für jeden Aufruf individuell Gestaltet und Darstellt oder Skripte eingebaut werden, die dem Benutzer die Möglichkeit geben die Webseite zu bedienen und somit eine vom Benutzer lebendig gemachte Webseite produzieren kann. Solche Programmiersprachen sind z.B. ASP, PERL, PYTHON und PHP. Ebenfalls zum Einsatz kommem Java und JavaScript. Wobei JavaScript direkt in HTML-Seiten eingebaut werden kann, ohne das auf dem Webserver dazu ein Interpreter/Compiler dieser Sprache gebraucht wird. Mit JavaScript lassen sich die Dargestellten Objekte ebenfalls in Form, Postion, Farbe und Inhalt verändern. Mit den Serverseiten Skrpitsprachen wie z.B. PHP, ASP oder PERL lassen sich Inhalte bei jeden-Seitenaufruf durche eine Quelle wie z.B eine Datenbank immer durch neuen Inhalt dynamisieren. Die Skripte können ebenfalls Berechnungen machen oder mit Hilfe von Session-Variablen oder Cookies Werte zu weiteren Webseiten übergeben, da es sonst bei jedenm Neuaufruf zu einem Datenverlußt kommen kann. Wed, 11 Jun 2008 13:30:00 GMT HTML-DESIGN / HTML DESIGN Wenn alles fertig ist wird die Datei über das FTP-Protokoll auf die Webseite übertragen. Hierzu wird ein FTP-Client benögt und auf dem Server muss der FTP-Server gestartet sein. Die Server sind so konzipiert, dass ein bestimmtes Verzeichniss für das Internet freigegeben ist und dort können die Skripte abgelegt, gespeichert und ausgeführt werden. Dies kann je nach Server-Typ Unterschiedlich sein. Man unterscheidet zwischen Windows und Linux Servern auf welchen entweder IIS (Windows) oder Apache (Linux) als Webserver laufen. Ebenfalls müssen die verwendeten Serverseitigen Skriptsprachen wie z.B. ASP, PHP, PERL, usw... installiert sein, damit die Skripte laufen. Wed, 11 Jun 2008 13:30:00 GMT HTML-DESIGN / HTML DESIGN