XML-Ecke

Struktur in den Content!

Der kleine Kachelmacher: Gehversuche auf dem Windows 8 Desktop

Posted on 28. Oktober 2012 by Peter Zschunke

Auf dem Startbildschirm von Windows 8 lassen sich auch Webseiten im Kacheldesign ablegen. Dabei erscheint standardmäßig das Symbol des Internet-Explorers:

Windows 8

Mit drei Zeilen HTML-Code im Header der Webseite lässt sich das Kachelbild individuell anpassen:

<meta name="application-name" content="albiflora orchids"/>

<meta name="msapplication-TileColor" content="#FFFFCC"/>

<meta name="msapplication-TileImage"content="designimages/albifront.png"/>

In der ersten Zeile wird der Name der “Anwendung” bestimmt – das kann die Adresse der Webseite oder ein beliebiger anderer Text sein. In der zweiten Zeile wird die Hintergrundfarbe der Kachel festgelegt – hier ein klassisches Badezimmerkachel-Gelb. Die dritte Zeile gibt eine Grafik an, die auf der Kachel gezeigt werden soll – 144 mal 144 Pixel groß und im png-Format gespeichert. Wird die Webseite mit diesen Meta-Informationen im Header aufgerufen kann man sie über einen im Internet Explorer 10 unten rechts angezeigten Button mit einer Stecknadel anpinnen:

Windows 8

Hier ist bereits der festgelegte Applikationsname zu sehen. Sobald die Webseite “an Start angeheftet” ist, wird die neue Kachel auf dem Desktop platziert:

Windows 8

Mit ein bisschen XML kann die Kachel auch dynamische Informationen anzeigen, etwa wenn eine Webseite aktualisiert wird. Dazu wird eine Mini-XML-Datei angelegt:

<?xml version="1.0" encoding="utf-8" ?>

<badge value="5" />

Als Wert wird die Anzahl der neu hinzugekommenen Einträge etwa in einem Blog festgelegt. Stattdessen können bei diesen “Live Badge Notifications” auch Symbole, sogenannte Glyphen angezeigt werden. Eine Meta-Information “msapplication-badge” im Header enthält den Link zur XML-Datei sowie optional den Zeitraum, wie oft die Webseite überprüft werden soll. Zusätzlich ist noch etwas JavaScript erforderlich, um die Darstellung in der Kachel auszugeben.

Posted in Im Lauf der Zeit, Tutorials | Tagged | 2 Comments

Google und Bing wollen mehr Semantik im Web

Posted on 7. Juni 2011 by Peter Zschunke

Mehrere Suchmaschinen haben ein eigenes Vokabular entwickelt, um mit semantischen Ergänzungen der HTML-Struktur einer Webseite die Qualität der Internet-Suche zu verbessern. Die Initiatoren von schema.org – unter ihnen Google, Bing und Yahoo – fordern die Anbieter von Web-Inhalten auf, diese Ergänzungen in ihre Dokumente einzufügen, “um es den Nutzern einfacher zu machen, relevante Informationen im Web zu finden”. Bei den Festlegungen von schema.org handelt es sich um Mikrodaten: Diese maschinenlesbaren Tags innerhalb des HTML5-Standards verstehen sich als einfachere Alternative zu RDFa, der HTML-Umsetzung des (Resource Description Frameworks), aber auch zu Mikroformaten wie XFN.

Das Vokabular umfasst zunächst eine relativ schlichte Hierarchie von Datentypen und “Dingen” (Things) mit lediglich sieben Kategorien: CreativeWork, Event, Intangible, Organization, Person, Place und Product. Der gesamte Bereich der Natur kommt in diesem Vokabular zunächst nicht vor. Für Erweiterungen des Vokabulars nennt schema.org Empfehlungen und erklärt, dass sinnvolle Erweiterungen in das Kernvokabular von schema.org übernommen werden können.

Die Mikrodaten werden als Attribute zu den Tags div und span angegeben. Ähnlich wie im RDF-Konzept werden sie in Form eines URI (Uniform Resource Identifier) angegeben:

?View Code HTML
<div itemscope itemtype="http://schema.org/Event"><!-- URI für den Item-Typ "Event" -->
<div itemprop="name">Pressekonferenz</div>
<span itemprop="description">Vorstellung von schema.org</span>
  Termin:
<time itemprop="startDate" datetime="2011-06-07T19:30">  7. Juni 2011, 19.30 Uhr <!-- HTML5-Tag time -->
</div>

Google hat ein Online-Tool bereitgestellt, um die erweiterte Auszeichnung mit schema.org-Attributen zu testen. Das Vokabular hat bislang die Versionsbezeichnung 0.9 – eine erste finale Version soll im Laufe dieses Jahres kommen.

Posted in Im Lauf der Zeit | Tagged , , , , | 1 Comment

Microsoft öffnet sich dem Open-Source-Web

Posted on 18. Januar 2011 by Peter Zschunke

Noch vor wenigen Jahren wäre das eine kleine Revolution gewesen: Microsoft unterstützt in einer eigenen Software PHP, MySQL und eine Vielzahl von weiteren Open-Source-Projekten. Die jetzt in der Finalversion von Microsoft herausgebrachte WebMatrix ist das Eingeständnis des Software-Konzerns, dass das Web anderen Regeln folgt als denen der Windows-Welt. Allerdings findet das kaum noch Aufmerksamkeit.

Beim Web-Design konnte Microsoft nie an den Erfolg seiner Standard-Anwendungen fürs Office anknüpfen. Das 1995 erstmals herausgebrachte Microsoft FrontPage hatte nie den besten Ruf bei professionellen Web-Entwicklern, weil die Software zwar zu schnellen Ergebnissen führte, sich dabei aber kaum um die Standards des W3C kümmerte – obwohl Microsoft selbst Mitglied dieses Konsortiums für die Web-Standards ist. Ende 2006 wurde das mit Microsoft Expression Web besser – hier werden CSS und XML sinnvoll unterstützt. Bei Steuerelementen für Web-Anwendungen kam aber vor allem die Microsoft-Technik ASP.NET. Zum Einsatz, etwa um einen Kalender einzubauen. 2008 kam mit Expression Web 2.0 immerhin die Unterstützung für PHP hinzu. Die im Juni 2010 herausgebrachte Version 4 kostet etwa 90 Euro.

Microsoft WebMatrix - Web Gallery

Kostenlos ist jetzt die WebMatrix, die beim Start die Installation von WordPress, Drupal, Joomla oder weiteren freien Content-Management-Systemen anbietet. Entscheidet man sich etwa für Joomla, wird im nächsten Schritt zunächst die Installation einer MySQL-Datenbank angeboten, wahlweise auf dem eigenen Rechner oder auf einem Server. Nach der Wahl eines Root-Passworts für die Datenbank zeigt das Programm eine präzise Übersicht an, welche Dateipakete für das ausgewählte System nun heruntergeladen werden – für das Kernpaket von Joomla ist da bereits die neue Version 1.6 ausgewählt.

Microsoft WebMatrix Dateiauswahl

Alternativ kann man auch mit einem leeren HTML-Dokument beginnen – oder mit anderen Formaten wie XML, PHP, CSS und natürlich auch mit dem Microsoft-Format ASPX. Der dann startende Editor eignet sich durchaus für das schnelle Erstellen einer XML-Datei. Die Schaltfläche „Ausführen“ zeigt die erstellte Datei in einem der installierten Browser an.

Microsoft WebMatrix XML-Editor

Bei den Eigenschaften einer Website bietet die WebMatrix zwar die Integration des .NET-Frameworks von Microsoft an – man kann hier aber auch „keine“ wählen und stattdessen die PHP-Unterstützung anklicken. Um eine Datenbank hinzufügen, wird in diesem Modus – anders als bei der „Web Gallery“ mit den Open-Source-Systemen standardmäßig die Microsoft-Lösung SQL Server Compact eingerichtet, die bei der Installation der WebMatrix-Software gleich mit dabei ist – zusammen mit dem Webserver IIS Developer Express und dem Web-Framework ASP.NET.

Die Idee der WebMatrix ist es, Einsteigern eine einheitliche Oberfläche für das Einrichten, Testen und Bereitstellen einer Website zu bieten. Bei Projekten, die ganz auf Open-Source-Angeboten aufbauen, bieten sich da sicherlich auch andere Möglichkeiten wie LAMP oder XAMP an. Die WebMatrix ist aber interessant genug – als übersichtliche Entwicklungsumgebung für Web-Projekte wie als Lern-Plattform für Webtechniken von Microsoft.

Posted in Im Lauf der Zeit | Tagged , , , | Leave a comment

Pivot visualisiert Datenberge

Posted on 3. Mai 2010 by Peter Zschunke
Pivot

Eine neue Sichtweise auf Datenberge ermöglicht das Pivot-Projekt aus den Microsoft Live Labs. “Pivot” (frz.) heißt “Dreh- und Angelpunkt”. Bei Microsoft Pivot werden Reihen von digitalen Daten wie bei einem Rubik’s Cube nach allen Seiten gedreht und gewendet. Dazu werden die Datenobjekte – das können etwa digitale Fotos oder auch Webseiten sein – mit Metadaten angereichert, die dann als Filter- und Sortierkriterien dienen.

Microsoft hat dazu einen Spezialbrowser entwickelt, der die Datenberge in einem Fenster anzeigt und gruppiert. Mit einem Schieberegler wird die Größe der angezeigten Objekte, also etwa der Thumbnails von Fotos verändert. Ein Mausklick auf ein Filterkriterium ordnet die Bildchen neu – was nur bei einem schnellen Prozessor und einer leistungsstarken Grafikkarte so schnell geht wie in den Videos des Pivot-Projekts.

XML, der Flash-Konkurrent Silverlight und Techniken der 2006 von Microsoft übernommenen Firma Seadragon wie “Deep Zoom” sind die technischen Grundlagen von Pivot. Die XML-Strukturen werden sichtbar, wenn man selbst eine Pivot-Kollektion erstellt. Dafür hat Microsoft ein “Pivot Collection Tool” für Excel entwickelt. Die Erweiterung erscheint nach der Installation als eigener Tab im Ribbon der Excel-Oberfläche:

Pivot

Die Reihen dieser speziellen Excel-Tabelle nehmen die Datensätze der Kollektion auf, die Spalten die Filter- und Sortierkriterien. Die Tabelle dieser Kollektion lässt sich ganz normal im xlsx-Format speichern. Das Tool hat aber auch einen Befehl “Publish”, der die Daten in ein spezielles XML-Format bringt und eine Datei mit der Endung .cxml (Collection XML) bringt:
?View Code XML
<?xml version="1.0" encoding="utf-8"?>
<Collection xmlns:p="http://schemas.microsoft.com/livelabs/pivot/collection/2009" SchemaVersion="1.0" Name="my_pivot_collection" xmlns="http://schemas.microsoft.com/collection/metadata/2009">
  <FacetCategories>
    <FacetCategory Name="Gattung" Type="String" p:IsFilterVisible="true" p:IsWordWheelVisible="true" p:IsMetaDataVisible="true" />
    <FacetCategory Name="rating" Type="String" p:IsFilterVisible="true" p:IsWordWheelVisible="true" p:IsMetaDataVisible="true" />
  </FacetCategories>
  <Items ImgBase="my_pivot_collection_files\joy1waib.1fa.xml">
    <Item Id="0" Img="#0" Name="anthrophora_3">
      <Jahr>2006</Jahr>
      <Facets>
        <Facet Name="Gattung">
          <String Value="Orchis" />
        </Facet>
        <Facet Name="rating">
          <String Value="1" />
        </Facet>
      </Facets>
    </Item>
    <Item Id="1" Img="#1" Name="albida_1">
      <Jahr>2009</Jahr>
      <Facets>
        <Facet Name="Gattung">
          <String Value="Pseudorchis" />
        </Facet>
        <Facet Name="rating">
          <String Value="1" />
        </Facet>
      </Facets>
    </Item>

Dieser Ausschnitt definiert die ersten beiden Datensätze einer Kollektion, wobei “Gattung” und “rating” als “Facet” definiert werden – diese Facets sind dann die Sortierkriterien im Pivot-Browser. Die “ImgBase” verweist auf die Image-Base – die dort angeführte Datei enthält die Angaben zum Speicherort der Bilder. Das Collection XML Schema ist schlank und eingängig. Seinen Reiz entfaltet die Technik, wenn große Mengen von Daten auf diese Weise strukturiert werden.

Bislang sind Pivot-Browser und das Excel-Tool nur für Windows verfügbar. Für Sommer hat Microsoft aber die Integration in das Silverlight-Plugin angekündigt. Dann lassen sich die Pivot-Sichtweisen auch auf dem Mac oder unter Linux (mit Moonlight) darstellen. Kritiker werden einwenden, dass Pivot der Versuch von Microsoft sei, seinem Silverlight eine weitere Verbreitung zu sichern. Wahrscheinlich soll Pivot auch der Microsoft-Suchmaschine Bing auf die Sprünge helfen. Ungeachtet davon ist Pivot aber ein durchaus interessantes Projekt für die Visualisierung von Datenbergen.

Posted in Im Lauf der Zeit | Tagged | Leave a comment