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

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 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-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 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

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

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

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

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

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

Nachbau der Website 1.)Hintergrundbild einfügen eigene CSS-Datei

Nachbau der Website  1.)Hintergrundbild einfügen eigene CSS-Datei Nachbau der Website http://www.lake-festival.at/ Erstelle eine neue Bootstrapsite im Ordner lakefestival. Es soll alle Ordner bereits enthalten, back für diverse backgrounds, img mit vielen Bildern usw.

Mehr

ANWENDUNGSSOFTWARE CSS

ANWENDUNGSSOFTWARE CSS ANWENDUNGSSOFTWARE CSS NAVIGATION Bilder zur Navigation: als Anker für Verweise benutzen Text sollte nicht Bestandteil des Bildes sein (Bild als Hintergrund), siehe z-index Navigationslisten mit ,

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

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

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

Inhalt. 1 Mit CSS beginnen 1. 2 Textauszeichnungen und andere Grundlagen 13

Inhalt. 1 Mit CSS beginnen 1. 2 Textauszeichnungen und andere Grundlagen 13 D3kjd3Di38lk323nnm xiii 1 Mit CSS beginnen 1 1.1 Formate definieren mit CSS......................... 1 1.1.1 lnline-formate............................. 3 1.1.2 Eingebettete Formate........................

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

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

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

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

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

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

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

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

Übung: Bootstrap - Navbar

Übung: Bootstrap - Navbar Übung: Bootstrap - Navbar Angaben befinden sich im Ordner: 5_Übung_nav. Darin befinden sich die Bootstrap-Ordner und die dazu passende index.html, die bereits die Links zu den Ordnern enthält. Aufgabe:

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

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

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

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

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

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

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

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

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

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

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

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

Format- oder Stilvorlagen

Format- oder Stilvorlagen Vorraussetzung Sie sollten Grundkenntnisse der HTML-Sprache besitzen, um die Ausbildungseinheit Formatvorlagen, auch Stilvorlagen genannt, ohne Probleme verstehen zu können. Ist dies nicht der Fall, empfehlen

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

Frames oder Rahmen im Browserfenster

Frames oder Rahmen im Browserfenster In dieser Ausbildungseinheit zeigen wir Ihnen, wie Frames oder auch Rahmen im Browserfenster erstellt werden. Dabei möchten wir anmerken, dass zu Frames bereits sehr viel Gegensätzliches geschrieben wurde.

Mehr

CSS Einführung & CSS Frameworks

CSS Einführung & CSS Frameworks CSS Einführung & CSS Frameworks Leif Singer leif.singer@inf.uni-hannover.de Seminar Aktuelle Software-Engineering-Praktiken für das World Wide Web 14.04.2010 Frage Anfragen von Kommilitonen: mit reinsetzen

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

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

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

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

Der transparente Look. Die Struktur, die oben angegeben wurde, ist im Anwendungsdesigner, wie in der nächsten Grafik ersichtlich, abgebildet.

Der transparente Look. Die Struktur, die oben angegeben wurde, ist im Anwendungsdesigner, wie in der nächsten Grafik ersichtlich, abgebildet. Intrapact Layout Allgemeines Das Layout einer Firma wird im Intrapact Manager, und dort im Layout Designer erstellt. Alle Eingaben im Layout Designer dienen dazu um die CSS/ASP Dateien zu generieren, die

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

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

Inhaltsverzeichnis. Florian Bauer CSS Seite 2 von 10

Inhaltsverzeichnis. Florian Bauer CSS Seite 2 von 10 CSS Inhaltsverzeichnis Gestaltung mit CSS... 3 CSS einbinden... 3 On the fly... 3 Im Header... 3 In einer externen Datei... 3 Aufbau einer CSS Anweisung... 4 Wichtige CSS Eigenschaften... 4 Pseudoelemente...

Mehr

DOKUMENTATION. CaptchaAd als Werbevariante. Einbindung in Ihrer Webseite. Die Schritte zur Integration des CaptchaAds im Einzelnen

DOKUMENTATION. CaptchaAd als Werbevariante. Einbindung in Ihrer Webseite. Die Schritte zur Integration des CaptchaAds im Einzelnen CaptchaAd als Werbevariante Stand: 21. November 2016 Damit die Integration von CaptchaAd Ihnen noch leichter fällt, haben wir die notwendigen Schritte in diesem Leitfaden zusammen gefasst. Mit etwas Programmierkenntnissen

Mehr

JAmp - Accelerated Mobile Pages plugin. 1 Einführung

JAmp - Accelerated Mobile Pages plugin. 1 Einführung 1 Einführung AMP befreit eine mobile Webseite von vielen unnötigen Elementen, die dafür verantwortlich sind, dass eine normale Webseite langsam angezeigt wird, z. B. Tonnen von Cookies, JavaScript von

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

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

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

Mit der Maus im Menü links auf den Menüpunkt 'Seiten' gehen und auf 'Erstellen klicken.

Mit der Maus im Menü links auf den Menüpunkt 'Seiten' gehen und auf 'Erstellen klicken. Seite erstellen Mit der Maus im Menü links auf den Menüpunkt 'Seiten' gehen und auf 'Erstellen klicken. Es öffnet sich die Eingabe Seite um eine neue Seite zu erstellen. Seiten Titel festlegen Den neuen

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

MOBILE USABILITY. Johannes Ewald peerigon UG

MOBILE USABILITY. Johannes Ewald peerigon UG MOBILE USABILITY Johannes Ewald peerigon UG ÜBER MICH Johannes Ewald UI-Designer und Webentwickler Studium Interaktive Medien Gründung der peerigon UG MOBILE APP MOBILE WEB GRUNDLAGEN DER MOBILE USABILITY

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

Eclipse Scout Heute und Morgen. Jérémie Bresson BSI Business Systems Integration AG

Eclipse Scout Heute und Morgen. Jérémie Bresson BSI Business Systems Integration AG Eclipse Scout Heute und Morgen @ZimMatthias @j2r2b Matthias Zimmermann Jérémie Bresson BSI Business Systems Integration AG Scout Heute Neon Release Eclipse Scout Neon Release Neue Java Platform Neon Release

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

Layoutmodelle. Steffen Schwientek Große Klostergasse 5 61169 Friedberg Email:schwientek@web.de Web :schlaukopp.org

Layoutmodelle. Steffen Schwientek Große Klostergasse 5 61169 Friedberg Email:schwientek@web.de Web :schlaukopp.org Layoutmodelle HTML wurde von ihren Erfindern nicht als Layoutsprache entworfen, sondern zur Informationsübermittlung entworfen Es gab verschiedene Modelle, welche das Web populär machten und. Bei Erstellung

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

Browser Grid Funktionalitäten

Browser Grid Funktionalitäten Browser Grid Funktionalitäten Die Browser Grid Funktionalitäten können durch rechts Klick auf dem Grid eines Browsers aufgerufen werden. Fig. 1 Die erste Option Gruppe (bis zur ersten linie in Fig.1) enthält

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

Fachartikel. Responsive Webdesign

Fachartikel. Responsive Webdesign Bundesrealgymnasium 8010 Graz, Petersgasse 110 Fachartikel Peter Tschuffer Responsive Webdesign Anpassungsfähige Websites für unterschiedliche Ausgabegeräte gestalten Abbildung 1: Screenshot von www.responsivefba.tk

Mehr

Darstellung der Maßnahmen zur Suchmaschinenoptimierung

Darstellung der Maßnahmen zur Suchmaschinenoptimierung Darstellung der Maßnahmen zur Suchmaschinenoptimierung Ob und an welcher Position eine Seite zu einem bestimmten Suchbegriff in den organischen Suchergebnissen einer Suchmaschine erscheint hängt von sehr

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

Beautify your APEX. Alexej Schneider DOAG 2016

Beautify your APEX. Alexej Schneider DOAG 2016 Beautify your APEX Alexej Schneider DOAG 2016 Im Überblick Technologie-orientiert Branchen-unabhängig Hauptsitz Ratingen 240 Beschäftigte Ausbildungsbetrieb Inhabergeführte Aktiengesellschaft Gründungsjahr

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

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

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

Übung: Überschriften per CSS gestalten

Übung: Überschriften per CSS gestalten Übung: Überschriften per CSS gestalten Teil 1: Umsetzung eines Layouts mit zwei Überschriften mit zwei verschiedenen Hierarchieebenen, ergänzt durch einen beschreibenden Textabsatz. Teil 2: Wie Teil 1,

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

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

KILL PHOTOSHOP. Gestaltung im Browser mit Contao

KILL PHOTOSHOP. Gestaltung im Browser mit Contao KILL PHOTOSHOP Gestaltung im Browser mit Contao DENNIS ERDMANN Kiel, Schleswig-Holstein" Geschäftsführer bei SOLADES" Steuermann bei Erdmann & Freunde" Contao-Nutzer seit 2008 RÜCKBLICK Warum ist Photoshop

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

Es gibt zahlreiche Web-Programmiersprachen: HTML, CSS, JavaScript, PHP, Perl, Python, HTTP, XML und viele weitere.

Es gibt zahlreiche Web-Programmiersprachen: HTML, CSS, JavaScript, PHP, Perl, Python, HTTP, XML und viele weitere. 1.0.0 Allgemeine Informationen Es gibt zahlreiche Web-Programmiersprachen: HTML, CSS, JavaScript, PHP, Perl, Python, HTTP, XML und viele weitere. Wir werden uns hauptsächlich mit HTML beschäftigen, weil

Mehr

Advanced CMS. Copyright 2015 silbersaiten.de Service&Support: https://addons.prestashop.com/en/write-to-developper?

Advanced CMS. Copyright 2015 silbersaiten.de Service&Support: https://addons.prestashop.com/en/write-to-developper? Advanced CMS Copyright 2015 silbersaiten.de Service&Support: https://addons.prestashop.com/en/write-to-developper?id_product=19835 1. Installation Nachdem Sie das Modul Advanced CMS heruntergeladen und

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

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

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

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

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

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

RoxIVE - Das Responsive OXID eshop Theme

RoxIVE - Das Responsive OXID eshop Theme Table of Contents 1. Einleitung 2. Systemvoraussetzungen 3. Installation 4. Theme updaten 5. Theme einstellen 6. Theme anpassen 7. Informationen für Entwickler 8. Troubleshooting 9. Hilfe & Support RoxIVE

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

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

Warum wir den High-Volume Onlineshop entwickelt haben

Warum wir den High-Volume Onlineshop entwickelt haben Warum wir den High-Volume Onlineshop entwickelt haben Wir haben unseren Ansatz, Fotos zu verkaufen, überdacht und stellen Ihnen nun einen komplett überarbeiten Onlineshop zur Verfügung. Dafür haben wir

Mehr

kostenlose Homepage erstellen

kostenlose Homepage erstellen kostenlose Homepage erstellen Anleitung zur Erstellung einer kostenlosen Homepage Seite 1 Inhalt Einleitung...3 Hosting...5 Homepage Baukasten...10 Web Design...13 Homepage erstellen...14 Webseiten...15

Mehr

Excel Diagramme. Dateneingabe zur späteren Verarbeitung als Diagramm

Excel Diagramme. Dateneingabe zur späteren Verarbeitung als Diagramm Excel Diagramme Dateneingabe zur späteren Verarbeitung als Diagramm Gib zunächst in Excel einige Zahlen ein, die du später in einem Diagramm darstellen möchtest. In diesem Beispiel verwende ich die Umsatzzahlen

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

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

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

In dieser Übung werden Sie auf den UMN-WebServer der FH zugreifen und die WMS Requests GetCapabilities und GetMap anwenden.

In dieser Übung werden Sie auf den UMN-WebServer der FH zugreifen und die WMS Requests GetCapabilities und GetMap anwenden. Fachbereich I Geoinformatik und Vermessung Karto - WS 2005/2006 Prof. Dr. A. Zipf WEBMapping mit UMN MapServer Diese Übungen werden unter Ihrem privaten Account ausgeführt. Übung 1: In dieser Übung werden

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

JSCMS Dokumentation. (Stand: 27.05.09)

JSCMS Dokumentation. (Stand: 27.05.09) JSCMS Dokumentation (Stand: 27.05.09) Inhalt: CMS Symbole und Funktionen. 2 Verwalten.. ab 3 Seiten Verwalten.. 4 Blöcke Verwalten....6 Templates Verwalten....7 Template Editor...8 Metatags bearbeiten..

Mehr

Hier zuerst eine grobe Übersicht, nachfolgend werden die einzelnen Schritte genauer erklärt:

Hier zuerst eine grobe Übersicht, nachfolgend werden die einzelnen Schritte genauer erklärt: ANLEITUNG zum Eintrag Ihrer Homepage auf Gingu.de Hier zuerst eine grobe Übersicht, nachfolgend werden die einzelnen Schritte genauer erklärt: 1. Kostenlos registrieren 2. Zum Erstellen eines Eintrages

Mehr

Inhalt. Technische Beschreibung - MEDIA3000 NEWSLETTERMODUL-PRO

Inhalt. Technische Beschreibung - MEDIA3000 NEWSLETTERMODUL-PRO Inhalt 01. Nachrichten (Newsletter erstellen) 02. Empfänger 03. Newsletter (Gruppen anlegen) 04. Nachrichtenvorlagen 05. Mailvorlagen 06. Einstellungen 07. Steuerzeichen 08. Newsletter testen Tipps und

Mehr