#mega-menu-wrap-secondary #mega-menu-secondary ul.mega-sub-menu ul.menu { pointer-events: auto; } #content { #main { h1, h2, h3, h4, h5, h6 { @media screen and (max-width: 989px) { line-height: 1.3 !important; } } p { @media screen and (max-width: 989px) { line-height: 1.5 !important; } } @media screen and (max-width: 989px) { h1 { font-size: 35px !important; } h2 { font-size: 28px !important; } h3 { font-size: 22px !important; } } } .gb-container { &:has(.button-primary + .button-secondary) { @media screen and (max-width: 767px) { flex-direction: column; gap: 10px; } .button-primary, .button-secondary { @media screen and (max-width: 767px) { width: fit-content; } } } } .button-primary, .button-secondary { @media screen and (max-width: 767px) { } & > * { white-space: unset; cursor: pointer; } } } .flexible-layout { &--style { &_3 { .flexible-layout__images { gap: 10px; display: grid; grid-template-columns: repeat(2, 1fr); @media screen and (min-width: 768px) { } .flexible-layout { &__image-container { width: auto; &.flexible-layout__image-container--secondary { line-height: 0; img.flexible-layout__image { @media screen and (max-width: 575px) { max-height: 160px; } } } } &__image-column { gap: 10px; width: auto; } } } } } } // body.job-template-default .reasons-wrapper { & > .gb-grid-wrapper { // gap: 20px; & > .gb-grid-column > .gb-container { background: var(--base-3); padding: 50px 35px; h3:last-child { margin: 0; } } } } .benefits { .gb-grid-column { h3:last-child { margin-bottom: 0; } } } .wpcf7-form { input.wpcf7-form-control.wpcf7-submit { width: 100%; padding: 8px 18px; } .drop_uploader.drop_zone { min-height: unset !important; padding: 15px; border: 2px dashed var(--contrast-3); transition: .3s ease all; &:has(a.file_browse:hover) { border: 2px dashed var(--salmon); } .text_wrapper { margin-block: 30px; .text { font-size: 1em; } i { font-size: 30px; } } ul.files { &.thumb { margin: 0 auto !important; width: 100%; li { font-size: 0.75em !important; .thumbnail { background-position: center; } } } } } } .list-element-custom { p.gb-headline { .gb-icon { // display: inline-flex; // margin-block: auto; svg { height: 1em; // width: 1em; top: 2px; position: relative; /* background: lightcoral; */ } } } } .pagination { margin-top: 30px; br { display: none; } .wp-pagenavi { padding-inline: 20px; @media screen and (min-width: 990px) { padding-inline: 50px; } & > * { font-size: 18px !important; } a { transition: .5s ease all; &:hover { color: var(--c-secondary); } } } } .gb-container.text-image-section > .gb-grid-wrapper > .gb-grid-column > .gb-container { // height: 100%; // display: flex; // flex-direction: column; // justify-content: center; } .job-filter-wrapper, .job-results-wrapper { p:empty { display: none; margin-bottom: 0 !important; } } .job-filter-wrapper { form.searchandfilter { & > ul { margin-bottom: 40px; row-gap: 5px !important; } li.sf-field-search { input { &::placeholder { font-size: 1em; } } } li[data-sf-field-input-type="select"] { & > label { border: 2px solid #999; padding-right: 20px; border-radius: 10px; & > select { background: transparent; border: unset; padding: 10px 0 10px 20px; option { // padding-block: 15px; &.sf-option-active { // background: var(--c-secondary); } } } } &.active { & > label { border-color: var(--c-secondary); color: var(--c-secondary); } } } } } .job-results-wrapper { .search-filter-results { br + .job-listing { margin-top: 25px; } } .job-listing { @media screen and (min-width: 990px) { padding-inline: 50px; } } } body .button-primary, body .button-secondary { font-weight: 500; } .carreer-intro { &:before { // max-width: calc(100% - 850px); // left: unset; // width: 100%; } p { font-size: 20px; margin-block: 30px; } }

Barrierefreiheit Beratung & Strategie Portale UX/UI-Design Webentwicklung

Starke Stimme für Inklusion – barrierefreier TYPO3-Relaunch für die LAG WfbM BW

Büro

Stuttgart

Branche

Gesellschaft, Bildung & Religion

Kunde seit

2016

Zielgruppe

B2C

TYPO3

Starke Stimme für Inklusion – barrierefreier TYPO3-Relaunch für die LAG WfbM BW

Die LAG WfbM Baden-Württemberg vertritt über 31.000 Arbeitsplätze für Menschen mit geistiger, körperlicher oder psychischer Behinderung im Land.

Für eine zukunftsfähige Kommunikation nach innen und außen wurde ein modernes Portal mit barrierefreiem Zugang und integriertem Extranet auf TYPO3-Basis realisiert.

Das Relaunch-Konzept vereint technologische Stabilität mit einem neuen Webdesign und deutlich verbesserter UX/UI – zugänglich, modern und nutzerzentriert.

Ein digitales Zuhause für Austausch, Sichtbarkeit und Selbstbestimmung – für alle Beteiligten.

Audit & Konzeption

Agile Entwicklung

GoLive

Betrieb & Weiterentwicklung

Unsere Leistung

Beratung & Konzeption Digitale Strategie UI / UX E-Commerce Beratung Online-Marketing Beratung Systemkompetenz

Die Herausforderung

Die bestehende Webseite erfüllt keine modernen Anforderungen an Barrierefreiheit und Nutzerführung.

Informationsarchitektur und visuelle Gestaltung sind nicht zeitgemäß und erschweren die Zielgruppenansprache.

Technische Basis und Content-Struktur lassen keine einfache Pflege und Skalierung der Inhalte zu.

UI/UX-Workshop

Analyse & Auswertung

Prozess-modellierung

Migrations- Roadmap

Unsere Lösung

Strategie

Workshop zur Anforderungsanalyse mit Fokus auf Zielgruppen & Barrierefreiheit

Konzeption einer barrierefreien UI/UX für alle Nutzergruppen (BITV 2.0-konform)

Entwicklung eines durchgängigen Navigations- und Inhaltskonzepts

Umsetzung eines modularen TYPO3-Setups zur flexiblen Inhaltsgestaltung

Tools & Methoden

Agiles Projektmanagement nach SCRUM

Entwicklung nach BITV 2.0 und WCAG 2.1 Standards

Accessibility Testing mit Screenreadern und Tools wie Wave & Axe

Git-Workflows inkl. QS-Prozesse und Dokumentation

TYPO3-Entwicklung mit flexiblen Inhaltselementen

Drei Personen besprechen sich geschäftlich vor einem großen Bildschirm

Das Ergebnis

Die neue Webseite der LAG WfbM Baden-Württemberg überzeugt durch klare Struktur, intuitive Nutzerführung und einen vollständig barrierefreien Zugang. Die TYPO3-Plattform ermöglicht der Organisation eine effiziente Pflege und Skalierung der Inhalte, während das moderne UI/UX Design alle Zielgruppen – ob mit oder ohne Behinderung – gleichermaßen anspricht.

Barrierefreiheit
sichergestellt

Umsetzung nach BITV 2.0, erfolgreiche Tests mit Screenreadern

Verbesserte
Usability

Intuitive Navigation und responsive Design sorgen für einfache Bedienbarkeit

Zeitgemäßes
Design

Emotional ansprechendes Erscheinungsbild im Einklang mit dem Selbstverständnis der Organisation

Effiziente
Redaktionsprozesse

TYPO3-Backend mit flexiblen Inhaltselementen und klaren Workflows

Sie haben Ähnliches vor?

Ob modernes, innovatives Webdesign, Programmierung oder Optimierung Ihrer Webseite oder Ihres Online-Shops. Ich berate Sie gerne zu Ihrem individuellen Projekt.

Adrian Weinschenk

Standortleiter Stuttgart

Tel.: 0711 / 46 05 89 – 50

E-Mail: a.weinschenk[at]econsor.de

Projekthighlights

Barrierefreies Webdesign

Barrierefreies Internet: Kontrast erhöhen oder Schriftgröße anpassen? Auf der neuen Seite dank cleverer Programmierung kein Problem mehr.

Bessere Zugänglichkeit

Interaktive Features

Mehr Leads

Kunden-Login

Interner Kunden-Login für TYPO3: Mitglieder können interne Daten zur Verfügung gestellt und heruntergeladen werden.

Von der Präsentation zum Tool

Zielgruppengerechte Darstellung

Länderspezifische Optimierung

Google Maps Integration

Dank eigens in TYPO3 programmierter und integrierter Extension werden die Werkstätten auf der Startseite übersichtlich dargestellt. Begleitende Hinweise zu Name, Adresse und Kontaktdaten lassen sich direkt im CMS setzen.

Von der Präsentation zum Tool

Zielgruppengerechte Darstellung

Länderspezifische Optimierung

Responsive Webdesign

Die responsive Internetseite berücksichtigt speziell die Bedürfnisse von Menschen mit (Seh-)Behinderungen: Mittels Icons im Header lassen sich Schriftgröße und Kontrast per Touch anpassen.

Erlebbare Software