Arbeitsinfos • Zusatzinfos


Bolzen und Schrauben


Die Seite Zusatzinfos habe ich einfach meiner bereits eingerichteten Webseite zugeordnet, damit ich die bereits vorhandenen Elemente einfach durch relative Links nutzen kann. Das spart Arbeit, denn ich brauchte mir daher um Struktur und Formatierung der Seite keine weiteren Gedanken mehr zu machen.

Angedocktes


Von hier aus kann ich zukünftig auch auf weitere Projekte bzw. Projektseiten verweisen, ohne dafür die komplette Menüstruktur des Seitensystems überarbeiten zu müssen, welches noch nicht dynamisch ist. Gerade weil dieses Seitensystem auch eine Art Webablage ist, die man auch mit älteren Browsern noch nutzen können soll, habe ich in diesem hier vorgestellten Seitensystem JavaScript sparsam eingesetzt und bei nicht aktiviertem JavaScript meist alternative Informationen oder Meldungen codiert. Allerdings habe ich mir genau das für diese Seite erspart ...

Altes - Frühere Arbeiten aus heutiger Sicht


Ich bin kein Webdesigner, so dass ich in Sachen Design also nicht unbedingt den Anspruch erhebe, schöne Webseiten zu erstellen. Aber auch die Garantie für uneingeschränkte und barrierefreie Funktionen kann ich nur bedingt übernehmen, denn nicht wenige liefern browsertypische Ergebnisse, die darüber hinaus nicht selten auch von den Browserversionen abhängen - und natürlich auch vom Betriebssystem, der verwendeten Dokument-Deklaration, von weiteren Standards und Quasi-Standards.

Dennoch ist es mir auch in frühen Arbeiten immer gelungen, valide Webseiten und Applikationen zu erstellen, die aber heute für den Einsatz im Internet nicht wirklich mehr taugen, denn für mobile Endgeräte wie Smartphones oder Tablets waren diese Seiten ja nie gedacht. Und auch die immer größer gewordenen Bildschirme wurden zum Problem, bevor es dann neue Browser gab, mit denen man die Seiten zoomen kann. Aber nicht jeder Benutzer kennt oder nutzt diese Funktion, so dass moderne Webseiten dies in der Codierung oft direkt berücksichtigen. Bevor man also heute die erste Information, eine Botschaft oder eine Nachricht absetzen kann, hat man schon jede Menge Quellcode geschrieben ...

Meine mehrsprachige private Homepage, die ich lange Zeit noch über den Navigator auf der Hauptseite meiner Domain anbot, geht auf eine Technik der Seitenabbildung zurück, die ich 2001 entworfen habe: die Verschachtelung mit Hilfe von iFrames. Mit diesen Fenstern, welche man auf einer Webseite bequem einbetten kann, war es möglich, die Inhalte solcher Fenster auf der Hauptseite zu steuern, so dass der Eindruck entstand, als sei es eine einzige dynamische Seite. Das folgende Beispiel stammt aus einer früheren Index-Seite:

  <a href="8000.htm#Auswahl1" target="Cont1">Link 1</a>
  <a href="8000.htm#Auswahl2" target="Cont1">Link 2</a>
  <a href="8000.htm#Auswahl3" target="Cont1">Link 3</a>
  

Die obigen Aufrufe mit Sprungmarken sind ja in der Tat nichts besonderes, bis auf die Tatsache eben, dass die Datei 8000.htm nur eine Sammeldatei für die verwendeten iFrames gewesen ist, die nur passiv aufgerufen wurde:

  <a name="Auswahl1">
    <iframe src="../imp/2001.htm?4" name="Cont1" width="100%" height="460" ... </iframe>
  </a>
  

iFrames sind also schon früher recht nützlich gewesen. Und auch heute werden iFrames noch auf vielfältige Weise eingesetzt, so z. B. auch von der FancyBox, einem Sub-Framework, das auf jQuery beruht (welches wiederum ein JavaScript- und CSS-Framework ist) und mit dem sich Bilder oder Seiteninhalte wie Mediadaten zoomen und in einem Pseudofenster darstellen lassen.

Im folgenden Beispiel habe ich eine Einblende-Funktion mit einem im Bereich abgelegten iFrame-Aufruf für die FancyBox-Überblendung mit Pseudofenster kombiniert. Klicken Sie im sich öffnenden Anzeigebereich einfach auf eines der kleinen Bildchen ...:

Bilder-Testfeld aufklappen

Wie Sie sicher festgestellt haben, gibt der iFrame die Größe für die automatische Skalierung mit FancyBox vor. Werden die Aufrufe nicht im iFrame, sondern von der eigentlichen Hauptseite aus aufgerufen, betrifft die Überblendung den vollen Anzeigebereich des Browsers. Auf dieselbe Weise lassen sich aber auch Informationen einblenden - quasi ein iFrame in einem iFrame; klicken Sie im Anzeigebereich auf das Bildchen, damit Sie die ehemalige CSS-Datei mit der FancyBox angezeigt bekommen:

Text-Testfeld aufklappen

Da ich für die Codierung von Webseiten auch heute noch lieber mit dem ganz normalen Texteditor arbeite und keine Webeditoren verwende, sind meine Seiten im Quellcode meist weniger durch Tab-Einrückungen zerrissen, sind trotzdem gut lesbar ... und man kann Text oder Code auch gut herauskopieren, wenngleich viele Entwickler immer wieder gerne versuchen, dies mit den diversesten Gimmicks zu verhindern. In einem solchen Fall schalten Sie dann einfach die Entwickeransicht Ihres Browsers aktiv oder rufen Sie die Quellcode-Anzeige auf - und meist können Sie die auf der Seite verwendeten Skript- und Formatierungsdateien damit öffnen und dann auch lokal speichern. ;-)

Neueres - Extras und Experimente


Die ursprünglich eingefügte Experimente-Seite habe ich wieder entfernt und die wenigen Elemente statt dessen direkt unter dieser Überschrift abgelegt. Allzu viel ist es zwar nicht, aber vielleicht finden Sie ja die eine oder andere interessante Ausarbeitung auf dieser Seite ...

Saarländisch-Wörterbuch-WebApp

SWApp als Smartphone-Simulation - β1-Version



Browserfenster (362 x 698 Pixel) öffnen

Alter Taschenrechner im neuen Gehäuse

Taschenrechner als Smartphone-Simulation - α-Version



Browserfenster (362 x 698 Pixel) öffnen

GenuFlor - Pflanzenbestimmung

GenuFlor als Smartphone-Simulation - Prototyp



Browserfenster (362 x 698 Pixel) öffnen

Auf dem Weg in die Zukunft - mit HTML5

Auch wenn HTML5 vom W3C-Konsortium noch nicht offiziell als Standard verabschiedet wurde, beherrschen heute nahezu alle Browser (ob nun auf dem PC, dem Tablet oder im Smartphone) diese Notation bzw. Doctype-Deklaration, welche sehr dynamische Elemente mitbringt, so dass zusammen mit CSS3 lebendige Webseiten erstellt werden können. Da ich aber auch heute noch kein großer Freund von fertigen Lösungen bin, die vielleicht auch von hunderttausenden anderer User 1:1 übernommen wurden, habe ich natürlich wieder eine individuelle Seite kreiert, die sich im Wesentlichen an den schon hier verwendeten Stilelementen orientiert. Die Seite ist zwar HTML5-konform, aber dennoch nicht für alle (mobilen) Geräte optimiert.

Die (neue) HTML5-Webseite - vielleicht nur ein Test ...



im aktuellen Browserfenster öffnen

Diese Seite sollte ursprünglich direkt von meiner Hauptseite www.Lencioni.de aus aufgerufen werden. Doch wegen der nicht umfänglichen Gerätekompatibilität erschien es mir sinvoller, die Seite einfach im Testbereich zu belassen.

Mit diesen Kurzvorstellungen werde ich die Seite erst einmal als abgeschlossen ansehen. Aber vielleicht schauen Sie ja dennoch von Zeit zu Zeit mal wieder hier vorbei ...

zum Seitenanfang