Hochschule für angewandte Wissenschaften Fachhochschule Deggendorf. Fakultät Elektro- und Medientechnik. Entwicklung eines jquery Plugins

Größe: px
Ab Seite anzeigen:

Download "Hochschule für angewandte Wissenschaften Fachhochschule Deggendorf. Fakultät Elektro- und Medientechnik. Entwicklung eines jquery Plugins"

Transkript

1 Hochschule für angewandte Wissenschaften Fachhochschule Deggendorf Fakultät Elektro- und Medientechnik Entwicklung eines jquery Plugins Development of a jquery Plugin for creating interactive infographics Bachelorarbeit zur Erlangung des akademischen Grades: Bachelor of Engineering an der Hochschule Deggendorf vorgelegt von: Fulda, Johanna Prüfer: Prof. Dr.-Ing. Udo Garmann am: 30. Mai 2012

2 2

3 Inhalt Einleitung Infografiken in der Zeitung Interaktive Infografiken Daten als Basis für Infografiken Datenjournalismus Daten sollen zugänglich werden Konzept: Open-Data Beispiele Open-Data Plattformen 15 Offener Haushalt 15 Städte und ihre Daten 16 The Truth about Crime 17 Farmsubsidy.org 18 Entwicklungszusammenarbeit und Transparenz HTML5 als Alternative zu Flash Benutzeroberflächen zum Erstellen von HTML5-Animationen Flash-Umwandlungs-Tools HTML5-Benutzeroberflächen 22 Adobe Edge 22 Sencha Animator 24 Tumult Hype jquery Ein JavaScript-Framework jquery als Bindeglied zwischen Programmierer und Designer Im Vergleich mit anderen JavaScript-Frameworks jquery für interaktive Infografiken Grundlagen für die Verwendung von jquery Beachtenswertes bei der Entwicklung für Desktop- und mobile Browser Anwendungsgebiet Anwendung 33 4

4 3.3 Aufbau des DOM, Styles und allgemeine Variablen Z-Index Plugin-Elemente als Unterelement Style Sheets Allgemeine Variablen zur Browser-Abfrage Vereinen von Touch- und Klick-Events Funktionen defineformat - Festlegen des Formats 39 Übersicht 39 Umsetzung 39 a) Größe des Dokuments festlegen 39 b) Orientationlock und Ausrichtung erkennen 40 c) Darstellung auf anderen Devices 41 d) Bild ohne Bilddatei 42 Parameter 43 Beispiel definelegend - Befüllen der Legende 44 Übersicht 44 Umsetzung 44 Parameter 45 Beispiel poigenerator - Setzen von Points of Information 46 Übersicht 46 Umsetzung 46 a) XML-Datei 46 b) Tooltips 47 c) Pulsieren 48 Parameter 49 Beispiel menuegenerator - Ein Menü generieren 50 Übersicht 50 Umsetzung 51 a) Menübuttons erzeugen 51 b) Klassen der Buttons 51 c) Farbverlauf 52 d) Div-Container der Buttons 52 Parameter 54 Beispiel 55 5

5 3.4.5 slidergenerator einen Slider generieren 56 Übersicht 56 Umsetzung 56 a) Sliderstationen 56 b) Fallback für IE 56 c) Sliderknopf bewegen 57 d) Feststellen der Klick- bzw. Touchposition 57 Parameter 58 Beispiel checkbox Checkboxen erstellen 59 Übersicht 59 Parameter 59 Beispiel startscreen Einen Einleitungstext hinzufügen 60 Übersicht 60 Parameter 61 Beispiel XML-Befüllungstool Resümee 65 Quellen 68 Externe Bildquellen 70 6

6 7

7 8

8 Einleitung Mit der Verbreitung der Tablet-PCs entstand eine völlig neue Publikations-Möglichkeit für Verlagshäuser. Tageszeitungen, Zeitschriften und Magazine entwickelten Applikationen, mit denen man die Möglichkeit hat, alle Ausgaben digital auf einem Tablet-PC zu lesen. Das spart Papier und bietet ein handlicheres Format als z.b. die große Tageszeitung. Diese Art der Publikation bringt neue Aufgaben in der Produktion mit sich. Zwar werden meist die Inhalte aus dem Print-Produkt eins zu eins übernommen, doch zusätzliche Angebote sollen die digitale App interessanter machen und dem Leser einen Anreiz geben, für den digitalen Inhalt den gleichen Preis zu zahlen wie für die Print-Version. Die zusätzlichen Angebote sind meist multimedial: Videos, Audio oder Inhalte, bei denen dem Leser Interaktionsmöglichkeiten geboten werden, beispielsweise in Form von interaktiven Infografiken. In der folgenden Arbeit geht es um die Produktion dieser interaktiven Grafiken im allgemeinen und speziell um die der digitalen Ausgabe der Süddeutschen Zeitung. Schon bevor es die digitale Ausgabe der SZ gab, wurden interaktive Grafiken für das Online-Portal der Zeitung produziert. Da sie viel Zeit für Vorbereitung und Umsetzung in Anspruch nahmen, wurden sie hauptsächlich für große Ereignisse erstellt, z.b. für Wahlen oder Sportmeisterschaften. Für das tagesaktuelle Geschehen waren sie weniger geeignet. Doch seit dem Release der digitalen Ausgabe für das ipad (eine App für Android-Geräte gibt es bisher noch nicht) wurde die Anzahl der Produktionen deutlich erhöht. Täglich wird mindestens eine Infografik aus der Print- Version für das ipad optimiert und mit interaktiven Elementen erweitert. Um jeden Tag eine interaktive Grafik zu produzieren, benötigte man ein System, mit dessen Hilfe immer wiederkehrende Elemente schnell und unkompliziert eingesetzt werden können. Da nicht immer ein Spezialist für die interaktiven Grafiken zur Verfügung steht, muss das System leicht verständlich und einfach anwendbar sein. Dies wurde in Form eines Plugins erstellt, das auf der JavaScript-Bibliothek jquery basiert und die am häufigsten auftretenden Fälle abdeckt. Welche Möglichkeiten es bietet und wie genau der Einsatz funktioniert wird im dritten Teil der Arbeit erläutert. Zunächst wird im ersten Teil ein Überblick über den Einsatz von Informationsgrafiken gegeben und insbesondere auf den Datenjournalismus eingegangen, der Infografiken auf eine spezielle Art nutzt. Der zweite Teil beinhaltet die technische Umsetzbarkeit der interaktiven Grafiken. Zunächst wird der Begriff HTML5 definiert und Benutzeroberflächen dafür genauer betrachtet. Anschließend wird die JavaScript Bibliothek jquery vorgestellt. 9

9 10

10 Informationsgrafiken begegnen uns in vielen Situationen. Sei es als U-Bahn-Übersicht, als Notausgangs-Plan, als erklärendes Bild an der Wand einer Arztpraxis oder als Bedienungsanleitung. Bilder sagen, laut Sprichwort, mehr als viele Worte. Blickbewegungsstudien ergaben, dass die meisten Leser eines Textes zunächst die dazugehörigen Bilder überfliegen.[1] Sie können schnell erfasst werden und das Interesse für den Text wecken. Diese Bildelemente sind in Zeitungen Fotos oder Grafiken, die Zusatzinformation oder eine Zusammenfassung des Textes bieten. In fast jedem Zeitungsverlag gibt es daher eine Grafikabteilung. Dorthin leiten Redakteure meist ihre Anfragen, wenn sie für ihren Artikel ein grafisches Element benötigen. Häufig handelt es sich dabei um Diagramme (z.b. in Form von Balken, Torten oder Kurven), um Landkarten (auf denen gezeigt wird, wo sich etwas abspielt) oder um Zeitleisten (auf denen wichtige Stationen zu einem Thema zusammengefasst werden). Durch sie soll leicht verständlich, optisch ansprechend und vor allem übersichtlich ein komplexer Zusammenhang dargestellt werden. Erstellt werden die Grafiken meist in Vektorprogrammen wie z.b. Adobe Illustrator. Dort gibt es die Möglichkeit, automatisch aus einer Tabelle Grafen zu erstellen. Diese wandeln Zahlen z.b. in die Höhe eines Balkens oder in das Volumen eines Kreises um. Ein in Illustrator erstelltes Beispiel zeigt Abb. 1. Abb. 1: Im Vektorprogramm Illustrator kann man aus einer Tabelle mit Zahlen z.b. Balken-, Kuvenund Torten-Diagramme erstellen lassen. ten und Nachrichtenagenturen oder von freien Grafikern, Designer und Gestaltern. ausgezeichnet werden ging der 1. Platz des dpa-infografik Award z.b. an Ole 11

11 stehen der Grünen veröffentlicht wurde. (Siehe Abb. 2) Inzwischen gibt es diese Auszeichnungen auch für interaktive Infografiken aus den Online- oder Digital-Ausgaben. International sticht dabei besonders häufig die New York Times heraus, die häufig sehr aufwändig recherchiert und umfangreiche in- Verlauf der Ölkatastrophe im Golf von Mexiko im Jahr Zu jedem einzelnen Tag zwischen dem Sinken des Öltankers (22.April) und zwei Wochen nach dem Verschließen des Lecks (am 2. August) indet man detaillierte Informationen, Quelle: New York Times 12

12 Das Verhalten im Betrachten von Bildern hat sich verändert, durch die Masse an Infor mationen, die wir täglich, vor allem über das Internet, konsumieren. Wir hantieren mit vielen nebeneinander geöffneten Fenstern, scrollbarem Text, Pop-ups. Videos und Musik können wir sehen und hören wann immer wir wollen. Das Tempo hat sich beschleunigt.[2] Bilder reduzieren die Rezeptionszeit. Unzählige visuelle Einflüsse überfordern die Aufnahmekapazität, weshalb Bilder immer origineller, schlichter und auffälliger sein müssen, um aus der Masse herauszustechen. Daher ist das Wissen um die Informationsverarbeitung für Designer von großer Bedeutung. In Zeitungen ist der Platz für Grafiken begrenzt. Je nach Thema und Redakteur werden einige Spalten oder dafür veranschlagt - ganz selten, zu besonderen Anlässen kann sich eine Grafik über zwei Zeitungseiten erstrecken. Für digitale Grafiken gilt diese Platzbeschränkung weniger. Hier hat man zwar immer das gleiche Format, kann sich aber durch Interaktion Informationen hinzu- oder wegschalten. Bisher fand man interaktive Grafiken vor allem auf den Internetportalen von Zeitungen und Zeitschriften. Inzwischen gibt es sie, durch die Verbreitung der Tablet-Computer, auch in den damit einhergehenden Digital-Ausgaben der Zeitungen und Zeitschriften. Einige Verlage beschränkten sich zwar zunächst darauf, eine App für das ipad von Apple anzubieten und den Android-Markt zu vernachlässigen. Da das Zeitunglesen auf dem Tablet aber gerade erst beginnt, wird wohl früher oder später auch noch eine Android-Alternative angeboten werden. Die Zeitungs-Apps bieten meist den kompletten Inhalt der Print-Versionen und stellen noch zusätzliche Multimedia-Angebote zur Verfügung. Dies sind zum einen Audio- oder Video-Dateien, zum anderen Bildergalerien oder Grafiken, in denen man interagieren kann. In diesen Versionen der Infografiken hat man die Möglichkeit mehr Information unterzubringen. Zahlen und Fakten, die in der Zeitung aus Platzgründen weggelassen werden, kann eine interaktive Grafik zusätzlich zur Verfügung stellen ohne die Gefahr überladen zu wirken. Zum Beispiel können auf einem Grafen, der den Verlauf eines Aktienkurses zeigt, Wende-/Maximal-/Minimalpunkte etc. markiert werden. Der Nutzer kann diese anwählen und erfährt was zu diesem Zeitpunkt genau geschah bzw. was dazu führte. Auch Fotos können dabei eingebunden werden, denn der Umfang einer interaktiven Grafik ist prinzipiell (bis auf die Tatsache, dass viele Fotos viele Kilobytes haben und das zu längeren Ladezeiten führt) unbeschränkt. Kleine Animationen, wie z.b. die Änderung der Größe von Balken, die animierte Neusortierung einer Liste oder die Umfärbung einer Fläche, geben den Grafiken einen besonderen optischen Reiz und können auch von Tablet-Prozessoren leicht umgesetzt werden. Zu große und aufwändige Animationen sorgen aber leider oft für Darstellungsfehler, Ruckeln oder im schlechtesten Fall für Abstürze der App (oder des Browsers). 13

13 1.3.1 Datenjournalismus denden Trend im Journalismus. Zwar gibt es schon seit den 1950-er Jahren die Möglichkeit, große Mengen an Informationen mit Rechenmaschinen zu durchsuchen, doch standen damals Technik und Information bei weitem nicht allen Interessenten zur Verfügung. Dies ist heute anders. Wenn man den klassischen Journalismus durch Recherchieren und Belegen von Fakten anhand von Daten kennzeichnen möchte, so ist Datenjournalismus die Umkehrung davon. Denn dabei werden Massen von Daten durchforstet, um am Ende eine Geschichte erzählen zu können. Durch das digitale Zeitalter gibt es unendlich viele Datenanhäufungen, die ohne großen Aufwand öffentlich zugänglich gemacht werden könnten. Doch noch ist es in Deutschland nicht soweit, dass diese Daten jederzeit frei verfügbar sind Daten sollen zugänglich werden Konzept: Open-Data resse sind, frei zugänglich sein müssen. Davon ausgeschlossen sind natürlich personenbezogene oder unter einer Geheimhaltungsstufe stehende Daten (ob diese Kennzeichnungen in jedem Fall gerechtfertigt sind, bleibt hier außen vor). Im Prinzip gilt: mit öffentlichen Geldern finanzierte Datensätze sollten der Allgemeinheit zur Verfügung stehen. Seit dem ist auf Bundesebene das Informationsfreiheitsgesetz in Kraft getreten. Dieses besagt, jeder Bürger hat das Recht, abgeschlossene amtliche Informationen von Bundesbehörden (nach Antragstellung und Bezahlen eines bestimmten Betrages) einsehen zu können ohne dafür eine Begründung abgeben zu müssen. Dies können sowohl Akten aus einem Kellerarchiv sein, als auch Pläne, Videoaufzeichnung oder digital hinterlegte Dokumente.[3][4] Auf Landesebene gilt dieses Gesetz allerdings noch nicht flächendeckend. Zwar haben die meisten Bundesländer inzwischen auch ein Informationsfreiheitsgesetz, so dass die Möglichkeit besteht, Daten aus Länder- und Kommunalbehörden einzusehen. In Bayern, Baden-Württemberg, Hessen, Niedersachsen und Sachsen gibt es ein solches Gesetz bisher allerdings nicht. (Stand März 2012) [5] Abgesehen von diesen fünf Ländern, wurden die Weichen für das OpenGovernment- Vorhaben gestellt. Als nächsten Schritt fordert die Open-Data-Bewegung, dass die Daten maschinenlesbar zur Verfügung stehen. Das heißt zum einen digital und zum anderen in einem nicht-proprietären Format, also in einem Format, das offen und nicht an eine firmeninterne Spezifikation gebunden ist. Zudem sollen alle Daten für jeden Internetnutzer frei zugänglich sein. 14

14 Um diese Forderungen durchzusetzen, gibt es in Deutschland seit ca. einem Jahr das OpenData Network (das Netzwerk zur Förderung von Open Government, Open ten aus Politik und Verwaltung, um eine stärkere Beteiligung der Bürgerinnen und Bürger, um die Bekämpfung von Korruption und darum, dass Politik und Verwaltung [6] Die Demokratie soll gestärkt und das Vertrauen der Bürger in die Politik zurückgewonnen werden. Denn dadurch, dass prinzipiell jedem Bürger alle Informationen zur Verfügung stünden, könnten diese sich durch Zahlen und Fakten selbst über bestimmte Themen informieren und wären nicht mehr abhängig von den Interpretationen der Politiker oder Journalisten. Zwar wären es wohl hauptsächlich die Journalisten, die sich mit - so vom Leser überprüft bzw. nachvollzogen und selbst interpretiert werden. Ein Beispiel sei der Bundeshaushalt des Bundesministeriums für Finanzen. Zwar ist es für Deutschland vergleichsweise fortschrittlich, dass auf der betreffenden Internetseite sehr viele detaillierte Haushalts- und Finanzpläne in Form von PDFs zur freien Verfügung stehen, diese sind jedoch - nach der Definition der Maschinenlesbarkeit - untauglich. Maschinenlesbar bedeutet in diesem Zusammenhang, dass Daten in einer eindeutig strukturierten, tabellarischen Form vorliegen, so dass man sie unkompliziert weiterverarbeiten kann, z.b. in Excel. Oder sie sollten in semistrukturierter Form, also nicht in Tabellenform, sondern per Auszeichnung gekennzeichnet sein (z.b. XML oder JSON).[7] Liegen die Daten im vorgesehenen Format vor, kann man sie mit Hilfe von Statistikwerkzeugen verarbeiten und auswerten oder man kann z.b. mit einer Programmierschnittstelle (Application Programming Interface, kurz: API) regelmäßige Aktualisierungen der Daten auslesen und sie direkt in eine Software einfließen lassen. Dadurch können aus bestimmten Zahlen Diagramme erstellt oder Maximal- und Minimalwerte ermittelt werden. Als maschinenlesbare Formate werden meist Dateien im Format XLS, CSV, XML, RSS oder JSON genannt.[8] Beispiele Open-Data Plattformen Offener Haushalt den Steuergeldern in Deutschland geschieht. Dazu haben die Macher alle frei verfügbaren PDFs des Bundeshaushalts in ein maschinenlesbares Format übertragen und anschaulich und verständlich visualisiert (siehe Abb. 4). Es wird darauf hinge- 15

15 wiesen, dass alle Quellen offen liegen und jeder dazu eingeladen ist, mitzumachen oder die Daten zu überprüfen, denn die Übertragung der Massen an Zahlen und Beschreibungen ist ein durchaus fehleranfälliger Prozess. Abb.4: OffenerHaushalt.de mit allen Bestandteilen des Bundeshaushaltes 2011 (oben) und die Auflistung der Posten am Beispiel des Bundesministeriums für Ernährung, Landwirtschaft und Verbraucherschutz (unten). Jeder Punkt enthält noch weitere Unterteilungen. Städte und ihre Daten Einige Städte haben sich auch schon an die offenen Daten heran gewagt. Ein Vorzeigebeispiel ist Frankfurt. Auf der Seite die auch zur OKF gehört, können alle Bürger detailliert einsehen, wofür die Stadt wie viel Geld ausgibt. Die Daten stehen alle im CSV-Format zum Download zur Verfügung. Nach dem bri- für die Politik Handlungsbedarf besteht. Mit Hilfe von OpenStreetMap werden alle Einträge auf einer Karte platziert und entsprechend ihrer Kategorie eingefärbt (siehe Abb. 5). Andere Nutzer können dann die Beiträge bewerten und kommentieren. Frankfurter Politiker sollen sich inzwischen auch schon am Geschehen beteiligen. Wie viele Initiativen aufgrund der Website tatsächlich umgesetzt wurden, ist schwer zu beurteilen. Es ist aber sicherlich eine gute Methode, Bürger zu motivieren, sich am Stadtgeschehen zu beteiligen.[9][10] 16

16 Abb. 5: Aktuelle Geschehnissen auf der Karte von frankfurt-gestalten.de Ähnliche Ideen hatten u.a.: daten.berlin.de und - entstanden durch das Projekt MOGDy - Munich Open Government Day The Truth about Crime Abb. 6: Die Oxford Crime Map zeigt ein erhöhtes Gewaltaufkommen in der Nacht von Samstag auf Sonntag In Großbritannien, der Heimat von Sherlock Holmes und Miss Marple, wo der Open Data Gedanke schon weiter verbreitet ist, wurde im Auftrag des BBC im Zeitraum von November 2007 bis November 2008 eine Karte erstellt, mit der Kriminalitätsmuster aufgedeckt werden können am Beispiel von der, als besonders durchschnittlich betrachteten Stadt Oxford, an welchen Wochentagen zu welcher Tageszeit besonders viel Kriminalität stattfindet. Die Einfärbungen auf der Karte (wie in Abb. 6 zu sehen) ändern sich mit der Fortbewegung auf der Zeitleiste, entsprechend den Vorkommnissen. Es lässt sich zum Beispiel erkennen, dass während normaler Arbeitstage nur wenige Vorfälle zu verzeichnen sind, außer am Nachmittag, wenn die Schule zu Ende ist und es zu Rangeleien zwischen Schülern kommt. Die Abend- und Nachtstunden des Wochenendes bringen, nach Schließung der Bars ein erhöhtes Aufkommen von Gewalt in der Nähe von Pubs.[11] 17

17 Farmsubsidy.org Ein weiteres Beispiel, bei dem etwas mehr Unerwartetes zum Vorschein kam, ist die welche landwirtschaftlichen Betriebe subventioniert. Noch stehen nicht alle Daten von den Betrieben der verschiedenen EU-Länder zur Verfügung, trotz eines Gesetzes das im April 2011, nach einigem hin und her wegen möglicher Urheberrechtsverletzungen, erlassen wurde[12]. Es lässt sich aber unschwer erkennen, dass es nicht nur die kleinen, auf Unterstützung angewiesenen Betriebe sind, die mit großen Subventionspaketen beliefert werden. Für die Verwendung der Gelder aus den Fonds innerhalb Deutschlands findet man auf einer Seite der Bundesanstalt für Landwirtschaft und Ernährung (www.agrarfischerei-zahlungen.de/suche) die Empfänger der Agrarfonds in den Jahren 2009 und 2010 mit Namen, Postleitzahl, Gemeinde und dem genauen Betrag. Im Zuge der sogenannten Transparenzinitiative verfolgte die Europäische Union das Ziel, die Verwendung der Agrarfonds zugänglicher und transparenter zu machen. Es soll- - [13] deutlich gemacht werden. Diese Veröffentlichung war allerdings sehr umstritten, da auch kleine Betriebe namentlich genannt wurden. Der Bayerische Agrarminister Helmut Brunner (CSU) verweigerte die Veröffentlichung der Zahlungen, da er den Datenschutz der Landwirte gefährdet sah.[14] Entwicklungszusammenarbeit und Transparenz ten fördert, stellt seit über 30 Jahren internationale Projektionen der Bevölkerung über Wirtschaft, Soziales und Umweltschutz auf. Dadurch können sie feststellen, wie effektiv Maßnahmen z.b. zur Armutsbekämpfung sind und sie dann entsprechend auf andere Länder übertragen.[15] Seit dem 22. April 2010 findet man die erhobenen Daten auf öffentlich und frei verfügbar. Unterteilt in über tausend Indikatoren, stehen alle Daten in maschinenlesbarem Format zur Verfügung. Sie gehen teilweise zurück bis Zudem Abb. 7: Visualisierung der Daten zur Pro-Kopf-CO2-Emission kann man sie sich auf einer Weltkarte, durch entsprechende Einfärbung oder in Form eines Graphen anzeigen lassen (siehe Abb. 7). Die Plattform soll dazu dienen, globale Themen zu veranschaulichen. Dadurch, dass 18

18 jeder sich beteiligen kann, sollen neue innovative Ideen entstehen.[16] Außerdem soll sie Skeptikern der Entwicklungshilfe aufzeigen, was mit den Geldern für Hilfsprojekte geschieht. auch die Weltbank angehört). Die IATI entwickelte einen Standard entsprechend Abb. 8: IATI-Standard zur Veröffentlichung der Daten zur Entwicklungshilfe Abb. 8, wie Dokumente zur Entwicklungshilfe in Zukunft ver öffentlicht werden sollen. So könnten die Daten direkt in entsprechende Visualisierungs - Software einlaufen und sofort ausgewertet werden. Dadurch steigt die Transparenz und somit die Glaubwürdigkeit der Organisationen. Inzwischen halten sich immer mehr Teilnehmer an die IATI-Norm.[17] 19

19 Im November 2011 verkündete Adobe, dass die Weiterentwicklung der sehr verbreite- [18]. Noch ist Flash das meist genutzte Tool zur Umsetzung von Animationen, Games und Videostreaming Abb. 9: Dieser Ausschnitt einer Infografik von Microsoft Tag (März 2011) prophezeit, dass in Amerika schon 2014 das Internet primär auf mobilen Geräten genutzt werden wird. und 99% aller Desktop-Browser (laut eigener Aussage Juli 2011 [19]) verfügen über einen Flash-Player. Doch da der mobile Markt sehr schnell weiter wachsen wird (eine Wachstumsprognose von Microsoft Tag ist in Abb. 9 zu sehen), die Entwicklung dafür aber beendet ist mobile Geräte der Firma Apple hatten von Anfang an keine Flash-Unterstützung wird Flash und somit die beliebte Benutzeroberfläche und die Skriptsprache Action Script immer weniger Verwendung finden. Die Alternative zu Flash, die sogar nativ, also ohne Plugin für einen Player verwendbar ist, ist HTML5. HTML5 ist eine Weiterentwicklung der Hypertext-Auszeichnungssprache (HTML - Hypertext Markup Language) zur Gliederung von Inhalten, die in Webbrowsern dargestellt werden. Die Fünf hinter dem HTML steht aber für mehr als nur die Strukturierung von Elementen - die aber auch deutlich vereinfacht wird. Die Neuerung bezieht sich vor allem auf das vereinfachte Zusammenspiel von HTML, CSS und JavaScript. Auch für CSS wird ein neuer Standard entwickelt: CSS3. Damit werden 3D-Transformationen und Animationen möglich, die vorher, wenn überhaupt, nur mit JavaScript umgesetzt werden konnten. Der Umfang von JavaScript hat sich ebenfalls erweitert und ermöglicht eine noch größere Einbindung des Nutzers durch Interaktion und z.b. client-seitige Datenbanken.[20] Abb. 10: Die Statistik (April 2012) zeigt, dass über die Hälfte der Nutzer veraltete Versionen eines Browsers (hier Internet Explorer) verwenden. Quelle: 20 Diese neue Technologie trifft allerdings bisher auf das Problem, dass viele Internetnutzer veraltete Browser verwenden (wie in dem Diagramm in Abb. 10 am Beispiel des Internet Explorers zu erkennen ist). Auf mobilen Browsern (z.b. Safari, Android Browser) kann man bereits die meisten Funktionalitäten nutzen, im Desktop-Bereich wird es noch ein paar Jahre dauern, bis man bei der Ent-

20 wicklung alte Nicht-HTML5-fähige Browser vernachlässigen kann. Und selbst modernen Browsern fehlen oft HTML5- und CSS3-Implementierungen. Eine hilfreiche Plattform, um herauszufinden, welche Eigenschaften oder Funktionen am Beispiel der CSS3-Methode zur 3D-Transformation, wie unterschiedlich die Unterstützung verschiedener Browser ausfällt. Abb. 11: Caniuse.com bietet Übersichts-Tabellen zur Kompatibilität von HTML5-, CSS3- und SVG- Eigenschaften in mobilen und Desktop-Browsern, hier die CSS3-Methode für 3D-Transformationen Beim Erstellen von HTML5-Anwendungen sollte man deshalb immer eine Fallback- Lösung für ältere Browser einbauen (zumindest beim Erstellen von Seiten, die für ein möglichst großes Publikum zugänglich sein sollten). Bei den Fallback-Lösungen kann es vorkommen, dass nicht alle modernen optischen Elemente umsetzbar sind. Die Seiten sollten aber zumindest dieselben Informationen bieten. Helfer, wie z.b. ob die verwendeten HTML5- oder CSS3-Implementierungen vorhanden sind. Wenn das nicht der Fall ist, werden z.b. JavaScript-Lösung angeboten.[21] Im Mai 2011 forderte das W3C (World Wide Web Consortium) alle Nutzer auf, im [22] Offiziell soll HTML5 zwar erst 2014 vom W3C als Web-Standard eingeführt werden, doch schon jetzt ist die Verbreitung, besonders auf mobilen Geräten, sehr groß. Da Apple sich von Anfang an konsequent gegen Flash auf mobilen Geräten entschieden hatte, sind sie sicherlich mitverantwortlich für die schnelle Verbreitung von HTML5.[23] 21

21 2.2.1 Flash-Umwandlungs-Tools Für diejenigen, die dennoch lieber mit Flash arbeiten oder bereits vorhandene Flash- Animationen weiter verwenden möchten, gibt es Anwendungen, die anbieten, eine - laby findet man eine lange Liste von Features, die nicht konvertiert werden, darunter auch ActionScript.[24] Swiffy konvertiert zwar ActionScript, aber nur Version 2.0 (aktuell ist Version 3.0). Der dabei entstehende Code ist so umfangreich, dass man damit kaum weiter arbeiten kann. Dargestellt werden kann das Ergebnis am besten in Webkit-Browsern mit SVG-Unterstützung (z.b. im mobilen Safari-Browser). Als Fallback-Lösung für iphone oder ipad, z.b. für ein auf Flash basierendes Werbebanner, kann eine solche Anwendung sinnvoll sein, für den plattformübergreifenden Einsatz ist sie aber ungeeignet HTML5-Benutzeroberflächen Um von vornherein HTML5-Anwendungen zu erstellen, entstehen im Moment verschiedene Benutzeroberflächen, die versuchen Flash abzulösen. Es folgt ein Überblick über drei dieser Oberflächen, von denen man besonders viel hört. (Beispieldateien befinden sich auf der beigelegten CD): Adobe Edge Adobe entwickelt zur Zeit eine HTML5-Be- native zu Flash. Da es sich noch in der Entwicklungs-Phase befindet (Stand: April 2012), kann man sich eine kostenlose Test- Version über Adobe Labs herunterladen. Momentan ist sie bei Version 5.1. Die Bedienung wirkt auf den ersten Blick verständlich, wenn man bereits mit Programmen von Adobe gearbeitet hat, da die Optik stark an ihre anderen Programme erinnert (siehe Abb. 13). Elemente werden erzeugt, indem man sie auf die Bühne zieht (Rechtecke, abgerundete Rechtecke und Text), dort kann man sie verschieben und frei skalieren, in der Timeline bekommt jedes Element eine Ebene. Es können allerdings keine strukturierenden Ordner erstellt werden, daher wird die Auflistung sehr schnell unübersichtlich. Jedes Element kann nun in der Timeline durch Setzen von die Style-Eigenschaften zum aktuell ausgewählten Element sichtbar und können per Eingabe angepasst werden. 22

22 Abb.13: Benutzeroberfläche von Adobe Edge, mit einer Test-Animation Wie in Flash können jedem Objekt Klick-, Mouseover-, Mousedown-, usw. Funktionen (siehe Abb. 14) gibt es eine Auswahl von Standard-Funktionen, die man verwenden kann, aber auch ein selbst geschriebener JavaScript-Code kann eingetragen werden. Als Ergebnis einer in Edge angelegten Animation erhält man eine HTML-Datei, drei Java Script-Dateien und einen Ordner mit den nötigen Bibliotheken (jquery, jqueryeasing, Edge und Json). Die JavaScript- Dateien enthalten alle verwendeten Elemente und deren Eigenschaften (es gibt keine extra CSS-Datei) und beschreiben die Animationsvorgänge und Events. Die HTML- Datei enthält lediglich einen Skript-Verweis auf die Preload-JS-Datei und einen Div- Container mit entsprechender ID und Klasse. Dadurch könnte man ein Edge-Projekt sehr einfach auch in eine bereits vorhandene HTML-Datei einbinden. In der Actions- JS-Datei können bei Bedarf weitere Funktionen ergänzt werden. Verwendbar ist der erzeugte Code für HTML5-fähige Browser, wobei der Umfang an HTML5-Unterstützung, wie schon erwähnt, bei unterschiedlichen Browsern variiert und somit die Darstellung und der Funktionsumfang verschieden sein kann. 23

23 Fazit: Das Zielpublikum von Edge sind Webdesigner, die gerne mit einer Benutzeroberfläche arbeiten wollen. Allerdings ist sehr deutlich zu erkennen, dass sich Edge noch in der Entwicklungsphase befindet. Viele Möglichkeiten, die man aufgrund von Erfahrungen mit anderen Adobe Programmen erwartet, sind noch nicht gegeben. Der entstehende Quellcode ist unübersichtlich und scheinbar unnötig groß. Darstellen können nur moderne Browser die so erzeugten Anwendungen, deshalb ist die Verwendung von Edge für Animationen, die einem möglichst großen Publikum zugänglich sein sollen, erst einmal nicht zu empfehlen. Sencha Animator Abb. 15: Logo der Soft- che zur Erstellung von Animationen und interaktiven Objek- Testversion zum freien Download zur Verfügung, die Vollversion kostet ca. 200 Dollar. Der Sencha Animator wirkt übersichtlicher als die Testversion von Edge. Wie bei Edge erzeugt man Elemente dadurch, dass man sie auf die Bühne zieht, dort kann man sie verschieben und skalieren. Man kann Elemente ineinander verschachteln und per Drang&Drop als auch durch genaue Zeitangaben verschoben werden. Für verschiedene Animationen legt man Szenen an, zu denen bei einem bestimmten Aufruf gesprungen werden kann. Abb. 16 zeigt die Benutzeroberfläche mit einem Beispiel- Projekt. 24

24 Jedem Element können einfache Klick-/Hover- etc. Funktionen zugeordnet werden, schreiben. Erzeugt wird eine einzige HTML-Datei, in deren head alle Java Script- und CSS-Befehle stehen. Aber auch hier entstehen wieder sehr viele Funktionen und Elemente, die für die Ausführung des Codes unnötig scheinen. Die Darstellung in älteren Browsern funktioniert auch hier nicht. Fazit: geschriebe nem CSS ist einfacher und die Oberfläche ist insgesamt übersichtlicher. Trotzdem auch hier: noch unterstützen zu wenige relevante Browser die Darstellung. lich. Daher ist der Einsatz bisher nicht sehr empfehlenswert. Tumult Hype Abb. 17: Logo der Soft- OS). Dies ist ebenfalls eine Software, die das Erstellen von HTML5 einfach und anschaulich machen soll. Sie kostet im AppStore ca. 40 Euro. Die Benutzeroberfläche hat die gleichen Komponenten, wie die anderen zwei Tools, auch hier kann man Elemente ziehen und skalieren, Szenen anlegen und Keyframes setzen. Selbst geschriebene JavaScript-Funktionen können im integrierten Editor einfach eingefügt werden. Abb. 18 zeigt die Benutzeroberfläche mit einer Test-Animation. 25

Einführung in die Cross-Plattform Entwicklung Das Intel App Framework

Einführung in die Cross-Plattform Entwicklung Das Intel App Framework Einführung in die Cross-Plattform Entwicklung Das Intel App Framework Einführung Dieses Hands-on-Lab (HOL) macht den Leser mit dem Intel App Framework vom Intel XDK vertraut. Es wird Schritt für Schritt

Mehr

JavaScript Frameworks für Mobile

JavaScript Frameworks für Mobile JavaScript Frameworks für Mobile MoBI Expertenrunde Usability, 1. März 2012 doctima GmbH JavaScript Frameworks für Mobile MoBI 1.3.2012 Edgar Hellfritsch Inhalt Native App-Entwicklung Klassische Web-Entwicklung

Mehr

1 Einführung Adobe sagt Danke

1 Einführung Adobe sagt Danke Einführung 2 1 Einführung. Adobe sagt Danke Für das wichtige Feedback der Community bedankt sich Adobe. So ist die erste Version von Edge Animate kostenlos erhältlich. Erst für das zweite Release werden

Mehr

Entwicklung und Integration mobiler Anwendungen. Oracle Deutschland B.V. & Co. KG

Entwicklung und Integration mobiler Anwendungen. <Speaker> Oracle Deutschland B.V. & Co. KG Entwicklung und Integration mobiler Anwendungen Oracle Deutschland B.V. & Co. KG Global Users (Millions) Der Trend ist eindeutig. Trend zu mobilen Endgeräten Wachstum des mobilen Datenverkehrs

Mehr

RÖK Typo3 Dokumentation

RÖK Typo3 Dokumentation 2012 RÖK Typo3 Dokumentation Redakteur Sparten Eine Hilfe für den Einstieg in Typo3. Innpuls Werbeagentur GmbH 01.01.2012 2 RÖK Typo3 Dokumentation Inhalt 1) Was ist Typo3... 3 2) Typo3 aufrufen und Anmelden...

Mehr

http://www.nvu-composer.de

http://www.nvu-composer.de Kapitel 16 Seite 1 Ein portabler Web-Editor Wer viel Zeit in eine Website investieren will ist gut beraten, eine professionelle Software für Webdesigner zu beschaffen. Diese Programme sind sehr leistungsfähig,

Mehr

Falko Braune Präsentation - Hauptseminar Web Engineering Professur Verteilte und selbstorganisierende Rechnersysteme Technische Universität Chemnitz

Falko Braune Präsentation - Hauptseminar Web Engineering Professur Verteilte und selbstorganisierende Rechnersysteme Technische Universität Chemnitz Falko Braune Präsentation - Hauptseminar Web Engineering Professur Verteilte und selbstorganisierende Rechnersysteme Technische Universität Chemnitz - 19.12.2012 1. Einleitung 2. Technologie 3. Bewertung

Mehr

Auffrischung jquery. jquery Mobile. Marco Francke I 24.02.2011

Auffrischung jquery. jquery Mobile. Marco Francke I 24.02.2011 Auffrischung jquery jquery Mobile Marco Francke I 24.02.2011 Mayflower GmbH 2010 write less do more Marco Francke 24. Februar 2011 24.02.11 Mayflower GmbH 2 Mayflower GmbH 2010 Was ist jquery und was kann

Mehr

Designänderungen mit CSS und jquery

Designänderungen mit CSS und jquery Designänderungen mit CSS und jquery In der epages-administration gibt es in den Menüpunkten "Schnelldesign" und "Erweitertes Design" umfangreiche Möglichkeiten, das Design der Webseite anzupassen. Erfahrene

Mehr

Agenda. Ingo Ebel (ie007) Benjamin Müller (bm032) Was ist AJAX? Sicherheit Vor- und Nachteile. AJAX Frameworks. Wozu benötigt Client/Server

Agenda. Ingo Ebel (ie007) Benjamin Müller (bm032) Was ist AJAX? Sicherheit Vor- und Nachteile. AJAX Frameworks. Wozu benötigt Client/Server AJAX Agenda Ingo Ebel (ie007) Was ist AJAX? Wozu benötigt Client/Server Sicherheit Vor- und Nachteile Benjamin Müller (bm032) AJAX Frameworks GWT ATF Ingo Ebel - ie007 2 Web 2.0 Ingo Ebel - ie007 3 Ingo

Mehr

Mobile: Die Königsfrage

Mobile: Die Königsfrage Mobile: Die Königsfrage - Native App,Mobile Website oder doch Responsive Design? - Native App oder Mobile Website? Wer am Boom der mobilen Anwendungen teilhaben möchte, hat im Prinzip zwei Möglichkeiten:

Mehr

Remote Communications

Remote Communications HELP.BCFESDEI Release 4.6C SAP AG Copyright Copyright 2001 SAP AG. Alle Rechte vorbehalten. Weitergabe und Vervielfältigung dieser Publikation oder von Teilen daraus sind, zu welchem Zweck und in welcher

Mehr

Kurzanleitung exelearning

Kurzanleitung exelearning Kurzanleitung exelearning exelearning ist ein XHTML-basiertes Autorentool, das die Erstellung von E-Learning-Lernmodulen ohne Programmierkenntnisse ermöglicht. Entwickelt von Version Betriebssystem Exportmöglichkeiten

Mehr

App Entwicklung mit Hilfe von Phonegap. Web Advanced II - SS 2012 Jennifer Beckmann

App Entwicklung mit Hilfe von Phonegap. Web Advanced II - SS 2012 Jennifer Beckmann App Entwicklung mit Hilfe von Phonegap Web Advanced II - SS 2012 Jennifer Beckmann http://www.focus.de/digital/internet/netzoekonomie-blog/smartphone-googles-android-laeuft-konkurrenz-in-deutschland-davon_aid_723544.html

Mehr

Neues Projekt anlegen... 2. Neue Position anlegen... 2. Position in Statikdokument einfügen... 3. Titelblatt und Vorbemerkungen einfügen...

Neues Projekt anlegen... 2. Neue Position anlegen... 2. Position in Statikdokument einfügen... 3. Titelblatt und Vorbemerkungen einfügen... FL-Manager: Kurze beispielhafte Einweisung In dieser Kurzanleitung lernen Sie die wichtigsten Funktionen und Abläufe kennen. Weitere Erläuterungen finden Sie in der Dokumentation FLManager.pdf Neues Projekt

Mehr

Praxisbericht Mobile Publishing. Willkommen in der Welt der Publikationen! seit 1799

Praxisbericht Mobile Publishing. Willkommen in der Welt der Publikationen! seit 1799 Praxisbericht Mobile Publishing Willkommen in der Welt der Publikationen! seit 1799 Inhalte Entwicklung, Geräte, Markt, Nutzung Publikationswege für Tablet-PC Demonstrationen, Beispiele Mobile Publishing

Mehr

Website-CMS Grundlagen des Worldsoft-CMS

Website-CMS Grundlagen des Worldsoft-CMS 1 1. Was ist ein Content Management System (CMS)? Ein Web Content Management System ist eine Datenbanklösung zur einfachen Erstellung und Aktualisierung von Websites. Im Gegensatz zu einer statischen Website

Mehr

Autorensysteme für mobile Anwendungen - Totgesagte leben länger. Prof. Dr. Michael Bauer 25.10. 2012 Autorensysteme

Autorensysteme für mobile Anwendungen - Totgesagte leben länger. Prof. Dr. Michael Bauer 25.10. 2012 Autorensysteme Autorensysteme für mobile Anwendungen - Totgesagte leben länger Was ist, was will ein Autor? Produzent interaktiver, multimedialer Inhalte geschlossene Einheiten (Apps) keine Grenzen für Kreativität Entwicklungs-

Mehr

Einführung in die Cross-Plattform Entwicklung Das Intel XDK

Einführung in die Cross-Plattform Entwicklung Das Intel XDK Einführung in die Cross-Plattform Entwicklung Das Intel XDK Einführung Dieses Hands-on-Lab (HOL) macht den Leser mit dem Intel XDK vertraut. Es wird Schritt für Schritt die erste eigene Hybrid-App entwickelt

Mehr

Schulung Open CMS Editor

Schulung Open CMS Editor Schulung Open CMS Editor Um Ihr Projekt im OpenCMS zu bearbeiten brauchen Sie lediglich einen Webbrowser, am besten Firefox. Vorgehensweise beim Einrichten Ihrer Site im OpenCMS Erste Schritte Wenn Sie

Mehr

E-Books produzieren und publizieren

E-Books produzieren und publizieren E-Books produzieren und publizieren Bruno Wenk Hochschule für Technik und Wirtschaft HTW Chur Leipzig, 24. Oktober 2012 Seite 1 Ziel Mit kostenlosen Programmen ein E-Book im Format EPUB (2.01) realisieren

Mehr

AM BeIsPIel Der DAsInvestMent.coM MoBIl WeB APP

AM BeIsPIel Der DAsInvestMent.coM MoBIl WeB APP AM BeIsPIel Der DAsInvestMent.coM MoBIl WeB APP 2 Inhalt Warum ist es sinnvoll eine spezielle Applikation für mobile Geräte zu entwickeln? Seite 5 Welche Möglichkeiten der Umsetzung gibt es? 6 Mobile Applikation

Mehr

Sachwortverzeichnis... 251

Sachwortverzeichnis... 251 Inhalt Vorwort... V 1 WWW World Wide Web... 1 1.1 Das Internet Infrastruktur und Administration... 2 1.2 Datenübertragung... 4 1.3 Sprachen im Web... 6 1.4 Webseiten... 7 1.4.1 Clientseitige Dynamik...

Mehr

Einführung in die Cross-Plattform Entwicklung Responsive Webdesign mit dem Intel XDK

Einführung in die Cross-Plattform Entwicklung Responsive Webdesign mit dem Intel XDK Einführung in die Cross-Plattform Entwicklung Responsive Webdesign mit dem Intel XDK Einführung Dieses Hands-on-Lab (HOL) macht den Leser mit dem Intel XDK und dem Responsive Webdesign vertraut. Es wird

Mehr

9.2 Weitergeben. 9.2.1 Online-Album. 9.2 Weitergeben. Flash-Player

9.2 Weitergeben. 9.2.1 Online-Album. 9.2 Weitergeben. Flash-Player 9.2 Weitergeben Das Weitergeben und das Erstellen unterscheiden sich eigentlich nur wenig. Beim Erstellen liegt das Augenmerk mehr auf dem Ausdrucken, bei der Weitergabe handelt es sich eher um die elektronische

Mehr

WEBAPPS MEDIEN ZWISCHEN TECHNOLOGIE UND GESELLSCHAFT PROF. DR. MANFRED THALLER JONAS SCHOPHAUS UNI KÖLN WS 2012

WEBAPPS MEDIEN ZWISCHEN TECHNOLOGIE UND GESELLSCHAFT PROF. DR. MANFRED THALLER JONAS SCHOPHAUS UNI KÖLN WS 2012 WEBAPPS MEDIEN ZWISCHEN TECHNOLOGIE UND GESELLSCHAFT PROF. DR. MANFRED THALLER JONAS SCHOPHAUS UNI KÖLN WS 2012 AGENDA 1. Native versus webbasierte Apps 2. HTML5 & CSS3 1. Media Queries 2. Geolocation

Mehr

AJAX SSL- Wizard Referenz

AJAX SSL- Wizard Referenz AJAX SSL- Wizard Referenz Version 1.0.2+ - 04.04.2011 Präambel Die vorliegende Dokumentation beschreibt den AJAX basierten SSL- Wizard der CertCenter AG. Der SSL- Wizard kann mit wenigen Handgriffen nahtlos

Mehr

Facebook iframe-tabs: individuelle Fanseiten-Reiter mit eigener Anwendung erstellen

Facebook iframe-tabs: individuelle Fanseiten-Reiter mit eigener Anwendung erstellen Facebook iframe-tabs: individuelle Fanseiten-Reiter mit eigener Anwendung erstellen Anfang März 2011 hat Facebook das Erstellen von sogenannten iframe-tabs als individuelle Gestaltungsmöglichkeit von Fanseiten

Mehr

Outlook Web App 2010. Kurzanleitung. interner OWA-Zugang

Outlook Web App 2010. Kurzanleitung. interner OWA-Zugang interner OWA-Zugang Neu-Isenburg,08.06.2012 Seite 2 von 15 Inhalt 1 Einleitung 3 2 Anmelden bei Outlook Web App 2010 3 3 Benutzeroberfläche 4 3.1 Hilfreiche Tipps 4 4 OWA-Funktionen 6 4.1 neue E-Mail 6

Mehr

Cross-Platform Apps mit HTML5/JS/CSS/PhoneGap

Cross-Platform Apps mit HTML5/JS/CSS/PhoneGap Cross-Platform Apps mit HTML5/JS/CSS/PhoneGap Proseminar Objektorientiertes Programmieren mit.net und C# Florian Schulz Institut für Informatik Software & Systems Engineering Einführung Was hat Cross-Plattform

Mehr

Proseminar Website-Management-Systeme im Wintersemester 2003/2004 AG Softwaretechnik. PHP-Nuke. PHP-Nuke. von Andreas Emrich

Proseminar Website-Management-Systeme im Wintersemester 2003/2004 AG Softwaretechnik. PHP-Nuke. PHP-Nuke. von Andreas Emrich AG Softwaretechnik 1 Übersicht 1. Grundlagen und Konzepte 2. Komponenten von 3. Erweiterungsmöglichkeiten und Personalisierung 4. Abschließende Bewertung 5. Literaturangaben 2 1. : Grundlagen und Konzepte

Mehr

Bedienungsanleitung GOZ-Handbuch der Landeszahnärztekammer Baden-Württemberg

Bedienungsanleitung GOZ-Handbuch der Landeszahnärztekammer Baden-Württemberg Bedienungsanleitung GOZ-Handbuch der Landeszahnärztekammer Baden-Württemberg LZK BW 12/2009 Bedienungsanleitung GOZ-Handbuch Seite 1 Lieferumfang Zum Lieferumfang gehören: Eine CD-Rom GOZ-Handbuch Diese

Mehr

CloudMatic V1.0. Inhalt

CloudMatic V1.0. Inhalt CloudMatic V1.0 Inhalt Einleitung... 2 CCUs hinzufügen... 3 meine-homematic.de... 4 Eigenes VPN... 4 View Editor... 5 Übersicht... 5 Allgemeine Einstellungen... 6 Kanäle hinzufügen... 6 Spezielle Kanäle...

Mehr

Facebook I-Frame Tabs mit Papoo Plugin erstellen und verwalten

Facebook I-Frame Tabs mit Papoo Plugin erstellen und verwalten Facebook I-Frame Tabs mit Papoo Plugin erstellen und verwalten Seit Anfang Juni 2012 hat Facebook die Static FBML Reiter deaktiviert, so wird es relativ schwierig für Firmenseiten eigene Impressumsreiter

Mehr

VWA Rhein-Neckar Dipl.-Ing. Thomas Kloepfer. Kommunikation I (Internet) Übung 4 PHP

VWA Rhein-Neckar Dipl.-Ing. Thomas Kloepfer. Kommunikation I (Internet) Übung 4 PHP VWA Rhein-Neckar Dipl.-Ing. Thomas Kloepfer Kommunikation I (Internet) Übung 4 PHP SS 2004 Inhaltsverzeichnis 1. PHP die serverseitige Programmiersprache...1 1.1. PHP - Bereiche in HTML definieren...1

Mehr

Sicherheit in Rich Internet Applications

Sicherheit in Rich Internet Applications Sicherheit in Rich Internet Applications Florian Kelbert 14.02.2008 Seite 2 Sicherheit in Rich Internet Applications Florian Kelbert 14.02.2008 Inhaltsverzeichnis Grundlagen Ajax und Mashups Adobe Flash-Player

Mehr

Offline Apps mit HTML5

Offline Apps mit HTML5 1 Offline Apps mit HTML5 Entwicklung vollständig offline-tauglicher Webanwendungen W3L AG info@w3l.de 2014 2 Agenda Motivation Situation unter HTML 4.01 Neuerungen durch HTML5 Technologie Offline-Technologien

Mehr

Content Management System (CMS) Manual

Content Management System (CMS) Manual Content Management System (CMS) Manual Thema Seite Aufrufen des Content Management Systems (CMS) 2 Funktionen des CMS 3 Die Seitenverwaltung 4 Seite ändern/ Seite löschen Seiten hinzufügen 5 Seiten-Editor

Mehr

Visual Web Developer Express Jam Sessions

Visual Web Developer Express Jam Sessions Visual Web Developer Express Jam Sessions Teil 1 Die Visual Web Developer Express Jam Sessions sind eine Reihe von Videotutorials, die Ihnen einen grundlegenden Überblick über Visual Web Developer Express,

Mehr

Zeitung als App? Wandel der Produktions- und Kommunikationsprozesse. Prof. Dr. Paul Klimsa Technische Universität Ilmenau

Zeitung als App? Wandel der Produktions- und Kommunikationsprozesse. Prof. Dr. Paul Klimsa Technische Universität Ilmenau Zeitung als App? Wandel der Produktions- und Kommunikationsprozesse Prof. Dr. Paul Klimsa Technische Universität Ilmenau Inhalt Technik, Inhalt und Organisation: Medieproduktion als neue Grundlage der

Mehr

Suche schlecht beschriftete Bilder mit Eigenen Abfragen

Suche schlecht beschriftete Bilder mit Eigenen Abfragen Suche schlecht beschriftete Bilder mit Eigenen Abfragen Ist die Bilderdatenbank über einen längeren Zeitraum in Benutzung, so steigt die Wahrscheinlichkeit für schlecht beschriftete Bilder 1. Insbesondere

Mehr

ebanking Business: Umwandeln der Lastschriftvorlagen in SEPA-Vorlagen mit automatischer Konvertierung von Kontonummer/BLZ in IBAN und BIC

ebanking Business: Umwandeln der Lastschriftvorlagen in SEPA-Vorlagen mit automatischer Konvertierung von Kontonummer/BLZ in IBAN und BIC ebanking Business: Umwandeln der Lastschriftvorlagen in SEPA-Vorlagen mit automatischer Konvertierung von Kontonummer/BLZ in IBAN und BIC Lastschriftvorlagen, die Sie in ebanking Business gespeichert haben,

Mehr

Referenzen Frontend Typo3

Referenzen Frontend Typo3 Referenzen Typo3 und Frontend Stand: Mai 2015 Diese Referenzliste beschreibt die eigene Webseite der Internetagentur Irma Berscheid-Kimeridze. Die Webseite ist seit Mai 2015 online. Sie ist mit Typo3 erstellt.

Mehr

Konfiguration des Internet Explorers 7

Konfiguration des Internet Explorers 7 Konfiguration des Internet Explorers 7 Allgemeines...2 Seiteneinrichtung...2 ActiveX-Steuerelemente...3 JavaScript...5 Verschiedenes...6 Ausdruck von Hintergrundbildern...8 HTTP 1.1...9 Popupblockereinstellungen...10

Mehr

XML Grundlagen Sommersemester 2013

XML Grundlagen Sommersemester 2013 XML Grundlagen Sommersemester 2013 Die Lehrveranstaltung wird studienbegleitend durch eine Hausarbeit und eine Präsentation mit Diskussion geprüft. Die Themen der folgenden Liste werden im Rahmen der Lehrveranstaltung

Mehr

Diese Anleitung bezieht sich auf FixFoto, V 3.40. In älteren oder neueren Versionen könnte die Arbeitsweise anders sein.

Diese Anleitung bezieht sich auf FixFoto, V 3.40. In älteren oder neueren Versionen könnte die Arbeitsweise anders sein. Pfade einstellen Stand: Dezember 2012 Diese Anleitung bezieht sich auf FixFoto, V 3.40. In älteren oder neueren Versionen könnte die Arbeitsweise anders sein. Diese Anleitung soll zeigen, wie man Pfad-Favoriten

Mehr

Süddeutsche Zeitung als digitale Ausgabe

Süddeutsche Zeitung als digitale Ausgabe Süddeutsche Zeitung als digitale Ausgabe Technische Spezifikationen für SZ Digital- Anzeigen, Stand: 06.06.2014 Inhaltsübersicht 1. Einleitung und Anlieferungstermine S. 1 2. Anzeigen 2.1. Bildanzeigen

Mehr

1 Websites mit Frames

1 Websites mit Frames 1 Websites mit Frames Mehrere Seiten in einer einzelnen Seite anzeigen - Was sind Frames und wie funktionieren sie? - Was sind die Vor- und Nachteile von Frames? - Wie erstellt man eine Frames- Webseite?

Mehr

Microsoft PowerPoint 2013 YouTube-Video einfügen

Microsoft PowerPoint 2013 YouTube-Video einfügen Hochschulrechenzentrum Justus-Liebig-Universität Gießen Microsoft PowerPoint 2013 YouTube-Video einfügen YouTube-Video einfügen in PowerPoint 2013 Seite 1 von 6 Inhaltsverzeichnis Einleitung... 2 Vorbereitungen...

Mehr

http://www.jimdo.com Mit Jimdo eine Homepage erstellen Kapitel 16 Seite 1 Die eigene Homepage mit Jimdo http://benutzername.jimdo.com Der Benutzername

http://www.jimdo.com Mit Jimdo eine Homepage erstellen Kapitel 16 Seite 1 Die eigene Homepage mit Jimdo http://benutzername.jimdo.com Der Benutzername Kapitel 16 Seite 1 Die eigene Homepage mit Jimdo Mit Jimdo ist das Erstellen einer eigenen Homepage ganz besonders einfach. Auch ohne Vorkenntnisse gelingt es in kurzer Zeit, mit einer grafisch sehr ansprechenden

Mehr

Einführung Erste Schritte mit Mamut Online Survey

Einführung Erste Schritte mit Mamut Online Survey [Type text] Mamut Active Services Einführung Erste Schritte mit Mamut Online Survey 1 Erste Schritte mit Mamut Online Survey Inhalt Über Mamut Online Survey... 2 Erste Schritte mit Mamut Online Survey...

Mehr

Handbuch AP Backoffice

Handbuch AP Backoffice Handbuch AP Backoffice Verfasser: AP marketing Tony Steinmann Bahnhofstrasse 13 6130 Willisau Alle Rechte vorbehalten. Willisau, 24. August 2005 Handbuch unter www.ap-backoffice.ch/handbuch_ap-backoffice.pdf

Mehr

Multivariate Tests mit Google Analytics

Multivariate Tests mit Google Analytics Table of Contents 1. Einleitung 2. Ziele festlegen 3. Einrichtung eines Multivariate Tests in Google Analytics 4. Das JavaScript 5. Die Auswertung der Ergebnisse Multivariate Tests mit Google Analytics

Mehr

Eine App, viele Plattformen

Eine App, viele Plattformen Eine App, viele Plattformen Anwendungsentwicklung für Mobile Heiko Lewandowski 23.04.2013 EINLEITUNG Festlegung App-Strategie: Welche Ziele möchte ich erreichen? Die Vielzahl der Plattformen und Geräte(hersteller)

Mehr

Startansicht... 1 Menüleiste... 2 Persönliche Einstellungen... 2 Queueansicht... 3 Suche... 5 Shortcuts... 5

Startansicht... 1 Menüleiste... 2 Persönliche Einstellungen... 2 Queueansicht... 3 Suche... 5 Shortcuts... 5 Inhalt Startansicht... 1 Menüleiste... 2 Persönliche Einstellungen... 2 Queueansicht... 3 Suche... 5 Shortcuts... 5 Ab dem Wintersemester 20112/2013 wird OTRS Version 2 durch Version 3 abgelöst und für

Mehr

Webseitennavigation mit dem Content-Management-System Imperia. Zentrum für Informationsverarbeitung Westfälische Wilhelms-Universität Münster

Webseitennavigation mit dem Content-Management-System Imperia. Zentrum für Informationsverarbeitung Westfälische Wilhelms-Universität Münster Webseitennavigation mit dem Content-Management-System Imperia Zentrum für Informationsverarbeitung Westfälische Wilhelms-Universität Münster 10. Januar 2006 Inhaltsverzeichnis 1. Einführung 4 2. Rubrikenstruktur

Mehr

Open Social in den VZ-Netzwerken

Open Social in den VZ-Netzwerken Open Social in den VZ-Netzwerken Berlin, 01.03.2010 1 Inhalt 1. Open Social in den VZ-Netzwerken 2. Applikationen 3. Datenschutz 4. Tracking 5. Video Tutorials 6. Technische Spezifikationen 2 in den VZ-Netzwerken

Mehr

Frontend Backend Administration Frontend Backend Administration Template

Frontend Backend Administration Frontend Backend Administration Template Begriffe Frontend Backend Administration Bei Contentmanagementsystemen (CMS) unterscheidet man zwischen zwei Bereichen, dem sogenannten Frontend und dem Backend Bereich. Der Backend wird häufig als Administration

Mehr

Moderne Benutzeroberflächen für SAP Anwendungen

Moderne Benutzeroberflächen für SAP Anwendungen Seite 1 objective partner für SAP Erfahrungen mit dem UI-Development Kit für HTML5 (SAPUI5) - 19.06.2012 Seite 2 Quick Facts objective partner AG Die objective partner AG 1995 gegründet mit Hauptsitz in

Mehr

PRAXISBUTLER ANPASSUNG DER VORLAGEN

PRAXISBUTLER ANPASSUNG DER VORLAGEN Praxisbutler Anpassung der Vorlagen 1 PRAXISBUTLER ANPASSUNG DER VORLAGEN Die Vorlagen werden hauptsächlich in den Bereichen Klienten und Fakturierung benutzt. Die Anpassung dieser Vorlagen ist wichtig,

Mehr

7 SharePoint Online und Office Web Apps verwenden

7 SharePoint Online und Office Web Apps verwenden 7 SharePoint Online und Office Web Apps verwenden Wenn Sie in Ihrem Office 365-Paket auch die SharePoint-Dienste integriert haben, so können Sie auf die Standard-Teamsite, die automatisch eingerichtet

Mehr

Was ist SVG? Inhalt: Allgemeines zu SVG Besondere Merkmale Vor- und Nachteile Dateiformat Standardobjekte Koordinatensystem Beispiele Links

Was ist SVG? Inhalt: Allgemeines zu SVG Besondere Merkmale Vor- und Nachteile Dateiformat Standardobjekte Koordinatensystem Beispiele Links Was ist SVG? Was ist SVG? Inhalt: Allgemeines zu SVG Besondere Merkmale Vor- und Nachteile Dateiformat Standardobjekte Koordinatensystem Beispiele Links SVG: Allgemeines zu SVG SVG = Scalable Vector Graphics

Mehr

Autor: Michael Spahn Version: 1.0 1/10 Vertraulichkeit: öffentlich Status: Final Metaways Infosystems GmbH

Autor: Michael Spahn Version: 1.0 1/10 Vertraulichkeit: öffentlich Status: Final Metaways Infosystems GmbH Java Einleitung - Handout Kurzbeschreibung: Eine kleine Einführung in die Programmierung mit Java. Dokument: Autor: Michael Spahn Version 1.0 Status: Final Datum: 23.10.2012 Vertraulichkeit: öffentlich

Mehr

Arbeiten mit Acrobat. Vorstellung von Adobe Acrobat Bearbeitung des Dokuments Präsentationen erstellen Teamarbeit

Arbeiten mit Acrobat. Vorstellung von Adobe Acrobat Bearbeitung des Dokuments Präsentationen erstellen Teamarbeit Arbeiten mit Acrobat Vorstellung von Adobe Acrobat Bearbeitung des Dokuments Präsentationen erstellen Teamarbeit Vollbildmodus Wählen Sie das Menü Fenster Vollbildmodus. Die aktuell angezeigte Seite verdeckt

Mehr

Manual WordPress - ContentManagementSystem

Manual WordPress - ContentManagementSystem Was ist WordPress? WordPress ist ein ContentManagementSystem (CMS) zur Verwaltung der Inhalte einer Website. Es bietet sich besonders zum Aufbau und Pflege eines Weblogs (Online-Tagebuch) an. Funktionsschema

Mehr

UI-Testing mit Microsoft Test Manager (MTM) Philip Gossweiler / 2013-04-18

UI-Testing mit Microsoft Test Manager (MTM) Philip Gossweiler / 2013-04-18 UI-Testing mit Microsoft Test Manager (MTM) Philip Gossweiler / 2013-04-18 Software Testing Automatisiert Manuell 100% 70% 1 Überwiegender Teil der Testing Tools fokusiert auf automatisiertes Testen Microsoft

Mehr

NEWpixi* API und die Umstellung auf REST. Freitag, 3. Mai 13

NEWpixi* API und die Umstellung auf REST. Freitag, 3. Mai 13 NEWpixi* API und die Umstellung auf REST Fakten NEWpixi* API Technik REST-basierend.NET Webservice IIS Webserver Release 31. August 2013, zusammen mit dem NEWpixi* ELI Release Legacy API und erste NEWpixi*

Mehr

Erstellung eines Wallpaper Ads / Hockeysticks für MSN Stand 04/2010

Erstellung eines Wallpaper Ads / Hockeysticks für MSN Stand 04/2010 Erstellung eines Wallpaper Ads / Hockeysticks für MSN Stand 04/2010 Definition eines Wallpaper Ads Benötigte Dateien: 728x90 Superbanner Fallback: Gif/Jpg (max 40kb) 728x90 Superbanner Flash: Swf (max

Mehr

HTML5. Grundlagen der Erstellung von Webseiten. Linda York, Tina Wegener. 1. Ausgabe, Dezember 2011 HTML5

HTML5. Grundlagen der Erstellung von Webseiten. Linda York, Tina Wegener. 1. Ausgabe, Dezember 2011 HTML5 Linda York, Tina Wegener HTML5 Grundlagen der Erstellung von Webseiten 1. Ausgabe, Dezember 2011 HTML5 2 HTML5 - Grundlagen der Erstellung von Webseiten 2 Die erste Webseite mit HTML erstellen In diesem

Mehr

Schritte zu einer guten Über mich Seite in XING.

Schritte zu einer guten Über mich Seite in XING. Schritte zu einer guten Über mich Seite in XING. 1 1. Die Wirkung der Über mich Seite in XING Im neuen XING Layout spielt die Über mich Seite von der Sichtbarkeit und Optik eine zentralere Rolle. Beim

Mehr

Fraunhofer ITWM Typo3 Schulung für Webbeauftragte

Fraunhofer ITWM Typo3 Schulung für Webbeauftragte Fraunhofer ITWM Typo3 Schulung für Webbeauftragte Die typo3 Schulung besteht aus zwei Blöcken: Einer Präsentation und einem Übungsteil. Während der Präsentation lernen Sie Anhand von konkreten Beispielen

Mehr

Einstieg in AJAX-Programmierung

Einstieg in AJAX-Programmierung www.happy-security.de präsentiert: Einstieg in AJAX-Programmierung Autor: Tsutomu Katsura Datum: 26. Mai 2006 Herzlich willkommen zu meinem kleinen Tutorial über AJAX-Programmierung. Ich möchte hier nicht

Mehr

Wo steht HTML5 Überblick, Möglichkeiten, Zukunft (ohne Anspruch auf Vollständigkeit)

Wo steht HTML5 Überblick, Möglichkeiten, Zukunft (ohne Anspruch auf Vollständigkeit) 1 Wo steht HTML5 Überblick, Möglichkeiten, Zukunft (ohne Anspruch auf Vollständigkeit) Sven Brencher 2 Wie ich zu Webentwicklung stehe Yeah Flexbox! Entwickler vs. Unternehmer ROI? 3 Wie kann man HTML5

Mehr

Web 2.0 Architekturen und Frameworks

Web 2.0 Architekturen und Frameworks Web 2.0 Architekturen und Frameworks codecentric GmbH Mirko Novakovic codecentric GmbH Quality Technische Qualitätssicherung in Software-Projekten mit Fokus auf Performance, Verfügbarkeit und Wartbarkeit

Mehr

Features und Vorteile von Office 2010

Features und Vorteile von Office 2010 Features und Vorteile von Office 2010 Microsoft Office 2010 bietet Ihnen flexible und überzeugende neue Möglichkeiten zur optimalen Erledigung Ihrer Aufgaben im Büro, zu Hause und in Schule/Hochschule.

Mehr

Password Depot für Android

Password Depot für Android Password Depot für Android * erfordert Android Version 2.3 oder höher Oberfläche... 3 Action Bar... 3 Overflow-Menü... 3 Eintragsleiste... 5 Kontextleiste... 5 Einstellungen... 6 Kennwörterdatei erstellen...

Mehr

Arbeiten mit. Eine einführende Schulung für Redakteure VGT. Michael Fritz, 21. Oktober 2006

Arbeiten mit. Eine einführende Schulung für Redakteure VGT. Michael Fritz, 21. Oktober 2006 Arbeiten mit Eine einführende Schulung für Redakteure VGT Michael Fritz, 21. Oktober 2006 1 Inhalte 1. TYPO3 - Ihr neues Content-Management-System S. 3 ff. 1.1 Was ist ein CMS 1.2 Wie komme ich rein 1.3

Mehr

Dreamweaver 8 Homepage erstellen Teil 1

Dreamweaver 8 Homepage erstellen Teil 1 Dreamweaver 8 Homepage erstellen Teil 1 Voraussetzungen Das vorliegende Skriptum knüpft an das Skriptum Dreamweaver_Einführung an und setzt voraus, dass du dieses bereits durchgearbeitet hast. Planung

Mehr

Übersichtlichkeit im Dokumentenmanagement

Übersichtlichkeit im Dokumentenmanagement Übersichtlichkeit im Dokumentenmanagement Workshop Software GmbH Siemensstr. 21 47533 Kleve 02821 / 731 20 02821 / 731 299 www.workshop-software.de Verfasser: SK info@workshop-software.de Datum: 02/2012

Mehr

1.1 Worum es in diesem Buch geht... 3. Moving Target: Offene Webstandards... 4. 1.3 Web-Animationen: Status quo... 5

1.1 Worum es in diesem Buch geht... 3. Moving Target: Offene Webstandards... 4. 1.3 Web-Animationen: Status quo... 5 VII Inhalt 1 Einführung 2 1.1 Worum es in diesem Buch geht... 3 1.2 Moving Target: Offene Webstandards... 4 1.3 Web-Animationen: Status quo... 5 2 Das Autorenwerkzeug Adobe Edge Animate 8 2.1 Zielgruppen...

Mehr

@HERZOvision.de. Kurzanleitung WebClient. v 1.0.0 by Herzo Media GmbH & Co. KG - www.herzomedia.de

@HERZOvision.de. Kurzanleitung WebClient. v 1.0.0 by Herzo Media GmbH & Co. KG - www.herzomedia.de @HERZOvision.de Kurzanleitung WebClient v 1.0.0 by Herzo Media GmbH & Co. KG - www.herzomedia.de Inhaltsverzeichnis Inhaltsverzeichnis... 2 E-Mails direkt im Browser bearbeiten... 3 Einführung in den WebClient

Mehr

Slices und Rollover für die Startseite einer Bildergalerie

Slices und Rollover für die Startseite einer Bildergalerie Slices und Rollover für die Startseite einer Bildergalerie Die größte Frage bei einer Webseite ist es, auf ggf. viele Informationen von der relativ kleinen Fläche eines Bildschirmes zu verweisen. Dabei

Mehr

Projekt AGB-10 Fremdprojektanalyse

Projekt AGB-10 Fremdprojektanalyse Projekt AGB-10 Fremdprojektanalyse 17. Mai 2010 1 Inhaltsverzeichnis 1 Allgemeines 3 2 Produktübersicht 3 3 Grundsätzliche Struktur und Entwurfsprinzipien für das Gesamtsystem 3 3.1 Die Prefuse Library...............................

Mehr

App-Entwicklung mit Titanium

App-Entwicklung mit Titanium App-Entwicklung mit Titanium Masterstudienarbeit von Betreuung Prof. Dr. M. von Schwerin App-Entwicklung mit Titanium 1 Gliederung 1.Titanium Eine Einführung 2.Programmierschnittstelle (API) 3.Module 4.App

Mehr

- 1 - LOGION CMS. MedienService Ladewig

- 1 - LOGION CMS. MedienService Ladewig - 1 - LOGION CMS MedienService Ladewig - 2 - Administration Einführung: Warum Online Redaktion einfach sein kann... Wer Informationen aufbereitet und verteilt, steht mit den Mitteln moderner Informationstechnologie

Mehr

TYPO3 Redaktoren-Handbuch

TYPO3 Redaktoren-Handbuch TYPO3 Redaktoren-Handbuch Kontakt & Support: rdv interactive ag Arbonerstrasse 6 9300 Wittenbach Tel. 071 / 577 55 55 www.rdvi.ch Seite 1 von 38 Login http://213.196.148.40/typo3 Username: siehe Liste

Mehr

Responsive Webdesign

Responsive Webdesign Responsive Webdesign Anlass sind 2 Probleme: 1. Darstellung der HU-Homepage auf mobilen Geräten ist nicht optimal (Überprüfung der Anzeige mit Strg+Shift+M oder Simulatoren www.responsinator.com) 2. Summe

Mehr

scmsp SMARTES Content-Management-System Bestimmtes kann und das dafür sehr gut. Bei der Konzeption des blockcms stand die Einfachheit im Vordergrund:

scmsp SMARTES Content-Management-System Bestimmtes kann und das dafür sehr gut. Bei der Konzeption des blockcms stand die Einfachheit im Vordergrund: scmsp SMARTES Content-Management-System blockcms steht für Block Content Management System Wir brauchen kein CMS, das alles kann, sondern eines, das nur Bestimmtes kann und das dafür sehr gut. Bei der

Mehr

Kurzanleitung Indiware online Stundenplan online Vertretungsplan online Indiware mobil

Kurzanleitung Indiware online Stundenplan online Vertretungsplan online Indiware mobil Kurzanleitung Indiware online Stundenplan online Vertretungsplan online Indiware mobil Stand: 26.11.2014 Kannenberg Software GmbH Nonnenbergstraße 23 99974 Mühlhausen Telefon: 03601/426121 Fax: 03601/426122

Mehr

Erste Schritte in der Benutzung von Microsoft SharePoint 2010

Erste Schritte in der Benutzung von Microsoft SharePoint 2010 Erste Schritte in der Benutzung von Microsoft SharePoint 2010 Inhalt 1. Einleitung... 1 2. Browserwahl und Einstellungen... 1 3. Anmeldung und die Startseite... 3 4. Upload von Dokumenten... 3 5. Gemeinsamer

Mehr

TM1 mobile intelligence

TM1 mobile intelligence TM1 mobile intelligence TM1mobile ist eine hochportable, mobile Plattform State of the Art, realisiert als Mobile BI-Plug-In für IBM Cognos TM1 und konzipiert als Framework für die Realisierung anspruchsvoller

Mehr

- Entwurfsphase: Entwurfsbeschreibung Gesamtsystem - Version: 1.0

- Entwurfsphase: Entwurfsbeschreibung Gesamtsystem - Version: 1.0 Projektbezeichnung Projektleiter Verantwortlich - Entwurfsphase: Entwurfsbeschreibung Gesamtsystem - Version: 1.0 MSP-13 - Integration eines Semantischen Tagging Systems in Microsoft Sharepoint Martin

Mehr

SVG Skalierbare Vektorgrafiken im Netz

SVG Skalierbare Vektorgrafiken im Netz SVG Skalierbare Vektorgrafiken im Netz Weckung des Bedarfs an der Verteilung von georeferenzierten Informationen beim LWL: Weckung des Bedarfs an der Verteilung von georeferenzierten Informationen beim

Mehr

1 Installationen. 1.1 Installationen unter Windows

1 Installationen. 1.1 Installationen unter Windows 1 Installationen Dieses Kapitel beschreibt die Installationen, die für die Nutzung von PHP und MySQL unter Windows, unter Ubuntu Linux und auf einem Mac mit OS X notwendig sind. 1.1 Installationen unter

Mehr

Responsive Webdesign Bootstrap und co. Pierre Hein & Benjamin Stein Stuttgart 7. Mai 2015

Responsive Webdesign Bootstrap und co. Pierre Hein & Benjamin Stein Stuttgart 7. Mai 2015 Responsive Webdesign Bootstrap und co. Pierre Hein & Benjamin Stein Stuttgart 7. Mai 2015 Agenda 1. Einführung Was ist Responive Webdesign, Media Queries und CSS preprocessing 2. Frameworks Bootstrap,

Mehr

Wiederholung float+clear. Grundlagen Webgestaltung Seite 136

Wiederholung float+clear. Grundlagen Webgestaltung Seite 136 Wiederholung float+clear Grundlagen Webgestaltung Seite 136 float und clear clear kann für mehrspaltige Layouts verwenden werden. Jedoch kann das auch zu ungewollten Effekten führen. Angenommen eine Webseite

Mehr

Online-Ansichten und Export Statistik

Online-Ansichten und Export Statistik ACS Data Systems AG Online-Ansichten und Export Statistik (Version 10.08.2009) Buchhaltung für Schulen ACS Data Systems AG Bozen / Brixen / Trient Tel +39 0472 27 27 27 obu@acs.it 2 Inhaltsverzeichnis

Mehr

Vielseitiges Redaktionssystem Effizientes Multi-Channel-Publishing

Vielseitiges Redaktionssystem Effizientes Multi-Channel-Publishing Vielseitiges Redaktionssystem Effizientes Multi-Channel-Publishing Media-Print Informationstechnologie GmbH Eggertstraße 28 33100 Paderborn Telefon +49 5251 522-300 Telefax +49 5251 522-485 contact@mediaprint-druckerei.de

Mehr

Wiki Dokumentation. Erstellt von:

Wiki Dokumentation. Erstellt von: Wiki Dokumentation Erstellt von: Wiki Dokumentation www.verkaufslexikon.de Allgemeines Wikipedia, ein Enzyklopädie Projekt der Wikimedia Foundation, ist ein Wiki, d. h. eine Website, deren Seiten man direkt

Mehr