Weiterbildung Webdesign mit Grafikdesign

HTML (ca. 5 Tage)

Grundgerüst

Tags zur Texterstellung (h1-h6, p, br)

Grundlagen CSS

Text-Format-Befehle

Gerüstbildende HTML-Tags (z. B. header, nav)

Grafiken einbinden und in Photoshop aufbereiten

Favicons

Verlinkungen

Interne-, Externe-, Tel.-, mailto-Links

Listen und Tabellen

Formulare in HTML

Formularelemente

Einbindung von Video- und Audioelementen

Einbindung von YouTube und Google-Maps

Unterschiede zwischen XHTML und HTML

Künstliche Intelligenz (KI) im Arbeitsprozess

Vorstellung von konkreten KI‐Technologien sowie Anwendungsmöglichkeiten im beruflichen Umfeld

Grundlagen CSS (ca. 5 Tage)

Grundlagen Dreamweaver

Einbindungsmöglichkeiten von CSS-Angaben (intern, extern, inline-Style)

Textgestaltung mit CSS

CSS-Attribute zur Gestaltung von Bordern und Abständen (padding, margin)

Hintergrundgestaltung per CSS

Grundlagen float/clear

Spaltigkeit mit float

Farben mit CSS

Clearfix

Pseudoelemente (::before/::after)

Pseudoklassen (:nth-of-type)

Listen/display/Link-Pseudo-Klassen

Navigation mit ul/li (horizontal/vertikal)

CSS-Flexbox (ca. 5 Tage)

Spaltigkeit mit Flex

Ausrichtung von Elementen mit Flex

Spalten in Spalten mit Flex

Individuelle Schrift verwenden (@font-face)

Schriften mit Dreamweaver

Dreamweaver – CSS-Designer

CSS-Position

Positionen: relative/absolute/fixed

Möglichkeiten zur Formulargestaltung per CSS

CSS-Farbverläufe

CSS – transition/transform

Responsives Webdesign (ca. 6 Tage)

Breakpoints, Viewport, Media-Querys

Header und header-img responsiv gestalten

Picture-Elemente in HTML

Mobile Navigation mit hover

Hover in click auf Apple-Handys ermöglichen

Klick-Event per CSS (mittels checkbox)

Responsive Navigationen mit click

Animierter Burger-Button

CSS-Akordeon (mittels Radio-Buttons)

Drop-Down-Menü für Desktop und Mobile

Unterschiedliche Designs

CSS-Pseudoklasse :target

One-Page-Site – Seitenstruktur

Responsive Navigation mit :target-Steuerung

Vorteile von One-Page-Sites

JavaScript (ca. 9 Tage)

Anwendungen einbinden

Einstieg in JavaScript/jQuery

If-then-else

Variablen

Data Objekt

Array Datentyp

ScrollTop

For-Schleife

Math-Objekt

Sticky-menu (js/css)

Menu mit Scrollen ein-/ausblenden

Verwendung von vh/vw und calc

Pflichtangaben Impressum/Datenschutz

Cookiehinweis

Font-awesome – Symbol Bibliothek

CSS-Filter

CSS-Variablen

Optim. der Site für die Suchmaschinen (SEO)

Object fit – Rahmenfüllende Grafiken

CSS-Animation

CSS-Grid

Grid-template-areas

Einführung in CSS-Framework: Bootstrap

Projektarbeit (ca. 10 Tage)

Zur Vertiefung der gelernten Inhalte

Präsentation der Projektergebnisse

Einführung in die Adobe Creative Cloud (ca. 2 Tage)

Desktop Programme im Überblick: Photoshop, Illustrator, InDesign

Adobe Mobile Apps für Grafikdesign

Creative Cloud Bibliotheken

Farbtrends und Inspirationen (z. B. Adobe Stock, Adobe Color)

Adobe Bridge, Adobe Exchange

Grundlagen (ca. 1 Tag)

Kunst vs. Design

Designdisziplinen, Designprinzipien

Designprozess

Gestaltgesetze der Wahrnehmung

Blickverlauf und Anordnung

Figur-Grund-Beziehung

Optische Täuschungen und Phänomene

Interferenzeffekte, Hicks Gesetz

Perspektive und räumliche Wirkung

Form und Farbe (ca. 2 Tage)

Punkt, Linie und Fläche

Anordnung und Gewichtung

Format, Proportionen und Seitenverhältnisse

Farbenlehre und Farbsysteme

Eigenschaften, Wirkung und Bedeutung

Farbgestaltung (Harmonien, Kontraste)

Aufmerksamkeit durch Form und Farbe

Erstellung und Bearbeitung von Formen (Zeichen, Piktogramme, Icons)

Künstliche Intelligenz (KI) im Arbeitsprozess

Vorstellung von konkreten KI‐Technologien sowie Anwendungsmöglichkeiten im beruflichen Umfeld

Bilder (ca. 3 Tage)

Bildkompetenz und Bildqualität

Pixel- und Vektorgrafik

Recherche, Idee, Moodboard

Eyecatcher und Storytelling

Der Mensch als Motiv

Bilder in der Unternehmenskommunikation

Bildgestaltung und Bildbearbeitung

Typografie und Layout (ca. 5 Tage)

Anatomie der Buchstaben

Schriftgeschichte, Schriftklassifikation

Schriftmischung

Lesetypografie, Detailtypografie

Workflow: Layout

Grundregeln guter Layouts

Satzspiegel und Gestaltungsraster

Dramaturgie, Blickführung und Fokus

Layoutideen umsetzen, präsentieren

Dateiausgabe im Überblick (Print, Digital)

Corporate Design (ca. 2 Tage)

Corporate Design vs. Corporate Identity

Basisbausteine

Logodesign, Signets und Marken

Umsetzung – Wort-Bild-Marke

Das Corporate – Design-Manual (Styleguide)

Projektarbeit (ca. 5 Tage)

Zur Vertiefung der gelernten Inhalte

Präsentation der Projektergebnisse

Im Bereich Webdesign mit HTML, CSS und Dreamweaver werden grundlegende und fortgeschrittene Techniken zur Erstellung von modernen, funktionalen Websites vermittelt. Zunächst wird ein HTML-Grundgerüst aufgebaut, mit den grundlegenden Tags zur Texterstellung, wie h1-h6, p, br, und strukturierenden HTML-Tags wie header und nav. Die Erstellung und Einbindung von Grafiken werden ebenso behandelt wie die Optimierung in Photoshop, und es werden Favicons sowie Verlinkungen zu internen und externen Seiten, Telefon- und mailto-Links implementiert. Die Gestaltung von Listen und Tabellen und die Integration von Formularen und interaktiven Formularelementen werden ebenso behandelt wie die Einbindung von Video- und Audioelementen, YouTube-Videos und Google Maps.

Im Bereich CSS-Grundlagen werden essentielle Themen wie die Textgestaltung mit CSS sowie Attribute zur Gestaltung von Bordern und Abständen (wie padding, margin) behandelt. Weiterhin werden Hintergrundgestaltung per CSS, der Einsatz von Pseudoelementen und Pseudoklassen sowie die Navigation mit ul/li im horizontalen und vertikalen Layout eingeführt. Ein weiteres Ziel der CSS-Weiterbildung ist es, die Spaltigkeit mit Flexbox zu erlernen, um eine flexible und responsive Gestaltung von Websites zu ermöglichen. Es wird darauf geachtet, wie Schriften mit Dreamweaver und CSS-Farbverläufe verwendet werden und welche Möglichkeiten es zur Positionierung von Elementen gibt.

Das Responsives Webdesign stellt sicher, dass Websites auf allen Geräten gut aussehen. Die Breakpoints, Viewport und Media Queries werden eingeführt, um flexible Layouts zu gestalten. Der Umgang mit mobile Navigation, der Klick-Ereignisse bei Apple-Geräten, und die Erstellung von animierten Burger-Buttons stehen ebenfalls auf dem Programm. Außerdem wird die Gestaltung einer One-Page-Site sowie die Steuerung einer Responsive Navigation mit :target-Steuerung behandelt. Diese Schulung bietet auch umfassende Einblicke in JavaScript, jQuery und deren Anwendung zur Interaktivität von Websites, einschließlich der Integration von Cookiehinweisen, Font Awesome-Symbolbibliotheken, und der SEO-Optimierung von Websites.

Im Bereich der Projektarbeit wird das Gelernte vertieft und es werden praktische Projekte erstellt, die die Mediengestaltung auf verschiedenen Plattformen wie Digital, Print und Web berücksichtigen. Dies umfasst die Adobe Creative Cloud und deren Programme wie Photoshop, Illustrator und InDesign, mit der Nutzung von Creative Cloud Bibliotheken und der Anwendung von Farbtrends aus Adobe Color.

Zusätzlich werden Designprinzipien und Gestaltgesetze sowie die Anwendung von Formen und Farben und deren Wirkung auf die Wahrnehmung behandelt. Weitere Themen sind Typografie und Layout, die Vermittlung der Anatomie von Buchstaben, und die Gestaltung von Layoutideen, die den Blick des Betrachters lenken und eine harmonische Gestaltung gewährleisten.

Die Corporate Design-Elemente wie Logo-Design, Signets, und die Erstellung eines Corporate Design Manuals (Styleguide) sind ebenso Teil der Weiterbildung, die auf die einheitliche Markenkommunikation fokussiert. Künstliche Intelligenz (KI) im Arbeitsprozess wird ebenfalls vorgestellt, mit einem Überblick über KI-Technologien und deren Einsatzmöglichkeiten in der täglichen Berufspraxis.

Dieser Kurs richtet sich an Webdesigner, Webprogrammierer, Grafiker, Mediengestalter, Fachkräfte aus künstlerischen Berufen sowie an alle, die an der Konzeption, Gestaltung und Umsetzung von Internet-Auftritten mitwirken möchten und sich die dafür erforderlichen Kenntnisse und Fähigkeiten aneignen wollen.

Als Grafikdesigner und Webdesigner umfasst Dein Berufsalltag eine Vielzahl von kreativen und technischen Aufgaben, die beide Disziplinen miteinander verbinden. Als Grafikdesigner bist Du verantwortlich für die visuelle Gestaltung unterschiedlichster Medien, sowohl digital als auch gedruckt. Du arbeitest mit Adobe Photoshop, Illustrator und InDesign, um ansprechende Layouts für Broschüren, Visitenkarten, Plakate, Flyer und andere Werbematerialien zu erstellen, die die Markenidentität eines Unternehmens widerspiegeln. Dabei achtest Du nicht nur auf ästhetische Aspekte, sondern auch auf die visuelle Kommunikation und die klare Übermittlung von Informationen an die Zielgruppe.

Ein weiteres zentrales Aufgabengebiet ist die Gestaltung von Markenidentitäten und Corporate Designs. Du entwirfst Logos, Signets und komplette Markenauftritte, die in einem Corporate-Design-Manual (Styleguide) festgehalten werden. Hierbei verwendest Du Farbtheorien, Typografie, Formgestaltung und Bildbearbeitungstechniken, um ein einheitliches und ansprechendes Erscheinungsbild zu schaffen, das die Werte und Ziele der Marke visuell kommuniziert.

Im Bereich Webdesign konzentrierst Du Dich auf die Entwicklung und Gestaltung von Webseiten und Online-Plattformen, die sowohl funktional als auch ästhetisch überzeugend sind. Du nutzt Technologien wie HTML, CSS und JavaScript, um Webseiten zu erstellen, die auf verschiedenen Endgeräten und Bildschirmgrößen optimal angezeigt werden – ein essenzieller Bestandteil des Responsive Webdesigns. Dabei spielst Du eine entscheidende Rolle bei der Umsetzung von User Interfaces (UI) und User Experience (UX)-Designs. Deine Aufgabe ist es, die Benutzerfreundlichkeit und die Zugänglichkeit der Website zu maximieren, indem Du eine klare Navigation, strukturierte Layouts und visuell ansprechende Interaktionen entwickelst.

Ein weiterer wichtiger Aspekt Deiner Arbeit als Webdesigner ist die Suchmaschinenoptimierung (SEO). Du sorgst dafür, dass die Webseiten, die Du gestaltest, für Suchmaschinen optimiert sind, indem Du auf relevante Schlüsselwörter, metadaten und Alt-Tags achtest, um die Sichtbarkeit in den Suchergebnissen zu verbessern. Dabei nutzt Du nicht nur Deine Design-Kenntnisse, sondern auch ein Verständnis für technische Aspekte wie Ladegeschwindigkeit, barrierefreie Gestaltung und SEO-freundliche Struktur.

In der Entwicklung von Webseiten arbeitest Du oft mit Frontend-Entwicklern zusammen, um sicherzustellen, dass Design und Funktionalität miteinander harmonieren. Hierzu gehört auch das Erstellen von Prototypen und Wireframes, die als Grundlage für die spätere Umsetzung dienen. Du kümmerst Dich um die Implementierung von CSS-Animationen, Interaktivität und dynamischen Inhalten, um den Besuchern ein ansprechendes Nutzererlebnis zu bieten.

Darüber hinaus beschäftigst Du Dich mit der Benutzererfahrung (UX) und stellst sicher, dass alle Designelemente und Funktionen der Website den Bedürfnissen und Erwartungen der Nutzer entsprechen. Du führst Usability-Tests durch, analysierst das Verhalten der Nutzer und optimierst die Navigationsstrukturen und Designs, um die Benutzerfreundlichkeit weiter zu verbessern.

Insgesamt ist Dein Arbeitsalltag als Grafik- und Webdesigner eine spannende Kombination aus kreativen Designprozessen und technischen Herausforderungen, bei der Du stets auf dem neuesten Stand der Designtrends und Webtechnologien bleibst, um die besten Ergebnisse für Deine Kunden zu erzielen.

Ein Fernstudium in Grafikdesign und Webdesign kann Dir enorme Vorteile für Deine berufliche Zukunft bieten. Es verschafft Dir nicht nur fundiertes Wissen und praxisorientierte Fähigkeiten in beiden Bereichen, sondern auch eine starke Position auf dem Arbeitsmarkt. Durch die Kombination von Grafikdesign und Webdesign erwirbst Du ein breites Spektrum an kreativen und technischen Kenntnissen, die Dir ermöglichen, vielseitige Designprojekte zu realisieren – sowohl für Print- als auch für digitale Medien.

Das Studium gibt Dir die Möglichkeit, mit den neuesten Design-Softwaretools wie Adobe Photoshop, Illustrator, InDesign und Dreamweaver zu arbeiten und Dein Portfolio mit professionellen Arbeiten auszubauen. Du wirst lernen, wie Du visuelle Kommunikation optimierst, Corporate Designs entwickelst und ansprechende Webseiten designst, die sowohl ästhetisch ansprechend als auch funktional sind.

Darüber hinaus wirst Du im User Experience Design (UX) geschult, sodass Du Webseiten und Anwendungen mit einer nutzerzentrierten Denkweise gestaltest. Du wirst die Prinzipien der Informationsarchitektur und Interaktionsdesigns verstehen, um intuitive und benutzerfreundliche Interfaces zu entwickeln. Das Studium umfasst auch moderne Webtechnologien wie HTML, CSS und JavaScript, wodurch Du in der Lage bist, Webseiten zu programmieren und optimal für alle Endgeräte zu gestalten. Du wirst mit Responsive Webdesign vertraut gemacht und lernst, wie Du Design-Elemente so anpasst, dass sie auf verschiedenen Bildschirmgrößen und Geräten perfekt zur Geltung kommen.

Ein weiterer wichtiger Bestandteil der Schulung ist die Vermittlung von SEO-Techniken und Webanalyse, die Dir helfen, Webseiten so zu gestalten, dass sie sowohl für Suchmaschinen als auch für die Nutzererfahrung optimal funktionieren. Dies stellt sicher, dass Deine Webseiten nicht nur visuell ansprechend, sondern auch gut positioniert sind und eine hohe Benutzerfreundlichkeit bieten.

Durch eine Weiterbildung in Grafikdesign und Webdesign baust Du nicht nur Deine fachlichen Kompetenzen aus, sondern erhältst auch die nötigen Fähigkeiten, um in der digitalen Medienproduktion erfolgreich zu arbeiten. Deine beruflichen Perspektiven erweitern sich und Du bist in der Lage, die Herausforderungen der modernen Designwelt erfolgreich zu meistern.

Als Grafik- und Webdesigner kannst Du mit einem breiten Spektrum an Verdienstmöglichkeiten rechnen, abhängig von Deiner Erfahrung, Deinem Standort und der Art des Unternehmens, für das Du arbeitest. In Deutschland liegt das Einstiegsgehalt für Grafik- und Webdesigner im Durchschnitt bei etwa 30.000 bis 35.000 Euro brutto jährlich. Mit steigender Erfahrung und spezialisierten Fähigkeiten in Bereichen wie UX/UI Design, Webentwicklung oder Responsive Design kann Dein Gehalt auf etwa 40.000 bis 50.000 Euro jährlich ansteigen.

Erfahrene Designer, die eine leitende Position übernehmen oder in großen Agenturen, Unternehmen oder als Freelancer arbeiten, können sogar über 60.000 Euro jährlich verdienen. Wer zusätzlich Kenntnisse in Suchmaschinenoptimierung (SEO), Programmierung oder E-Commerce mitbringt, erhöht sein Marktwert und kann noch höhere Gehälter erzielen.

Freiberufliche Grafik- und Webdesigner haben je nach Auftragslage und Spezialisierung ebenfalls die Möglichkeit, ihr Einkommen signifikant zu steigern. Besonders gefragte Experten in Webentwicklung oder Digital Marketing können hohe Tagessätze verlangen und von einer vielfältigen Auftragslage profitieren.

Zusätzlich zu den Gehältern bieten sich auch viele Karrieremöglichkeiten in verschiedenen Bereichen, wie User Experience Design, Content Management oder E-Commerce-Entwicklung, die das Einkommen weiter steigern können.