Upload
digicomp-academy-ag
View
97
Download
1
Embed Size (px)
Citation preview
Trends im Webdesign Flat-Design, Full-Screen, Responsive, Parallax-Scrolling, Onepager, Verstecke Menüs,
Videohintergründe, …, Design-Trends kommen und gehen.
reinegger.net
reinegger.net
Flat Design
Flat Design vs. Realism www.flatvsrealism.com
reinegger.net
Flat Design vs. Realism www.flatvsrealism.com
Flat Design
reinegger.net
www.reinegger.net
Full-Screen (Panorama)
reinegger.net
www.makeyourmoneymatter.org
www.sony.com/be-moved www.cyclemon.com
www.flatvsrealism.com
Parallax-Scrolling
reinegger.net
www.creativitykills.co
www.gcardoso.pt www.google.com/hangouts
www.ticariarac.vw.com.tr/mikrosite/Caravelle/
Single Page / Onepager
reinegger.net
www.pollenlondon.com
www.editions.ayr.com www.kennedyandoswald.com/#!/premiere-screen
www.wandaprint.com/home
Versteckte Menüs
Welche Zielgruppe? Lokal, National, International?
Web- bzw. Technik-Affin? In Social Media aktiv? Welche Generation?
B2B oder B2C? Online Käufer? Experimentel? Wissbegierig?
Kaufkraft? Mobil?
…
reinegger.net
Zielgruppen Ansprache Erfülle die Erwartungen deiner Zielgruppe!
Kommuniziere deine Alleinstellungsmerkmale (USP’”⁹s)! Verwende angepasste Landingpages / Microsites!
Hebe deine Gütesiegel / Zertifikate hervor! Heb dich von anderen ab!
Sammel Bewertungen! Nutze Call To Action!
Sei professionell! Sei authentisch!
…
reinegger.net
reinegger.net
Imagefilm und Fotos von Mitarbeitern bei der Arbeit - www.gepe-peterhoff.de
Authentizität
reinegger.net
Ice Bucket Challenge & Tafel - www.gepe-peterhoff.de
News / Engagement
reinegger.net
Fotos von Personal und Interieur & Gütesiegel - www.brillen-demmer.de
Spezialisierung / Kompetenzen
reinegger.net
Fotos von Personal, Rezensionen und Call to Action - www.praxisklinikaachen.de
Landingpage / Microsite
Usability Design-Trends kommen und gehen, was immer zählt ist
die Benutzbarkeit von Websites
reinegger.net
Technik Im Web ist alles abhängig von der Technik im Hintergrund.
reinegger.net
Qualität der eigenen Website messen
Überprüfung vom HTML Quellcode per W3C validator.w3.org
Überprüfung vom Stylesheet (CSS) per W3C www.css-validator.org
Überprüfung von fehlerhaften Links validator.w3.org/checklink
Überprüfung der Barrierefreiheit (WCAG) www.cynthiasays.com
Überprüfung der Responsivität www.jamus.co.uk/demos/rwd-demonstrations
Überprüfung der Semantik www.chrispederick.com/work/web-developer/
Überprüfung der Ladegeschwindigkeit developers.google.com/speed/pagespeed/insights
Überprüfung der Onpage SEO www.seorch.de
reinegger.net
Suchmaschinenoptimierung (SEO)
Wie funktioniert
- Onpage SEO?
- Offpage SEO?
- Local SEO?
Ist meine Seite SEO Optimiert?
SEO Tools und Tests für die eigene Website
reinegger.net
Onpage SEO
- Korrekte Title-Tag und Meta-Angaben
- Korrekte Semantik (Header Tags, Listenelemente, Paragraphen, …)
- Barrierefreiheit (z.B. Alt-Tags)
- Interne Linkstruktur (Linkjuice)
- SEO freundliche URL’”⁹S
- Content zu Code Verhältnis
- Sitemap, htaccess & Robots.txt
- Fehlerfreiheit (HTML & CSS Validierung)
- Performance - Ladezeiten
- …
reinegger.net
Suchmaschinenoptimierung (SEO)
reinegger.net
http://www.seo-summary.de/wp-content/uploads/onpage-seo-infografik_web.png
Suchmaschinenoptimierung (SEO)
reinegger.net
Suchmaschinenoptimierung (SEO)
http://www.seo-summary.de/wp-content/uploads/onpage-seo-infografik_web.png
Offpage SEO
- Linkaufbau
- PR / Artikel Submissions
- Social Bookmarking
- Social Media
- Verzeichnisse
- Video Submission
- Slideshare / PDF
- …
reinegger.net
Suchmaschinenoptimierung (SEO)
Local SEO
- Lokales Linkbuilding
- Online Branchenbuch Einträge
- Social Media
- Google+
- Google Places
- Landing Pages
- Social Media
- Bewertungsseiten
- …
reinegger.net
Suchmaschinenoptimierung (SEO)
Tools für die Onpage SEO
SEO Online Test www.seorch.de www.sistrix.de (kostenpflichtig)
SEO Site Tools (Browser Erweiterung) Für Google Chrome: www.chromeextensions.org/webmaster-seo/seo-site-tools Für Firefox: addons.mozilla.org/de/firefox/addon/seo-site-tools-analysis
Überprüfung der Ladegeschwindigkeit developers.google.com/speed/pagespeed/insights/Überprüfung der Barrierefreiheit (WCAG) www.cynthiasays.com Google Webmaster Tools www.google.com/webmasters/tools
reinegger.net
Suchmaschinenoptimierung (SEO)