Flexibles HTML.

Save this PDF as:
 WORD  PNG  TXT  JPG

Größe: px
Ab Seite anzeigen:

Download "Flexibles HTML. christian.cueni@bfh.ch"

Transkript

1 Flexibles HTML

2 Inhalt Desktop & Mobile Strategien Responsive Design HTML5 Feature Detektion mit Modernizr

3 Desktop & Mobile Strategien Wie bringe ich mobile Nutzer zum (UI) optimierten Content? User Initated Client-side Responsive Design Server-side Ridirect Optimierter Content

4 User Initiated Simpler Link auf der Webseite mit Besuchen Sie unsere mobile Webseite Positiv: Sehr einfach zu implementieren Der Benutzer kann entscheiden Negativ Einige Benutzer werden den Link aber nicht sehen Einige Benutzer werden den Link klicken obwohl sie nicht ein mobiles Gerät haben

5 Responsive Design Für alle Geräte wird dasselbe HTML ausgeliefert Mit Hilfe von Media Queries (also verschiedenes CSS für verschiedene Screens) wird das Layout auf die jeweiligen Screens angepasst. Beispiele: Starbucks WWF

6 Responsive Design +/- Vorteile Ein Satz Content für alle Geräte Eine URL Nachteile Der Content ist nicht voll für Mobile optimiert (ausser man macht Mobile First) Schlechtere Performance (im Schnitt ist eine Webseite 1.3 MB gross) Die Navigation kann erschwert werden (verschieden Use Cases für Mobile & Desktop)

7 User-Agent Sniffing

8 User-Agent Sniffing Um mobile Seiten anzuzeigen kann Der Client weitergeleitet werden z.b. m.mydomain.ch Oder es wird direkt mobiles Markup und CSS an den Client geliefert Höchstes Level an Flexibilität, da spezielles Markup und Content für mobile Nutzer Wird meist auf Enterprise Level eingesetzt Liste mit UA-Strings muss ständig angepasst werden

9 Dedizierte Mobile Seite Meist wird eine Subdomain wie m.example.ch oder mobile.example.ch verwendet. Eigentlich wäre.mobi für diesen Zweck gedacht Das Markup und der Content werden für mobile optimiert Beispiele: NZZ Amazon "A study of trends in mobile design" 2010

10 Dedizierte Mobile Seite +/- Vorteile: Lädt schneller, da der Content optimiert ist Änderungen können separat für Mobile und Desktop gemacht werden Einfachere Navigationsstruktur Nachteile: Mehrere URLs für jede Seite. Kann beim Teilen dazu führen, dass Desktop- Benutzer auf der mobilen Seite landen. Kann auch SEO (Search Engine Optimization) beinflussen Mobile und Desktop Seite können in Content und Funktionalität stark variieren Es werden 2 Sätze an Content benötigt Benötigt Redirects

11 Responsive Design & Server Side Components Mobilen Besuchern wir auf derselben URL eine für Mobile optimierte Seite gezeigt Um verschiedenen Screens gerecht zu werden kann zusätzlich Responsive Web Design verwendet werden Um Suchmaschinen die verschiedenen Seiten verfügbar zu machen wird der Vary HTTP-Header verwendet Beispiele: CNN Slideshare https://developers.google.com/webmasters/smartphone-sites/details

12 Responsive Design & Server Side Components +/- Vorteile: Einfachere Navigation Optimierter Content für Mobile Lädt schneller Darstellung kann zusätzlich noch optimiert werden Nachteile Kann zusätzliche Last auf den Servern erzeugen, da die Seiten dynamisch erzeugt werden Benötigt User-Agent Sniffing

13 Mobile Unterstützung Anno 2010 Untersuchung der 100 meist besuchten Webseiten (nach Google Ad-Planner) 39% leiten die Benutzer per Redirection um 32% zeigen den mobilen Content auf der Hauptseite an 29% hatten keine mobile Unterstützung "A study of trends in mobile design" 2010

14 Responsive Design Wie? CSS revisited Media Queries Vorgehen Frameworks

15 Responsive Design Wie? Erstellen einer sauberen und semantisch korrekten Webseite Stylesheets mit flexiblen Elementen Verschiedene Stylesheets für verschiedene Screens (Media Query)

16 CSS 101 Mit CSS kann das Design einer Seite verändert werden CSS Zen Garden

17 CSS Box Model Width kann mit der CSS property box-sizingbeeinflusst werden.

18 CSS Selectors 1/2 <p>...</p> <div> <p id= stuff >...</p> p {...} #an_id.alert {...} <div> <p class= other >...</p> </div> </div> <div class= alert > <p><a href=.. class= alert>..</a></p> <p id= an_id > <a href=.. class= alert>..</a> </p> </div> div.alert {...} <div id= someid > <p class= alert >...</p> <div class= alert >...</div> </div>

19 CSS Selectors 2/2 h1 {...} Alle h1-elemente werden selektiert h1, p {...} #navigation {...}.nav_link {...} Alle h1- und p-elemente werden selektiert Das Element mit id navigation wird selektiert Alle Elemente mit class nav_link werden selektiert p.alert {...} p.alert {...} Alle p-elemente mit class alert werden selektiert Alle Elemente welche ein p-element als Elternelement haben und von der class alert sind, werden selektiert

20 CSS Properties..{ margin: 10px; margin-left: 5px; } Margin von 10px ausser links (5px)..{ width: 50%;}..{ padding: 4px;} Breite 50% vom Elternelement Padding von 4px..{ background-color:#aabbcc; }..{ font-family: veranda, serif; } Hintergrund Farbe Font

21 CSS p { width: 100px;} p { margin: 10px;} p { background-color:#aaa; } p { width: 75%;} p { font-size: 16px;} p { width: 110px;} = p { margin: 10px; background-color:#aaa; font-size: 16px; width: 110px; }

22 CSS 3 Neu! Abgerundete Ecken Animationen Schattenwurf Gradienten Transparenz

23 CSS 3 Vendor Prefixes Neue Properties werden meist mit sogenannten Vendor-Prefixes verwendet -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);

24 CSS3 Media Queries Mit Media Queries können für verschiedene Stylesheets oder CSS-Regeln für verschiedene Screens bestimmt werden Inline im url(some.css) (min-width: screen and (max-width:640px) {.alert { background: red; } } Als separates CSS-File <link rel="stylesheet" media="screen and (max-width: 640px)" href="small.css" />

25 CSS Media Types Existieren seit CSS2 Erlauben es Stylesheets für verschiedene Gerätetypen zu definieren Meist werden all, print, screen verwendet handheld war für mobile Geräte gedacht, hat aber nie wirklich anklang gefunden

26 Features für Media Queries Feature Defintion Hat min- und max- Prefix width Breite vom Darstellungsbereich height device-width device-height orientation aspect-ratio device-aspect-ratio Höhe vom Darstellungsbereich Breite vom Device-Display Breite vom Device-Display portrait oder landscape Verhältnis von Breite zu Höhe vom Darstellungsbereich z.b. 16:9 Verhältnis von Breite zu Höhe vom Device-Display z.b. 16:9

27 Features für Media Queries Feature Defintion Hat min- und max- Prefix color Anzahl Bits pro Farbkomponente. Devices ohne Farbe sollten den Wert 0 haben color-index Anzahl Farben im Color-Lookup Table des Displays (z.b. 256) monochrome Bits per Pixel für Monochrome Devices resolution Pixeldichte in dpi scan grid Für TV-Geräte ist der Scan- Prozess entweder progressive oder scan z.b tty oder einfaches Telefon mit fixer Schrift. Gibt 1 oder 0 zurück

28 CSS3 Media Queries screen and (min-device-width: 768px) and (max-devicewidth: 1024px) Mehrere Queries screen and (max-device-width: 480px) Maximale Breite only screen and (-webkit-min-device-pixel-ratio: 2) IPhone 4/5 all and (orientation:portrait) all and (orientation:landscape) Orientation

29 Break Points Breite Geräte 320 Pixel Für kleine Geräte, wie Telefone, in Porträtformat. 480 Pixel Für kleine Geräte, wie Telefone, in Querformat. 600 Pixel Kleinere Tables, wie der Amazon Kindle (600x800), in Porträtformat. 768 Pixel 10 Tablets wie das ipad (728x1024) in Porträtformat 1024 Pixel Tablets wie das ipad (1024x728) in Querformat oder einige Laptops, Netbooks und Desktop Displays 1200 Pixel Für Breitbild Displays, wie Laptop und Desktop-Browser

30 Design

31 Fix Design Alle Elemente haben fixe Breiten (in Pixel) --> responsive/non_responsive.html

32 Flexible Elemente Bei flexiblen Elementen sind die breiten nicht in Pixel sondern in % (oder auch em) angegeben. Formel: Ziel / Context = Resultat z.b. #content: 630 / 990 = > responsive/responsive1.html

33 Flexible Bilder Es braucht nur max-width: 100% Bei IE Browsern < IE7 braucht es zusätzliche Arbeit Alternativ kann auch overflow: hidden fürs übergeordnete Element und max-width:auto für das Bild verwendet werden. Dies verdeckt allerdings Teile vom Bild --> responsive/responsive2.html

34 Media Queries Mit Media Queries werden einzelne Eigenschafen überschrieben z.b. die Breite, da wir bei kleinen Geräten die gesamte Breite nutzen wollen --> responsive/responsive3.html

35 Media Queries in Javascript Wenn man noch Dinge mit Javascript beeinflussen will, dann gibt es Libraries wie z.b. enquire.js Es können Methoden definiert werden die aufgerufen werden sobald ein Query matched oder auch nicht.

36 Responsive Design - Frameworks Es gibt verschiedene Frameworks, die out-of-thebox Responsive Design anbieten. Die 2 populärsten sind Twitter Bootstrap Zurb Foundation Bei beiden steuert man das Aussehen durch das hinzufügen von CSS-Klassen

37 Frameworks - Raster Beide basieren auf einem Raster das in 12 Spalten aufgeteilt ist (das kann aber geändert werden) Bei Zurb z.b. so <div class="row"> <div class="four columns">.four.columns </div> <div class="four columns">.four.columns </div> <div class="four columns">.four.columns </div> </div>

38 Responsive Design Wie? CSS revisited Media Queries Vorgehen Frameworks

39 HTML5 & CSS3 Feature Detektion mit Modernizr Detektiert HTML5 & CSS3 Features bei Browsern Bietet Methoden an um Javascript Dateien zu laden falls ein Feature vorhanden oder nicht vorhanden ist Bietet auch die Möglichkeit um CSS anzupassen falls der Browser einzelne Features nicht unterstützt. Bietet einfache Überprüfung im Code Bietet keine Polyfills (Code der HTML5 APIs & CSS3 nachahmt und so die Funktionalität auch älteren Browsern verfügbar macht) Modernizer

40 Vor Modernizer UA Sniffing Feature Detektion window.indexeddb = window.indexeddb window.mozindexeddb window.webkitindexeddb window.msindexeddb; window.idb* objects:window.idbtransaction = window.idbtransaction window.webkitidbtransaction window.msidbtransaction; window.idbkeyrange = window.idbkeyrange window.webkitidbkeyrange window.msidbkeyrange; if(typeof window.indexeddb!== 'undefined') {... }

41 Übungen

42 Zurb/Bootstrap 1/4 Erstelle eine Seite mit einem Überschrif Erstelle eine Zeile mit 3 Spalten die gleich breit sind. Erstelle eine weitere Zeile mit 2 Spalten. Jede Spalte soll 2 Einheiten breit sind. Die eine Spalte soll linkbündig sein. Die andere Spalte soll 2 Einheiten rechts von der ersten liegen. Füge in der mittleren Spalte in der 1. Zeile 2 weitere Spalten hinzu (Nesting)

43 Zurb/Bootstrap 2/4 Erstelle ein CSS-File und füge den Spalten eine Hintergrundfarbe und runde Ecken dazu. Schliesse die genesteten Spalten davon aus. Erstelle für eines der genestetenspalten eine Farbgradienten mit CSS Füge einer Spalte einen Button hinzu. Mische Grösse, Typ und Stil. Füge eine Topbar Navigation ein. Teste auf einem kleinen Screen.

44 Zurb/Bootstrap 3/4 Füge unter dem Titel eine Slideshow ein Verwende die Bilder von fh.trivialview.ch/pics.zip Spiele mit den Optionen herum und füge Captions hinzu Füge 2 Alert Boxen ein. Eine rote mit Not supported und eine grüne mit Supported

45 Zurb/Bootstrap 4/4 Binde modernizr ein und schaue was dein Browser unterstützt. Wähle ein Feature aus und mache die Anzeige von den Alerts vom Feature abhängig. Wird das Feature unterstützt so soll Supported angezeigt werden und sonst Not supported. Dies benötigt nur CSS. Füge mit Reveal ein Modal ein, welches beim Klicken des Buttons gezeigt wird

Responsive Web Design

Responsive Web Design Responsive Web Design mit APEX Theme 25 Christian Rokitta APEX UserGroup NRW Treffen 20.01.2014 Oracle DB & APEX Entwickler (selbstständig) Deutschland ( 1996) Niederlanden ( 1996) themes4apex: APEX UI

Mehr

responsive-web 31.10.2012 giordano.ch Oktober 31, 2012 1

responsive-web 31.10.2012 giordano.ch Oktober 31, 2012 1 responsive-web 31.10.2012 giordano.ch Oktober 31, 2012 1 perspektiven bruno giordano. // giordano.ch online.ch Oktober 31, 2012 2 giordano.ch Oktober 31, 2012 3 www.leo.org giordano.ch Oktober 31, 2012

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

Responsive Webdesign

Responsive Webdesign ebusiness Praxistag Thüringen 2014 Responsive Webdesign BASISWISSEN UND MÖGLICHKEITEN DER UMSETZUNG Maik Grunitz Geschäftsführer Forward Marketing GbR Inhalte 1. Warum Responsive Design? 2. Geschichte

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

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

Gliederung. Responsive Design Begriffserklärung und Übersicht. Frameworks Einführung in HTML / CSS Frameworks.

Gliederung. Responsive Design Begriffserklärung und Übersicht. Frameworks Einführung in HTML / CSS Frameworks. Gliederung Responsive Design Begriffserklärung und Übersicht. Frameworks Einführung in HTML / CSS Frameworks. Präsentationsplattform Vorstellung der Präsentationsplattform Setzkasten. 1 / 14 Responsive

Mehr

Responsive Webdesign. IHK-Arbeitskreis Software. Prof. Dr. Manfred Wojciechowski 18.02.2014

Responsive Webdesign. IHK-Arbeitskreis Software. Prof. Dr. Manfred Wojciechowski 18.02.2014 IHK-Arbeitskreis Software Prof. Dr. Manfred Wojciechowski 18.02.2014 Aufbau Vorstellung Responsive Webdesign Motivation Technologien Frameworks 2 Vorstellung Zur Person 1991 1996: Studium Informatik an

Mehr

Die eigene Website. Zusatzkapitel CSS mobile Geräte & Ausdruck

Die eigene Website. Zusatzkapitel CSS mobile Geräte & Ausdruck Die eigene Website Zusatzkapitel CSS mobile Geräte & Ausdruck Im Folgenden finden Sie einige Zusatztipps zu Kapitel 6 des Buchs Die eigene Website. Mehr Infos zum Buch auf der Website zum Buch. CSS für

Mehr

Responsive Web Design Graceful Degradation and Progressive Enhancement

Responsive Web Design Graceful Degradation and Progressive Enhancement Graceful Degradation and Progressive Enhancement Seminar Web Engineering für Master-Studenten (WS 2013/2014) Betreuer: Michael Krug Datum: 13.12.2013 1 Gliederung 1. Warum? 2. Konzepte zur Anpassung an

Mehr

1 Definition der Selektoren Einbinden der CSS 3 Möglichkeiten Farbangaben Schriftformatierung Abstände...

1 Definition der Selektoren Einbinden der CSS 3 Möglichkeiten Farbangaben Schriftformatierung Abstände... CSS GRUNDLAGEN 1 Definition der Selektoren... 2 2 Einbinden der CSS 3 Möglichkeiten... 2 3 Farbangaben... 4 4 Schriftformatierung... 4 5 Abstände... 4 6 Box Modell... 5 7 Links... 5 8 Eigene Klasse definieren...

Mehr

Einführung Responsive Webdesign

Einführung Responsive Webdesign Einführung Responsive Webdesign Aktuelle Situation Desktop Webseiten Umsetzungen auch heute noch in den meisten Fällen Pixelbasiert JavaScript schafft Dynamik CSS schafft Trennung von Inhalt und Layout

Mehr

Allgemeine Technologien II Sommersemester Mai 2011 CSS

Allgemeine Technologien II Sommersemester Mai 2011 CSS Allgemeine Technologien II Sommersemester 2011 02. Mai 2011 CSS Kursthemen Designparadigmen Framesets Tabellenbasierte Layouts -basierte Layouts: CSS & Co. Cascading Style Sheets CSS CSS einbinden

Mehr

Süddeutsche Zeitung als digitale Ausgabe

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

Mehr

Interface-Optimierung bei mobilen Endgeräten

Interface-Optimierung bei mobilen Endgeräten Interface-Optimierung bei mobilen Endgeräten Darauf sollte man achten Darstellung über CSS anpassen Durch optimierte Breiten kann man sehr einfach für Mobiltelefon oder ipad optimierte Seiten ausliefern.

Mehr

CSS. Cascading Stylesheets

CSS. Cascading Stylesheets CSS Cascading Stylesheets Themen Was sind Cascading Stylesheets? Vorteile von CSS Nachteile von CSS CSS: Versionen Regelsyntax für Stylesheets Einem HTML-Dokument Styles hinzufügen und Numerische

Mehr

Allgemeine Technologien II Wintersemester 2011 / November 2011 CSS

Allgemeine Technologien II Wintersemester 2011 / November 2011 CSS Allgemeine Technologien II Wintersemester 2011 / 2012 28. November 2011 CSS Themen 28.11.2011 Cascading Style Sheets CSS CSS einbinden Inline-Styles CSS im Dokumentkopf Externe Stylesheets Konzepte Typen-,

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

HTML5, CSS3 und JavaScript Webseiten entwickeln. Fortgeschrittene Anwendungen. Isolde Kommer. 2. Ausgabe, September 2015 ISBN 978-3-86249-441-5 HTML5F

HTML5, CSS3 und JavaScript Webseiten entwickeln. Fortgeschrittene Anwendungen. Isolde Kommer. 2. Ausgabe, September 2015 ISBN 978-3-86249-441-5 HTML5F HTML5, CSS3 und JavaScript Webseiten entwickeln Isolde Kommer Fortgeschrittene Anwendungen 2. Ausgabe, September 2015 HTML5F ISBN 978-3-86249-441-5 3 HTML5, CSS3 und JavaScript - Webseiten entwickeln 3.2

Mehr

Best Practices für HTML & CSS. Johannes Eschrig

Best Practices für HTML & CSS. Johannes Eschrig Best Practices für HTML & CSS. Johannes Eschrig Gliederung. 2 1. Best Practices i. Standards ii. Standardfreundlichkeit iii. Grundlegende Regeln 2. Best Practices für HTML i. class & id ii. HTML & CSS

Mehr

NATURAL FOR AJAX RESPONSIVE WEB ANWENDUNGEN FÜR MOBILE ENDGERÄTE ROLAND FABICH NOVEMBER 2016

NATURAL FOR AJAX RESPONSIVE WEB ANWENDUNGEN FÜR MOBILE ENDGERÄTE ROLAND FABICH NOVEMBER 2016 NATURAL FOR AJAX RESPONSIVE WEB ANWENDUNGEN FÜR MOBILE ENDGERÄTE ROLAND FABICH NOVEMBER 2016 2015 Software AG. All rights reserved. For internal use only RESPONSIVE WEB ANWENDUNGEN MIT NJX ÜBERSICHT Live

Mehr

Navigation für Internetpräsenzen

Navigation für Internetpräsenzen Navigation für Internetpräsenzen Gestern und heute 2016 Navigieren in Internetseiten Das Wort Navigation wird den meisten bekannt sein und fast jeder kann eine Verknüpfung aus seinem alltäglichen Leben

Mehr

Martin Fache (KIDS interactive) - Anforderungen an eine mobile/responsive Website Vortrag zum Seitenstark Fachtag

Martin Fache (KIDS interactive) - Anforderungen an eine mobile/responsive Website Vortrag zum Seitenstark Fachtag Agenda Entwicklung der Internet-fähigen Geräte Motivation für mobile Optimierung Lösungsansätze und Praxisbeispiele Im Jahr 2000 http://dag.wosc.edu/?gallery=wosc-computer-collection Im Jahr 2000 Webseite

Mehr

3-W-Event. Simplify! Ganzheitliche Gestaltungskonzepte neue Trends im Webdesign. Sabrina Schoenfelder Projektleitung, Beratung

3-W-Event. Simplify! Ganzheitliche Gestaltungskonzepte neue Trends im Webdesign. Sabrina Schoenfelder Projektleitung, Beratung 3-W-Event Simplify! Ganzheitliche Gestaltungskonzepte neue Trends im Webdesign Sabrina Schoenfelder Projektleitung, Beratung internezzo ag Grundstrasse 4b CH-6343 Rotkreuz Tel. +41 41 748 02 48 www.internezzo.ch

Mehr

E-Mail Editor Vorlagen Programmier-Richtlinien

E-Mail Editor Vorlagen Programmier-Richtlinien E-Mail Editor Vorlagen Programmier-Richtlinien 1 Inhaltsverzeichnis 1. Einleitung... 3 2. Code erstellen für Vorlagen... 4 3. Code für mobile Vorlagen (Responsive Design)... 5 4. Editor Klassen (Tags)

Mehr

CSS - Cascading Stylesheets

CSS - Cascading Stylesheets CSS - Cascading Stylesheets Alfred Beringer HTBLVA für Textilindustrie und Datenverarbeitung Alfred Beringer 1 Überblick Kurze Einführung Deklarationen Selektoren Beispiele Alfred Beringer 2 CSS Formatierungssprache

Mehr

SASS für Einsteiger. WordCamp Köln 2015. 06.06.2015 Bernhard Kau @2ndkauboy kau-boys.de 1

SASS für Einsteiger. WordCamp Köln 2015. 06.06.2015 Bernhard Kau @2ndkauboy kau-boys.de 1 SASS für Einsteiger WordCamp Köln 2015 06.06.2015 Bernhard Kau @2ndkauboy kau-boys.de 1 Wer bin ich? Bernhard Kau Wahlberliner PHP-Entwickler WordPress-Plugin Hobby-Entwickler CSS-Tüftler Organisator der

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

AdOps Technische Spezifikationen

AdOps Technische Spezifikationen AdOps Technische Spezifikationen HTML5-Werbemittel (Desktop) Bei der Verwendung von Redirects müssen diese Spezifikationen nicht beachtet werden. Physische Anlieferung von HTML5-Werbemitteln + Trackings.

Mehr

Introduction to Technologies for Interaction Design. Stylesheets

Introduction to Technologies for Interaction Design. Stylesheets Introduction to Technologies for Interaction Design Stylesheets Syntax Selektor und Eigenschaften Selektor bezieht sich auf ein HTML-Element ID-Selektoren dürfen in jeder HTML-Datei nur einmal vorkommen

Mehr

Das Favicon. Kleines Bild große Wirkung. Langner Marketing Unternehmensplanung Metzgerstraße 59 72764 Reutlingen

Das Favicon. Kleines Bild große Wirkung. Langner Marketing Unternehmensplanung Metzgerstraße 59 72764 Reutlingen Kleines Bild große Wirkung Stand April 2016 Langner Marketing Unternehmensplanung Metzgerstraße 59 72764 Reutlingen T 0 71 21 / 2 03 89-0 F 0 71 21 / 2 03 89-20 www.langner-beratung.de info@langner-beratung.de

Mehr

Multimediale Webprogrammierung. Bilder als Content von Webseiten. Bilder in Webseiten. Bildformate. Bilder in Webseiten 15.06.2015.

Multimediale Webprogrammierung. Bilder als Content von Webseiten. Bilder in Webseiten. Bildformate. Bilder in Webseiten 15.06.2015. Multimediale Webprogrammierung 03.06.2015/1 03.06.2015/2 http://www.allwebdesigninfo.com/10-helpful-tools-for-responsive-web-design.html als Content von Webseiten Alle Webseiten, 15.05.2015 (etwa 484.000)

Mehr

3. Briefing zur Übung IT-Systeme

3. Briefing zur Übung IT-Systeme 3. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde, 30.11.2016, PC Pool Stand und Ausblick Einführung: 18.10.2016, 12.00 Uhr (c.t.), HS 4/PC Pool Fragestunde: 09.11.2016,

Mehr

Entwicklung von MOBILEN Webanwendungen

Entwicklung von MOBILEN Webanwendungen Vorlesungsreihe Entwicklung webbasierter Anwendungen Entwicklung von MOBILEN Webanwendungen Prof. Dr.-Ing. Thomas Wiedemann email: wiedem@informatik.htw-dresden.de HOCHSCHULE FÜR TECHNIK UND WIRTSCHAFT

Mehr

Das Favicon. Kleines Bild große Wirkung. Langner Marketing Unternehmensplanung Metzgerstraße 59 72764 Reutlingen

Das Favicon. Kleines Bild große Wirkung. Langner Marketing Unternehmensplanung Metzgerstraße 59 72764 Reutlingen Kleines Bild große Wirkung Stand Mai 2015 Langner Marketing Unternehmensplanung Metzgerstraße 59 72764 Reutlingen T 0 71 21 / 2 03 89-0 F 0 71 21 / 2 03 89-20 www.langner-beratung.de info@langner-beratung.de

Mehr

Web-Performance-Optimierung - Websites auf Speed SEO Barbecue - DIWISH - Kiel - 01. August 2012. Timo Heinrich t.heinrich@online-werbung.

Web-Performance-Optimierung - Websites auf Speed SEO Barbecue - DIWISH - Kiel - 01. August 2012. Timo Heinrich t.heinrich@online-werbung. SEO Barbecue Web-Performance-Optimierung - DIWISH - Kiel - 01. August 2012 - Websites auf Speed 1 2 Kinder 1 Frau 41 Jahre jung Seit 1996 autodidaktischer Onliner Schwerpunkte: Suchmaschinenoptimierung

Mehr

Einführung zu Twitter Bootstrap

Einführung zu Twitter Bootstrap Einführung zu Twitter Bootstrap & Nutzung in Contao 3.1 Eine Präsentation von Johannes Pichler (webpixels) & Klaus Gansberger (webplus) Agenda Was ist Twitter Bootstrap Was kann Twitter Bootstrap Wie nutze

Mehr

Wir bringen Ihre Notes/Domino Anwendungen sicher ins Web 19.11.2015, Bilster Berg Drive Resort Michael Steinhoff, agentbase AG. www.agentbase.

Wir bringen Ihre Notes/Domino Anwendungen sicher ins Web 19.11.2015, Bilster Berg Drive Resort Michael Steinhoff, agentbase AG. www.agentbase. Wir bringen Ihre Notes/Domino Anwendungen sicher ins Web 19.11.2015, Bilster Berg Drive Resort Michael Steinhoff, agentbase AG www.agentbase.de 1 Agenda Grundlagen Modernisierung Möglichkeiten mit Domino

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

HTML5 2 1 / 6. Doing Web Apps HTML5 2. Letzte Änderung: 2014-10-24 Version: 1.1

HTML5 2 1 / 6. Doing Web Apps HTML5 2. Letzte Änderung: 2014-10-24 Version: 1.1 1 / 6 Doing Web Apps HTML5 2 Autor: Rüdiger Marwein Letzte Änderung: 2014-10-24 Version: 1.1 Dieses Dokument darf mit Nennung des Autoren - frei vervielfältigt, verändert und weitergegeben werden. Der

Mehr

Inhalt HTML 2. Applets Frames Formulare CSS cascading style sheets. Lehrveranstaltung Internet in AT Dr.-Ing. A. Braune TECHNISCHE UNIVERSITÄT DRESDEN

Inhalt HTML 2. Applets Frames Formulare CSS cascading style sheets. Lehrveranstaltung Internet in AT Dr.-Ing. A. Braune TECHNISCHE UNIVERSITÄT DRESDEN Inhalt HTML 2 Applets Frames Formulare CSS cascading style sheets SS 06 1 Applets Das Applet Java Applets sind kleine Java-Programme mit deren Hilfe aktive Webseiten erstellt werden können. werden mit

Mehr

Benutzerhandbuch. Gästebuch Software - YellaBook v1.0 http://www.yellabook.de. Stand: 01.08.2012. by YellaBook.de - Alle Rechte vorbehalten.

Benutzerhandbuch. Gästebuch Software - YellaBook v1.0 http://www.yellabook.de. Stand: 01.08.2012. by YellaBook.de - Alle Rechte vorbehalten. Benutzerhandbuch Gästebuch Software - YellaBook v1.0 http://www.yellabook.de Stand: 01.08.2012 Inhalt 1 Funktionen... 3 2 Systemanforderungen... 4 3 Installation... 4 4 Einbinden des Gästebuchs... 5 5

Mehr

1. Warum Responsives Webdesign? 2. Was ist Responsives Webdesign? 3. Welche Technik und Konzepte gibt es im Responsiven Webdesign?

1. Warum Responsives Webdesign? 2. Was ist Responsives Webdesign? 3. Welche Technik und Konzepte gibt es im Responsiven Webdesign? 1. Warum Responsives Webdesign? 2. Was ist Responsives Webdesign? 3. Welche Technik und Konzepte gibt es im Responsiven Webdesign? 4. Wie sieht die Zukunft im Responsiven Webdesign aus? Special: Responsives

Mehr

Trend: Mobiles Internet. Eine aktuelle Übersicht

Trend: Mobiles Internet. Eine aktuelle Übersicht Trend: Mobiles Internet Eine aktuelle Übersicht Computer verändern sich Kommunikation verändert sich Fotografie verändert sich Drei Erfolgsfaktoren 1 Seien Sie auf allen Bildschirmen präsent 2 Seien Sie

Mehr

Mobile Lernstrategien mit Moodle

Mobile Lernstrategien mit Moodle Mobile Lernstrategien mit Moodle Tobias Hauser Thomas Kraehe Arrabiata Solutions GmbH Arrabiata Solutions GmbH 1 UNSER HINTERGRUND Arrabiata Solutions GmbH Full Service E-Learning Agentur 8 Jahre Moodle

Mehr

Web-basierte Anwendungssysteme XHTML- CSS

Web-basierte Anwendungssysteme XHTML- CSS Web-basierte Anwendungssysteme XHTML- CSS Prof. Dr. Sergej Alekseev (alekseev@fb2.fra-uas.de) Prof. Dr. Armin Lehmann (lehmann@e-technik.org) Fachbereich 2 Informatik und Ingenieurwissenschaften Wissen

Mehr

Mobiler Ratgeber. TILL.DE Google Partner Academy

Mobiler Ratgeber. TILL.DE Google Partner Academy Mobiler Ratgeber TILL.DE Google Partner Academy Warum mobil sein? Eine Webseite, die mobil nicht gut zu erreichen ist, ist mit einem geschlossenen Geschäft gleichzusetzen! Warum mobil sein? Darüber informieren

Mehr

EasyWeb CSS Editor. EasyWeb CSS Editor IACBOX.COM. Version Deutsch

EasyWeb CSS Editor. EasyWeb CSS Editor IACBOX.COM. Version Deutsch EasyWeb CSS Editor Version 2.0.1 Deutsch 19.05.2014 In diesem HOWTO wird beschrieben wie Sie mit Hilfe des EasyWeb CSS Editor die Kunden-Anmeldeseite der IAC-BOX bearbeiten. EasyWeb CSS Editor TITEL Inhaltsverzeichnis

Mehr

Service Coding Crash Course

Service Coding Crash Course Service Coding Crash Course Willkommen! noch 2 wilde Tage! Bisher: Aufbau von Models, scaffolding, Formulare Formatierung, Assets einbinden, Layout, Navigation Ziel heute: Mobile Browser, JavaScript APIs

Mehr

CSS-Boxen. Hans Gell Schulungen & Dienstleistungen Übersicht der Schulungsinhalte

CSS-Boxen. Hans Gell Schulungen & Dienstleistungen  Übersicht der Schulungsinhalte CSS-Boxen Übersicht der Schulungsinhalte Das Web ist nicht aus Papier enttäuschte Erwartungen Autor hat keine Kontrolle Webseiten sehen immer anders aus Webseiten sind flexibel - Papierseiten sind starr

Mehr

Inhaltsverzeichnis. Einführung... 1. Kapitel 1 Die Bausteine einer Webseite... 13. Kapitel 2 Die Arbeit mit Webseitendateien... 39

Inhaltsverzeichnis. Einführung... 1. Kapitel 1 Die Bausteine einer Webseite... 13. Kapitel 2 Die Arbeit mit Webseitendateien... 39 Inhaltsverzeichnis Einführung....................................... 1 HTML und CSS im Überblick............................ 2 Browser........................................ 3 Webstandards und Webspezifikationen......................

Mehr

CSS Cascading Style Sheets

CSS Cascading Style Sheets XML light CSS Cascading Style Sheets Jörn Clausen joern@techfak.uni-bielefeld.de Übersicht Wieso Cascading Style Sheets? HTML und CSS XML und CSS Ausblick XML light CSS Cascading Style Sheets 2/24 Probleme,

Mehr

Georgienseite TYPO3 LTS7 Projekt Georgienseite TYPO3 LTS 7 responsiv Stand: Juni 2016

Georgienseite TYPO3 LTS7 Projekt Georgienseite TYPO3 LTS 7 responsiv Stand: Juni 2016 TYPO3 LTS7 1 Projekt TYPO3 LTS 7 responsiv Stand: Juni 2016 Die gibt es seit 2000. Im September 2014 haben wir sie auf TYPO3 LTS 6 eingerichtet. Juni 2016 erfolgte ein update auf die Version LTS 7 von

Mehr

Tutorial zum erstellen einer Webseite

Tutorial zum erstellen einer Webseite Tutorial zum erstellen einer Webseite 2. Teil das Aussehen mit CSS bestimmen Vorbereitungen: Die HTML Grundlage anpassen, Änderungen sind fett geschrieben. Ab sofort werden wir mit zwei Dateien arbeiten,

Mehr

Immer mehr lebt mobil

Immer mehr lebt mobil Immer mehr lebt mobil mehr als 4.600.000.000 Mobilgeräte breite Verfügbarkeit neuer always-on und Apps Lifestyle 2 Trittsicher auf allen mobilen Pfaden mit HTML5 und jquery Mobile Mike Baird http://flickr.com/photos/mikebaird/482031103/

Mehr

ALLGEMEINES WOMIT KANN ICH WEBSITES ERSTELLEN?

ALLGEMEINES WOMIT KANN ICH WEBSITES ERSTELLEN? HTML AG INHALT Allgemeines... 2 Womit kann ich Websites erstellen?... 2 Grundgerüst von HTML... 3 Tags und Attribute... 3 Links... 4 Links auf andere Seiten... 4 Bilder... 5 meta-tags... 5 Webseiten mit

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

Inhaltsverzeichnis. Florence Maurice. Mobile Webseiten. Strategien, Techniken, Dos und Don'ts für Webentwickler. ISBN (Buch): 978-3-446-43118-8

Inhaltsverzeichnis. Florence Maurice. Mobile Webseiten. Strategien, Techniken, Dos und Don'ts für Webentwickler. ISBN (Buch): 978-3-446-43118-8 Inhaltsverzeichnis Florence Maurice Mobile Webseiten Strategien, Techniken, Dos und Don'ts für Webentwickler ISBN (Buch): 978-3-446-43118-8 ISBN (E-Book): 978-3-446-43279-6 Weitere Informationen oder Bestellungen

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

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

SharePoint 2013 Mobile Access

SharePoint 2013 Mobile Access Erstellung 21.05.2013 SharePoint 2013 Mobile Access von Stephan Nassberger Hofmühlgasse 17/1/5 A-1060 Wien Verantwortlich für das Dokument: - Stephan Nassberger (TIMEWARP) 1 Inhalt Inhalt... 2 Versionskontrolle...

Mehr

Responsive Design & ecommerce

Responsive Design & ecommerce Responsive Design & ecommerce Kassel, 15.02.2014 web n sale GmbH Jan Philipp Peter Was bisher geschah Was bisher geschah oder: Die mobile Evolution früher : - Lokale Nutzung - Zuhause oder im Büro - Wenige

Mehr

Easy Mobile Homepage. Nützliche Tipps für die Nutzung der Software. 2011 Die Software ist urheberrechtlich geschützte Freeware - all rights reserved

Easy Mobile Homepage. Nützliche Tipps für die Nutzung der Software. 2011 Die Software ist urheberrechtlich geschützte Freeware - all rights reserved Easy Mobile Homepage Nützliche Tipps für die Nutzung der Software Danke für Ihr Interesse! Danke für Ihr Interesse an unserer neuen Software und wir freuen uns darüber, dass Sie die Tutorials angefordert

Mehr

Schulung Marketing Engine Thema : Einrichtung der App

Schulung Marketing Engine Thema : Einrichtung der App Schulung Marketing Engine Thema : Einrichtung der App Videoanleitung : http://www.edge-cdn.net/video_885168?playerskin=48100 Marketing Engine Tool : App Paket : Basis / Premium Version 1.0-09.07.2015 1

Mehr

Inhaltsverzeichnis. Einleitung 1. Teil I Workshop Schritt für Schritt zum professionellen HTML-CSS-Design. 1 So geht der Workshop vor 6

Inhaltsverzeichnis. Einleitung 1. Teil I Workshop Schritt für Schritt zum professionellen HTML-CSS-Design. 1 So geht der Workshop vor 6 ix Einleitung 1 Teil I Workshop Schritt für Schritt zum professionellen HTML-CSS-Design 1 So geht der Workshop vor 6 2 Vorbereitungen 8 2.1 Anlegen einer sinnvollen Ordnerstruktur... 9 2.2 Das brauchen

Mehr

Webseitenverwaltung. Mit HTML, CSS und ein klein wenig PHP. Steffen Schwientek http://schlaukopp.org

Webseitenverwaltung. Mit HTML, CSS und ein klein wenig PHP. Steffen Schwientek http://schlaukopp.org Webseitenverwaltung Mit HTML, CSS und ein klein wenig PHP Ziel: Einheitliches Layout Banner für alle Seiten des Webauftritts div id="navi" Seite 1 Seite2 Seite

Mehr

Wetter-Tickers (Laufband)

Wetter-Tickers (Laufband) Diese Seite richtet sich an alle Benutzer der Wetterauswertesoftware WSWIN (http://www.pc-wetterstation.de) von Werner Krenn, besonders aber an Neueinsteiger. Auf den folgenden Seiten soll nicht die Arbeit

Mehr

MEHR FUNKTIONEN, MEHR E-COMMERCE:

MEHR FUNKTIONEN, MEHR E-COMMERCE: MEHR FUNKTIONEN, MEHR E-COMMERCE: XT:COMMERCE TEMPLATE BB BOOTSTRAP 3 XT:COMMERCE TEMPLATE BB BOOTSTRAP 3 FEATURES aktuelles CSS3 Template: Das Blackbit Bootstrap Template ist ein aktuelles CSS3 Template

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

Installationsanleitung

Installationsanleitung Installationsanleitung Dieses Werk ist urheberrechtlich geschützt. Jede Verwertung außerhalb der engen Grenzen des Urheberrechtsgesetzes ist ohne Zustimmung der OutStart E-Learning GmbH unzulässig und

Mehr

tentoinfinity Apps 1.0 EINFÜHRUNG

tentoinfinity Apps 1.0 EINFÜHRUNG tentoinfinity Apps Una Hilfe Inhalt Copyright 2013-2015 von tentoinfinity Apps. Alle Rechte vorbehalten. Inhalt der online-hilfe wurde zuletzt aktualisiert am August 6, 2015. Zusätzlicher Support Ressourcen

Mehr

HTML und CSS. Eine kurze Einführung

HTML und CSS. Eine kurze Einführung HTML und CSS Eine kurze Einführung Begriff Markup Begriff aus Druckindustrie: Layouter fügt Anmerkungen/Markierungen (Tags) hinzu Markup-Languge (ML) = Auszeichnungssprache Beispiele a) das Wort wird fett

Mehr

mehr funktionen, mehr e-commerce:

mehr funktionen, mehr e-commerce: mehr funktionen, mehr e-commerce: xt:commerce plugin Search Tag Cloud xt:commerce Plugin search tag cloud Wonach suchen Ihre Kunden? Nicht nur für andere Nutzer ist es interessant, welche Artikel Ihre

Mehr

Einführung in die Webentwicklung

Einführung in die Webentwicklung Einführung in die Webentwicklung Mit HTML5 und CSS3 auf dem Weg zur eigenen Website Kerstin Blumenstein EXPOSEE Dieses Script beinhaltet alle in dem Kurs durchgenommenen - Teile mit Erklärungen von Tag

Mehr

3. Briefing zur Übung IT-Systeme

3. Briefing zur Übung IT-Systeme 3. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde, 30.11.2016, PC Pool Stand und Ausblick Einführung: 18.10.2016, 12.00 Uhr (c.t.), HS 4/PC Pool Fragestunde:, 12.00

Mehr

Mein Name ist Franz Liebing ich bin Internet Unternehmer und helfe Unternehmern bei der besseren Außendarstellung Ihrer Firma und dabei, wie Sie mehr Umsatz über das Internet generieren. Sicherlich hat

Mehr

Webdesign mit (X)HTML und CSS

Webdesign mit (X)HTML und CSS Webdesign mit (X)HTML und CSS Das Praxisbuch zum Einsteigen, Auffrischen und Vertiefen Deutsche Ausgabe der 3. englischen Auflage Jennifer Niederst Robbins Übersetzung von Kathrin Lichtenberg O'REILLY*

Mehr

FUNKTIONSBESCHREIBUNG. IFRAME EINBETTUNG VERSION: ab

FUNKTIONSBESCHREIBUNG. IFRAME EINBETTUNG VERSION: ab FUNKTIONSBESCHREIBUNG IFRAME EINBETTUNG VERSION: ab 2016.1.0 Inhaltsverzeichnis 1 Einleitung... 3 2 Schreibweise... 3 3 Zusätzliche Parameter... 4 3.1 Hintergrundfarbe... 4 3.2 Anzeige als Liste... 4 3.3

Mehr

Whitepaper Responsive Design

Whitepaper Responsive Design 76% Smartphone-Besitzer surfen täglich 69% Tablet-Besitzer surfen täglich 74% der Schweizer nutzen das Internet mobil Das mobile Internet ist mittlerweile fest in den Alltag der Schweizer integriert: 76

Mehr

Schulung Marketing Engine Thema : Einrichtung der App

Schulung Marketing Engine Thema : Einrichtung der App Schulung Marketing Engine Thema : Einrichtung der App Videoanleitung : http://www.edge-cdn.net/video_885168?playerskin=48100 Marketing Engine Tool : App Paket : Basis / Premium Version 2.0-03.11.2015 1

Mehr

RÖK Typo3 Dokumentation

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

Mehr

2. FAQ. 2.1 Headline Banner. Inhalt: 1.Installation. 1. Installation 2. FAQ 3. Einstellungen 4. Benötigen Sie weitere Hilfe?

2. FAQ. 2.1 Headline Banner. Inhalt: 1.Installation. 1. Installation 2. FAQ 3. Einstellungen 4. Benötigen Sie weitere Hilfe? Inhalt: 1. Installation 2. FAQ 3. Einstellungen 4. Benötigen Sie weitere Hilfe? 1.Installation Um das Electronics Theme zu installieren, gehen Sie in der Rubrik Design zum Template Store. Hier sehen Sie

Mehr

Mobile Fundraising. Praxisbeispiele. Katja Prescher Fundraiserin, Marketing- und Kommunikationsexpertin. Mobile Fundraising Katja Prescher

Mobile Fundraising. Praxisbeispiele. Katja Prescher Fundraiserin, Marketing- und Kommunikationsexpertin. Mobile Fundraising Katja Prescher Mobile Fundraising Praxisbeispiele Katja Prescher Fundraiserin, Marketing- und Kommunikationsexpertin katja.prescher@sozialmarketing.de @sozialmarketing @SoZmark 5.. Bonus-Tipp Auf den folgenden Seiten

Mehr

Aufbau einer HTML Seite:

Aufbau einer HTML Seite: 1 Aufbau einer HTML Seite: Grundstruktur: Head Bereich: "nicht sichtbar" Er enthält grundlegende Informationen wie: Title, Charset, Ansichtsgröße,

Mehr

Quickstart IMS Custom-Player Pro

Quickstart IMS Custom-Player Pro Quickstart IMS Custom-Player Pro Jedes IMS-MDN (Media Delivery Network) Konto bietet zum Abspielen von Flash Videos den Standard IMS Custom Player. Dieser Player wird von uns auf einem hoch performanten

Mehr

Xpert.ivy Developer Day 2014. User Dialog Features. Autoren: Peter Stöckli & Flavio Sadeghi Datum: 14. Mai 2014

Xpert.ivy Developer Day 2014. User Dialog Features. Autoren: Peter Stöckli & Flavio Sadeghi Datum: 14. Mai 2014 Xpert.ivy Developer Day 2014 User Dialog Features Autoren: Peter Stöckli & Flavio Sadeghi Datum: 14. Mai 2014 1 Inhalt Übersicht New User Dialog Wizard Form Fields CMS & Html Dialog Layouts JSF 2.2 / Primefaces

Mehr

Firefox Add-ons. Präsentation in WAP WS09/10 von Christoph ASCHBERGER, Andreas BERTOLIN, Robert MUTTER und Yunzhou XU

Firefox Add-ons. Präsentation in WAP WS09/10 von Christoph ASCHBERGER, Andreas BERTOLIN, Robert MUTTER und Yunzhou XU Firefox Add-ons Präsentation in WAP WS09/10 von Christoph ASCHBERGER, Andreas BERTOLIN, Robert MUTTER und Yunzhou XU Agenda Technisches Überblick XUL JavaScript CSS XPI-Pakete Einreichen bei Mozilla Sicherheitsüberlegungen

Mehr

Weil das Internet der Zukunft mobil ist 15. BVMW pecha kucha Nacht 12. Mai 2015

Weil das Internet der Zukunft mobil ist 15. BVMW pecha kucha Nacht 12. Mai 2015 RESPONSIVE WEBDESIGN Weil das Internet der Zukunft mobil ist 15. BVMW pecha kucha Nacht 12. Mai 2015 2000 2007 Apple iphone 2010 Apple ipad 2015 Smartphone Zombies 50% der Deutschen nutzten 2014 ein Smartphone

Mehr

Kleines Handbuch zur Fotogalerie der Pixel AG

Kleines Handbuch zur Fotogalerie der Pixel AG 1 1. Anmelden an der Galerie Um mit der Galerie arbeiten zu können muss man sich zuerst anmelden. Aufrufen der Galerie entweder über die Homepage (www.pixel-ag-bottwartal.de) oder über den direkten Link

Mehr

Inhalt: 1)Das Box-Modell

Inhalt: 1)Das Box-Modell Inhalt: 1. Das Box-Modell 2. Reset-CSS 3. CSS-Eigenschaft: position (static, relative, absolute) 4. CSS-Eigenschaft: float, clear 5. Übung 6. Die Seite zentrieren mit margin:auto 1)Das Box-Modell Die Box

Mehr

SEO SEARCH ENGINE OPTIMIZATION

SEO SEARCH ENGINE OPTIMIZATION SEO SEARCH ENGINE OPTIMIZATION Warum Suchmaschinenoptimierung? Mehr als 80% der Nutzer kommen über Suchmaschinen und Web-Verzeichnisse zu neuen Websites 33% aller Suchmaschinen User glauben, dass die zuerst

Mehr

APEX 5.0 DOAG Mai 2014

APEX 5.0 DOAG Mai 2014 APEX 5.0 DOAG Mai 2014 APEX 5.0 16 Jahre MuniQSoft GmbH Tätigkeitsbereiche: Oracle Support Hotline: Mo-Fr 8.00 18.00 Uhr Erweiterung um Rufbereitschaft auch am Wochenende möglich Oracle IT-Consulting &

Mehr

BOSS 2 BSZ One Stop Search

BOSS 2 BSZ One Stop Search BOSS 2 BSZ One Stop Search 16. BSZ-Kolloquium in Stuttgart 22.09.2015 Cornelius Amzar 1 Responsive Design Smartphone, Tablet, Fernseher, PC, Laptop Benutzer erwarten einen gleichwertigen Dienst für alle

Mehr

CAS WEBDESIGN UND WEBPUBLISHING KURS 1 / TAG 1: GRUNDLAGEN DER WEBENTWICKLUNG

CAS WEBDESIGN UND WEBPUBLISHING KURS 1 / TAG 1: GRUNDLAGEN DER WEBENTWICKLUNG CAS WEBDESIGN UND WEBPUBLISHING KURS 1 / TAG 1: GRUNDLAGEN DER WEBENTWICKLUNG Von Markus Stauffiger / 4eyes GmbH DOZENTENTEAM FÜR JEDES THEMA EIN SPEZIALIST ANDI KELLER andi@4eyes.ch Mitgründer von 4eyes

Mehr

Webengineering. jquery

Webengineering. jquery Webengineering jquery Marcel Vilas 1 DHBW - Stuttgart jquery - Allgemein jquery ist eine JavaScript-Bibliothek (API) jquery ist eine Funktion (Funktionen sind Objekte) Vorteile: einfacher als vanilla JavaScript

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

Umsetzen einer skalierbaren horizontalen Navigation:

Umsetzen einer skalierbaren horizontalen Navigation: Umsetzen einer skalierbaren horizontalen Navigation: Erstelle im Dreamweaver eine neue HTML - Datei (navigation.html) und eine CSS Datei (navigation.css). Die Struktur dieser Navigation soll auf einer

Mehr

Die Zeitungsproduktion

Die Zeitungsproduktion HTW Chur FS15 Power of Content 20. Juli 2015 Die Zeitungsproduktion Projekt «explorativ und kreativ» Sybille Hofer sybillehofer@gmx.ch 1 / 8 INHALTSVERZEICHNIS Workflow des gesammten Projekts...3 Erste

Mehr

Klicken Sie auf den Reiter Newsfeed (1) in der oberen Menüleiste und wählen Sie dann links in der schmalen grauen Leiste Neuer Newsfeed (2) aus:

Klicken Sie auf den Reiter Newsfeed (1) in der oberen Menüleiste und wählen Sie dann links in der schmalen grauen Leiste Neuer Newsfeed (2) aus: Seite 1 Wenn Sie daran interessiert sind, aktuelle Informationen über Ihr Unternehmen auf Ihrer Internetpräsenz zu veröffentlichen, ist die Newsfeed-Funktion von meltwater news genau das richtige für Sie.

Mehr

Logics Software GmbH

Logics Software GmbH Ihre Website für Smartphones Logics Software GmbH http://www.logics.de apps@logics.de mobile_web 1.4, 2012-01-30 / jf Ihre Website für Smartphones Inhalt Teil 1: Einführung Smartphone ist nicht gleich

Mehr