of 33/33
1 Websiteentwicklung auf Basis vonTYPO3 Unterlagen zur Vorlesung WS 19/20 1. Pagemachine 2. Inhalt der Vorlesung 3. Einführung CMS und TYPO3 4. Links 5. Bekannte Websites mit TYPO3 1 2

Websiteentwicklung auf Basis vonTYPO3 Unterlagen zur ...Certified TYPO3 Integrator Der „Certified TYPO3 Integrator“ ist eine von der TYPO3 Association entwickelte Zertifizierung

  • View
    2

  • Download
    0

Embed Size (px)

Text of Websiteentwicklung auf Basis vonTYPO3 Unterlagen zur ...Certified TYPO3 Integrator Der „Certified...

  • 1

    Websiteentwicklung auf Basis vonTYPO3

    Unterlagen zur VorlesungWS 19/20

    1. Pagemachine

    2. Inhalt der Vorlesung

    3. Einführung CMS und TYPO3

    4. Links

    5. Bekannte Websites mit TYPO3

    1

    2

  • 2

    www.Pagemachine.de

    Pagemachine

    Miklos Weiszhaupt

    Dipl.-Ing. Nachrichtentechnik, TU Darmstadt

    Mitgründer der Pagemachine in 2001

    Seit 2004 Realisierung von Webprojekten auf Basis von TYPO3

    www.Pagemachine.de

    Pagemachine

    Full Service Digitalagentur

    Konzeption und Umsetzung von webbasierten Lösungen

    18 Mitarbeiter in den Bereichen:

    Beratung, Konzeption, Gestaltung,

    Programmierung,TYPO3, Extensions

    Onlinemarketing

    3

    4

  • 3

    www.Pagemachine.de

    Pagemachine

    TYPO3 Community

    Codesprints

    Marketingsprints

    Designsprints

    Education Committee Sprint

    Core Entwickler

    www.Pagemachine.de

    Pagemachine

    F & E Projekt gemeinsam mit Frankfurt UAS

    Ist eine Sammlung von Kommunikationsprotokollen für

    Anwendungen wie Videokonferenz, Dateitransfer bzw.

    Datenübertragung, Chat und Desktopsharing.

    Entwicklung von speziellen Protokollen und Algorithmen

    Prototypische Umsetzung von Anwendungen

    5

    6

  • 4

    www.Pagemachine.de

    Pagemachine

    www.Pagemachine.de

    Die Pagemachine AG

    Praktikum und Bachelor-Thesis bei uns

    TYPO3

    WebRTC

    Technologien und Methoden, z.B.:

    HTML, CSS

    Bootstrap, Less/Sass

    TypoScript

    JavaScript – Vue.js, JsSIP

    PHP

    MySQL, MongoDB

    Deployment (z.B. Docker, Shippable), Versionsverwaltung (Bitbucket)

    Agile Methoden, Scrum, Kanban

    7

    8

  • 5

    1. Die Pagemachine AG

    2. Inhalt der Vorlesung

    3. Einführung CMS und TYPO3

    4. Links

    5. Bekannte Websites mit TYPO3

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Fragestellungen

    Realisierung einer Website auf Basis von TYPO3

    unter Vorgabe eines Gestaltungskonzepts.

    Wie ist der prinzipielle Projektablauf?

    Welche Technologien werden verwendet?

    Warum wird ein CMS eingesetzt?

    Welche Elemente hat eine typische Website?

    Wie wird eine Website in TYPO3 realisiert?

    9

    10

  • 6

    www.Pagemachine.de

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Aufgabenstellung

    Vorgabe: Designkonzept (Dummy)

    Kopfbereich mit Logo und Bild

    Hauptnavigation horizontal

    Subnavigation vertikal

    Breadcrumb Navigation

    Suchfunktion

    Mehrsprachig (DE / EN)

    News

    Kontaktformular

    Sitemap

    11

    12

  • 7

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Einrichtung und Konfiguration von TYPO3

    Wie ist TYPO3 aufgebaut?

    Was wird zum Betreiben von TYPO3 benötigt?

    Installation von TYPO3 auf dem eigenen Rechner

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Entwicklung der Designvorlage (HTML /CSS)

    Entwicklung des Templates

    HTML Grundlagen

    CSS Grundlagen

    Bildformate

    13

    14

  • 8

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    TypoScript

    eigene Konfigurationssprache

    Einführung in die Syntax

    TypoScript Entwicklung

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Auswahl, Installation und Konfiguration der

    erforderlichen Extensions

    Newsmodul

    Suche

    15

    16

  • 9

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Suchmaschinenoptimierung / Kennzahlen

    Wie funktioniert SEO?

    Welche Maßnahmen gibt es?

    Wie kann man den Erfolg messen?

    Welche Kennzahlen gibt es?

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Certified TYPO3 Integrator

    Der „Certified TYPO3 Integrator“ ist eine von der TYPO3 Association entwickelte

    Zertifizierung für all jene, die ihre TYPO3-Kenntnisse testen und dokumentieren

    möchten.

    Die anspruchsvolle Prüfung umfasst Themen wie

    TypoScript

    Templating

    Backend-Administration

    Grundlagen der TYPO3-Implemetierung

    Auswahl, Installation und Konfiguration von Extensions

    Freiberuflern wie Agenturen dient das Zertifikat somit als Qualifikationsnachweis

    bei anspruchsvollen Kundenprojekten. Gleichzeitig erhalten Unternehmen ein

    objektives Kriterium für die Auswahl ihrer Dienstleister.

    17

    18

  • 10

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    www.Pagemachine.de

    Wie arbeiten wir?Inhalt der Vorlesung

    Klausur

    Multiple Choice

    Themengebiete

    allgemeine Fragen zu TYPO3

    Fragen zu HTML / CSS

    Fragen zu TypoScript

    Fragen zu den Themen „SEO“, „Usability“

    Präsentationen zur Vorlesung ausreichend.

    19

    20

  • 11

    1. Die Pagemachine AG

    2. Inhalt der Vorlesung

    3. Einführung CMS und TYPO3

    4. Links

    5. Bekannte Websites mit TYPO3

    www.Pagemachine.de

    Wie denken wir?

    Content Management System

    Ein Content-Management-System (kurz: CMS, übersetzt:

    Inhaltsverwaltungssystem) ist ein System zur gemeinschaftlichen Erstellung,

    Bearbeitung und Organisation von Inhalten.

    Diese können aus Text- und Multimedia-Dokumenten bestehen. Ein Autor kann

    ein solches System in den meisten Fällen ohne Programmier- oder HTML-

    Kenntnisse bedienen. Der darzustellende Informationsgehalt wird in diesem

    Zusammenhang als Content (Inhalt) bezeichnet.

    Wikipedia

    CMS und TYPO3

    21

    22

  • 12

    www.Pagemachine.de

    Wie denken wir?

    Content Management System

    Tageszeitungen führten in den 80er Jahren Redaktionssysteme ein.

    Diese Systeme wurden in den „Online-Redaktionen“ um weitere

    Funktionen erweitert.

    Heute werden Redaktionssysteme /Content Management Systeme in

    zahlreichen Unternehmen eingesetzt für das Erstellen von Content für:

    Kataloge

    Bedienungsanleitungen

    Preislisten

    Technische Dokumentation

    Medienneutrale Datenhaltung für Export in beliebigen Formaten

    CMS und TYPO3

    CD-ROM / DVD

    Websites

    Intranet

    Apps

    www.Pagemachine.de

    Wie denken wir?

    Web Content Management System

    Bei den WCMS-Systemen handelt es sich um Systeme für die Erstellung und

    Verwaltung des Contents für das Internet, für Intranets und Extranets, die die

    Interaktion und Kommunikation zwischen Benutzer und Website

    unterstützen.

    CMS und TYPO3

    23

    24

  • 13

    www.Pagemachine.de

    Wie denken wir?

    Content Management Systeme

    Verteilung von Open Source CMS Systemen in Deutschland

    (Quelle: www.cmscrawler.com)

    1. Wordpress 5.222.844 Websites

    2. Joomla! 590.694 Websites

    3. Drupal 314.027 Websites

    4. (Wix.com 300.446 Websites - kein Open Source)

    5. TYPO3 188.143 Websites

    Stand 10/2019

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    Websiteentwicklung ohne CMS

    Statische Websites

    CMS und TYPO3

    25

    26

    http://www.cmscrawler.com/

  • 14

    www.Pagemachine.de

    Wie denken wir?

    Websiteentwicklung ohne CMS

    Statische Websites

    Inhalt und Gestaltung werden gemeinsam programmiert.

    Ergebnis wird hochgeladen

    Nachteile

    Ohne Programmierkenntnisse kann die Website nicht gepflegt werden.

    Umfangreiche Websites mit vielen Einzelseiten und Sprachen können

    nur mit erheblichem Aufwand gepflegt werden.

    Hohe Fehleranfälligkeit

    i.d.R. dauert es lange bis Änderungen online sind

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    Content Management System

    CMS und TYPO3

    Navigation

    Gestaltung

    Inhalt

    +

    +

    CMS

    27

    28

  • 15

    www.Pagemachine.de

    Wie denken wir?

    Content Management System

    Gestaltung, Inhalt und Navigation werden getrennt erstellt.

    Nur die Gestaltung wird von der Agentur erstellt.

    Alle Inhalte wie Texte und Grafiken können ohne Programmierkenntnisse

    z.B. von Redakteuren oder Marketingabteilung editiert werden.

    Navigation wird ebenfalls ohne Programmierkenntnisse bearbeitet.

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    Content Management System - Vorteile

    Dezentrale Pflege

    Redakteure benötigen keine Programmierkenntnisse

    Individuell konfigurierbare Rechte für Redakteure

    Einhaltung der Design-Vorgaben

    Automatische Generierung der Navigation

    Speicherung der Inhalte in einer Datenbank => Mehrfachnutzung

    Regelmäßige Updates (z.B. Sicherheitspatches oder Anpassung an

    neue Browser)

    Content just in time

    Quelle: www.typo3.com

    CMS und TYPO3

    29

    30

  • 16

    www.Pagemachine.de

    Wie denken wir?

    Enterprise Web Content Management System (EWCMS)

    Open Source GPL (GNU Public License)

    TYPO3 darf kommerziell genutzt werden

    Man darf das System verändern, muss aber ursprüngliche

    Copyrighthinweise bewahren

    Eigenentwicklungen dürfen in Rechnung gestellt werden

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    GNU-Projekt

    Das GNU-Projekt wurde von Richard Stallman mit dem Ziel gegründet, ein

    offenes, unixähnliches Betriebssystem zu schaffen, das sicherstellt, dass die

    Endbenutzer die Freiheiten haben, es verwenden, untersuchen, verbreiten

    (kopieren) und ändern zu dürfen. Software, deren Lizenz diese Freiheiten

    garantiert, wird Freie Software (Free Software) genannt, GNU ist in diesem Sinne

    frei.

    Da es in der Zeit am MIT üblich war, für Programme, die anderen Programmen

    ähneln, rekursive Akronyme zu nutzen, wählte Stallman den Namen GNU für

    „GNU’s not Unix“.

    Bekanntheit erlangte das Projekt vor allem auch durch die von ihm eingeführte

    GNU General Public License (GPL)

    Quelle: www.typo3.com

    CMS und TYPO3

    31

    32

  • 17

    www.Pagemachine.de

    Wie denken wir?

    TYPO3 darf prinzipiell für alle Arten von Websites verwendet werden

    Allerdings wünscht sich Kasper Skårhøj, dass es nicht für

    Pornografische Websites

    Antireligiöse Websites

    Websites mit menschrechtsverletzenden Inhalt

    Kasper Skårhøj (* 1975 in Dänemark) Erfinder und

    ehemaliger Chefentwickler

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    1997 – Kaspar Skårhøj beginnt mit der Entwicklung von TYPO3

    2000 – erste Beta Version

    2002 – Die Version 3.0 wird veröffentlicht

    2006 – Version 4.0, Runderneuerung des Backend, besser Usability

    2011 – Version 4.5, Performanceoptimierung, HTML5 Unterstützung,

    2012 – Version 6.0, Optimierung des Codes und des Backends, FAL

    2014 – Version 6.2 LTS

    2014 – Version 7.0, Code-Cleanup, Redesign des Backends

    2016 – Version 7.6 LTS, responsive Backend, Bildercropping

    2017 – Version 8.7 LTS, unterstützt PHP7, Formularframework, CK Editor

    2018 – Version 9.5 LTS

    2019 – Start Version 10

    CMS und TYPO3

    33

    34

  • 18

    www.Pagemachine.de

    Wie denken wir?

    Und was ist mit der Version 5?

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    TYPO3 Flow

    TYPO3 Flow (ursprünglich FLOW3) ist ein in PHP geschriebenes freies

    Applikation-Framework, dessen erste finale Version am 20. Oktober 2011

    erschien.

    Es wurde zwar in erster Linie als Grundlage für das Content-Management-System

    TYPO3 Neos entwickelt, lässt sich aber auch unabhängig davon einsetzen.

    Es eignet sich generell für die Entwicklung von Software in PHP mit einem

    mittleren oder hohen Umfang

    Quelle: Wikipedia

    CMS und TYPO3

    35

    36

  • 19

    www.Pagemachine.de

    Wie denken wir?

    - in Zahlen

    9.400.000+ Downloads

    500.000+ Websites mit TYPO3

    79.000+ registrierte Entwickler

    1.800+ Extensions

    1647+ registrierte Agenturen

    51 Sprachen

    Quelle typo3.org (2017)

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?CMS und TYPO3

    37

    38

  • 20

    www.Pagemachine.de

    Wie denken wir?

    typo3.org

    Zentrale Anlaufstelle zu allen Themen rund um TYPO3

    Allgemeine Infos

    Download der aktuellen Versionen

    Dokumentation

    Community

    Termine und Veranstaltungen

    Extension Repository

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    Verein: 2004 gegründet, Sitz in der Schweiz

    Fördert die Weiterentwicklung von TYPO3

    Organisiert die TYPO3 Veranstaltungen

    T3BOARD, TYPO3 Conference, T3DD

    Wird durch Spenden und Mitgliedschaften finanziert

    Man kann Mitglied werden durch Zahlung eines einmaligen Betrages und

    einer jährlichen Mitgliedsgebühr

    Ist für die TYPO3-Zertifizierungsprüfung verantwortlich - CertiFUNcation

    http://association.typo3.org

    CMS und TYPO3

    39

    40

    http://association.typo3.org/

  • 21

    www.Pagemachine.de

    Wie denken wir?

    TYPO3 GmbH

    Gegründet in 2016 von der TYPO3 Association, Sitz in Düsseldorf

    Ca. 10 Mitarbeiter, Geschäftsführer Mathias Schreiber

    Ist kommerzieller Arm von TYPO3

    Marketing

    Support für Agenturen

    Organisiert Code Sprints

    Bietet erweiterten Long Term Support für einzelne TYPO3 Versionen

    Bietet Service Level Agreements

    www.typo3.com

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    -Content Management System

    Trennung von Inhalt (Content), Navigation und Layout

    Layout wird von der Agentur initial angelegt

    Inhalte wie Texte und Grafiken werden ohne Programmierkenntnisse erstellt

    Content und Navigation werden in der Datenbank gespeichert

    Layout, Inhalt und Navigation wird durch TYPO3 (Typoscript)

    zusammengefügt

    CMS und TYPO3

    41

    42

    http://www.typo3.com/

  • 22

    www.Pagemachine.de

    Wie denken wir?

    - einfach im Einsatz

    Inhalte (Content) werden ausschließlich über Webbrowser bearbeitet

    Der Redakteur kann die Website von jedem PC mit Webzugang editieren

    Redakteure, Administratoren und Entwickler können parallel an der

    Website arbeiten

    Die Entwicklung kann ebenfalls direkt im Backend erfolgen

    Arbeiten mehrere Entwickler parallel an komplexen Website, sind externe

    Tools und Versionsverwaltung (Git) empfehlenswert

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    - viele Funktionen

    Offene Architektur / nahezu beliebig erweiterbar

    Mehrere Websites / Domains

    Asset Management -FAL (File Abstraction Layer)-Modul

    Mehrsprachigkeit

    Workflow Management (Workspaces)

    Integrierte Bildbearbeitung (ImageMagick)

    Individuell konfigurierbares Rechtekonzept

    CMS und TYPO3

    43

    44

  • 23

    www.Pagemachine.de

    Wie denken wir?

    - einfache Erweiterbarkeit

    Zahlreiche (>6.000) Extensions, z.B.

    Newsverwaltung

    FAQ Modul

    Userverwaltung (Registrierung, Login)

    Glossar Modul

    Shop Modul

    Bewerber Management

    Newsletteranmeldung und Versand

    Einbindung von Twitter , RSS Feeds etc.

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    - individuell erweiterbar

    Einfache Entwicklung von kundenspezifischen Erweiterungen

    Anpassung und Erweiterung bestehender Extensions

    Programmierung von Schnittstellen zur Anbindung an Datenbanken, CRM,

    ERP, SAP etc.

    Schnittstellen zu Social Media (Facebook, Twitter etc)

    Als Framework einsetzbar

    CMS und TYPO3

    45

    46

  • 24

    www.Pagemachine.de

    Wie denken wir?

    - offen für moderne Technologien

    Responsive Design

    Einbindung von JavaScript-Bibliotheken (z.B. jQuery) für die

    DOM Manipulation

    z.B. für Animationen, Filterfunktionen

    Mit AJAX (Asynchronous JavaScript and XML)

    können HTTP-Anfragen durchgeführt werden, während eine HTML-Seite

    angezeigt wird. Damit kann die Seite verändert werden, ohne sie komplett

    neu zu laden. (z.B. Suggestfunktion)

    CMS und TYPO3

    www.Pagemachine.de

    Wie denken wir?

    - Optimierung

    Viele Standardfunktionen zur Suchmaschinenoptimierung (SEO)

    Valider Quellcode

    Sprechende URL‘s

    Metadaten (z.B. Title, Description)

    Google Sitemap

    Canonical Tag

    CMS und TYPO3

    47

    48

  • 25

    www.Pagemachine.de

    Wie denken wir?

    - kostengünstig

    Keine Lizenzkosten

    Keine laufenden Kosten

    Zahlreiche kostenfreie Erweiterungen

    CMS und TYPO3

    Quelle: www.typo3.com

    www.Pagemachine.de

    Wie denken wir?CMS und TYPO3

    Backend

    Navigationsleiste DetailansichtModulleiste

    Frontend

    49

    50

  • 26

    1. Die Pagemachine AG

    2. Inhalt der Vorlesung

    3. Einführung CMS und TYPO3

    4. Links

    5. Bekannte Websites mit TYPO3

    www.Pagemachine.de

    Tools & Links

    Links

    www.typo3.org

    http://association.typo3.org, http://bugs.typo3.org

    http://www.typo3.net/forum/

    http://www.typo3forum.net/

    http://www.typo3-snippets.de/

    http://typo3blogger.de/linkliste/ (Linksammlung mit über 2.000 Links)

    http://www.w3.org/

    http://validator.w3.org/

    51

    52

    http://www.typo3.org/http://association.typo3.org/http://bugs.typo3.org/http://www.typo3.net/forum/http://www.typo3forum.net/http://www.typo3-snippets.de/http://typo3blogger.de/linkliste/http://www.w3.org/http://validator.w3.org/

  • 27

    1. Die Pagemachine AG

    2. Inhalt der Vorlesung

    3. Einführung CMS und TYPO3

    4. Links

    5. Bekannte Websites mit TYPO3

    www.Pagemachine.de

    Tools & Links

    Etwa 50% aller Dax-500-Unternehmen setzen

    derzeit ein TYPO3 CMS ein.

    53

    54

  • 28

    www.Pagemachine.de

    Tools & Links

    Sehr verbreitet an Hochschulen

    Eigenes TYPO3 Association Academic Committee

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    55

    56

  • 29

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    57

    58

  • 30

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    59

    60

  • 31

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    SIXT Autovermietung

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielwebsites

    61

    62

  • 32

    www.Pagemachine.de

    Wie arbeiten wir?TYPO3 Beispielseiten

    Weitere Beispiele

    Viele weitere Beispiele finden Sie z.B. auf:

    http://www.typo3-websites.eu

    1. Die Pagemachine AG

    2. Inhalt der Vorlesung

    3. Einführung CMS und TYPO3

    4. Links

    5. Bekannte Websites mit TYPO3

    63

    64

    http://www.typo3-websites.eu/

  • 33

    www.Pagemachine.de

    Wie denken wir?

    Nächste Vorlesung

    24.10.2019

    Themen

    TYPO3 Installation und Administration

    CMS und TYPO3

    www.Pagemachine.de

    Vielen Dank

    für Ihre Aufmerksamkeit

    Diese Präsentation können Sie ab morgen unter:

    www.Pagemachine.de/fh-frankfurt

    herunterladen.

    65

    66

    http://www.pagemachine.de/fh-frankfurt