Kategorien
Webdesign

Formular-Typen

von Jan Schmager

Formulare sind unersetzlich, unergründlich und unwiderstehlich sexy. Ohne Formulare keine Suchmaschinen, Gästebücher und keine Newsletterabos. In dieser Hinsicht sind wir uns einig: Formulare sind eine gute Sache.

Dr.Web hat sich als großer Liebhaber der elegant gestalteten, schönen Formularform um diese Kunst mit Beharrlichkeit verdient gemacht. Als Ergebnis unermüdlicher Grundlagenforschung ist hier Jans definitive Formular-Typisierung.

1.) Das gewöhnliche Formular. Dieses ist sehr verbreitet. Hier steht die absolute Funktionalität noch im Mittelpunkt. Man gibt ein, was einzugeben ist. Eventuell selektiert man etwas und der Gebrauch dieses Typus ist mit einem wohlwollenden Ergebnis beendet.

2.) Das Designer-Formular. Der Anblick dieses Typs ruft ehrfürchtiges Erschaudern hervor. Oh mein Gott – welch ein design-technischer Höhepunkt in meinem Leben. Nach circa fünf Minuten inbrünstiger Betrachtung fällt einem wieder ein, was man wollte. Irgend etwas eingeben und das Ergebnis abwarten.

3.) Das Super-Mega-Formular. Dieser Typ verschlingt rein platztechnisch mindestens zwei Din-A4-Seiten. Geballtes Know-How wurde hier integriert. Das Abarbeiten eines solchen Formulars erfordert das Ausfüllen von mindestens acht Eingabefeldern, das Betätigen von mehreren Checkboxen, Radiobuttons und Auswahllisten. Ein großes Kommentar-Feld und das Abonnieren eines Newsletters sind hier exzellent integriert. Den Button zum Absenden findet man erst nach mehrmaligem Scrollen. Der Rest läuft wie gehabt.

4.) Das funktionslose Formular. Es handelt sich hier um einen ausgesprochen arglistigen Typus. Dieses Formular wirkt auf den ersten Blick normal. Spätestens nach dem Betätigen des Buttons zum Absenden wirft der Wolf seinen Schafspelz ab und zeigt sein wahres Gesicht. Es passiert nichts. Ergebnis dieses Typs ist ein frustrierter Surfer.

5.) Das High-Tech-Formular. Neueste Html- und CSS-Technologie kennzeichnen diesen Typ. Nur der aktuellste Browser und ein sehr moderner Rechner sind für die Nutzung dieses Formulars erfolgsversprechend. Abgesehen davon ist ungewiss, ob man sich nun mit dem eigenen System (Baujahr 97) für die Arbeit mit diesem Formular qualifiziert.

6.) Das „* Angabe erforderlich“-Formular. Dass ich in ein Formular etwas einzutragen habe bzw. etwas selektieren muss, war mir schon lange klar. Dieser Formulartyp hilft dabei in entsprechender Weise. Diese Angabe ist Pflicht, jene optional usw. Unübersichtlich wird es, wenn Fußnoten auf 75 % Pflicht hinweisen. Umgekehrt wäre es vielleicht besser gewesen (wegen der Übersichtlichkeit).

7.) Das Baustellen-Formular. Dieser Typ verspricht beim ersten Betrachten eine Menge: Gute Features und Selektions-Möglichkeiten, sozusagen ein Traum von Benutzerfreundlichkeit. Allerdings bemerkt man nach wenigen Sekunden die wohlwollenden Hinweise des Webmasters, das diese oder jene Funktion noch nicht implementiert ist und das man am Besten später noch mal vorbeischaut. Bookmark gesetzt (wird bestimmt gut) und weiter.

8.) Das missbrauchte Formular. Hier wurde das Formular bzw. ein Element zweckentfremdet, beispielsweise Klick-Buttons in Verbindung mit JavaScript. Die vertraute Methodik wird ad absurdum geführt. Das Ergebnis unseres Tuns ist nicht genau vorhersehbar.

9.) Das Jäger- und Sammler-Formular. Dieser Typ ist offensichtlich eine Weiterentwicklung des „Super-Mega-Formulars“. Man findet es vorwiegend auf gewinnträchtigen Seiten. Das Ausfüllen gestaltet sich recht kompliziert. Stirnrunzeln bereitet die Fülle der erforderlichen Angaben. Von A wie Alter bis Z wie Zahlungsfähigkeit will man alles von mir wissen. Die Angabe von Informationen in diesem Ausmaß lässt mich sofort an einen Datenschutzbeauftragten denken. Fraglich, ob man den Absende-Button drücken wird.

10.) Der (un)gesunde Mix. Schließlich gibt es noch die Formulare, die eine Art Mischung aus den genannten Typen bilden. Individuell gemixt entsteht ein mehr oder weniger erfreuliches Ergebnis. Eine arge Kombination bildet die Verknüpfung des Typs „Angabe erforderlich“ mit „Jäger und Sammler“.

Kategorien
Webdesign

HTML für Einsteiger – Teil 2

HTML ist eine im Grunde simple Angelegenheit. Was Anfangs ein wenig erschrecken mag, ist der enorme Umfang der vorhandenen Befehle. Aber keine Sorge, weder muss man alle auswendig lernen, noch werden alle gebraucht.

Wie baue ich Bilder ein?
Bild heißt auf Englisch „Image“, der Begriff taucht deshalb auch im HTML-Tag auf:

 <img src="bild.gif">
    

Zwischen die „“ Zeichen wird der Dateiname geschrieben. Abgesehen von einigen Exoten gibt es im Internet nur zwei Formate für Bilder: das GIF und das JPG. Solche Bilder können Sie, wenn Sie sie nicht selber zeichnen wollen, auf vielen Seiten im Netz kostenlos herunterladen.

Der <img> Tag kennt allerlei nützliche Attribute. Mit width=““ geben Sie an wie breit das Bild dargestellt werden soll, mit height=““ geben Sie die Höhe an. Die Maßeinheit ist der Bildpunkt, der Pixel genannt wird.

      <img src="bild.gif" width="100" height="100">
    

Doch damit nicht genug. Mit dem Attribut border=““ kann man das Bild mit einem Rahmen versehen. Zwischen die „“ Zeichen steht dann in Pixeln die Breite des Rahmens.

      <img src="bild.gif" width="100" 
height="100" border="2">
    

Und schließlich kann mit alt=““ ein beliebiger Text eingefügt werden, der das Bild beschreibt. Man nennt so etwas Alternativtext, er wird angezeigt, solange das Bild noch nicht geladen ist oder wenn der Mauszeiger (Cursor) drüber steht.

      <img src="bild.gif" width="100" height="100" 
border="2" alt="Meine Bildbeschreibung">
    

Wie färbe ich den Hintergrund einer Seite ein?
Erinnern Sie sich an die Struktur der HTML-Seite? Dann könnte Ihnen der <body> Tag noch im Gedächtnis sein. Er steht für die ganze Seite und kann wie viele andere Tags Attribute enthalten. Ein solches Attribut ist die Farbe des Seitenhintergrundes.

      <body 
bgcolor=""> 
    

Zwischen den „“ Zeichen erscheint der Name der Farbe. Und zwar auf Englisch. Um eine Seite rot zu färben, schreiben Sie:

      <body bgcolor="red"> 
    

Hier ist ein Muster in einem neuen Fenster

Es gibt über Hundert Farbnamen, die Sie verwenden können. Aber damit nicht genug, meistens werden sogenannte Hexadezimalcodes verwendet. Mit Ihnen kann man die Farbe sehr genau definieren. Eine Liste der Farbnamen finden Sie hier. Am besten, Sie spielen damit ein wenig.

Wird im <body> Tag nichts angegeben, wird die Seite von den meisten Browsern weiß dargestellt, einige, vor allem ältere Browser, zeigen den Hintergrund grau.

Wem das nicht genügt, der kann auch ein Bild verwenden. Damit hat man dann unendlich viele Möglichkeiten. Man sollte es aber nicht übertreiben, die meisten Web-Seiten sehen mit Hintergrundbildern gar nicht mehr schön aus. Verwenden Sie dieses Attribut:

      <body background="bild.gif"> 

Kategorien
Webdesign

HTML für Einsteiger – Teil 3

HTML ist eine im Grunde simple Angelegenheit. Was Anfangs ein wenig erschrecken mag, ist der enorme Umfang der vorhandenen Befehle. Aber keine Sorge, weder muss man alle auswendig lernen, noch werden alle gebraucht.

Wie baue ich Hyperlinks ein?
Hyperlinks oder kurz Links genannt, sind ein unverzichtbarer Bestandteil des Webs. Keine Homepage kann darauf verzichten. Denn sonst könnte man nicht von einer Seite zur anderen gelangen, geschweige denn auf fremde Seiten springen. Wer zwei Seiten miteinander verbinden will, tut das mit diesem HTML-Tag:

 <a 
href="seite2.html">Hier klicken, um auf die nächste Seite zu 
kommen</a>
    

Einfach oder? Das „a“ steht hier für das englische Wort „anchor“, was Anker bedeutet. Zwischen den „“ Zeichen befindet sich der Dateiname der Seite, auf die verwiesen wird. Das Ganze braucht wie immer einen Schluß-Tag, nämlich

      </a>
    

Hier klicken, um auf die nächste Seite zu kommen

Um einen Link auf eine ganz andere, nämlich fremde Web-Site zu setzen, muss lediglich noch der Domainname dazugeschrieben werden. So etwas nennt man einen absoluten Link. Die erste Variante heißt relativer Link.

      <a href="http://www.ideenreich.com/">Link zu 
Ideenreich</a>
    

Solche externe Verweise sind sehr wichtig, denn sie bringen erst die Besucher auf eine Homepage. Deshalb legen viele Leute „Linklisten“ an, auf denen man seine Lieblingslinks zum Besten gibt.

Im Prinzip kann man auf alles „linken“, was einem Spaß macht. Man sollte sich jedoch vor zweifelhaften oder illegalen Seiten hüten. Das kann einem zum Nachteil ausgelegt werden. Auf manchen Homepages finden sich deshalb Warnungen wie: „Ich bin nicht für die Inhalte fremder Homepages verantwortlich“ oder etwas ähnliches.

Es gibt noch mehr Möglichkeiten, um einen Link zu setzen. Nämlich innerhalb einer Seite. Das macht man, um zum Beispiel von unten nach oben oder zu einer bestimmten Textstelle zu springen. Dazu muss dann an der anzuspringenden Stelle ein Ankerpunkt eingefügt werden. Der sieht so aus:

      <a name="bis-hier"></a>
    

Dieser Ankerpunkt kann überall stehen. Dann setzt man einen normalen Link, der halt nicht auf eine andere Seite weist, sondern auf eben diesen Anker. Wichtig ist der „Gartenzaun“ # vor der Bezeichnung des Ankerpunkts.

      <a 
href="#bis-hier">Link zun Ankerpunkt</a>
    

Und guter Letzt gibt es noch Email-Links, die nichts anderes machen, als das Email-Programm zu öffnen, wenn man draufklickt.

      <a href="mailto:post@meinname.de?subject=hallo">Schick 
mir Post</a> 

Den Unterschied sehen Sie schon. Man benutzt die Wendung „mailto:“ und setzt dahinter die eigene Emailadresse. Praktisch ist, dass man die Betreffzeile (subject) für die Mail gleich mit angeben kann, so spart man dem Besucher die Arbeit und weiß selber gleich, worum es geht.

Möchten Sie den Email-Link ausprobieren?

Kategorien
Webdesign

HTML für Einsteiger – Teil 4

HTML ist eine im Grunde simple Angelegenheit. Was Anfangs ein wenig erschrecken mag, ist der enorme Umfang der vorhandenen Befehle. Aber keine Sorge, weder muss man alle auswendig lernen, noch werden alle gebraucht.

Texte und Schriften
Auch wenn es viele Bilder gibt, das Web besteht hauptsächlich aus Texten. Die kann man einfach in den Editor eingeben. Was aber, wenn man eine Schrift verändern möchte?

Dafür gibt es den Tag <font> Font heißt auf Deutsch nichts anderes als „Schriftart„. Der Begriff „face“ steht hier nicht für Gesicht, sondern für den Namen der Schrift. So sieht es aus:

 <font face="Arial">Mein 
Text</font>
    

Der Tag erzeugt eine Schrift ohne „Gänsefüßchen“. Am Bildschirm sieht man das nicht so deutlich, man muss genau hingucken.

Dr. Web ist komplett in der Schrift „Verdana“ ausgelegt. Das macht man so:

      <font 
face="Verdana">Mein Text</font>
    

Auch Schreibmaschinenschrift ist möglich. Sie heißt „Courier“.

      <font face="Courier">Mein 
Text</font>
    

Klicken Sie hier, um ein Beispiel zu sehen. Es öffnet sich ein neues Fenster.

Im Browser selbst sind keine Schriftarten eingebaut, er holt sie sich vom Betriebssystem. Das bedeutet, dass der Browser nur die Schriften zeigen kann, die auf dem Computer des Betrachters vorhanden sind. Will man eine exotische, besonders schöne Schrift verwenden, zum Beispiel Garamond oder Webdings für Symbole, kann es leicht passieren, dass der Besucher etwas völlig anderes sieht. Deshalb sollte man unter HTML nur die oben genannten Schriften verwenden, auch wenn es schwerfällt. Deshalb werden Überschriften häufig in Form von Grafiken angelegt.

Um eine Schrift größer oder kleiner zu machen, geht man ganz ähnlich vor:

      <font size="3">Mein 
Text</font>
    

Dies ist die Standardgröße der Schrift. Man muss das dem Browser nicht extra sagen. Soll die Schrift kleiner sein, sieht das so aus:

      <font size="2">Mein Text</font>
    

      <font size="1">Mein Text</font>
    

Kleiner geht es dann nicht mehr. Aber größer:

      <font size="4">Mein 
Text</font>
    

      <font size="5">Mein Text</font>
    

      <font size="6">Mein Text</font>
    

Je größer die Nummer, desto größer wird auch die Schrift. Farbige Buchstaben werden ganz ähnlich erzeugt:

      <font color="red">Mein 
Text</font>
    

      <font color="blue">Mein Text</font>
    

      <font color="green">Mein Text</font> 

HTML benutzt englische Farbnamen. Meist werden die Farben aber in einem speziellen hexadezimalen Code angegeben, den man sich schlecht merken kann.

Und hier die Beispiele in einem Extrafenster:
Schriftgrößen
Schriftfarben

Hier geht es weiter:
Vorwort
Teil 1 – Erste Schritte
Teil 2 – Bilder und Seitenhintergründe
Teil 3 – Seiten verbinden mit Hyperlinks
Teil 4 – Texte und Schriften
Teil 5 – Tabellen

Kategorien
Webdesign

HTML für Einsteiger – Teil 4

Die Tabelle ist das beliebteste Gestaltungsmittel für eine Web-Seite. Mit ihr lässt sich eine Seite wunderbar aufteilen und gestalten.

Man erkennt eine Tabelle an folgendem Anfangs- bzw. End-Tags im Quellcode:

 <table> 
und </table> 
    

Nun kann eine Tabelle höchst unterschiedlich aussehen: Sie kann begrenzt sein, mehr Spalten als Zeilen und umgekehrt enthalten, es können Spalten oder Zeilen zusammengefasst sein, der Zelleninhalt kann oben, unten, links oder rechts stehen und vieles mehr. Lassen Sie uns hier ein paar einfache Gestaltungsmöglichkeiten durchspielen.

Wenn wir den Quellcode ansehen, finden wir zwischen den <table>-Tags z.B.:

      <tr> 

<td colspan="2" align="center" valign="top">
<h1>Alois Mustermanns Homepage</h1>
</td>
</tr>

Die Tags <tr> und </tr> zeigen eine Tabellenzeile an, während der Tag <td> und </td> eine Tabellenspalte festlegt. Probieren Sie es aus und schreiben Sie in Ihren Tabellencode folgende Zeile:

      <td>Neue Tabellenspalte</td> 
    

oder

      <tr>Neue Tabellenzeile</tr>
    

Je nachdem, an welcher Stelle zwischen dem Anfangs-Tag <table> und dem End-Tag </table> Sie die Zeilen einfügen, kommt ein anderes Ergebnis heraus. Experimentieren Sie, indem Sie den Spalten- oder den Zeilen-Tag an verschiedenen Stellen einbauen und wieder herauslöschen.

Tabellenzellen sind jedoch nicht immer gleich groß. Manchmal sollten sie auch über zwei oder mehr Spalten gehen oder sich über zwei und mehr Zeilen ausdehnen. Auch dies ist kein Problem.

Wollen Sie, dass sich eine Zelle über zwei Spalten erstrecken soll, schreiben Sie in den Anfangs-Tag <td> noch die Anweisung colspan=“2″. Dann sieht der Quellcode folgendermaßen aus:

      <td colspan="2">Hier 
kommt zweispaltiger Zellentext</td>
    

Zwischen den Anführungszeichen steht die Zahl der Spalten, auf die sich die Zelle erstrecken soll. Wenn Sie also statt 2 nun 3 hineinschreiben, wird die Tabellenzelle dreispaltig sein. Das funktioniert aber nur, wenn Ihre Tabelle dann auch tatsächlich drei Spalten bekommt, d.h. wenn Sie jede Spalte mit <td> -Text </td> einzeln aufgeführt haben.

Nun können Sie das auch mit Zeilen machen. Wenn Sie möchten, dass Ihre Zelle sich über zwei Zeilen erstreckt, müssen Sie in den Anfangs-Tag <td> die Anweisung rowspan=“2″ einbauen. Es sieht dann so aus:

      <td rowspan="2">Hier steht zweizeiliger Zellentext</td>
    

Wie breit oder wie hoch Ihre Tabellenspalte sein soll, bestimmen Sie selbst, und zwar, indem Sie in den Anfangs-Tag <td> die zusätzliche Anweisung width=““ für die Breite und/oder height=““ für die Höhe aufnehmen. Zwischen die Anführungsstriche schreiben Sie die Maßangabe. Sie können das Maß auf zweierlei Weise bestimmen: Entweder geben Sie hier die Anzahl der Bildpunkte (Pixel) an oder wie viel Prozent vom Bildschirm die Zeile oder Spalte einnehmen soll. Wollen Sie also, dass Ihre Spalte eine Breite von 300 Pixel haben soll, sieht die Anweisung folgendermaßen aus:

      <td 
width="300"> 
    

Soll eine Zelle eine Höhe von 30 Prozent des Monitors haben, geben Sie folgendes ein:

      <td height="30%"> 

    

Nun können Sie Tabellen auch mit Gitterlinien und Umrandungen zwischen den Zeilen und Spalten darstellen. Wollen Sie ein Netz erstellen, fügen Sie in den Tabellen-Anfangs-Tag <table> einfach das Wörtchen »border« ein:

      <table border> 
    

Erscheint Ihnen dieses Gitter ein wenig mickrig, können Sie auch hier die Anzahl der gewünschten Bildpunkte bestimmen, indem Sie hinter die border-Anweisung ein Gleichheitszeichen setzen und zwischen Anführungszeichen die Pixel festlegen. Bei einem Rand von 10 Pixel sieht der Befehl so aus:

      <table border="10"> 
 

Probieren Sie es einfach mal aus. Schreiben Sie in Ihren Quellcode die border-Anweisung mit einer beliebigen Anzahl von Pixel und schauen Sie sich das Ergebnis anschließend im Browser an. Dann verändern Sie die Zahl mehrfach. Setzen Sie auch einmal eine Null zwischen die Anführungsstriche. Fällt Ihnen etwas auf?

Tatsächlich ändert sich mit größer werdender Zahl nur die Randbreite. Das Gitter zwischen den Zellen bleibt konstant. Bei Null haben Sie weder Rand noch Gitter – eine so genannte „blinde Tabelle“. Die blinde Tabelle ist im Internet sehr beliebt, weil sie im Browser nicht als Tabelle erscheint, aber trotzdem eine gute Bildaufteilung erlaubt.

Nun kann es sein, dass Sie wissen wollen, wie man die Breite der Gitter selbst bestimmen kann. Auch das ist möglich, durch die Anweisung cellspacing=““, die wieder in den Anfangs-Tag von <table> eingesetzt wird. Sie ahnen es bereits: Zwischen die Anführungszeichen schreiben Sie wieder die Zahl der gewünschten Pixel.

Tabellentext (bzw. Tabelleninhalt) und Tabellen- oder Zellenrand stehen manchmal eng nebeneinander. Wer hier den Abstand vergrößern will, kann dies durch die Anweisung cellpadding=““ tun. Diese steht ebenfalls im <table>-Tag. Auch hier bestimmt sich der Abstand durch die Zahl der Pixel zwischen den Anführungsstrichen.

Hier geht es weiter:
Vorwort
Teil 1 – Erste Schritte
Teil 2 – Bilder und Seitenhintergründe
Teil 3 – Seiten verbinden mit Hyperlinks
Teil 4 – Texte und Schriften
Teil 5 – Tabellen

Kategorien
Webdesign

Verzierungen für Formulare und Fotos

Ein feiner, kleiner Effekt sind die Eckstücke für Formulare und Bilder. Mit Hilfe einiger GIF’s kann flexibel gearbeitet werden. Es sind viele Varianten denkbar. Beispiel Nr. 1 kommt mit lediglich zwei Grafiken oben und unten aus. Einfach kopieren und selbst versuchen.

 
  Name  
  Email  
     

Häufig dürfte es praktischer sein, für jede Ecke eine eigene Grafik zu erstellen. Diese können dann recht einfach via HTML auf verschiedene Größen gebracht werden.

 
   
  Name  
  Email  
       
 

Oder für ein Foto:

 
   
 

Sie benötigen eine 3*3 Tabelle – Cellpadding und Cellspacing können beliebig variiert werden.

Der Quellcode

 <table border="0" 
cellspacing="0" cellpadding="0" align="center">
<tr>
<td><img src="images/eck_oben_links.gif" width="10" height="10"></td>
<td>&nbsp;</td>
<td><img src="images/eck_oben_rechts.gif" width="10" height="10"></td></tr>
<tr>
<td>&nbsp;</td>
<td><img src="images/celli6.jpg" width="165" height="155"></td>
<td>&nbsp;</td></tr>
<tr>
<td><img src="images/eck_unten_links.gif" width="10" height="10"></td>
<td>&nbsp;</td>
<td><img src="images/eck_unten_rechts.gif" width="10" height="10"></td>
</tr></table>

Für das folgende Beispiel wurden die Eckstücke auf 25*25 Pixel vergrößert.

 
   
 

Selbstverständlich können auch transparente GIF’s Anwendung finden. Dann lassen sich zusätzlich auch Hintergrundfarben für die Tabelle einsetzen.

Kategorien
Webdesign

PHP & MySQL – Teil 1

von Andreas Ahlenstorf

PHP wird erst so richtig interessant, wenn man erste Webapplikationen wie ein Gästebuch oder ein Forum damit programmiert. Dazu müssen Daten gespeichert. Das lässt sich über eine Textdatei oder mit einer Datenbank realisieren.

Counter zum Beispiel sind eine praktische Sache und schnell eingerichtet. Wer allerdings mehr als eine simple Zahl oder einen Ausdruck speichern will, kommt kaum um den Gebrauch einer Datenbank herum.

In Datenbanken werden Informationen (Daten) einerseits gesammelt, andererseits verwaltet, kontrolliert und miteinander in Beziehung gebracht. Der Sinn besteht darin, eine Information möglichst nur ein einziges Mal abzuspeichern und die Information schnell abrufen zu können. Dies wird Datenbanksystem genannt. Beispiele für ein derartiges Datenbanksystem sind Microsoft Access, Oracle, der Microsoft SQL-Server oder das Open-Source-Projekt MySQL.

Alle diese Datenbanken haben etwas gemeinsam, sie werden über die Datenbanksprache SQL oder einen speziellen Treiber, welcher SQL in die Sprache der jeweiligen Datenbank übersetzt, angesprochen. Und SQL selber lässt sich wieder über PHP, ASP oder ColdFusion ansprechen.

MySQL
Wer eine Datenbank für seine PHP-Scripte braucht, wird in der Regel MySQL als Datenbanksystem wählen. Dies hat vier Gründe: MySQL ist kostenlos, speziell auf die Bedürfnisse im Internet zugeschnitten, fast jeder Provider bietet MySQL-Datenbanken an und last but not least ist MySQL besonders einfach über PHP anzusprechen.

Um effektiv mit MySQL arbeiten zu können, ist zu erst einmal eine Erweiterung der Entwicklungsumgebung notwendig. Wer seinen Apache-Webserver mit PHP schon installiert hat, kann auf der MySQL-Homepage eine aktuelle Version für das jeweilige Betriebssystem herunterladen. Die Windows-Version wird direkt inklusive Installer und grafischem Interface geliefert, wobei eine Konfiguration von PHP oder Apache nach der Installation nicht nötig ist.

Erste Schritte
MySQL ist nun installiert und aktiviert. Als nächstes hat man sich zu entscheiden, wie man MySQL verwalten will. Das grafische Interface bietet nur eine Überblick über die aktuellen Einstellungen und Datenbanken, verändern lässt sich aber damit nicht viel. Wer eine Datenbank erstellen will, um erste Daten zu speichern, kann entweder den MySQL-Monitor oder ein php-basierendes Administrationstool verwenden. Wobei der MySQL-Monitor eher etwas für Fortgeschrittene und Liebhaber von Kommandozeilen ist. Die php-basierenden Administrationstools sind dagegen ziemlich einfach und intuitiv zu bedienen. Das wohl berühmteste und beste Administrationstool ist phpMyAdmin von Tobias Ratschiller.

phpMyAdmin verwenden
Die Installation des Adminstrationstools verläuft relativ unproblematisch. Nach dem Download muss man das Archiv nur entpacken und die Konfigurations-Datei nach eigenen Wünschen editieren. Die Dateien sollten sich dann in einem Ordner befinden, wo man über Browser und lokalen Webserver zugriff hat. Beispielsweise http://localhost/phpMyAdmin/

Screenshot
der erste Blick auf phpMyAdmin

Die erste Datenbank ist schon vorhanden und nennt sich mysql. Diese bitte auf keinen Fall löschen, sonst ist MySQL nachher unbrauchbar.

Um erste Daten zu speichern, muss eine neue Datenbank erstellt werden (Create new database). Bei der Namensgebung empfiehlt es sich alles klein zu schreiben, der Name darf keine Leerzeichen, Minuszeichen (-) oder ähnliche Sonderzeichen enthalten. Einzig der Unterstrich (_) darf verwendet werden.

Wenn die Datenbank angelegt ist, muss eine Tabelle erstellt werden, die dann mit den eigentlich Inhalten gefüllt werden kann.

MySQL beim Hoster
Zum Abschluss des ersten Teils noch ein Wort zu MySQL beim Hoster. Viele Hoster unterstützen MySQL. Es ist aber oft erst bei den etwas teureren Paketen verfügbar. Näheres dazu dann in den FAQ des Providers, wo auch erklärt wird, wie man zu einer Datenbank kommt.

Um die einzelne MySQL-Datenbank auf dem Server verwalten zu können, ist phpMyAdmin das Verwaltungstool erster Wahl. Die Installation unterscheidet sich kaum von der lokalen Variante. Allerdings eine Warnung: Das Verzeichnis in dem phpMyAdmin liegt, muss gut geschützt verwerden. Ideal ist eine Passwortsperre mit .htaccess. Ansonsten können Unbefugte die Daten löschen oder verändern.

Kategorien
Webdesign

PHP & MySQL – Teil 2

von Andreas Ahlenstorf

PHP wird erst richtig interessant, wenn man erste Webapplikationen wie zum Beispiel ein Gästebuch oder ein Forum programmieren kann. Dazu müssen Daten gespeichert werden. Das kann in Textdateien oder in einer Datenbank geschehen. Teil 2 klärt darüber auf, wie man die dafür notwendigen Tabellen anlegt und mit Daten füllt.

Wie im 1. Teil erwähnt, werden Daten in Tabellen gespeichert, die später in einer Datenbank zusammengefasst werden. Zu erst wurde die Datenbank angelegt, nun müssen die entsprechende Tabellen erstellt werden. Um das Ganze weniger abstrakt zu gestalten, könnte man sich etwa vorstellen, dass man einen kleinen Klickzähler für Downloads oder Links programmieren möchte.

Nun sollte man den localhost starten, phpMyAdmin aufrufen und eine Datenbank anlegen, sofern das noch nicht geschehen ist. Der Name spielt keine Rolle, hier haben wir ‚misc’ verwendet.

Die Möglichkeiten, eine Tabelle zu erstellen, sind vielfältig. Die einfachsten Varianten finden sich in manchen vorgefertigten Scripts, die gleich ein Setup-Script beinhalten, welches Tabellen ohne spezielle Eingriffe des Benutzers selber anlegt. Anspruchsvoller wird es, wenn man von Hand jede Spalte einzeln definieren muss.

Der erste Schritt besteht darin, dass der Tabelle ein Name gegeben wird. Man bestimmt dann, wie viele Felder (Spalten) sie enthalten soll. Dazu sollte man sich gut überlegen, was man eigentlich tun will.

Hier wollen wir uns an einem Download- oder Linkzähler versuchen. Dazu müssen eine ID, ein Link und die Hits gespeichert werden. Benötigt werden also 3 verschiedene Felder. Nach einem Klick auf „Go“ wird es interessant.

Screenshot
Tabelle anlegen

Datentypen
Man sieht sich mit einer Tabelle konfrontiert, die aus 10 verschiedenen Spalten besteht, von denen zumindest ein Teil ausgefüllt werden muss. Es geht m Wesentlichen darum, die Datentypen zu definieren, also zu bestimmen, wie ein String abgespeichert werden muss. Diese Datentypen lassen sich grob in drei verschiedene Gruppen unterteilen:

  • Numerische Typen
  • Zeichentypen
  • Vermischte Typen

Die Gruppen bestehen aus diversen einzelnen Typen, die alle ihre eigene Aufgabe haben. Dies ist nötig, um für Geschwindigkeit zu sorgen. Allerdings ist ein intensives Studium nicht von Nöten, denn immer, wenn in einem Artikels eine Tabelle angelegt werden muss, gibt es die passende Strukturangabe mit dazu.

Um zu unserem Linktracker zurückzukommen, hier die Angaben für das Anlegen der Tabelle:

Field Type Lenght Attributes Null Default Extra
id blob     Not Null    
url blob     Not Null    
hits varchar 5   Not Null    

Kategorien
Webdesign

PHP & MySQL – Teil 3

von Andreas Ahlenstorf

PHP wird erst richtig interessant, wenn man erste Webapplikationen wie zum Beispiel ein Gästebuch oder ein Forum programmieren kann. Dazu müssen Daten gespeichert werden. Das kann in Textdateien oder in einer Datenbank geschehen. In Teil 3 wird gezeigt, wie man mit PHP auf eine Datenbank zugreifen kann.

Nachdem wir unsere Vorbereitungen getroffen haben (siehe Teil 1 und 2), können wir mit PHP auf die Datenbank zugreifen. Da es sich bei MySQL um eine externe Anwendung handelt, muss zuerst eine Verbindung geschaffen werden.

Die Verbindung zur MySQL-Datenbank
Eine Verbindung zu MySQL herzustellen ist relativ einfach, da PHP von Haus aus einen kompletten Befehlssatz zum Umgang mit MySQL enthält. Da diese Befehle einfach gehalten sind, kommen wir mit wenigen Codezeilen aus.

Um auf einzelne Tabellen zugreifen zu können, sind zwei Schritte nötig. Zuerst muss die Verbindung zum Datenbank-Host hergestellt und dann die richtige Datenbank ausgewählt werden.

 $connection=mysql_connect($mysqlhost, 
$mysqluser, $mysqlpwd) or die("Verbindungsversuch fehlgeschlagen");
    

Dieses Code-Beispiel stellt die Verbindung zum MySQL-Host her. Dazu werden drei verschiedene Angaben benötigt:

  • $mysqlhost steht für den Name des Servers, auf dem MySQL läuft. Er lautet in den meisten Fällen ‚localhost‘.

  • $mysqluser steht für den Namen des Users, der auf den MySQL-Host zugreift. Diese Daten erfährt man entweder vom Provider oder man hat sie bei der Installation von MySQL selbst definiert.

  • $mysqlpwd steht für das Passwort, das benötigt wird, um auf den MySQL-Host zugreifen zu können.

Falls die Verbindung nicht zu Stande kommt, wird die Meldung „Verbindungsversuch fehlgeschlagen“ angezeigt, was durch die () ausgelöst wird.

Als nächstes, gilt es die entsprechende Datenbank auszuwählen. Dazu dient folgende Funktion:

      mysql_select_db($mysqldb, $connection) or die("Konnte 
die Datenbank nicht waehlen.");
    

Der Code wählt die Datenbank, welche mit der Variable $mysqldb angegeben wird. Um beim Beispiel aus Teil 1 und Teil 2 zu bleiben, müsste nun der Wert auf ‚misc‘ gesetzt werden. Weiter wird die Variable $connection benötigt, welche die Verbindung beinhaltet, die im ersten Code-Beispiel hergestellt wurde.

Die Datenbankverbindung sieht dann folgendermassen aus:

      <?php
    
      $mysqlhost="localhost"; 
// MySQL-Host angeben
$mysqluser="root"; // MySQL-User angeben
$mysqlpwd=""; // Passwort angeben
$mysqldb="misc"; // Gewuenschte Datenbank angeben
      $connection=mysql_connect($mysqlhost, 
$mysqluser, $mysqlpwd) or die("Verbindungsversuch fehlgeschlagen");
    
      mysql_select_db($mysqldb, 
$connection) or die("Konnte die Datenbank nicht waehlen.");
    
      ?>
    

Diesen Code speichert man am besten in einer Datei, beispielsweise mysql.connect.php, ab, damit man sie wieder verwenden kann. Das spart Code und Nerven, wenn man Fehler suchen muss.

Daten einfügen
Nun können wir damit beginnen, Daten einzufügen. Die Datenbank wird zwar per PHP angesprochen, die Instruktionen an die Datenbank aber werden in SQL formuliert. SQL versteht jede SQL-Datenbank, dazu gehören neben MySQL auch PostgreSQL und der MS SQL-Server und auch Access.

Als erstes gilt es die Tabelle anzusprechen, in welche die Daten einfügt werden sollen. Um beim Beispiel aus Teil 2 zu bleiben, fügen wir einen Datensatz in die Tabelle ‚links‘ ein und zwar bestehend aus einer ID („php“) und einem URL („http://www.php.net/“).

      <?php
    
      $id="php";
$url="http://www.php.net";
      require("mysql.connect.php");
    
      mysql_query("INSERT 
INTO links VALUES('$id','$url','')") or die(mysql_error());
    
      
        ?>
      
    
      mysql_query("INSERT INTO links VALUES('$id','$url','')") 
or die(mysql_error());
    

mysql_query() steht für einen Befehl an den MySQL-Host und dient unter anderem dazu, Daten in der Datenbank abzuspeichern und auszulesen. Als nächstes kommt ein SQL-Befehl, der dafür sorgt, dass die Daten in die Tabelle ‚links‘ geschrieben werden. Dabei wird in die erste Spalte die Variable $id geschrieben, in die zweite $url und die dritte Spalte wird leer gelassen. Abschliessend wird ein Fehlerabfänger eingebaut, der die Fehlermeldungen des MySQL-Hosts ausgibt, sofern solche Fehler auftreten. Nun noch die Codes im Überblick.

mysql.connect.php

      <?php
    
      $mysqlhost="localhost"; 
// MySQL-Host angeben
$mysqluser="root"; // MySQL-User angeben
$mysqlpwd=""; // Passwort angeben
$mysqldb="misc"; // Gewuenschte Datenbank angeben
      $connection=mysql_connect($mysqlhost, 
$mysqluser, $mysqlpwd) or die("Verbindungsversuch fehlgeschlagen");
    
      mysql_select_db($mysqldb, 
$connection) or die("Konnte die Datenbank nicht waehlen.");
    
      ?>
    

add.php

      <?php
    
      $id="php";
$url="http://www.php.net";
      require("mysql.connect.php");
    
      mysql_query("INSERT 
INTO links VALUES('$id','$url','')") or die(mysql_error());
    
      
        ?>
       

Kategorien
Webdesign

Datenbanken: Grundlagen

Jeder kennt Datenbanken, jeder nutzt sie – wahrscheinlich sogar täglich. Doch wie die Sache funktioniert, gehört nicht zum Allgemeinwissen. Grund genug, um einmal hinter die Dinge zu schauen und sich mit den Grundlagen der Datenbank zu beschäftigen.

Das ER-Modell beschreibt die Beziehungen zwischen einzelnen Datensätzen und ist die wohl wichtigste Grundlage für die professionelle Arbeit mit Datenbanksystemen und dem Datenmanagement. Dieser Artikel soll einen Einblick in die komplexen Beziehungen von Daten geben und die einzelnen möglichen Relationen anhand von praktischen Beispielen zeigen.

Um erfolgreich ausgefeilte Datenbanksysteme zu erstellen, benötigt man das entsprechende Fachwissen über Grundkonzepte von Datenbanken. Zuerst ist zu klären, was überhaupt eine Datenbank ist und wozu diese benötigt wird.

Eine Datenbank ist eine Sammlung von Objekten (Daten). Diese Daten sind in Tabellen untergebracht, ein Datenobjekt kann eine Anweisung, eine Verknüpfung oder einfach nur ein Text sein. Eine Datenbank kann beliebig viele Tabellen haben.

Die Tabellen, in denen die Daten gespeichert sind werden durch Spalten und Reihen dargestellt, was die strukturelle Verteilung deutlich macht. Eine komplette Reihe einer Datenbanktabelle wird als Datensatz betrachtet. Die Anzahl der Spalten ist hier verantwortlich für die Länge des Datensatzes. Ein Feld ist eine bestimmte Spalte aus einem Datensatz.


Spalten und Datensatz

Anhand der Abbildung kann man erkennen, wie auf einen einzelnen Datensatz zugegriffen wird. Ein Datensatz ist durch seine Einmaligkeit gekennzeichnet. Diese einmalige Kennzeichnung erleichtert den Zugriff auf die jeweiligen Daten.

Sie kennen dieses Prinzip selbst aus dem täglichen Leben – denken Sie nur an Ihren eigenen Personalausweis. Dieser ist durch eine einmalige Nummer fest definiert. Es gibt also keinen weiteren Menschen, der einen Personalausweis mit der gleichen Nummer hat. Nach genau diesem Prinzip arbeiten Datenbanken. Durch die Festlegung eines einmaligen Schlüssels, dem sogenannten Primärschlüssel (primary key) kann ein Datensatz als einmalig definiert und mit der einmaligen Kennzeichnung auf diesen zugegriffen werden.

Was genau ist SQL?
Wer sich bis jetzt nur am Rande mit Datenbanken befasst hat kommt bei der intensiven Einarbeitung nicht um die Abfragesprache SQL (standard query language) herum. Mit SQL Abfragen kann man Befehlszeilen und Anweisungen an den Server senden, gar kleine Programme schreiben, doch Sinn macht das Ganze erst, wenn die Datenbank mit Programmen, wie PHP Skripten verbunden wird, worin das PHP Skript über SQL auf die Daten in der Datenbank zugreift und diese manipuliert, das heisst: verändert.

SQL besteht aus strikten Regeln. Diese beschreiben, was beispielsweise eine zulässige Befehlssyntax ist oder welche Inhalte für Felder verwendet werden. Jede Spalte kann nur mit Daten gefüllt werden, die dem zulässigen Datentyp entsprechen. Sie können also keinen Text für eine Ganzzahl (Integer) einsetzen. Die Indexe (Schlüssel) beschleunigen den Zugriff auf die Daten durch Such- und Sortierfunktionen.

Das relationale Modell beschreibt die Beziehungen zwischen den einzelnen Daten. Schon bei der Wahl der Tabellenstruktur wird man mit diesem System aus Beziehungen konfrontiert. Das folgende Beispiel eines kleinen Hardware-Shops zeigt im Kleinen einfache Beziehungen.


Tabellenbeispiel

Zunächst müssen wir festlegen, worin diese Beziehungen liegen. Der einmalige Schlüssel ist hier die Artikel – ID. Mit dieser kann man auf die weiteren Daten des Artikels zugreifen. Der nächste Schlüssel ist die Kategorie – ID. Hier finden wir auch schon die erste Beziehung. Mit der Kategorie – ID wird festgelegt, in welche Kategorie ein Artikel gehört. In unserem Beispiel sind das Prozessoren, Festplatten und RAM – Bausteine. Die Daten, wie jetzt die Kategorie heißt, oder welche Beschreibung es allgemein zu der Kategorie gibt, welche Artikel es gibt sind in einer anderen Tabelle gespeichert. Mit der Kategorie – ID als Primärschlüssel kann man auf diese Daten zugreifen.

Screenshot
Die Tabelle mit den Kategorien könnte wie folgt aussehen:

Wie Sie sehen, hat man nach dem ER-Modell (Entity Relationship-Modell) zwischen den einzelnen Tabellen und Datensätzen eine Beziehung erzeugt. Diese Beziehungen sind nicht immer deutlich, doch es erscheint logisch, die Daten so fein wie nur möglich zu verteilen und anhand eines Schlüssels auf diese zuzugreifen.

Es ist außerdem praktisch, die Daten so zu verteilen. Fügt man in die obige Artikel-Tabelle auch noch die Daten der Kategorien ein und will später diese Daten der Kategorien ändern, dann muss man die Daten für jeden einzelnen Artikel der dieser Kategorie angehört, ändern. Das wäre natürlich viel zu umständlich.

Bei dieser Datenverteilung spricht man von der Normalisierung von Daten, dies erfolgt nach den Regeln, die anhand des Beispiels gezeigt wurden.

Welche Beziehungsformen gibt es?
Das Beispiel hat eine einfache Beziehung zwischen den Daten aus zwei Tabellen gezeigt. Man spricht hier von einer n – 1 Beziehung. In der Tabelle der Kategorien wurden die Daten der Kategorie gespeichert, diese sind direkt mit den Artikel-Daten aus ihrer Tabelle verknüpft, da in beiden Tabellen jeder Datensatz eindeutig (Primärschlüssel) zugeordnet ist. Doch können in der Artikel-Tabelle die Kategorie-ID bei vielen Artikel gleich sein, dennoch ist jeder Eintrag in der Kategorie-Tabelle einmalig. Deshalb spricht man hier von n – 1, da auf der linken Seite der Schlüssel mehrfach auftauchen kann.

Doch es gibt neben dieser n – 1 Beziehung noch zwei weitere Beziehungsarten. Zunächst wollen wir ihnen die 1-1 Beziehung vorstellen.

Die 1:1 Beziehung besteht zwischen zwei Tabellen, die jeweils Daten einer ID-Speichern. Hier werden in der zweiten Tabelle z.B. Daten eines Artikels gespeichert, die nicht unbedingt notwendig sind. In einer Artikeldatenbank eines Shops können das die Support-Kontakte oder die Garantie usw. sein. Diese Daten haben in beiden Tabellen den gleichen Schlüssel, da sie ja zum gleichen Artikel gehören. Man spricht hier von der 1-1 Beziehung.

Nun wollen wir uns der letzten möglichen Beziehungsart zuwenden. Die n – n Beziehung. Sie entsteht wenn die Normalisierungsregeln nicht komplett angewandt wurden.

Ein Beispiel
Ein User bestellt in einem Shop mehrere Artikel gleichzeitig. Er erhält dafür eine Bestellnummer. Diese Bestellnummer ist für alle Artikel gleich, da sie ja durch eine Bestellung entstanden sind. Doch die Bestellung wird jetzt in einzelne Datensätze unterteilt. Jeder bestellte Artikel wird in einer Tabelle aufgeführt. Hier sind dann die User-ID (ID des Käufers) und die Artikel – ID gleich, und diese Gleichheit tritt unter jedem weiteren bestellten Artikel, einer Bestellung, des gleichen Artikels auf. Hierbei handelt es sich um eine n – n Beziehung.

Die Nachvollziehung, speziell die der n – n Beziehung ist sehr schwer, deshalb sollte man sich das bildlich vorstellen. Die Tabelle in der die Bestellungen unseres Hardware-Shops gespeichert sind, sieht wie folgt aus.

Bestellungs – ID (pro Artikel) Kunden – ID Bestellnummer Artikel – ID
1 1 4 2
2 1 4 3
3 1 4 4

Wenn man die Beziehungen hier nachvollzieht herrscht die n – n Beziehung zwischen der Kunden – ID und der Bestellnummer. Wer jetzt aus den vorherigen Artikel die Bestellung des Kunden mit der ID = 1 nachvollzieht kann man feststellen, das er unter der Bestellnummer 4 auf einmal die Artikel mit der ID 2, 3 und 4 bestellt hat, das wären ein Prozessor, eine Festplatte und ein RAM Baustein.

Dieses komplexe Beispiel, welches noch sehr abgespeckt ist, hat sie nun in das ER – Modell eingeführt, und soll eine gute Grundlage für das weitere Arbeiten mit professionellen Datenbanksystemen unter SQL sein.

Kategorien
Webdesign

Javascript und PHP: Ungleiche Gesellen

Die beliebten Scriptsprachen PHP und Javascript werden nicht selten zusammen auf einer Seite benutzt. Wie passen die ungleichen Gesellen zusammen und wie können Daten untereinander ausgetauscht werden?

Der wichtigste Unterschied liegt auf der Hand. Javascript wird auf dem Computer des Benutzers, durch den Browser ausgeführt, PHP dagegen auf dem Webserver. PHP wurde immer bereits ausgeführt, wenn Javascript erst mit der Arbeit beginnt. Da helfen nur Tricks, um Variablen austauschen zu können.

So werden PHP-Werte an Javascript übergeben:

 <script language="javascript">
var name = "<?php echo $username; ?>";
var email = "<?php echo $email; ?>";
      alert("Name: " + name + 
", Email: " + email);
</script>

Die Javascript-Variablen werden definiert. Bevor die Datei vom Webserver an den Browser gesendet wird, schreibt PHP die Werte seiner Variablen in den Quellcode. Jetzt kann das Javascript-Programm damit arbeiten, und gibt sie per alert() aus.

Umgekehrt ist es schwieriger: Die Javascript Werte können nur an eine neue Datei weitergegeben werden. Dieses Beispiel übergibt den Namen und die Email-Adresse an ein PHP-Skript, welches dann aus beiden einen Link generiert:

      <HTML>
<script language="javascript">
var name = "Michi";
var email = "michi@webmail.de";
document.write('<a href="2.php?name=' + name + '&email=' + email + '">weiter...</a>');
</script>
</HTML>

Das Javascript schreibt mit document.write() einen Link und setzt die vorher definierten Variablen ein:

Das PHP-Script liest die über die URL gelieferten Variablen wieder aus und baut damit einen Email-Verweis.

      <?php
$name = $_GET["name"];
$email = $_GET["email"];
echo "<a href=\"mailto:$email\">$name</a>";
?>

Kategorien
Webdesign

Email im Griff

von Peter Braun

Es wird immer schlimmer: Tag für Tag vermüllt das Email-Postfach mehr. Hier stapelt sich unbearbeitete Korrespondenz, dort warten etliche Kunden und Kollegen auf Antwort. Keine Zeit, kein Plan. Gretchenfrage: Wie kriegen Profis ihre Email in den Griff?

 

Email versprach uns reinen Segen: schnell, einfach und effizient. Von wegen. Ohne ausgetüftelte Selbstorganisation verstopfen Postfächer in allerkürzester Zeit. Der Überblick geht flöten, Wichtiges und Dringendes bleibt liegen. Der Anblick des Posteingangs weckt augenblicklich das schlechte Gewissen. Es muss doch einen Ausweg aus dem Dilemma geben …

Wie heißt es so schön? Ordnung ist das halbe Leben. Räumen Sie also als erstes auf, indem Sie eigene Konten oder Identitäten für verschiedene Aufgaben anlegen. Für mehr Überblick über den Posteingang sorgen thematisch oder inhaltlich abgegrenzte Archivordner, die gleichartige Emails aufnehmen. Am besten kombiniert man dies mit Filterfunktionen des Emailprogramms, um dadurch eine erste Vorsortierung zu erreichen. Überdies können Filter die lästigen Spam-Emails von bekannten Versendern oder mit bekannten Betreffzeilen direkt in den Papierkorb leiten.

Die Bezeichnung sollte für Ihre Benutzer eindeutig erkennbar und zuzuordnen sein. So sind Kundenaufträge im Postfach bestellung@… bestens aufgehoben, technische Anfragen richten sich an support@… . Newsletter empfängt man idealerweise via newsletter@… und Privates wird über privat@… abgewickelt. So kann man jedes Konto der Reihe nach abarbeiten – was außerdem den Vorteil bietet, dass Sie sich immer nur auf ein Thema konzentrieren müssen.

Zeitdiebe lauern überall. Der wahrscheinlich wichtigste Helfer ist die Trennung zwischen Wichtigem und Unwichtigem. Geschäftliches kommt vor Privatem, Dringendes vor nicht Dringendem. Besonders effektiv ist es, mit den schweren Brocken zu beginnen. Einfache Emails sind zwar schnell abgearbeitet und bieten schnelle Erfolgserlebnisse, aber die Aussicht auf die noch zu bearbeitenden aufwändigeren Nachrichten demotiviert dann wieder.

Es ist schon erstaunlich, dass sich die Mehrheit aller Nutzer von Email-Konten ohne großen Widerstand bei der Arbeit unterbrechen oder ablenken lässt. Sei es von Anrufen, Instant Messaging Systemen, Musik oder der klassischen Variante, den lieben Kollegen, die mit dringenden Wünschen unangemeldet ins Büro platzen. Natürlich ist so manche Störung auch eine willkommene Abwechslung im tristen Büroalltag, trotzdem verlängert sie nüchtern betrachtet nicht nur die Bearbeitungsdauer für die noch wartenden Emails – man muss sich jedes Mal wieder aufs Neue in das Thema hineinfinden. Der Job ist definitiv schneller erledigt, wenn man für die Dauer der Email-Bearbeitung die Bürotür schließt und den Anrufbeantworter einschaltet. Auch auf die Gefahr hin, als unkommunikativ zu gelten – das genaue Gegenteil ist der Fall.

Das permanente automatische Überprüfen des Email-Kontos und eine optische oder akustische Benachrichtigung bei Email-Neuzugängen im Postfach kann eine weitere lästige Unterbrechung sein. Sinnvoller scheint es zu sein, neue Emails manuell abzurufen – und zwar erst dann, wenn alle alten Emails bearbeitet sind. Wehret den Anfängen: Wer am Ende eines Tages noch unbearbeitete Emails im Postfach hat, befindet sich bereits im Anfangsstadium der Vermüllung. Jeder neue Morgen bringt auch neue Emails. So wiederholt sich das Spiel, bis nach wenigen Wochen der Eingangsordner rappelvoll ist.

Manche Webworker schwören darauf, die Emails stets zu festen Zeiten, bevorzugt in den Morgen- oder Vormittagsstunden, abzurufen und zu bearbeiten, da zu dieser Zeit die Leistungskurve und Konzentration am höchsten ist. Nach landläufiger Meinung gehen problemlastige und arbeitsintensive Emails dann leichter von der Hand als am Nachmittag, wenn die Akkus deutlich leerer sind.

Wie kann man bei der Bearbeitung von Emails Zeit sparen? Zeitraubend sind beispielsweise Rückfragen auf bereits beantwortete Emails. Die einzige Abhilfe ist, konkrete Aussagen zu treffen und Fragen vollständig zu beantworten. Gegebenenfalls kann man den Empfänger bei Fragen, wenn das eigene Know how nicht mehr ausreicht, auf weiterführende Internet-Adressen verweisen.

Umgekehrt gilt dieses Prinzip auch für das Verfassen eigener Emails: Wer sich präzise ausdrückt und auf den Punkt kommt, erhöht die Chancen auf eine schnelle Antwort. Tauchen bei Kundenanfragen regelmäßig die gleichen Fragen auf, lohnt es sich, diese samt Antwort zu sammeln und als FAQ-Liste in eine Textdatei zu kopieren. Diese Frequently Asked Questions kann man später auf der Homepage veröffentlichen, idealerweise im Supportbereich oder bei den Kontaktinformationen. Zusätzlich lohnt ein Hinweis auf die Internet-Adresse bei Kundenanfragen, oder der entsprechende Text wird aus der FAQ in die Reply hineinkopiert.

Ein komfortables und leistungsfähiges Email-Programm ist für die effiziente Nachrichtenbearbeitung ein Muss, insbesondere für Vielschreiber. Mehrere Email-Konten mit separaten Postein- und -ausgängen, flexible Filter (z.B. um lästige Emails bereits auf dem Server zu löschen), ein geschicktes Ordner-Management, Volltextsuche, Nachrichtenvorlagen, Sicherheitsfunktionen zur Virenabwehr (Blockade von automatischen Starts von Dateianlagen) sowie PGP-Verschlüsselung und digitale Signaturen erleichtern die tägliche Arbeit. Unter Powerusern genießt The Bat! einen sehr guten Ruf. Wer gerne konfiguriert und sich nicht an einer gruftigen Oberfläche stört, dem sei auch ein Blick auf Pegasus Mail empfohlen.

Dass Email eine zeitraubende, bisweilen produktivitätskillende Angelegenheit sein kann, haben inzwischen die ersten Web-Dienstleister erkannt. Neben Call-Centern für den telefonischen Kundenkontakt gibt es auch externe Dienstleister für die Abwicklung der elektronischen Firmenpost.

Kategorien
Webdesign

Massenmails mit Pegasus

von Christian Prior

Pegasus Mail ist nicht nur ein komfortabler Email-Client. Das Flügelwesen trägt Ihre Botschaften auch massenwirksam in die Welt hinaus. Mit der Funktion Mail Merge kommt Ihre Nachricht in personalisierter Form am besten beim Empfänger an. Die Anleitung gibt es hier.

Ab Version 3.12 ist die Programmfunktion „Mail Merge“ als standardmäßig eingebaute „Extension“ in Pegasus Mail enthalten. Sie funktioniert mit zwei einfachen Textdateien, eine für das Format und die andere mit den benötigten Daten. In diesem Beispiel nehmen wir an, allen registrierten Benutzern unserer Seite ein neues Passwort zuzusenden.

So wirds gemacht:
Erstellen Sie einen Datensatz mit den folgenden Datenfeldern: Emailadresse, Name, Benutzername sowie ein Passwort. Jeder einzelne Eintrag befindet sich in einer Zeile, die Einträge sind durch einen Tabulator voneinander getrennt (tab-delimited), es wird kein besonderes Zeichen zum Zeilenabschluss verwendet.

Besonders leicht lässt sich eine solche Datei über eine Tabellenkalkulation oder eine Datenbankabfrage erstellen. Excel beispielsweise bietet die Funktion „Speichern unter“ „Text (Tabs getrennt)“. Damit erzeugen wir folgende Datei:

Screenshot
Die Daten

Nun erstellen wir das Format-Template. Auch dies ist wieder eine .txt-Datei, die den Email-Text und die Platzhalter für die Variablen enthält: ~2~ etwa ergibt in unserem Fall den Namen. Bitte beachten Sie, dass zur Verdeutlichung der Tabs hier kein Leerzeichen zwischen Vor- und Nachname gesetzt wurde! Eine einfache Formatvorlage:

Screenshot
Das Format

Beide Dateien speichert man an beliebiger Stelle auf der Festplatte ab. Jetzt wird’s spannend: In Pegasus öffnet man das Menu „Tools“ > „Extensions“ > „Mail Merge“, woraufhin dieses Fenster erscheint:

Screenshot
Auf los gehts’s los: Mail Merge

Über die Auswahlbuttons wählt man die Daten- und Formatdatei aus, der „field separator“ ist in unserem Fall voreingestellt. Wichtig ist, dass Sie das Feld für die Emailadresse benennen, wir haben sie an Position 1. Wählen Sie eine bessere Betreffzeile als in diesem Beispiel, und verzichten Sie auf den Einsatz von Copy self. Jetzt ein Klick auf „send“ – und schon wird die Massenmail erstellt.

Hat man vorher über „File“ > „Enter offline mode“ die Verbindung zum Netz getrennt, kann man sich jede einzelne Mail bequem ein zweites Mal unter „File“ > „Review queued mail“ ansehen. Pegasus erstellt eine Email für jeden Empfänger. Der Verzicht auf die Kopfzeile cc. (copy self) ist von Vorteil, schliesslich unterscheiden sich die Emails nur in den wenigen Variablen. Vorsicht auch bei eigens erzeugten X-Headern im Briefkopf. Diese werden leicht mehrfach eingebunden und blähen die Datei unnötig auf. So manches Email-Programm produziert gleich mehrere X-Header auf einmal. Zurückhaltung ist auch aus Gründen der Netiquette angesagt, denn X-Header, vom Absender nach Lust und Laune produziert, sind für so manchen Empfänger ein Hinweis auf fehlende „Vertrauenswürdigkeit“. Sie wollen ja, dass Ihre Nachricht gelesen wird …

Für einen kleinen Newsletter oder eine Kundeninformation haben Sie jetzt eine technisch zufrieden stellende Lösung, eingebettet in einen Email-Client mit einem hohen Leistungsumfang.

Unser Tipp für potenzielle Massenmailer: Klären Sie Ihr Vorhaben vor dem Versand höherer Auflagen unbedingt mit dem Provider ab. T-Online beispielsweise schickte in der Vergangenheit schon bei 100 gleichzeitig verschickten Emails eine Bitte um Unterlassung. Den Ärger sollten Sie sich ersparen.

Für weitergehende Fragen existiert eine englischsprachige Mailingliste. Der Hersteller dagegen bietet Support nur gegen Bezahlung. Allerdings aus gutem Grund: Kostenlos erhältlich ist Pegasus Mail als ‚Bookware‘ – das Programm lebt vom Verkauf der Handbücher.

Es lohnt sich, auf Pegasus Mail umzusteigen. Sie haben für viele Standard-Anwendungen des Internetdienstes „Email“ das passende Tool zur Verfügung.

Kategorien
Webdesign

Kein Virus, sondern ein Feature? Sichere Alternativen zu MS Outlook

Wer Internet sagt, muss auch E-Mail sagen. Die elektronische Post hat sich mittlerweile einen festen Platz in der Kommunikation der kurzen Wege gesichert. E-Mail braucht keine langen Wartezeiten, birgt aber auch Risiken in sich, die man als Nutzer kennen muss.

Was von Microsoft für einen problemlosen Datenaustausch innerhalb der MS-Produktfamilie gedacht war, bedeutet in punkto Sicherheit einen entscheidenden Nachteil. Wenn alles verbunden und vernetzt wird, bleibt irgendwann die Sicherheit auf der Strecke. Wer sich mit Outlook nicht sicher genug fühlt, muss sich zwangsläufig nach Alternativen umschauen, die es als Free- oder Shareware per Download im Internet gibt. Die Auswahl ist groß:

Faktor Kosten: Microsoft bietet seinen Anwendern die E-Mail-Clients kostenlos, wenn man das kleine Entgelt beim Erwerb von Windows unberücksichtigt lässt. Gleiches gilt aber auch für andere Clients, wie Pegasus oder Mozilla/Netscape.

Eudora, das es inzwischen in der Version 5.1 gibt, bietet eine sichere Verbindung für zum Versand und Empfang von E-Mails und für das Online-Banking per SSL-Standard (secure socket layer). Hinzu kommen zahlreiche Konfigurations möglichkeiten, die ab der Version 4.xx mit unterschiedlichen Varianten und Erweiterungen angeboten wird.

Screenshot
Eudora

Ein kleiner Nachteil liegt darin, dass Eudora nur in Englisch angeboten wird. Trotzdem ist es auch mit wenigen Englisch-Kenntnissen schnell zu überblicken und anzuwenden. Wer später auf ein anderes Programm wechseln will, hat den Vorteil, dass Eudora-Daten (E-Mails, Einstellungen, Adressbücher) von den meisten E-Mail-Clients problemlos importiert werden können.

Auch hier erfolgt die Verwaltung der Nachrichten über Mailboxen, die sich zu Ordnern zusammenfassen lassen und eine strukturierte Ablage der Nachrichten ermöglichen. Außerdem stehen flexible Filterfunktionen sowie ein einwandfrei funktionierendes Drag and Drop und die Verarbeitung von HTML-Mails zur Verfügung. Die Gestaltung von E-Mails ermöglicht der Eudora-Editor mit einfachen Formatierungen auf der Basis von HTML. Mit Eudora lassen sich auch per E-Mail zugesendete HTML-Seiten direkt anzeigen, weisen aber manchmal abweichende Darstellungen vom Original auf.

Postme bietet neben den Standards kreative Features und Details für den täglichen E-Mail-Gebrauch. Benutzer finden beispielsweise HTML-Mails, interaktive Vorlagen, umfangreiche Filter, integrierte Verschlüsselung, automatisches Ver- und Entzippen, Multi-Accounts, gefahrlosem Anzeigen von Textanlagen und Textbausteine.

Pegasus kann bei der Einrichtung von Multi-Accounts sowie in punkto Konfigurierbarkeit und Archivierung jederzeit mithalten und ist auch in Novell Netzwerken einsetzbar. Pegasus wird häufig für den E-Mail-Versand über das Firmenintranet eingesetzt. Das Email Programm Pegasus gibt es inzwischen in der Version 4.1. Mit dabei: Ein Spamfilter, Content Control genannt, sowie SSL Unterstützung für die gesicherte Kommunikation. Dazu kommen zahlreiche Verbesserungen im Detail und Windows XP Look.

Die Auswahl brauchbarer E-Mail-Clients ist nicht auf prominente Namen eingeschränkt. Unterschiedliche Merkmale sind vor allem der Preis oder die Möglichkeit des kostenlosen Downloads sowie technische Details, sprich: Benutzerfreundlichkeit und Funktionalität. Gut beraten ist auf jeden Fall, wer die entsprechenden Hilfe-Funktionen aufmerksam studiert, die Sicherheitsstandards der einzelnen Programme genau kennt und einzuschätzen vermag.

Screenshot
Netscape Netmail

Natürlich kann man sich auch Mail-Funktionen bedienen, die in Browsern wie Netscape integriert sind. Die bieten beispielsweise in Gestalt des Netscape Netmail weitestgehend die gleichen E-Mail-Funktionen wie die einschlägigen Programme im Stil von Outlook, Eudora, K-Mail und vielen anderen. Auch hier sind vielfältige Konfigurations- und Filterfunktionen integriert.

The Bat bietet eine erstaunliche Vielzahl von Funktionen und Möglichkeiten des automatisierten Einsatzes der E-Mail-Bearbeitung mit Filtern und Makros. Hinzu kommt bei The Bat! der mögliche Betrieb einer einfachen Mailing- oder Diskussionsliste, was ganz neue Möglichkeiten der individuellen Kommunikation eröffnet.

Zugegeben ist The Bat! lernbedürftig für denjenigen, der sich verschiedene Varianten von Outlook gewöhnen mussten. Die gute Nachricht: Viele Funktionen gleichen sich, man muss im reichhaltigen „Bat-Menü“ nur suchen oder die ausführliche und sehr praktikable Hilfe bemühen. Hier wird einem garantiert geholfen. Hervorhebenswert ist noch, dass man über diesen E-Mail-Client die einzelnen E-Mail-Konten sofort überblicken und neue bzw. gelesene E-Mails kontenbezogen erfassen kann. Das bietet einem beispielsweise Outlook 200x nicht!

Screenshot
The Bat!

The Bat! verzichtet auch auf Dinge, die im Detail zwar komfortabel erscheinen, aber insgesamt das Programm nur künstlich aufblähen und die E-Mails (je nach Unvermögen des Benutzers) nur „verschandeln“. Dazu zählt beispielsweise, dass The Bat! nur Fonts mit fester Schrittweise zur Verfügung stellt und die vielen hinderlichen „Kunstschriften“ im E-Mail-Verkehr a priori ausschließt. Dafür kann man die E-Mail mit Satz-Anweisungen recht übersichtlich gestalten und darüber hinaus mit diversen Richtlinien für die Verwendung von Textbausteinen und Rechtschreibprüfung versehen. Im Besonderen wird bei diesem E-Mail-Programm die Sicherheit sehr groß geschrieben. PGP-Verschlüsselung, digitale Unterschriften, ein Betrachter für HTML-E-Mails gehören diesbezüglich zu den Standards.

Mehr noch: Mit The Bat! ist man gegen Viren und Würmer geschützt, die sich über E-Mail verbreiten, da hier weder das Adressbuch noch ein Windows-abhängiger HTML-Betrachter verwendet wird. In die Sicherheitsvorkehrungen einbezogen sind auch Warnungen für das Öffnen verdächtiger Dateianlagen oder solcher, deren Öffnen vollständig verhindert wird. Die sind dann nur über eine Speicherung auf dem PC und (hoffentlich) gleichlaufende Viren-Überprüfung zu lesen.

Sozusagen als „Bonbon“ bietet The Bat! auch einen „Mail Ticker“, der beim Eintreffen neuer E-Mails anzeigt, von wem und mit welchem Betreff diese eingetroffen sind. Sogar über den so genannten „Postfach-Inspektor“ kann man sich über, auf dem Server eingegangene, E-Mails informieren. Der allerdings angezeigte Nachrichtenimport „von allen gängigen E-Mail-Programmen“ ist wohl doch noch nicht ganz durchgesetzt. Trotzdem, oder gerade deswegen: Dafür kann man auch den vergleichsweise geringen Preis von knapp über 35-55 Euro über die virtuelle Ladentheke schieben.

TheBat | Eudora | Pegasus |Postme

Kategorien
Webdesign

Outlook Express Datensicherung

Auf dieses Werkzeug dürften Anwender von Microsofts kostenlosem Mail-Client lange gewartet haben.

Outlook Express Datensicherung legt Backups der Mails, Identitäten, Adressbuch, News-Konten, Filter und Signaturen an. Das ist insofern ein echter Gewinn, weil OE-Anwender diese Daten bislang aus diversen Ecken des Betriebssystems mühsam per Hand zusammensuchen mussten.

Screenshot
Sicher ist sicher

Mit dem Tool von Heiko Schröder sind Backup und Restore nun mit wenigen Mausklicks erledigt. Sehr schön. Die Testversion ist funktionell ein wenig eingeschränkt. Die Vollversion kostet moderate 10 Euro. Empfehlenswert.

Kategorien
Webdesign

Outlook Daten sichern mit Outback Plus

Wenn einem Outlook erst mal um die Ohren geflogen ist, weil ein Virus oder die eigene Fehlbedienung zugeschlagen haben, ist es bereits zu spät. Ohne Backup muss man wieder bei Null anfangen. Oder man baut dem Email-Gau mit OutBack Plus vor und legt Backups an.

Backups sind lästig und ohne Zusatzsoftware oft eine zeitraubende Angelegenheit. Mit OutBack Plus geht die Sache schnell und flexibel von der Hand. Das Tool sichert die persönlichen Ordner (.PST) als komprimiertes Archiv – inklusive Signaturen, Filterregeln, Konfiguration und Favoriten und Cookies vom Internet Explorer. Auch einzelne Dateien lassen sich manuell hinzufügen.


Email-Backups auf die flotte und bequeme Art

Die Bedienung ist simpel und stellt auch die faulsten Anwender nicht vor größere Hürden. Alle wichtigen Komponenten von Outlook sind der Voreinstellung bereits zur Sicherung ausgewählt. Dann noch den Zielordner angeben – und go!

Auch schön: Gegen Vergesslichkeit hilft eine Erinnerungsfunktion. Datum und Uhrzeit des Backups lassen sich in den Archivnamen integrieren, die Kompressionsstärke ist in vier Stufen wählbar, ein Logfile protokolliert alle Aktivitäten, und wenn´s mal ganz schnell gehen muss, legt die Funktion „Quick Backup“ eine Sicherung mit den Parametern des letzten Backups an. Gibt´s da noch irgendwelche Ausreden gegen das Backup?

Outback Plus 5 läuft mit Windows XP, Windows 2000, Windows ME, Windows 98SE, Windows 98 Windows 95, ist voll kompatibel mit Outlook 2003 , 2002 (XP), 2000, and 98 spricht Englisch und kostet 39,95 US-Dollar. Für den kleinen Bruder Outlook Express ist vom gleichen Hersteller eine ähnliche Software unter dem Namen Express Assist 7 erhältlich.