E-Commerce (electronic commerce) ist der Überbegriff für elektronisch durchgeführte Transaktionen, wie sie z. B. bei Online-Bestellungen, elektronisch ausgestellten Angeboten und Ausschreibungen gemacht werden.

M-Commerce (mobile commerce) meint Transaktionen per Smartphone, wie sie beispielsweise beim Buchen von Parkscheinen, beim Zigarettenkauf, beim Kauf von Handywertkarten, Zugkarten und beim Bezahlen am Snack-Automaten anfallen.

Alle diese Transaktionen können bequemer und sicherer mit einer elektronischen Signatur (Unterschrift) durchgeführt werden, manche Funktionen sind nur damit möglich. Im Bankbereich kommen meist Transaktionscodes (TANs) zur Erhöhung der Sicherheit zum Einsatz.

E- und M-Commerce

Beim Kauf von etwas kommt zwischen VerkäuferIn und KäuferIn ein Vertrag zustande. Der Vertrag beruht auf den übereinstimmenden Willen von VerkäuferIn und KäuferIn: Der Verkäufer/die Verkäuferin möchte etwas zu einem bestimmten Preis verkaufen (Angebot) und der Käufer/die Käuferin möchte es kaufen (Nachfrage).

Der Wille der Vertragsparteien muß nach aussen zum Ausdruck gebracht werden:

• ausdrücklich: schriftlich oder mündlich
• schlüssig: aus einer Handlung heraus (z. B. Einwurf einer Münze in den Automaten)

Beim Einkaufen im Geschäft ist die Situation meist eindeutig. Es ist klar,

• welche Personen den Vertrag miteinander schließen
• was der Inhalt des Vertrages ist.

Beim elektronischen Geschäftsverkehr zwischen Händlern und Kunden (E-Commerce) ist die Situation eine andere. Aber auch hier werden Bestellungen und Annahmeerklärungen ausgetauscht, aber auf elektronischem Wege. Die Identität der potentiellen Vertragspartner bleibt vorerst ungeklärt. Selbst aus welchem Land sie kommen, ist nicht geklärt, und damit, welches Recht gilt.

Verträge kommen grundsätzlich in Österreich auch mündlich zustande. In manchen Fällen ist aber ein schriftliche Vertrag mit eigenhändiger Unterschrift notwendig.

• Ein Vertrag soll aus Beweisgründen schriftlich erstellt werden. Der Vertragsinhalt (wer, was, welche Rechte und Pflichten) wird so für die Zukunft festgeschrieben.
• Ein Rechtsverkehr zwischen Abwesenden (z. B. schriftliche Bestellung) bedarf der Möglichkeit einer schriftlichen Niederlegung.
• In manchen Fällen ist sogar eine besondere Form vorgeschrieben (eigenhändiges Testament: eigenhändig verfaßt und unterschrieben, Verpflichtungserklärung eines Bürgen etc.).

Die Unterschrift dient drei Zwecken:

1. Feststellung der Identität des Unterschreibenden
2. der Unterzeichner/die Unterzeichnerin bringt zum Ausdruck, dass sie sich mit dem Inhalt identifiziert und ihn akzeptiert
3. der Unterzeichner/die Unterzeichnerin macht sich bewusst, dass durch die Unterschrift Rechtsfolgen entstehen (Warnfunktion)

Mit der technischen Entwicklung ist der Geschäfts- und Rechtsverkehr nicht mehr auf den mündlichen und schriftlichen Nachrichtenaustausch beschränkt. Daten können elektronisch (digital) übermittelt werden (Email, WWW). In diesen Fällen kann keine originale Unterschrift übermittelt werden. Ein weiteres Problem: Eine per Email übermittelt Rechnung gilt nicht als Beleg im Sinne des Umsatzsteuergesetzes.

Hier schafft die elektronische Signatur Abhilfe.

Sinn und Zweck

Mit der elektronischen Signatur (früher auch: „digitale Signatur“) wird die Funktion der eigenhändigen Unterschrift in den elektronischen Bereich übertragen werden. Im Signaturgesetz (SigG) wird die elektronische Signatur folgendermaßen definiert:

„elektronische Daten, die anderen elektronischen Daten beigefügt werden oder mit diesen verknüpft werden und die der Authentifizierung, also der Feststellung der Identität des Signators, dienen“.

Dazu kommt aber auch noch der Zweck, die Integrität der Nachricht zu gewährleisten.

Eine wichtige Rolle spielt auch die Unbestreitbarkeit des Vorgangs: Es kann später überprüft werden, dass es eine Transaktion stattgefunden hat und wer daran als Sender oder Empfänger beteiligt war.

Die elektronische Signatur dient also (Funktionen)

• der Feststellbarkeit der Identität des Absenders
  ► geschieht durch die asymmetrische Verschlüsselung
• der Gewährleistung der Integrität der Nachricht und
  ► wird durch das Bilden und den Vergleich zweier Hashwerte gewährleistet
• der Feststellbarkeit der Unbestreitbarkeit des Vorgangs
  ► durch die Stelle, die den privaten Schlüssel ausgestellt hat

Die Technik

Der elektronischen Signatur liegt die asymmetrische Verschlüsselung zu Grunde, die gegenüber der symmetrischen Vorteile hat. Bei der Verschlüsselung wird „Klartext“ (lesbarer Text) in „Geheimtext“ (unverständliche Zeichenfolgen) umgewandelt. Nur mit dem Schlüssel kann der Geheimtext wieder in Klartext rückgewandelt werden.

• Symmetrische Verschlüsselung: Die Verschlüsselung und Entschlüsselung erfolgt mit demselben Schlüssel. Der Absender verschlüsselt die Nachricht mit seinem Schlüssel, gibt den Schlüssel an den/die Empfänger, der/die die Nachricht damit entschlüsseln. Es besteht die Gefahr, dass der Schlüssel weiteren Personen bekannt wird (die ihn auch verwenden könnten). Ausserdem kann die Identität des Absender nicht eindeutig festgestellt werden.
• Asymmetrische Verschlüsselung generell (Prinzip):
  

  

  Asymmetrische Verschlüsselungsverfahren arbeiten mit Schlüsselpaaren, dem öffentliche Schlüssel (Public Key) und dem privaten Schlüssel (Private Key). Dieses Schlüsselpaar hängt über einen mathematischen Algorithmus eng zusammen. Daten, die mit dem öffentlichen Schlüssel verschlüsselt werden, können nur mit dem privaten Schlüssel entschlüsselt werden. Der private Schlüssel muss vom Besitzer des Schlüsselpaares geheim gehalten werden.

   

  Konkret: Will der Sender Daten verschlüsselt an den Empfänger senden, benötigt er den öffentlichen Schlüssel des Empfängers. Mit dem öffentlichen Schlüssel können die Daten verschlüsselt, aber nicht mehr entschlüsselt werden (Einwegfunktion). Nur noch der Besitzer des privaten Schlüssels, also der richtige Empfänger kann die Daten entschlüsseln.

• Asymmetrische Verschlüsselung bei der elektronischen Signatur:
  

  

  Bei der Signatur wird das asymmetrtische Verfahren umgekehrt: Der Sender verschlüsselt mit seinem privaten Schlüssel. Der Empfänger entschlüsselt mit dem öffentlichen Schlüssel des Senders.

  Der private Schlüssel gehört nur dem Anwender und muss von diesem geheimgehalten werden. Die Weitergabe des privaten Schlüssels zu verhindern ist eine Grundvoraussetzung für das Funktionieren des Systems. Gesichert vor Zugriffen Unberechtigter wird dieser Private Key entweder mit einem Passwort, einem PIN-Code (wie bei der Bankomat-Karte) oder durch Verwendung von eigens dafür vorgesehenen SmartCards mit Lesegeräten bzw. mithilfe von Smartphones.

  Der öffentliche Schlüssel ist für alle anderen Teilnehmer gedacht, die mit dem Anwender kommunizieren wollen bzw. sollen. Dieser Public Key wird öffentlich – etwa über das Internet – verbreitet und steht jedermann frei zugänglich zur Verfügung. Da aus dem öffentlichen Schlüssel nicht auf den privaten Schlüssel geschlossen werden kann, kann der öffentliche Schlüssel risikolos offengelegt werden.
  Mit diesem Verfahren kann die Identität eines Senders/Unterzeichners einwandfrei festgestellt werden.

Das Verfahren

Signieren und Signatur überprüfen

PrivatanwenderInnen, die gelegentlich ein Dokument signieren oder ein signiertes Dokument überprüfen wollen, können dies auf ► https://www.buergerkarte.at/pdf-signatur-karte.html tun. Dafür muss das Dokument hochgeladen werden, signiert und wieder runtergeladen werden, was etwas umständlich ist.

Firmen und Behörden verwenden dafür ergänzende Software, z. B. zu MS Office, Emailclients, Adobe Acrobat usw., was weniger umständlich ist.

Austellen einer Signatur

Viele Stellen (Banken, Versicherungen, Gemeindeämter usw.) sind berechtigt, eine Signatur auszustellen. Dabei muss man sich ausweisen, weil es wichtig ist, die Identität festzustellen. Die Handy-Signatur, die für PrivatanwenderInnen am praktischsten ist, ist an die Telefonnummer gebunden.

Peer-to-Peer-Netzwerke kommen vor allem im privaten Bereich zur Anwendung. Dabei werden Rechner gleichwertig (“peer” – Gleicher) miteinander vernetzt. Jeder Rechner kann seine Ressourcen (Drucker, Festplattenspeicher, CD-ROM/DVD/BD-Laufwerk, Modem) freigeben. Auf diese haben dann die anderen Zugriff. Der häufigste Grund, ein Peer-to-peer-Netzwerk einzurichten ist, den Zugang ins Internet für alle Geräte zu schaffen.

Einrichten eines Peer to Peer-Netzwerkes mit 2 PCs, einem Smartphone und einem Modem-Router mit Switch:

• der vom Internet-Provider gelieferte Router (mit Modem- und Switchfunktion) ist am das Stromnetz und an die Telefonleitung angeschlossen
  (ein Router ist notwendig, um von einem Netzwerk in ein anderes zu gelangen, hier vom Home-Netzwerk (Peer-to-peer-Netzwerk) ins Internet)
• die PCs und weiteren Geräte sind physikalisch mit Kabeln oder per WLAN miteinader verbunden (im Bild durch den Router mit integriertem 4-Port-Switch), die Treiber für die Netzwerkkarten sind installiert
• Zuweisen der Subnetzmaske und der IP-Adressen, des Standardgateways und der zwei DNS-Server:

Festlegen einer gemeinsamen Arbeitsgruppe:

• “MAYERS”

Das Zuweisen der Subnetzmaske und der IP-Adressen, des Standardgateways und der zwei DNS-Server kann manuell oder dynamisch geschehen.

• Manuell: Im Netzwerk jedes Gerätes müssen die Daten eingetragen werden (IP-Adresse, Subnetzmaske, Standardgateway, DNS-Server). Dabei ist zu achten, dass jede IP-Adresse nur einmal vergeben wird.
• Dynamisch: Alle Daten werden dynamisch (beim Start des Gerätes) von einem eigenen Server (DHCP-Server) zugewiesen. Im Heimnetzwerk ist dieser DHCP-Server im Modem-Router integriert.

Mit HTML werden Inhalte strukturiert. Mit CSS wird der strukturierte Inhalt formatiert.

CSS ist eine Stilsprache, die das Aussehen von HTML-Dokumenten definiert. CSS kann man z. B. zum festlegen von Schriftarten, Farben, Rändern, Linien, Höhen, Breiten, Hintergrundbildern, für fortgeschrittener Positionierung und viele andere Sachen benutzen. Kurz: Mit CSS wird der Inhalt einer Seite formatiert und das Layout (Anordnung der einzelnen Elemente) festgelegt.

Mit HTML werden die Inhalte bloß stukturiert (durch Überschriften, Aufzählungen etc.).

CSS war eine Revolution im Webdesign. Es brachte viele Vorteile:

• Kontrolle über das Layout vieler Webseiten aus einer einzigen Style-Sheet-Datei heraus; das Layout und die Formate werden in die Style-Sheet-Datei geschrieben; die einzelnen HTML-Seiten bekommen einen Verweis auf die Style-Sheet-Datei (<link rel=”stylesheet” type=”text/css” href=”style/style.css” />)
• präzisere Kontrolle über das Layout;
• verschiedene Layouts für verschiedene Medientypen (Bildschirmanzeige, Druck, Smartphone, IPad etc.);
• eine Vielzahl von fortgeschrittenen und anspruchsvolle Techniken.

Die Syntax von CSS ist immer die gleiche (hier: die Hintergrundfarbe wird auf rot eingestellt):

Selektor {Eigenschaft: Wert;}

body {
   background-color: #FF0000;}

• HTML bedeutet Hypertext Markup Language. Es handelt sich dabei um die im World Wide Web verwendete Seitenbeschreibungssprache.
• HTML-Dokumente sind reine Textfiles (plain-text) und können daher mit jedem beliebigen Texteditor (z. B. der Editor von Windows) erzeugt werden.
• Zum Betrachten der HTML-Seiten wird ein sogenannter Browser (=Client), wie z. B. MS Internetexplorer, Firefox, Maxthon benötigt.
• Die HTML-Seite muss aber zuvor entweder von einem WWW-Server bereitgestellt werden (z.B. http://www.reli4you.info) oder lokal auf einer Festplatte vorliegen (z. B. file:///E:/schule/ainf1213/baumgartner_neu/index.html).
• HTML-Dokumente bestehen aus einzelnen Elementen, die stets in spitzen Klammern (TAGs) <…> eingeschlossen sind und überwiegend paarweise auftreten. Die Wirkung eines Elementes erstreckt sich nur auf den Text oder die Grafik zwischen den Einzelelementen der paarweise auftretenden Elemente.
  <h1>Felix Baumgartner</h1>

Ein HTML-Dokument wird grundsätzlich mit dem Kommando <HTML> begonnen und mit dem Kommando </HTML> abgeschlossen.
Im Prinzip besteht ein HTML-Dokument aus zwei Teilen. Im Header (umschlossen von <HEADER> … </HEADER>) wird das Dokument selbst beschrieben und im Body (umschlossen von <BODY> … </BODY>) sein Inhalt.
Der HEADER enthält den Titel des Dokuments, der in der Titelleiste des Webbrowsers angezeigt wird, und einige Festlegungen, z. B. zur Zeichencodierung.

Seitenaufbau:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HLW Hollabrunn</title>
</head>

<body>
<h1>Die fünfjährige Höhere Lehranstalt </h1>
<p/>Die fünfjährige Lehranstalt für wirtschaftliche Berufe führt zur Matura. … </p>

<h1>Die dreijährige Fachschule</h1>
<p>Die dreijährige Form mündet in die Abschlussprüfung. … </p> 
</body>
</html>

Ergibt:

Auf der Site http://codebeautify.org/htmlviewer/ kannst Du experimentieren. Im linken Fenster trägst Du HTML-Code ein, klickst in der Mitte auf RUN und siehst rechts das Ergebnis.

HTML-Elemente zur Text-Strukturierung: Näheres siehe auf http://de.selfhtml.org/html/text/index.htm

• <h> (h1 – h6)
  Überschriften auf 6 Ebenen
  Jede Überschrift ist eine eigener Absatz, es braucht daher davor und danach kein eigener Absatz eingefügt werden.
• <p>
  Textabsatz
  Ein Absatz ist ein Textabschnitt, der einen Abstand davor und danach hat.
• <br>
  erzwungener Zeilenumbruch
  Ein bloßer Zeilenumbruch erzeugt keinen Abstand wie ein Absatz.
• <em>
  zeichnet einen Text als betont aus
• <strong>
  zeichnet einen Text als stark betont aus
• <b>
  zeichnet einen Text als fett aus
• <i>
  zeichnet einen Text als kursiv aus
• <u>
  zeichnet einen Text als unterstrichen aus
• <sup>
  zeichnet einen Text als hochgestllt aus
• <sub>
  zeichnet einen Text als tiefergestellt aus
• <div>
  damit wird ein Block (Box) erzeugt

Eine umfassende Liste aller HTML-Tags findest Du auf https://wiki.selfhtml.org/wiki/Referenz:HTML

Mit DIV-Containern (Boxen) kann das Layout (die Art und Weise, wie Text und Bilder und sonstige Elemente einer Seite angeordnet sind) einer Webseite exakt definiert werden. Das sogenannte Box-Modell erlaubt, Container (Boxen) zu definieren und auf der Seite zu positionieren. Eine Box kann mehrere Eigenschaften haben:

• Breite (width)
• Höhe (height)
• Hintergrundfarbe (background-color)
• Innenabstand (padding)
• Rahmen (border)
• Aussenabstand (margin)

Die Gesamtbreite bzw. die Gesamthöhe einer Box ergibt sich aus der Addition von:

• der Breite bzw. Höhe des Elementinhalts (width)
• des Innenabstands (padding)
• der Rahmenstärke (border-width) und
• des Aussenabstands (margin).

Definieren eines div-Containers (einer Box)

Die Definition einer Box erfolgt im Stylesheet. Die Syntax ist folgende:

div#name_der_box{
   Eigenschaft1: Wert;
   Eigenschaft2: Wert;
   ...
}

Beispiel:

div#inhalt {
   position:relative;
   width:980px; height:200px;
   background-color:#A0A0A4;
}

inhalt – Name der Box
position:relative – die Boxen ordnen sich so an, dass die zuerst eingefügt oben ist, die weiteren folgen darunter; zur genaueren Positionierung gibt es weitere Möglichkeiten (margin, float)
width – Breite der Box
height – Höhe der Box
background-color – die Hintergrundfarbe der Box

Einbinden einer Box in eine HTML-Seite

Eine Box muß eigens in die HTML-Seite eingebunden werden. Das Verbinden der HTML-Seite mit dem Stylesheet, in dem die Box definiert wurde, reicht nicht. Die Einbindung einer Box erfolgt so:

<div id="name_der_box">
   ...
</div>

Beispiel:

<div id="inhalt">
   ...
</div>

Zwischen das öffnende <div> und schließende DIV-Tag </div> kommt der Inhalt der Box (…).

In Dreamweaver können Boxen über das Menü Einfügen – Layoutobjekte – Divtag eingefügt werden.

[ws_table id=”11″]

Hier wird die Vorgehensweise des Programmierens einer kleinen Website beschrieben. Die Schritte sind:

1. Überlegung: Wer ist die Zielgruppe (Personengruppe, Alter, Bildung, Berufsgruppe) meiner Website?
   Danach richten sich: Inhalte inkl. der Bilder, Layout, Formate (z. B. Schriftgröße)
2. Die Website mit ihren einzelnen Seiten und Inhalten inkl. der Verlinkung planen:
   Inhalte suchen, zusammenstellen, schreiben, auf die einzelnen Seiten aufteilen, Verlinkung mit den Namen für die Hyperlinks planen.
3. Ev. Fotos in richtiger Größe und vorbereiten (laut Plan).
4. Den Stammordner mit ev. Unterordnern (z. B. für Fotos) anlegen.
5. Das Layout der Einzelseite und die Formatierungen planen (auf Papier).
6. In Dreamweaver die neue Site anlegen: Site / Neue Site (der Site einen Namen geben, Stammordner auswählen).
7. Das Stylesheet: Das Stylesheet anlegen (Datei / Neu / CSS) und gleich mit einem aussagekräftigen Namen speichern.
   Das Layout der Seite und die Formate im Stylesheet umsetzen:
   Boxen anlegen (div#boxname{…}
   Schriftformate, Hyperlinks programmieren:
   h1{font-family …}
8. Namenskonventionen (Regeln für Dateinamen im Web):
   ausschließlich Kleinschreibung
   keine Umlaute
   keine Sonderzeichen ausser Unterstrich (_)
9. Eine Musterseite (kann die index.html sein) anlegen:
   Datei / Neu / HTML und sofort speichern.
   Erst nach dem Speichern die Seite mit dem Stylesheet verbinden: Stylesheet anfügen (Symbol)
10. Im Stylesheet definierte Boxen (div-Elemente) in die Musterseite einbinden: Einfügen / Layoutobjekte / DivTag
    Darauf achten, dass die Boxen nacheinander sind und nicht ineinander (verschachtetlt). Der Mauszeiger darf niemals in einer Box stehen, wenn die nächste eingefügt wird!
    In der Codeansicht der Seite sieht das richtig so aus:
    <div id=”kopf”> Inhalt </div>
    <div id=”navigation”> Home … </div>
    <div id=”inhalt”>Bla bla bla </div>
11. Wenn mit der Musterseite alles in Ordnung ist, die Musterseite durch “Speichern unter” neuen Namen vervielfältigen (z. B. schulprofil.html; kontakt.html).
12. Texte und andere Inhalte (Bilder etc.) in die Seiten einfügen.
13. In die index.html die Namen für die Navigation hineinschreiben, die Verlinkung durchführen und die fertige Verlinkung in die weiteren Seiten kopieren.
14. Die Verlinkung testen.

https://www.google.at/search?q=website+planen&source=lnms&tbm=isch&sa=X&ei=W-IvU-HiAqS07Qa8lYCgBg&sqi=2&ved=0CAcQ_AUoAQ&biw=1473&bih=814

Eine Website besteht aus mehreren einzelnen Seiten, die miteinander verlinkt sind.  Im Zusammenhang damit hat sich folgende Begrifflichkeit eingebürgert: