The Institute for the Future: The process’ pioneer

The Institute for the Future (IFTF), an independent research organization founded in 1968 and based in Palo Alto, California, is a pioneer in the field of futures thinking. With over five decades experience, the IFTF has developed innovative methods to support organizations in anticipating and shaping strategic, future-oriented measures.

The Strategic Foresight process (which includes the Prepare, Foresight, Insight and Action phases) is one of the IFTF’s central tools. This method helps organizations think systematically about the future and make informed strategic decisions. The following sections will present this process.

Basic requirements for successful futures thinking

To be successful, Futures Thinking requires discipline, stamina, a budget, and a clear mandate from decision-makers to colleagues to be able to apply Futures Thinking when it’s introduced and implemented.

A clear task definition is essential. In our example, the question is: How can we develop innovative corporate strategies using Futures Thinking?

Several basic requirements are also needed:

1. Cross-departmental and multidisciplinary cooperation

The future is complex and influenced by a wide range of factors – technological, economic, social, and cultural. No single department or discipline has all the knowledge and perspectives needed to fully understand this complexity. Cross-departmental and multidisciplinary cooperation allow us to combine a variety of perspectives and develop a holistic understanding.

• Form interdisciplinary teams: Teams should include members from different areas, like marketing, technology, human resources, and research and development. Each department brings specific expertise that enriches the joint analysis. All team members, regardless of position or discipline, should contribute their perspectives. Different opinions promote innovative approaches and informed decision-making.
• Develop a common language: Different departments often have different terms and methods. Creating a common language is important to avoid misunderstandings and promote collaboration. Experience shows that it helps to define a common goal via a question or task and then discuss if everyone has a similar vision, with moderation from a neutral party.

Cross-departmental and multidisciplinary collaboration

• promotes innovation through the interplay of different thinking methods;
• allows blind spot identification that might be overlooked in a one-dimensional perspective;
• creates greater internal acceptance for developed strategies, as different departments are involved and everyone can participate equally.

2. Co-creation and creativity

Co-creation is the key to developing future-oriented solutions that are accepted and actively supported by all involved. Creativity helps us break out of existing thought patterns and develop radically new ideas. The first important step is to put together multidisciplinary teams from different departments.

Therefore, it is imperative to:

• Organize workshops and innovation sprints: Interactive formats like design thinking workshops or scenario building sessions promote the exchange of ideas and the development of creative approaches.
• Use creative techniques: Methods like brainstorming, mind mapping, and the “Six Thinking Hats” model encourage different thinking styles and promote out-of-the-box ideas.
• Involve users and stakeholders: Co-creation means not only working with the internal network, but also actively involving external actors such as customers, partners, or other stakeholders.

This approach kills two birds with one stone:

• Co-creation strengthens the sense of responsibility and commitment of all participants.
• Different people’s creativity leads to innovations that would not be possible with traditional and often linear methods.
• External participation leads to solutions closer to your service or product users’ actual needs.

3. The role of AI applications

The amount of data that must be analyzed for futures thinking often exceeds human capacities. Artificial intelligence (AI) helps us efficiently analyze data volumes, recognize patterns, and make predictions. AI also opens up new avenues for scenario development and decision-making.

• Automate horizon scanning (see 1. Prepare): AI-powered tools can systematically analyze data from millions of sources, from scientific articles to social media to patent databases. With horizon scanning, you can identify trends and signals faster and more accurately.
• Scenario simulation and modeling: AI can be used to develop dynamic scenarios by simulating variables and analyzing their interactions. This allows organizations to better understand the potential effects of decisions or external developments.
• Personalized insights: AI can tailor results to the specific needs and interests of individual teams, decision-makers, or customer groups, increasing efficiency.

AI can help you:

• considerably reduce the time needed to collect and analyze data.
• gain deeper insights by recognizing patterns not obvious to us humans.
• accelerate decision-making through data-based models and simulations.

4. Systemic thinking and uncertainty management

Futures Thinking works in an uncertain environment. Understanding systems and their interactions is crucial to better understand complex dynamics and build resilience to unexpected events.

The following tools and approaches can help with this.

• Visualize the relationships and interactions between actors, trends, and influencing factors in a system, e.g. using system mapping.
• Generating and using scenarios to explore alternative futures helps you see uncertainty as an opportunity, not a risk.
• Agile working methods help you to react quickly and efficiently to new developments.

After some disciplined practice, you can iteratively adapt your strategies and remain dynamic.

Cross-departmental collaboration enables the integration of diverse perspectives, co-creation and creativity foster innovative solutions, and AI provides the efficiency and precision needed to manage growing complexity.

Systemic thinking and uncertainty management complement this approach by helping organizations build resilience and strategically leverage uncertainty.

Together, these elements provide the basis for strategic decisions that respond to the present and can be used to actively shape the future.

Strategic Foresight: The Process in Detail

The strategic foresight process is a structured method to help organizations anticipate possible futures and make informed decisions. This process comprises four central phases: Prepare, Foresight, Insight and Action, which are supported by specific tools and methods. Each phase builds upon the previous one, leading from identifying trends to implementing concrete measures.

1. Prepare: Setting the scene

The Prepare phase sets the foundation for the entire strategic foresight process. It aims to define relevant questions, involve relevant stakeholders, and create the strategic framework. In this phase, we ensure that the process is targeted and resources are used efficiently. It provides a clear starting point that aligns all participants with a common goal.

The following methods support during the preparation phase:

• Framing: Framing defines the central questions and objectives pursued during the process. This creates clarity on the focus and the sought after results.
• Horizon Scanning: Horizon scanning is a systematic method for identifying trends, signals, and potential disruptions. It involves collecting information from a wide range of sources, like scientific publications, news, and innovation reports. The aim is to identify early developments that could affect the organization.
• Trend and Driver Analysis: This method identifies long-term trends and the underlying drivers that push them forward. It makes it possible to understand the cause of specific developments and better assess their effects.
• Stakeholder Mapping: This method is used to identify relevant actors who may be affected by or influence future developments. The mapping ensures that different perspectives are taken into account and that a common basis for cooperation is created.

In relation to our example, we focused on the following question: How can we develop innovative corporate strategies using futures thinking?

Using the aforementioned methods and tools, we verified the following three trends, with their respective signals and drivers, as examples:

• Trend 1 – Sustainability and environmental awareness
• Trend 2 – AI and automation
• Trend 3 – Changing world of work and the working world in transition

Now, we’ll introduce the associated signals and drivers. And in the next step, we’ll develop potential future scenarios based on this foresight.

2. Foresight: Exploring possible futures

The foresight phase focuses on exploring alternative futures. The aim is to develop different scenarios and analyze potential developments. Scenarios are potential, alternative pictures of the future that take various possibilities for development into account. This helps us to gain a deeper understanding of the dynamics that can shape future developments.

The Envision Alternative Futures method helps us visualize different plausible futures. This method is based on identifying key drivers and their influence on a specific topic or issue.

Drivers are the central forces that can bring change and shape different futures. The graphic shows three central drivers that influence the world of work – we’ll focus on driver B: efficiency gains through automation and AI influence the organization of work.

In the next step, we’ll develop four different scenarios based on the driver. Each scenario represents a potential future with specific dynamics and implications.

Scenario 1: Growth

• Description: Automation and AI lead to significant efficiency gains, making companies more competitive. Organizing work is increasingly supported by machines, leading to increased productivity.
• Key message: Technology is becoming the main driver of growth and economic success.

Scenario 2: Constraint

• Description: Politics and society implement strict ethical guidelines for AI usage to ensure no jobs are lost and machines are not allowed to make critical decisions.
• Key message: Regulation and ethics are the focus, deliberately limiting technological advances.

Scenario 3: Collapse

• Description: A massive failure in an AI system causes severe economic and societal damage, causing automation and AI integration to collapse.
• Key message: Mismanagement or technological failures can completely destroy trust and progress.

Scenario 4: Transformation

• Description: The trend leads to a paradigm shift where people and machines work in close collaboration. Human creativity and emotional intelligence are more highly valued in the work world.
• Key message: Technology and humanity complement each other and create a transformative future.

By considering different futures, we can develop a broader understanding of uncertainties and opportunities and develop a variety of perspectives. Developing different scenarios promotes our ability to react flexibly to different developments and encourages us to think beyond the status quo and create transformative ideas.

After defining scenarios, the next step is to develop measures and prepare for different futures.

3. Insight: Decoding meaning

In the Insight phase, results from the Foresight phase are analyzed and translated into the organizational context. This helps translate our insights into strategic measures.

Here, we chose the Growth scenario. The focus is on increasing efficiency through automation and AI. Organizations benefit significantly from technologies, which strengthens their competitiveness and makes the work organization more productive.

This scenario identifies four central milestones that help optimally exploit the potential of automation and AI. The following description goes through the milestones and their specific measures, which can be found in detail in the graphic.

The growth scenario shows how automation and AI can transform organizations if they are proactively supported with training, collaborative approaches, and multidisciplinary teams. The milestones and measures described in the graphic represent the basis for a roadmap of how companies can successfully integrate efficiency improvements into their working environment. They focus on the continued development of employees and promoting an innovation-friendly culture to sustainably increase productivity.

4. Action: Taking charge of the future

The action phase is where developed strategies and measures are implemented iteratively. It aims to actively involve people in the implementation.

The action phase of the strategic foresight process marks the transition from strategic planning to operational implementation. In this phase, a roadmap is developed that divides goals and measures into time horizons to achieve the desired results. The roadmap is divided into short-term, medium-term, and long-term measures with varying complexity.

The roadmap offers a structured and realistic approach to achieving the growth scenario’s goals. Of course, these are overarching epics that must be broken down into smaller work packages and specific tasks in order to be implemented.

In any case, the roadmap offers a clear guide on how to move from planning to actual implementation, successfully setting the transformation in motion.

Summary

Futures Thinking is a methodical tool that helps organizations and individuals strategically prepare for potential futures. In an era of constant change, this approach provides a clear structure for turning uncertainty into opportunity. Futures Thinking is not about predicting the future, but about empowering people to explore different scenarios and develop targeted strategies. By using strategic foresight, as developed by the Institute for the Future (IFTF), organizations can make informed decisions and drive innovation.

The Five Principles of Futures Thinking

1. Focus on trends, signals and drivers

To shape the future, first organizations must analyze their environment. Trends and signals provide clues to possible developments, while drivers represent forces that drive change.

2. Analyze data

Data is the basis for every strategic decision. Systematic analysis can help identify patterns and make informed hypotheses about possible futures.

3. Look back to look forward

The past offers valuable lessons for the future. By looking at historical patterns and decisions, conclusions can be drawn about future developments.

4. Discover patterns

Patterns help us understand the underlying dynamics of change. This enables better decision-making and targeted actions.

5. Build communities

The future cannot be shaped alone. Exchanging ideas and working with interdisciplinary teams and external stakeholders promotes innovative solutions and creates acceptance for new ideas.

“Get there early.” Bob Johansen, Institute for the Future

This text was created in collaboration with ChatGPT and was curated and edited by the author according to subject-specific criteria.

Inspiration

Literature:

• Conway, Maree. Foresight-Infused Strategy: A How-to-Guide for Using Foresight in Practice, 2016
• Voros, Joseph. The Generic Foresight Process Framework, 2000

Websites:

• Board of Innovation, https://ai.boardofinnovation.com/?ref=theresanaiforthat
• Institute for the Future, https://www.iftf.org/
• World Futures Studies Federation, https://wfsf.org/

YouTube:

• Webb, Amy. AI and the Future of Work, https://www.youtube.com/watch?v=W_T2Cgfov68

Tools:

• https://chat.openai.com/
• https://ai.boardofinnovation.com/brainstorm-buddy
• https://ai.boardofinnovation.com/future-scenario-maker
• https://stormz.me/

The post Futures Thinking: Developing Innovative Corporate Strategies appeared first on webinale 2026.

Personas are fictitious but realistic user profiles based upon real data and user research. They represent different user groups with specific characteristics, needs, goals and behaviors. Instead of relying on mere averages, personas create detailed characters with individual stories, offering a deeper understanding of the user perspective. An example of a persona (greatly abbreviated) could look like this:

• Name: Lisa König
• Age: 32 years
• Occupation: Marketing manager
• Technical affinity: High, uses modern software solutions daily
• Goals: Efficient management of marketing campaigns, routine task automation
• Challenges: Overwhelmed by complex software, little time for extensive training

This initial draft of a persona can provide an important basis for decision-making for a software team developing a marketing tool.

Why are personas important?

Using personas has several key advantages:

• Better user-centricity: Personas help teams consistently align with the needs of real users. Instead of addressing an anonymous “target group”, developers and designers can concretely imagine who they are optimizing software for.
• Improved communication within teams: Different departments (development, design, product management, marketing) often speak different “languages”. Personas create a common ground and ensure a uniform understanding of user requirements.
• More targeted product decisions: Features, designs, and workflows can be better validated using personas. Instead of speculating on whether a feature is useful, the team can ask specifically, “Does this feature help Lisa do her job more efficiently?”
• More effective UX and UI design: By mapping typical user behaviors and expectations, personas can make user interfaces more intuitive and accessible.
• Reducing development errors: Undesirable developments often occur when software is developed without the actual users in mind. Personas help avoid these missteps by consistently incorporating users’ perspective into the development process.
• Better marketing strategies: In addition to product development, personas are also helpful in marketing. They make it possible to create more targeted campaigns and content that are precisely tailored to relevant user groups.

Personas are much more than just nice add-on documents – they are an indispensable tool for successful, user-centered software development. They help teams put themselves in the perspective of real users and ensure that products are not only technically sophisticated, but also intuitive, useful, and engaging. In the following sections, we will take a closer look at how personas are developed, which methods have proven themselves and how they can be integrated into Agile development processes.

Differences and differentiation from classic target group analysis

In software development and marketing, it is essential to understand the users’ exact needs. While classic target group analysis is a proven means of segmenting potential customers or users, the personas approach goes one step further. The difference between the two concepts lies not only in the depth of the analysis, but also in the way they are used.

Audience analyses are often based on demographic and statistical data. They divide people into groups that have similar characteristics, for example in terms of age, gender, income or occupation. A typical audience description for a fitness app might be: “Men and women between the ages of 25 and 45 who exercise regularly and have an above-average income.” While this information helps to make a rough market segmentation, it leaves open what individual needs and behaviors exist within this group.

Personas, on the other hand, go beyond this general description and try to make a specific person from the target group tangible. A persona for the same fitness app might look like this:

• Name: Lisa, 34 years old, working mother
• Motivation: Wants to stay fit, but has little time for long workouts
• Challenges: Must integrate training sessions into a busy everyday life
• Expectations of the app: Short, effective workouts with ease of use

The big advantage of personas is that they illustrate a detailed story, behavioral patterns, and specific needs of a user group. While a target group analysis only defines the external characteristics, a persona provides insights into the “why” behind the users’ decisions.

Another distinguishing feature is the method of application. Target group analyses are particularly helpful in marketing to evaluate market potential or to target advertising campaigns to a specific demographic group.

They offer a broader perspective and help understand who might potentially be interested in a product. Personas are used more in product development and UX optimization. They enable designers, developers and product managers to put themselves in the shoes of users and simulate concrete use cases.

A practical software development example illustrates the difference. A company developing a new banking app can use a target group analysis to determine that the main users are between 25 and 50 years old and prefer to use online banking. But it is only through a persona like “Thomas, 46, family man, uses online banking, but feels insecure with new technologies” that it becomes clear that the app must offer a particularly understandable user interface and an easily accessible security concept.

The Importance of Personas in Software Development

Software development faces the challenge of combining complex requirements with user-friendly experience. Technically mature applications can be a market failure if they aren’t tailored to the needs of the users. That’s where personas come in. They make it possible to design software specifically for real users instead of developing it past an abstract target group. Some arguments about why you should rely on personas, especially in software development, are summarized in Table 1.

Table 1: Benefits of Personas in the Software Development Process

Psychological Basics: How User Behaviour and Decision-Making Processes Influence Personas

People may use software rationally, but their decisions and behaviour are also shaped by emotions, habits, and unconscious thought patterns. Personas serve to make precisely these psychological mechanisms tangible in order to design a product in such a way that it can be used intuitively, efficiently and pleasantly.

A central aspect is the way people make decisions. Psychologist Daniel Kahneman distinguishes between two systems of thought: a fast, intuitive system and a slow, analytical system. In software development, it is crucial to consider both ways of thinking.

Users expect an application to support their habitual thought patterns so they don’t have to think twice. An example of this is the arrangement of buttons in a mobile banking app. If the “Transfer” function is intuitively placed, it will be used without much thought. However, if it’s hidden in an unfamiliar place, it can cause confusion and frustration. In such cases, personas help simulate typical behaviours and expectations, optimizing user guidance.

Another psychological influencing factor is cognitive load, i.e. the amount of information that a person can process at the same time. Users don’t want to be overwhelmed with unnecessary options and want to find a solution to their problem quickly. A good example of this is a travel provider’s booking platform. A persona like “Anna, 34, plans vacation during her lunch break and has little time” makes it apparent that clear navigation and a quick booking option are essential. If they are overwhelmed with too many choices, they are more likely to abandon the process in frustration.

Emotions also play a central role in interacting with software. An application can convey trust and security or trigger uncertainty and anger. Especially with security-critical applications, like an online banking app, it is important that the user feels in control at all times.

A persona like “Stefan, 55, rarely uses online banking and has concerns about security” helps design functions such as two-factor authentication in such a way that they are understandable and easy to use without overwhelming the user.

In addition, people are not only shaped by their individual experiences, but also by social influences. The need for social validation is evident in apps with community functions. An example of this is a fitness app where users can share their training successes with friends. The persona “Tom, 29, sports enthusiast, is motivated by competition” can help integrate gamification elements into the application in a meaningful way. If this is ignored, the app may lose engagement because users don’t feel sufficiently engaged.

Personas therefore help to incorporate psychological aspects into software development. They make visible how people think, what fears or expectations they have, and how they interact with an application.

Developing Personas: Methods and Data Sources

Personas are only useful when they’re based on sound data. A well-designed persona is more than a fictional character with a name and a stock photo – it represents real user needs, behaviours, and challenges. In order to develop realistic and meaningful personas, a combination of qualitative and quantitative methods and reliable data sources is required.

From data collection to persona creation

The first step to develop personas (Figure 1) is data collection. Companies can draw on various information sources to understand user behaviour and needs. One of the most valuable methods is the direct user survey. Interviews and surveys make it possible to gain deeper insights into the mindset and challenges of users. For example, a software company for a project management app can find out through interviews with team leaders which features really help them in their day-to-day work and which they find annoying.

Figure 1: Process for creating and using personas

In addition, analytics data provides valuable insights into user behaviour. Which functions are frequently used? Where do users abort processes? Heat maps and click analyses can help identify weaknesses in user guidance. For example, users of an e-commerce platform may abandon the purchase process because the checkout is complicated. A persona like “Lisa, 32, frequent online shopper, expects a fast and smooth checkout” can help address these problem areas.

Combining qualitative and quantitative data correctly

Effective persona development requires the combination of quantitative data (such as user statistics and survey results) and qualitative data (such as interviews and observations). While quantitative methods provide insight into what users are doing, qualitative approaches provide insights into why they are doing it.

We can see an example of both methods un the development of an educational platform. A platform analysis shows that many users drop out after a few minutes – a clear signal that there are problems with user guidance.

By interviewing teachers and students, the company learns that most users are overwhelmed because too much information is presented at once. Based on these findings, a persona such as “Max, 17, student, uses the platform irregularly and needs intuitive navigation” can be developed to improve user guidance in a targeted manner.

From raw data to persona

Once enough data has been collected, it’s a matter of transferring it into a tangible persona. A persona should contain concrete, but not too detailed, information to serve as a helpful tool in the development process. In addition to demographic data such as age, occupation, and technical affinity, motivations, frustrations, and typical usage scenarios should be included.

For example, a good persona might look like this:

• Name: Sarah Meier
• Age: 38 years
• Occupation: Marketing manager
• Technical affinity: Experienced in using digital tools, but prefers simple solutions
• Challenges: Too many complex functions in software complicate everyday work
• Motivation: Increased efficiency through intuitive and time-saving tools

This persona can be used as a reference at all development stages to validate design decisions. The goal is not to create as many personas as possible, but to create a few, precisely elaborated profiles that cover the most important user groups.

With a solid methodology and the right data sources, an abstract target group becomes a living persona that helps teams tailor products to the needs of users. This results in technically sophisticated, intuitive software.

Persona Models

Personas are a proven tool of making user groups tangible and better integrating their needs into the development process. But not every persona is the same – depending on the objective, database, and application, there are different models to use in practice. Choosing the right persona model depends on the project’s requirements: Should the persona be as close to reality as possible or offer a simplified representation of user needs (Table 2)?

Table 2: Types of Personas

Each persona model has its own specific advantages and is suitable for different fields of application.

Data-driven persona development: Using AI, analytics, and user research

Artificial intelligence (AI), data analysis and user research make it possible to build personas not just on assumptions, but on measurable behavioural patterns. This creates data-driven personas that are more dynamic, precise, and flexible.

AI can analyse enormous amounts of user data and recognize patterns that would often be difficult for humans to understand. Machine learning can be used to identify clusters of user types that show similar behaviours. While conventional personas are often based on assumptions, this data-driven persona uses real user data to explain behaviour in a targeted manner and derive possible courses of action.

Besides to AI-supported methods, classic user research continues to play an important role. A/B testing, heatmaps, and user interviews can help better understand behaviours from the data. While pure data analysis often only shows what users are doing, qualitative methods provide the answer to the why.

One example is a learning platform where many users start their courses but don’t finish them. The pure analytics data shows a high bounce rate after the first lesson. But only interviews with users provide the explanation: Many find the learning curve too steep and lose motivation. A data-driven persona could look like this:

• Name: Julia, 29, works and learns in her free time
• Behaviour: Starts courses, but often drops out after a short time
• Challenge: Lack of motivation and time
• Solution: Shorter learning units or gamification elements such as progress rewards

This shows how valuable the combination of data analysis and direct user feedback is. The persona is underpinned by numbers and given an emotional and motivational dimension through qualitative research.

A major advantage of data-driven personas is that they are not static. While classic personas are often created at the beginning of a project and then rarely updated, AI-powered personas can be continuously optimized through real-time data. One example is a music streaming platform that evaluates their user habits. The platform can create and customize dynamic personas based on listening behavior.

If a user suddenly listens to more jazz music, his persona could develop from “Eva, 25, indie rock fan” to “Eva, 25, music discoverer with broad taste”. With this dynamic approach, software solutions can be further personalized. Whether it’s recommendation algorithms, marketing strategies or UX optimization – data-driven personas help companies to better understand users in real time and offer tailor-made solutions.

Using AI, analytics and user research takes persona development to a new level. Instead of relying only on assumptions and individual opinions, data-driven personas enable realistic and dynamic user analysis. The combination of quantitative data analysis and qualitative interviews ensures that personas reflect the behaviour of the users and helps us understand their motivation and challenges.

Difficulties

Although personas are a powerful tool for user-centred development, there are some typical hurdles that can limit their effectiveness. A persona alone does not guarantee better software – its success depends on how it is created, interpreted, and used in the development process. Incorrect or inaccurately used personas can even have a contrary effect, leading to undesirable developments.

One of the most common challenges is that personas are based on guesswork instead of real-world data. If teams develop a persona based solely on internal discussions, without interviewing actual users or analysing usage data, this can lead to bias.

A persona that only reflects one’s own expectations instead of mapping real user needs will quickly lose relevance. An example of this is a software company that develops a project management tool and assumes that all users are highly tech-savvy. If it later turns out that a large part of the target group consists of less tech-smart team leaders who want it to be easy to use, the product could be developed without the needs of real users.

Another problem is creating so many personas that the team loses track. Instead of focusing on a few representative core personas, often many user profiles are created that differ only slightly. This can lead to personas no longer being used as action-relevant tools, but merely existing as overloaded documents.

At the same time, the opposite can also be problematic: overly general personas that are supposed to cover all possible user groups, but in the end do not represent real needs. A persona like “User X, 30-50 years old, interested in technology” is so unspecific that it can hardly serve as a decision-making basis. Effective personas need a clear focus on typical user groups with differentiated characteristics.

Even the best personas are useless if they’re created only once and not actively considered in the development process. Often a lot of energy is invested during creation, but once the day-to-day business dominates, the personas are forgotten.

Personas are not static documents – they should be revised and adapted regularly. User needs, technological trends, and market requirements are constantly changing. If personas remain unchanged for years, they can lose relevance and lead to wrong decisions.

Tools

There are many tools for creating personas that help us better understand and visualize the target groups:

• Make My Persona by HubSpot: An interactive, free tool that walks you through a seven-step process to create detailed buyer personas (Figure 2). At the end, you’ll receive a professionally designed persona document that you can download and share with your team.
• Persona by Delve AI: An AI-powered persona generator that combines your own data, like web analytics, CRM data, with public data sources to automatically create data-driven buyer personas for your business.
• Miro Persona Tool: A collaborative online whiteboard that provides templates for creating user personas. It allows teams to collaborate on persona profiles, provide feedback, and integrate it into the design process.
• Persona Maker AI by Board of Innovation: An AI-powered tool that automatically generates personas based on your research questions and audience descriptions. It provides valuable insights into your target audience and supports your research.
• UXPressia’s Online Persona Creator An easy-to-use tool for creating user personas with customizable templates. It allows you to integrate real-time data, team collaboration, and export personas in different formats.
• Persona Builder by Semrush: A free tool to create buyer personas without limitations. It offers an intuitive user interface and lets you create and save an unlimited number of personas (Figure 3).

Figure 2: Persona Tool: HubSpot

Figure 3: Persona Tool: SemRush

These tools help you create detailed and realistic personas that can serve as the foundation for marketing strategies, product development, and user experience design. It’s best to try out a few tools that come closest to your own requirements in terms of functionality and operation. The same applies to persona tools: they should be easy to use and speed up the development process, not create hurdles and ultimately, they should make work fun.

Conclusion

Personas are essential in modern software development. They help user needs become tangible in order to make targeted development decisions and more intuitive and effective software. Unlike traditional audience analytics, which rely on demographic data, personas provide detailed insights into user behaviour, motivation, and challenges. This allows better feature alignment, UX design, and product strategies with actual user needs.

Data-driven personas, especially those which are optimized through continuous analyses, offer an innovative way to keep user profiles dynamic and improve development processes. Despite their many benefits, there are some challenges, especially the risk of outdated, unused, or overly generic personas.

In summary, it’s clear that the targeted use of personas improves the quality of software products and saves time and costs. Companies that effectively integrate personas into their development process benefit from more user-friendly solutions, happier customers, and ultimately greater market success.

The post Personas in Software Development appeared first on webinale 2026.

Behörden sind seitdem dazu verpflichtet, insbesondere ihre Web-Präsenzen und Apps so zu gestalten, dass diese möglichst keine Barrieren enthalten, etwa in Bezug auf die Schrift- oder Farbgestaltung. Im Jahr 2019 kam dann die EU-Richtlinie 2019/882 über die Barrierefreiheitsanforderungen für Produkte und Dienstleistungen, der sog. European Accessibility Act (EAA). In Deutschland ist der EAA durch das Barrierefreiheitsstärkungsgesetz (BFSG) vom 16. Juli 2021 umgesetzt worden, das vollumfänglich ab dem Stichtag 28. Juni 2025 gelten wird.

Zweck des BFSG ist es, im Interesse der Verbraucher und Nutzer die Barrierefreiheit von Produkten und Dienstleistungen zu gewährleisten. Dadurch wird für Menschen mit Behinderungen ihr Recht auf Teilhabe am Leben in der Gesellschaft gestärkt und der Harmonisierung des Binnenmarktes Rechnung getragen (§ 1 BFSG). Nach der Definition aus § 2 Nr. 1 BFSG gelten als Menschen mit Behinderung all diejenigen, die langfristige körperliche, seelische, geistige oder Sinnesbeeinträchtigungen haben, die sie in Wechselwirkung mit einstellungs- und umweltbedingten Barrieren an der gleichberechtigten Teilhabe an der Gesellschaft hindern können. Als langfristig wird hierbei ein Zeitraum angesehen, der mit hoher Wahrscheinlichkeit länger als sechs Monate andauert.

Anwendungsbereich

Bei vom BFSG erfassten Dienstleistungen handelt es sich um die folgenden:

• Telefondienste
• E-Books
• Messenger-Dienste
• Bankdienstleistungen
• Elektronischer Geschäftsverkehr (E-Commerce)
• Personenbeförderungsdienste
• Auf Mobilgeräten angebotene Dienstleistungen im überregionalen Personenverkehr

Folgende Produkte müssen zukünftig die BFSG-Vorgaben erfüllen:

• Computer
• Notebooks
• Tablets
• Smartphones
• Geldautomaten
• Fahrausweis- und Check-in-Automaten
• E-Book-Lesegeräte
• Router

Die gesetzlichen Anforderungen gelten allerdings nur für Produkte und Dienstleistungen, die nach dem 28. Juni 2025 in Verkehr gebracht werden.

Folgende Personenkreise sind dafür verantwortlich, die BFSG-Regelungen dann umzusetzen:

• „Dienstleistungserbringer“ (§ 2 Nr. 4 BFSG): Jede natürliche oder juristische Person oder rechtsfähige Personengesellschaft, die auf dem Unionsmarkt eine Dienstleistung für Verbraucher erbringt oder anbietet, eine solche Dienstleistung zu erbringen (also Dienstleister).
• „Hersteller“ (§ 2 Nr. 11 BFSG): Jede natürliche oder juristische Person oder rechtsfähige Personengesellschaft, die ein Produkt herstellt oder entwickeln bzw. herstellen lässt und dieses Produkt unter ihrem eigenen Namen oder ihrer eigenen Marke vermarktet (also Produzenten).
• „Einführer“ (§ 2 Nr. 13 BFSG): Jede in der Europäischen Union ansässige natürliche oder juristische Person oder rechtsfähige Personengesellschaft, die ein Produkt aus einem Drittstaat auf dem Unionsmarkt in den Verkehr bringt (also Importeure).
• „Händler“ (§ 2 Nr. 14 BFSG): Jede natürliche oder juristische Person oder rechtsfähige Personengesellschaft in der Lieferkette, die ein Produkt auf dem Markt bereitstellt, mit Ausnahme des Herstellers oder des Einführers (d.h. Zwischen- / Großhändler).

Als Dienstleister in diesem Sinne zählen u.a. auch alle Website- bzw. Webshop-Verantwortliche und App-Betreiber, jedenfalls wenn das betreffende Angebot gegenüber Endverbrauchern erbracht wird (B2C). Rein private Angebote sind ebenso ausgenommen wie reine B2B-Angebote. Außerdem sieht das BFSG eine Ausnahme für Kleinstunternehmen im Dienstleistungsbereich vor (§ 3 Abs. 3 BFSG). Ein Unternehmen, das weniger als 10 Personen beschäftigt und entweder einen Jahresumsatz von höchstens 2 Mio. Euro erzielt oder dessen Jahresbilanzsumme sich auf höchstens 2 Mio. Euro beläuft, gilt als Kleinstunternehmen (§ 2 Nr. 17 BFSG).

Ausnahmen

Es gibt aber auch Dinge, die vom BFSG nicht erfasst werden. Dessen Vorgaben gelten demnach nicht für den folgenden Inhalt von Webseiten und mobilen Anwendungen:

• Aufgezeichnete zeitbasierte Medien, die vor dem Stichtag veröffentlicht wurden
• Dateiformate von Büroanwendungen, die vor dem Stichtag veröffentlicht wurden
• Online-Karten und Kartendienste, sofern bei Karten für Navigationszwecke wesentliche Informationen barrierefrei zugänglich in digitaler Form bereitgestellt werden
• Inhalte von Dritten, die von dem betreffenden Wirtschaftsakteur weder finanziert noch entwickelt werden noch dessen Kontrolle unterliegen
• Inhalte von Webseiten und mobilen Anwendungen, die als Archive gelten, da ihre Inhalte nach dem 28.06.2025 weder aktualisiert noch überarbeitet werden.

Dienste, die Verbrauchern den Zugang zu audiovisuellen Mediendienste (z.B. Netflix, Amazon Prime, Disney+ & Co.) ermöglichen, werden vom BFSG ebenfalls nicht erfasst. Hierfür werden eigene Regelungen zur Barrierefreiheit erlassen. Außerdem müssen die BFSG-Vorgaben nicht umgesetzt werden, wenn deren Einhaltung zu einer unverhältnismäßigen Belastung führen würde. Eine „unverhältnismäßige Belastung“ in diesem Sinne liegt vor, wenn die Einhaltung der Barrierefreiheitsanforderungen eine zusätzliche übermäßige organisatorische oder finanzielle Belastung darstellt und es nach vernünftigem Ermessen nicht möglich wäre, eine oder mehrere der Anforderungen des BFSG vollumfänglich anzuwenden. Hier geht es um das Verhältnis von Nettokosten, die mit der Einhaltung der Barrierefreiheitsanforderungen verbunden sind, zu den Gesamtkosten (Betriebs- und Investitionsausgaben) bzw. den Nettokosten, die mit der Einhaltung der Barrierefreiheitsanforderungen verbunden sind, zum Nettoumsatz. Diese Beurteilung ist schriftlich zu dokumentieren, fünf Jahre lang aufzubewahren und auch alle fünf Jahre zu wiederholen. Zudem muss die zuständige Marktüberwachungsbehörde unverzüglich informiert und ihr die Dokumentation bereitgestellt werden.

Allgemeine Pflichten

Produkte, die auf dem Markt bereitgestellt werden, und Dienstleistungen, die angeboten oder erbracht werden, müssen ab dem Stichtag barrierefrei sein. Das umfasst neben dem Produkt bzw. der Dienstleistung selbst u.a. auch Gebrauchsanweisungen, Sicherheitsinformationen oder Kontaktangaben zum Hersteller. Produkte und Dienstleistungen sind dann barrierefrei, wenn sie für Menschen mit Behinderungen in der allgemein üblichen Weise, ohne besondere Erschwernis und grundsätzlich ohne fremde Hilfe auffindbar, zugänglich und nutzbar sind (§ 3 Abs. 1 S. 2 BFSG). Die konkreten Anforderungen an die Barrierefreiheit richten sich nach der Verordnung über die Barrierefreiheitsanforderungen für Produkte und Dienstleistungen nach dem Barrierefreiheitsstärkungsgesetz (BFSGV). Diese bestimmt in ihrem § 3 Abs. 1, dass regelmäßig der Stand der Technik zu beachten ist (siehe Kasten „Praxistipp“).

Um die Vorgaben der BFSGV mit Leben zu füllen, veröffentlicht die Bundesfachstelle für Barrierefreiheit auf ihrer Website regelmäßig u.a. eine Auflistung der wichtigsten zu beachtenden Standards, aus denen die Barrierefreiheitsanforderungen detailliert hervorgehen, sowie aktuelle Informationen zu den zu beachtenden Standards.

Folgende allgemeine Anforderungen werden gemäß BFSG an Websites gestellt:

• Websites müssen auf konsistente und angemessene Weise wahrnehmbar, bedienbar, verständlich sowie robust gestaltet werden.
• Im Fall der Verfügbarkeit von Unterstützungsdiensten (z.B. Help Desk, Call Center, technische Unterstützung, Relaisdienste oder Schulungsdienste) müssen diese die Informationen über die Barrierefreiheit und die Kompatibilität der Dienstleistung mit assistiven Technologien mit barrierefreien Kommunikationsmitteln bereitstellen.
• Produkte im Sinne des BFSG, die zur Erbringung einer Dienstleistung verwendet werden, müssen die entsprechenden Anforderungen erfüllen.
• Es müssen bestimmte Pflichtinformationen bereitgestellt werden.

Zu den Pflichtinformationen zählt insbesondere auch die Barrierefreiheitserklärung (Anlage 3 zu § 14 BFSGV). Diese muss folgende Angaben enthalten:

• Beschreibung der geltenden Anforderungen an die Barrierefreiheit
• Allgemeine Beschreibung der Dienstleistung in einem barrierefreien Format
• Beschreibungen und Erläuterungen, die zum Verständnis der Durchführung der Dienstleistung erforderlich sind
• Beschreibung, wie die Dienstleistung die einschlägigen Barrierefreiheitsanforderungen erfüllt
• Angabe der zuständigen Marktüberwachungsbehörde

NOCH MEHR ZU WEB DESIGN?

Der Web Design & Development Track

Mehr erfahren

Alle Pflichtinformationen…

• werden über mehr als einen sensorischen Kanal bereitgestellt;
• sind für den Verbraucher auffindbar;
• werden in verständlicher und wahrnehmbarer Weise dargestellt;
• werden in Textformaten zur Verfügung gestellt, die sich zum Generieren alternativer assistiver Formate durch den Verbraucher eignen, die auf unterschiedliche Art dargestellt und über mehr als einen sensorischen Kanal wahrgenommen werden können;
• werden in einer Schriftart mit angemessener Größe und mit geeigneter Form unter Berücksichtigung des vorhersehbaren Nutzungskontexts und mit ausreichendem Kontrast sowie ausreichenden Abständen zwischen den Buchstaben, Zeilen und Absätzen dargestellt;
• werden in einer alternativen Darstellung des Inhalts angeboten, wenn Elemente nicht textlichen Inhalts enthalten sind.

Pflichten im E-Commerce

In Bezug auf Dienstleistungen im elektronischen Geschäftsverkehr müssen gemäß § 19 BFSG:

• Informationen zur Barrierefreiheit der zum Verkauf stehenden Produkte und der angebotenen Dienstleistungen bereitgestellt werden, soweit diese Informationen vom verantwortlichen Wirtschaftsakteur zur Verfügung gestellt werden,
• Identifizierungs-, Authentifizierungs-, Sicherheits- und Zahlungsfunktionen, wenn diese nicht in Form eines Produkts, sondern im Rahmen einer Dienstleistung bereitgestellt werden, wahrnehmbar, bedienbar, verständlich und robust gestaltet werden, und
• Identifizierungsmethoden, Authentifizierungsmethoden, elektronische Signaturen und Zahlungsdienste, wenn diese bereitgestellt werden, wahrnehmbar, bedienbar, verständlich und robust gestaltet werden.

Checkliste Website

Folgende konkrete Maßnahmen sollten generell für eine BFSG-konforme Website realisiert werden:

• Verbesserung von Benutzererfahrung und Benutzeroberfläche
• Gestaltung von Websites leicht navigierbar und verständlich
• Schaffung von klaren, verständlichen Layouts
• Integration von interaktiven Elementen zur Unterstützung von Menschen mit Behinderung (z.B. „Text vorlesen lassen“)
• Verwendung von Farbkontrasten oder auch Implementierung von Sprache-zu-Text-Funktionen
• Interaktive Elemente, wie Links, Formulare und Buttons, so gestalten, dass sie von Screenreadern leicht erkannt werden können (klar beschriftet und in einem kontrastreichen Format)
• Tastaturnavigation muss ohne Einschränkungen möglich sein
• Bereitstellung von „Alt“-Texten für Bilder
• Verwendung von leicht verständlicher Sprache
• Bereitstellung der Pflichtinformationen („Erklärung zur Barrierefreiheit“)
• Bei PDF-Dateien lesbare Schriftarten und angemessenen Kontrast verwenden sowie eine Strukturierung der Informationen in einer Weise, die von Screenreadern leicht verarbeitet werden kann

Für Behörden existiert die Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz (kurz: Barrierefreie-Informationstechnik-Verordnung, BITV 2.0). Darin gibt es die gesetzliche Vermutung, dass die Anforderungen an die Barrierefreiheit als erfüllt anzusehen sind, wenn die harmonisierten Normen oder Teile dieser Normen umgesetzt wurden. Eine vergleichbare Vorschrift gibt es mit § 4 BFSG auch, so dass hier eine entsprechende Vermutung zugunsten des betreffenden Website- bzw. App-Betreibers angenommen werden kann. Es ist daher vorteilhaft, sich an bestehende Normen zu halten, insbesondere an den europäischen Standard EN 301 549 sowie an die Web Content Accessibility Guidelines (WCAG). Auch wenn sich die BITV 2.0 und damit auch EN 301 549 und WCAG in erster Linie an öffentliche Stellen richten, kann Unternehmen nur empfohlen werden, sich in puncto Barrierefreiheit ebenfalls daran zu halten.

Sanktionen

Die Nichteinhaltung der BFSG-Vorschriften stellt eine Ordnungswidrigkeit dar. Hierbei wird es nach dem 28. Juni 2025 also beispielsweise um das Inverkehrbringen eines nicht barrierefreien Produkts, um das Anbieten einer nicht barrierefrei gestalteten Dienstleistung oder um die Nichtbereitstellung der Pflichtinformationen gehen. Je nach konkretem Verstoß droht hier eine Geldbuße von bis zu 100.00 Euro.

The post Barrierefreiheit im Digitalen: So erfüllen Sie die neuen BFSG-Anforderungen ab 2025 appeared first on webinale 2026.

Elisa Czerski ist Unternehmerin, Philosophin und Wirtschaftswissenschaftlerin. Basierend auf ihren akademischen Forschungen, in denen sie die Verbindung von KI, Robotik, Neurowissenschaften und Ethik untersucht hat, gründete sie im Jahr 2021 N Robotics.

In diesem Vortrag erkundet sie das transformative Potenzial der Verknüpfung von KI und Robotik. Es werden die bedeutendsten Fortschritte, Anwendungen und Herausforderungen besprochen, wobei der Fokus auf ethischen Implikationen und verantwortungsbewusster Entwicklung liegt. Ziel des Vortrags ist es, einen prägnanten Überblick über den aktuellen Stand der verkörperten KI und deren Auswirkungen auf die Gesellschaft zu vermitteln.

The post Keynote-Video: How Advancements in Robotics and AI Will Affect All of Us appeared first on webinale 2026.

Teil 1 – Theorie
Bedeutet digitale Barrierefreiheit den Kontrollverlust über Corporate-Design?

Teil 2 – Praxis
Ein Design für eine barrierefreie Webseite erstellen – wie gehe ich vor?

Teil 2 – Praxis

Jedes Design bzw. jede Webseitenkonzeption sollte mit Research über die Nutzenden beginnen. Für barrierefreie Webseiten ist es natürlich notwendig, sich nicht nur mit dem klassischen “Menschzentrierten Gestaltungsprozess” [1] zu beschäftigen und dessen Methoden anzuwenden, sondern sich auch darin zu vertiefen, dass Menschzentriert nicht heißt, dass im Zentrum der “normale” Mensch steht, sondern alle Menschen mit ihren körperlichen, kognitiven und psychischen Eigenarten.

Das wirkt sich idealerweise bereits stark auf die Wireframes aus, die berücksichtigen sollten, dass interaktive Elemente auf allen Geräteklassen sowohl mit der Maus, als auch mit der Hand und mit der Tastatur bedienbar sein müssen.

Nachdem die Wireframes feststehen, kann eine erste Farbversion entstehen. Eine Methode ist dabei sicherlich, zunächst die Startseite zu gestalten. Sinnvoller jedoch ist es, zunächst zu schauen, welche Inhaltsblöcke es auf der gesamten Webseite geben soll und diese auf einer Meta-Seite zusammenzuziehen. Auch wenn ich bei der Konzeption oft den Ansatz “Mobile first” vertrete, empfehle ich in diesem Fall, eher mit einer Desktop-Größe zu beginnen. Am besten mit einer, auf der nicht die ganze Breite genutzt wird, sondern rechts und links noch die Hintergrundfarbe des Bodyelements sichtbar sein wird. Desktop HD mit 1440px Breite zum Beispiel.

Meine Meta-Seite umfasst:

1. Darstellung und Position von Skip-Links für Screenreader-Nutzende und ggf. Einstellungen zur Barrierefreiheit, die nicht automatisch abgedeckt werden können.*
2. <head> der Seite mit
   1. Logo
   2. Suche
   3. Navigation
   4. Metanavigation
3. <main> der Seite mit
   1. h1 Überschrift (für alle Templates!)
   2. Fließtext in Paragraphen 16px (= 1rem im CSS)
   3. Links
      1. innerhalb der Seite
      2. zu externen Seiten
      3. auf Dokumente, die geöffnet werden (Dateiformat mit angeben!)
      4. auf Dokumente, die herunter geladen werden (Dateiformat mit angeben!)
   4. Headlines Level 2–6
   5. Weitere Inhaltsblöcke:
      1. Zitate
      2. Informationsboxen
      3. Sortierte Liste
      4. Unsortierte Liste
   6. Formularelemente:
      1. Eingabefelder
      2. Dropdown-Felder bzw. Comboboxen
      3. Checkboxen und Radiobuttons
   7. Nicht vergessen! die Spezialfarben für:
      1. Selektierten Text
      2. Scrollbar-Design
      3. Hover-Darstellung von Links
      4. Visited-Darstellung von Links
      5. Hover-Darstellung von visited Links
      6. Fokus-Farbe und Stil für alle Elemente (one fits all?)

* Position und Darstellung hiervon bestimmen, ob sie ebenfalls im <head> platziert werden können oder eine eigene <section> erhalten.

Je nachdem, wie die Brand bisher aussieht, fange ich mit den bereits feststehenden Farben an, eine erste Version zu bauen. Dabei achte ich darauf, die Unterscheidungen zwischen einzelnen Abschnitten und Elementen nicht über die Invertierung der Schriftfarbe zu lösen, sondern achte darauf, möglichst eine andere Hintergrundfarbe oder andere Gestaltungselemente zu verwenden die einen ausreichend hohen Kontrast zu der Fließtextschrift hat.

Erst wenn diese Version fertig ist, dupliziere ich sie und bearbeite die Version für den jeweils anderen Modus. Dabei achte ich immer darauf, alle Farben, die miteinander kombiniert werden können, auch gegeneinander zu prüfen, ob der Kontrast ausreichend ist.

Wenn die Farbgestaltung feststeht kommen noch exemplarische Ausarbeitungen in verschiedenen Schriftgrößen sowie für eine grobe oder feine Eingabemethode dazu.

Wichtig ist natürlich nach wie vor die responsive Darstellung, die im Prüfschritt 9.1.4.10 Inhalte brechen um [2] ein Level AA-Kriterium darstellt.

Farbmodi mit CSS Farb-Variablen mit wenigen Codezeilen umsetzen

95% der in Deutschland verwendeten Browser unterstützen inzwischen den Einsatz von CSS-Variablen [3]. Für die wenigen Browser, die dies noch nicht unterstützen, gibt es den Fallback den Farbwert mit in den Aufruf der Farbe zu schreiben. Wenn Sie die 0,09% Unterstützung für den Internet Explorer 11 ebenfalls unterstützen möchten können Sie dies mit einem Polyfill [4] tun.

CSS-Variablen sind deshalb so wichtig, weil wir ihnen an zentraler Stelle sagen können, für welche Farbpräferenz sie gelten sollen.

Zunächst wird das Set von Farben für den Tag-Modus am Anfang der CSS-Datei gesetzt, da CSS (zur Erinnerung, CSS steht für “Cascading Style Sheet”) gesetzte Regeln so lange innerhalb von bestimmten Bereichen vererbt, bis sie anderweitig überschrieben werden. Zur besseren Veranschaulichung des Prinzips habe ich Farbnamen gewählt:

:root {
   --body: white;
   --copy: black;
   --logo: red;
   --link: blue;
}

Damit der Tag-Modus auch der Modus ist, der beim Ausdrucken verwendet wird, setzen wir bei den folgenden Media-Queries immer den Geltungsbereich “only screen” zusätzlich zu der eigentlichen Abfrage mit ein. Dann gelten die Anweisungen nicht für den Druckmodus.

@media only screen and (prefers-color-scheme: dark) {
  :root {
    --body: black;
    --copy: white;
    --link: yellow;
}

Im weiteren Verlauf werden diese Variablen den jeweiligen Eigenschaften zugewiesen. Das Komma hinter dem Variablen-Namen und der Default-Farbwert sind für diejenigen Browser gedacht, die keine Variablen unterstützen:

body {
     background: var(--body, white);
}

#logo {
     color: var(--copy, black);
     fill: var(--logo, red);
}

p {
     color: var(--copy, black);
}

a {
     color: var(--link, blue);
}

Für die ID #logo bin ich davon ausgegangen, dass das Logo aus einem rot gefärbten SVG mit daneben stehendem schwarzen Text besteht. Der Text wird durch die Eigenschaft color eingefärbt, der Logo-Pfad im SVG durch fill.

Der Farbwert “red” wird mit dem Hexadezimalwert #FF0000 aufgelöst. Er erreicht im Kontrast zu weiß ein Verhältnis von 4, was nur die Voraussetzungen für Schrift mit mehr als 24px erfüllt. Da wir davon ausgehen, dass das Logo eher groß angezeigt wird, reicht dies gerade so aus. Auf schwarzem Hintergrund ergibt sich ein Kontrastverhältnis von 5.25, was auch die Kriterien für AAA für große Schrift erfüllt. Da dies als ausreichend betrachtet werden kann wird die Farbe –logo in den Einstellungen für den Nacht-Modus nicht verändert.

Das Ergebnis sieht automatisch so aus dass die linke Version sichtbar ist wenn der Tag-Modus aktiviert wurde und der rechte bei aktivem Nacht-Modus:

The post Ein Design für eine barrierefreie Webseite erstellen – wie gehe ich vor? appeared first on webinale 2026.

Teil 1 – Theorie
Bedeutet digitale Barrierefreiheit den Kontrollverlust über Corporate-Design?

Teil 2 – Praxis
Ein Design für eine barrierefreie Webseite erstellen – wie gehe ich vor?

Und dann das: Menschen mit visuellen Einschränkungen können das bereitgestellte Webangebot nicht nutzen und die angebotenen Produkte und Dienstleistungen nicht kaufen:

• weil das viele Weiß sie blendet und sie die Seite wieder schließen.
• weil sie die Farben nicht richtig sehen und die Links nicht finden.
• weil sie die Schrift in der festgelegten Größe nicht lesen können.
• weil sie die Funktion hinter den schicken Icons nicht deuten können.
• …

In dieser Artikelserie geht es darum aufzuzeigen, dass es möglich ist, ein Corporate Design so zu erweitern, dass es (visuell) barrierefrei nutzbar ist.

Teil 1 – Theorie

Elemente von Corporate-Design und -Identity

Zu einer Corporate-Identity gehören:

1. Corporate Culture
2. Corporate Communication
3. Corporate Behavior (inklusive Corporate Social Responsibility)
4. Corporate Design

Das Corporate-Design umfasst den visuellen Firmen-Auftritt und wird in einem Styleguide bzw. Brand Book festgehalten:

• das Logo bzw. Wort-Bild-Marke inkl. Regeln wie es einzusetzen ist
• die Farben und Farbkombinationen die verwendet werden dürfen
• die erlaubten Schriften und Schriftschnitte bis zu einer eigenen Hausschrift
• die Bildsprache von Fotos und Illustrationen
• weitere gestalterische Stilmittel z.B. Icons, Formen, Kombinationen

Die meisten Corporate-Designs sind darauf ausgelegt, auf und in allen Medien ein einheitliches Erscheinungsbild zu transportieren.

Was ist das Problem?

Corporate Designs werden für Menschen entwickelt, deren Augen …

• nahezu 100% Sehkraft haben
• gut sehen können:
  • alle Farben
  • alle Sättigungsabstufungen von grau bis knallig
  • alle Kontraste unabhängig der Farben und ihrer Sättigung
  • alle Schriftgrößen
• generell gut fokussieren können
• sich an helle und dunkle Lichtverhältnisse adaptieren können
• nicht blendempfindlich sind
• unterschiedlich große Schriften lesen können
• räumlich sehen können

Die Realität sieht anders aus!

Die folgende Tabelle stellt eine grobe Übersicht über Seheinschränkungen dar, ohne Vollständigkeit zu bieten. Es geht mir darum, zu verdeutlichen, dass viel mehr Menschen betroffen sind als allgemein angenommen. Auffällig ist die ungleiche Verteilung auf Männer und Frauen bei den Farbsehschwächen und Migräne. Daten für nichtbinäre und agender Menschen liegen nicht vor. Alle Zahlen sind eher mit Vorsicht zu genießen, weil sie in Deutschland nicht offiziell erfasst werden. Das gilt insbesondere auch für Blindheit [2].

Wie bei allen anderen Behinderungen auch, nehmen Seheinschränkungen im Alter zu. Zwar gibt es Menschen, die gar keine Probleme haben, oder deren Probleme sich mit Brillen, Kontaktlinsen und Operationen ausgleichen lassen, aber sie sind nicht in der Mehrzahl.

Farbsehschwächen

Haben Sie eine Farbsehschwäche? Manch einer erfährt es erst beim Führerscheintest. Um das zu testen, gibt es die Ishihara-Farbtafeln. Wer in den unten stehenden Kreisen aus verschiedenen farbigen Punkten keine Zahl oder nicht die Zahl sieht, die Menschen mit voller Farbwahrnehmung sehen, hat möglicherweise die darunter stehende Farbschwäche.

Abbilding 1: Ishihara-Farbtafeln

Die oben abgebildeten Farbtafeln sind aus der Wikipedia [4]. Die linke zeigt eine einstellige Zahl, die beiden anderen eine zweistellige. Weitere Tafeln und auch eine animierte Darstellung des Prinzips für Farbenblinde gibt es in der Wikipedia.

Die häufigsten Farbsehschwächen liegen im Rot-Grün-Bereich. Speziell diese sind auch Chromosomen-spezifisch, weshalb mehr Männer betroffen sind.

Einen kleinen Einblick, wie es ist in einer Welt ohne Farben zurecht zu kommen ist im folgenden Video beschrieben: https://youtu.be/ChQ9bpK2oU4

Kurzsichtigkeit, Weitsichtigkeit und Astigmatismus

Kurzsichtigkeit ist von den genannten Einschränkungen in der digitalen Barrierefreiheit am wenigsten zu beachten, wenn sie mit einer Brille oder Kontaktlinsen ausgeglichen werden.

Für Weitsichtige ist die Möglichkeit, die Schriftgröße auf ihren Geräten größer einstellen zu können, wichtig. 

Menschen mit Astigmatismus (die Lichtbündel brechen nicht nur an einem Punkt im Auge, es kommt zu Überstrahlungen) oder Menschen, die nur noch eine sehr geringe Restsehkraft haben, benötigen noch weit größere Schriften und Kontraste bzw. die Möglichkeit, die ganze Seite zu skalieren. Alles, was sich automatisch oder unerwartet bewegt, stört den ohnehin schwierigen Prozess der Orientierung und unterbricht den Lesevorgang.

Migräne

Nicht direkt ein Problem mit den Augen, aber mit Lichteinfall können z.B. Migräneschübe zusammenhängen. “Weltweit leiden zehn bis 15 Prozent der Erwachsenen an Migräne. Etwa 6 bis 8% aller Männer und 12 bis 14% aller Frauen sind betroffen. Bei Frauen sind die Attacken meist länger und intensiver.

Alleine in Deutschland sind etwa 3,7 Millionen Frauen und rund 2 Millionen Männer betroffen. Am häufigsten ist die Migräne in der Gruppe der 35 – 45- Jährigen. Danach gehen bei beiden Geschlechtern Schwere und Häufigkeit der Attacken zurück.” Heißt es im Manual der Deutschen Migräne- und Kopfschmerzgesellschaft. [5]

Auswirkungen der visuellen Barrierefreiheit auf das Corporate Design

Jede Brand hat das Bestreben, einen größtmöglichen Bekanntheitsgrad zu erlangen. Nur wenigen gelingt dies wie Coca-Cola. Was in Deutschland der Ausspruch “Du lebst wohl hinter dem Mond” ist, ist in Griechenland “Aber Coca-Cola ist in deinem Dorf angekommen?” [6]. Einen größeren Erfolg kann sich eine Marke wohl kaum wünschen.

Der Grund, weshalb ich Coca-Cola im weiteren Verlauf dieses Artikels nicht beschreibe liegt daran, dass deren Webseite absolut unbrauchbar als gutes Beispiel für Barrierefreiheit ist. 

Kontraste – elegant vs. lesbar

Lange Zeit galt es als “Schick” im Design mit eher geringen Farbkontrasten zu arbeiten. So sollte z.B. eine graue Schrift auf weiß wie Silber anmuten. Der Farbcode des Farbnamens “silver” wird mit #C0C0C0 angegeben. Im ContrastChecker [7] wird bei dem Farbton auf weißem Grund ein Kontrastverhältnis von 1.83 ausgerechnet. Um mindestens das Konformitäts-Level AA zu erreichen braucht es ein Kontrastverhältnis von 3 für Schriften über 18pt (1pt entspricht 1,333px und somit sind 18pt umgerechnet 24px [8] – was bei einer normalen Darstellungsgröße von 16px  wiederum 1.5rem entspricht).

Das Verhältnis von 4.5 reicht laut Definition für Schriftgrößen unter 24px aus. Erst ab einem Kontrastverhältnis über 7 wird das Konformitäts-Level AAA erreicht.

Farben im Corporate Design

Die verwendeten Medien haben schon immer einen Einfluss auf die farbliche Gestaltung einer Marke genommen. So war Gelb beispielsweise lange Zeit in Logos verpönt, um das Problem zu umgehen, dass es beim Versenden von analogen Faxen nicht übertragen wird. Da Faxe weitgehend (!) keine Rolle mehr spielen, ist das inzwischen obsolet.

Abgesehen von solchen Überlegungen spielen die Erkenntnisse der Farbpsychologie, aber auch das brancheninterne Benchmarking hinsichtlich Zugehörigkeit und Abgrenzung eine Rolle. Ob auch die Verfügbarkeit der gewünschten Farben für verschiedene Druckverfahren berücksichtigt wird, hängt natürlich stark davon ab, was das Unternehmen vertreibt. 

Gerade Wohlfühlprodukte haben es in der digitalen Barrierefreiheit visuell schwer, da sie oft auf Pastelltöne auf weißem Grund zurückgreifen. Oft hilft es jedoch, den Einsatz der Farbe anzupassen: helle Farben im Hintergrund können durchaus eingesetzt werden. Solange die Schriftfarbe einen ausreichenden Kontrast zum Hintergrund hat, kann auch das barrierefrei sein!

Tag-Modus – Nacht-Modus – Egal-Modus?

Früher habe ich gerne einzelne Elemente der Webseite invertiert. Wenn beispielsweise der Inhalt selbst dunkle Schrift auf hellem Hintergrund enthalten hat, habe ich den Header und Footer sowie Elemente, die ich hervorheben wollte, oft mit heller Schrift auf dunklem Hintergrund angelegt. Im Nacht-Modus habe ich die Bereiche einfach invertiert.

Dabei bin ich jedoch dem Trugschluss erlegen, es gäbe einen “Egal-Modus”, also eine Einstellung mit der Nutzende sagen können, dass sie mit beiden Modi gut zurechtkommen. Das ist leider nicht der Fall.

Meiner kleinen und ganz bestimmt nicht repräsentativen Stichprobe bei LinkedIn und unter Freund:innen nach, gibt es durchaus einen großen Anteil an Menschen, denen es nichts oder wenig ausmacht, wenn eine Seite durchmischt ist. Dies sind dann aber oft die Menschen, die eben nicht auf barrierefreies Design angewiesen sind. Diejenigen, die sich aus medizinischen Gründen für einen Modus entschieden haben, bevorzugen es, wenn möglichst wenig Flächen invertiert sind.  

Wenn wir uns nicht aktiv darum bemühen, sowohl einen Tag- als auch Nacht-Modus bereit zu stellen, dann kann es uns passieren, dass Menschen im Betriebssystem einstellen, dass der Bildschirm invertiert werden soll. Dann werden aber nicht nur die Hintergründe und Texte invertiert, sondern auch unsere Brand-Farben und je nach Einstellung auch alle Bilder.

Abbildung 2: Original-Design und invertierte Darstellung auf dem Mac mit der Systemeinstellung Barrierefreiheit/Ansicht/Farben umkehren.

Das Design soll sich nicht wie in Abbildung 2 gezeigt von türkis/lila in rot/grün verändern, sondern vom invertierten Bereich im Content her sollen die Farben grundsätzlich im genannten Spektrum bleiben, aber so dunkel werden, dass sie mit heller Schrift funktionieren.

Abbildung 3: Tag-Modus-Design und Nacht-Modus-Design wie gewünscht.

Nun kann es natürlich sein, dass Nutzende den Nacht-Modus UND das Invertieren des Screens aktiviert haben. In dem Fall würde auch die dunkle Variante invertiert werden.

Abbildung 4: Nacht-Modus-Design und invertierte Darstellung

Dadurch, dass ich beide Farbvarianten gestaltet und die gewünschten Farben im Code zugewiesen habe, behalte ich (weitgehend) unabhängig von der Einstellung der Nutzenden die Kontrolle über die Farben meiner Webseite.

Manche Webseiten bieten deshalb auf der Seite selbst die Möglichkeit an, die Webseiten zu invertieren oder mit anderen Farbvarianten darzustellen. Dies ist an sich gut gemeint, besser ist es jedoch, wenn sich jeder Mensch die benötigten oder gewünschten Einstellungen im Betriebssystem des Gerätes einstellt und dann das Betriebssystem, alle Webseiten und Apps sich daran anpassen. Additional können solche Tools gerne eingesetzt werden, jedoch nicht als Ersatz für eine barrierefreie Gestaltung und Programmierung.

Darum lautet meine Empfehlung:

1. Stellen Sie einen Tag- und Nacht-Modus bereit!
2. Invertiert so wenig Elemente wie möglich!
   Gerade Webseiten, auf deren Inhalte Sie später keinen Einfluss mehr haben, sollten diesbezüglich robust angelegt werden.

Telekom-Tochter t-online zeigt wie es gelingen kann

Dass Farben wichtig sind, zeigt in Deutschland vor allem die Telekom, die sich bereits im Jahr 2000 die Farbe Magenta eintragen lassen hat. Beim DPMA [9] heißt es, der Markenrechtsschutz (der noch bis zum 31.12.2025 läuft) gelte u. A. für “Zurverfügungstellung von über das Internet abrufbaren Inhalten”. Die Telekom selbst hat eine eigene Seite über die Farbe Magenta verfasst, auf der es heißt “Heute ist Magenta ein eingetragenes Markenzeichen in der Europäischen Union, den USA und weiteren Ländern.” [10].

Die unterschiedlichen Tochterfirmen der Telekom verwenden den eingetragenen Farbcode in unterschiedlicher Weise. Was zum einen zeigt, dass es sich um eigenständige Seiten handelt, aber auch, wie viel Varianz innerhalb einer Marke möglich ist, ohne den grundsätzlichen Wiedererkennungswert einzubüßen.

Abbildung 5: Header der Webseite Telekom.com – nur im Tag-Modus verfügbar

Abbildung 6: Header der Webseite Telekom.de – nur im Tag-Modus verfügbar

t-online.de ist hier unser (nicht perfektes, aber gutes) Beispiel dafür, dass ein Corporate Design im Tag- und Nacht-Modus funktionieren kann, ohne den grundsätzlichen Charakter einzubüßen:

Abbildung 7: Header der Webseite t-online.de im Tag-Modus

Abbildung 8: Header der Webseite t-online.de im Nacht-Modus

Bitte beachten Sie, dass nicht nur das Schwarz im eigenen Logo, sondern auch im Logo von Amazon invertiert wurde!

Der eingetragene Farbcode mit dem Hexadezimalwert #E20074 hat zu weiß ein Kontrastverhältnis von 4.68. Bis auf die höchsten Kriterien AAA für kleine Schriften und die absolute Farbdifferenz besteht sie damit den Check auf Barrierefreiheit. Auf Schwarz hingegen beträgt das Kontrastverhältnis nur 4.49. Dies gilt nur für Schrift mit mehr als 24px als barrierefrei – gemäß der Konformitätsstufe AA.

Entsprechend ist der Tag-Modus vom Kontrast her barrierefreier als der Nacht-Modus. Dies zeigt, dass es teilweise nötig sein kann, zusätzlich zur bestehenden Brand-Farbe eine weitere Farbversion als Brandfarbe zu definieren.

 Für die Telekom könnte das so aussehen:

Tatsächlich fallen die notwendigen Änderungen am Farbwert sehr gering aus um in beiden Versionen das Konformitätslevel AA zu erreichen.  

Damit kein Missverständnis entsteht: die zusätzlichen Farbwerte dienen der Verdeutlichung, wie eine Brand adaptiert werden müsste und sind keinesfalls die von der Telekom neu eingeführten Farbwerte!

 Sie sehen, dass es unter dem Gesichtspunkt der Barrierefreiheit gar nicht so leicht ist, eine bestehende Marke zu transformieren. Nicht nur bei SEO, auch beim Design gilt es, die Barrierefreiheit sorgsam gegen andere Aspekte abzuwägen.

 Zum “Glück” für die Telekom reicht es laut der Richtlinie, dass die Level AA-Kriterien zum Start der Gültigkeit der EAA umgesetzt werden. Nun ist natürlich immer die Frage, ob es dem eigenen Anspruch entspricht, “nur” die gesetzlichen Vorgaben zu erfüllen, oder tatsächlich das Maximum an Barrierefreiheit zu erzeugen, wie es in der BITV unter § 3 Anzuwendende Standards in Passus (4) heißt: es “[…] soll ein höchstmögliches Maß an Barrierefreiheit angestrebt werden.” [14]

 Mein Lösungsvorschlag wäre in dem Fall der Telekom:

1. Den Tag-Modus für die “normale” Einstellung, ohne zusätzliche Einstellung, dass mehr Kontrast benötigt wird, so lassen.
2. Den Farbwert für den Nacht-Modus für das Level AA anpassen.
3. Für den Fall, dass Nutzende in den Einstellungen angegeben haben, dass sie mehr Kontrast bevorzugen bzw. benötigen, die Farbwerte für AAA im Tag- und Nacht-Modus nutzen (@media (prefers-contrast: more).
4. Den Eintrag bei der DPMA um diese Angaben ergänzen. Mit den Informationen wann welcher Farbton gilt.

 Für alle, die gerne die Richtlinie wüssten, auf die ich mich beziehe: BITV 2.0 Nummer 11.7 Benutzerdefinierte Einstellungen [15]. Dort heißt es: “Die Seite soll benutzerdefinierte Browsereinstellungen berücksichtigen.” Nun können Sie argumentieren, dass Tag- und Nachtmodus ja keine speziellen Browsereinstellungen sind.

Genaugenommen verlangt dieser Prüfschritt derzeit, dass sich die Webseiten auch an benutzerdefinierte Farbeinstellungen anpassen. Mit meinen Test-Farben im Firefox sieht die t-online.de bis auf die Logo-Farbe unabhängig von Tag- oder Nacht-Modus wie folgt aus:

Abbildung 9: Darstellung im Firefox mit der Einstellung “Oben ausgewählte Farben anstatt der Farben der Seite verwenden: Immer”

Spätestens an diesem Punkt entzieht sich die Farbgestaltung spätestens unserem Einfluss.

 Es gibt auch noch die Darstellung im Forced-Color-Mode, den laut Windows 4% der Nutzenden insgesamt und laut WebAIM 50% der Nutzenden mit starken Seheinschränkungen eingestellt haben, wie im Blog von Polypane beschrieben [16]:

Abbildung 10: oben der Tag- und unten der Nacht-Modus, wie ihn Chrome auf dem Mac mit dem Rendering “forced-colors: active” anzeigt

The post Bedeutet digitale Barrierefreiheit den Kontrollverlust über Corporate-Design? appeared first on webinale 2026.

In welchen Situationen ist ein Audit sinnvoll?

Ein Performance Marketing Audit ist in verschiedenen Situationen sinnvoll. In den letzten Monaten sank die Konsumlaune [1] und in zahlreichen Unternehmen steht weniger Budget zur Verfügung. Gerade jetzt ist es daher wichtig zu überprüfen, ob das vorhandene Budget optimal genutzt wird. Zudem profitieren Inhouse-Marketing-Teams von regelmäßigen Audits, um sicherzustellen, dass ihre Kampagnen den aktuellen Best Practices der Branche entsprechen.

Darüber hinaus bietet sich ein Audit gerade in wichtigen Unternehmensphasen an. Wenn ein Unternehmen eine internationale Expansion plant, ist ein Audit unerlässlich, um sicherzustellen, dass bestehende Maßnahmen zielgerichtet umgesetzt sind und bestehende Strategien auf die neuen Märkte zugeschnitten werden können. Doch auch in Phasen, in denen die Performance nicht den Erwartungen entspricht und möglicherweise 50 % des Media-Spendings gekürzt werden müssen, kann ein Audit dabei helfen, die Kampagne zu optimieren, um eine optimale Leistung zu erzielen und trotz Budgetreduzierung keine zu starken Umsatzeinbrüche in Kauf nehmen zu müssen. Auch Startups, die sich in der aktuellen Zeit verlängern müssen und die ihr Budget nun über einen längeren Zeitraum strecken müssen, können von einem Audit profitieren, um ihre Kampagnen auf längere Sicht zu planen und effizienter zu werden.

Welchen Zweck erfüllt ein Audit im Performance Marketing?

Der Zweck eines PPC-Audits besteht darin, sicherzustellen, dass das Budget optimal genutzt wird, die Kampagne den aktuellen Best Practices entspricht und die Performance verbessert wird. Ein Audit ist auch wichtig, um sicherzustellen, dass alle Kanäle optimal genutzt werden. Möglicherweise besteht in einzelnen Kanälen die Möglichkeit das Budget bei wachsendem Umsatz zu erhöhen, während in einem anderen Kanal Budget eingespart werden könnte, ohne an Umsatz zu verlieren. Auch wenn Budgets für das nächste Jahr oder Quartal neu geplant werden, sollte die Budgetallokation überprüft werden. Ein Performance-Marketing-Audit sollte daher Budgeteinsatz und Kostenstrukturen prüfen, sowie Verbesserungspotenziale aufzeigen. Das Ergebnis des Audits ist dann in der Regel ein Bericht, der Empfehlungen zur Verbesserung der Kampagnen enthält.

Für wen ist ein Performance Marketing Audit interessant?

Auch wenn einzelne Empfehlungen innerhalb eines Audits sehr spezifisch und detailliert sein können, ist ein PPC-Audit nicht nur für den Account-Manager interessant. Die Empfehlungen betreffen auch die Verantwortlichen für Landingpage und Conversion-Rate-Optimierung, die Verantwortlichen für die Erstellung der Werbeanzeigen und letzten Endes sind die Empfehlungen zur Budgetallokation auch für den CFO des Unternehmens interessant. Es ist wichtig, sicherzustellen, dass die Kampagne auf die Bedürfnisse aller Stakeholder zugeschnitten ist. Ein Audit ist also hilfreich für alle, die daran interessiert sind, gemeinsam das Beste aus ihrem Marketing-Budget herauszuholen. Hier sind normalerweise weit mehr Personen betroffen als der Online Marketing Manager, der die Kampagnen verwaltet.

Welche Elemente sollten geprüft werden?

Um den unterschiedlichen Stakeholdern gerecht zu werden, sollte die Analyse im Kern vier unterschiedliche Themenfelder abdecken: Kostenstrukturen, Landingpages, Conversion- und Kostentreiber sowie die Top 100 Elemente im jeweiligen Werbekonto.

Analyse der Kostenstruktur

Zur Optimierung der Effizienz von Werbemaßnahmen, ist eine Analyse der Kostenstruktur ein wichtiger erster Schritt. Hierbei sollten wichtige Metriken wie ROAS und Cost/Conv. für einzelne Werbemaßnahmen auf verschiedenen Plattformen geprüft werden. Durch eine Überprüfung der Budgetallokation kann ermittelt werden, ob das Budget effektiv auf die verschiedenen Plattformen verteilt ist. Ein Beispiel in Tabelle 1 zeigt, dass eine Erhöhung des Budgets bei Microsoft Ads zu einem höheren Umsatz führen könnte als bei Google Ads.

Tabelle 1: Vergleich unterschiedlicher Metriken für die Plattformen Google Ads, Meta Ads und Microsoft Ads

Es ist jedoch zu beachten, dass bei einer Erhöhung des Budgets die Metriken nicht unbedingt konstant bleiben. Eine Analyse der Budgetallokation ist daher wichtig, um eine effiziente Verteilung des Budgets zu gewährleisten und möglicherweise auf effizienteren Kanälen unter geringerem Budgeteinsatz den gleichen Umsatz zu erzielen.

Eine weitere wichtige Analyse betrifft den Vergleich von Cost-Share und Revenue-Share innerhalb einer Werbeplattform. Diese Auswertung ist in Tabelle 2 dargestellt. Hierbei sollte der Kosten-Anteil einer Kampagne in etwa dem Umsatz-Anteil entsprechen, um sicherzustellen, dass Kampagnen, die viel Umsatz erzielen, auch einen möglichst hohen Anteil des verfügbaren Budgets erhalten. Kampagnen mit hohem Kosten-Anteil und niedrigem Umsatz-Anteil wie etwa Kampagne B sollten in den Kosten reduziert werden. Im Beispiel könnte dafür das Budget auf Kampagne C umverteilt werden. Bei einer solchen Analyse sollte berücksichtigt werden, dass neue Kampagnen, die erst seit wenigen Tagen aktiv sind, eine faire Chance bekommen sollten ausreichend Daten zu sammeln und die Performance durch erste Optimierungen zu steigern, bevor die Kosten zu stark gesenkt werden.

Tabelle 2: Vergleich von Kosten und Umsätzen unterschiedlicher Kampagnen innerhalb einer Plattform

Analyse von Conversion- und Kostentreibern

Nachdem bereits analysiert wurde, welche Kanäle und Kampagnen zum Umsatz beitragen, geht es im nächsten Schritt nun darum zu analysieren, welche einzelnen Elemente im Werbekonto gut funktionieren und welche nicht konvertieren. Für Google Ads können nicht konvertierende Keywords pausiert werden, während bei Meta Ads Anzeigen oft viele Impressionen und Reichweite erzielen, die keine oder nur wenige Sales und Umsätzen generieren. Um zu vermeiden, dass einzelne Elemente zu hohen Kosten führen, können automatische Regeln eingerichtet werden, um Keywords oder Anzeigen zu pausieren, die nicht zur Performance beitragen. Eine Möglichkeit besteht darin, eine Kostengrenze auf Basis des Cost/Conv. festzulegen.

Abb. 1: Anlegen einer automatischen Regel bei Google Ads, um Keywords zu pausieren, die bereits 100 € gekostet haben ohne zu konvertieren

Weiterhin können Landingpages überprüft werden, um sicherzustellen, dass keine 404-Fehler auftreten und Anzeigen ins Leere laufen. Bei Google Ads kann ein 404-Skript eingesetzt werden, um sämtliche Landingpages innerhalb des Werbekontos zu überprüfen. Dieses Skript wird von Google selbst kostenfrei zur Verfügung gestellt und muss lediglich im eigenen Werbekonto implementiert werden. [2]

Eine weitere Möglichkeit ist die Auswertung von Dimensionen und Segmenten. Bei Google Ads kann die Performance nach Standort oder Tageszeit direkt im Interface überprüft werden, während bei Meta Ads die Überprüfung schwieriger geworden ist. Allerdings kann man in Google Analytics oder anderen Webanalyse-Tools prüfen, welche Zielgruppe den größten Anteil am Umsatz hat, um die Werbung auf diese Zielgruppe zu konzentrieren. Es kann sich zeigen, dass Werbung am Wochenende oder außerhalb der Geschäftszeiten kaum zu relevanten Umsätzen führt, weshalb eine Anpassung der Werbeschaltung in Erwägung gezogen werden kann.

Analyse der Landingpages

Nachdem zuvor bereits Landingpages aufgedeckt wurden, die nicht erreichbar sind und demnach nicht zu Sales und Umsätzen beitragen können, liegt im nächsten Schritt der Werbekampagnen-Analyse der Fokus noch einmal auf der Landingpage-Optimierung. Eine effektive Steigerung der Conversion-Rate auf der Landingpage kann bei gleichen Werbeausgaben höhere Umsätze generieren oder bei niedrigeren Werbeausgaben gleichbleibende Umsätze erwirtschaften. Das Beispiel in Tabelle  verdeutlicht, wie die Conversion-Rate von 3,0 % auf 3,5 % durch verschiedene Optimierungsmaßnahmen erhöht werden kann. Bei unverändertem durchschnittlichem Warenkorbwert und Kosten sinkt der Cost/Conv. von 33 € auf 29 €, was zu einem höheren Umsatz von 2.100 € anstelle von 1.800 € führt.

Tabelle 3: Vergleich unterschiedlicher Metriken für die Plattformen Google Ads, Meta Ads und Microsoft Ads

Neben der Steigerung des Umsatzes können Werbetreibende durch Landingpage-Optimierung auch das Werbebudget effizienter nutzen. Bei einer Steigerung der Conversion-Rate von 4,0 % auf 4,5 % wie in Tabelle 3 müssen nur noch 857 € anstelle von 1.000 € eingesetzt werden, um den gleichen Umsatz von 4.000 € zu erzielen. Dies führt zu einem höheren ROAS von 467 %.

Regelmäßige Überprüfung der Landingpages auf ihre Performance und gegebenenfalls Optimierungsmaßnahmen sind daher essenziell. Webanalyse-Tools wie Google Analytics können hierbei hilfreiche Informationen zur Verfügung stellen und dabei unterstützen, die Leistung schwacher Landingpages zu verbessern.

Analyse der Top 100

Im letzten Schritt des Audits nach der Untersuchung von Kontenstrukturen und Kostentreibern, steht die Analyse der Top 100 Elemente an. Diese werden jeweils nach ihren Kosten sortiert. Im Fall von Google Ads sollten die Top 100 Suchanfragen, Keywords und Produkte für Google Shopping-Anzeigen betrachtet werden. Für Werbung im Bereich Social Media Ads sollten die Top 100 Anzeigen überprüft werden.

Um die Top 100 Elemente im Werbekonto zu analysieren, können wie in Abbildung 2 neun verschiedene Bereiche betrachtet werden. Soll Budget eingespart und nur in effektive Elemente investiert werden, sollte man sich auf die All Stars und gegebenenfalls auch auf die Neglected Gold Mines konzentrieren. Wasteful Leaks wurden bereits im zweiten Schritt identifiziert, aber es können auch andere Elemente problematisch sein. Obwohl die roten Elemente (High Interest Opportunities, Low Quality Terms und Benchwarmers) derzeit keine Kosten verursachen, da sie aufgrund weniger Klicks kaum Impressionen generieren, können sie langfristig gefährlich werden und sollten daher kritisch überprüft werden, bevor sie in einem nächsten Schritt möglicherweise pausiert werden.

Abb. 2: Keywords, Suchanfragen oder Anzeigen können in neun unterschiedlichen Gruppen kategorisiert werden

Insbesondere die zweite Spalte der Efficiency Threats ist für die Kosteneinsparung von Interesse, da viele Impressionen auf diese Elemente entfallen, obwohl sie problematisch sein können. In einem idealen Kampagnensetup, fällt nur ein sehr geringer Anteil der Top 100 Elemente in diesen Bereich. Auch die Elemente der Kategorie Undercover Sabotage können gefährlich werden, da sie zwar zu Umsätzen und Conversions beitragen, aber der Cost/Conv. deutlich über dem angestrebten Zielwert liegt. Wenn man an dieser Stelle Budget einspart und einen Teil dieses Budgets in die All Stars oder Neglected Goldmines investiert, kann man möglicherweise bei gleichem oder weniger Budgeteinsatz mehr Umsatz erzielen.

Fazit

Eine Analyse der Kostenstruktur und auch der einzelnen Elemente wie Landingpages oder Keywords lohnt sich als in jedem Fall. Ein Performance-Marketing-Audit ist daher ein unverzichtbares Werkzeug, um sicherzustellen, dass die Kampagnen optimal laufen und das Beste aus dem verfügbaren Werbebudget herausholen. Durch regelmäßige Audits kann zudem sichergestellt werden, dass die Kampagnen den aktuellen Best Practices entspricht und auf die Bedürfnisse aller Stakeholder zugeschnitten sind.

Die Session der Autorin auf der webinale 2023

Links & Literatur

[1] GfK-Konsumklima-Index von Oktober 2020 bis Oktober 2022 (Quelle: Statista https://de.statista.com/statistik/daten/studie/2425/umfrage/gfk-konsumklima-index/)

[2] Google Ads Linkchecker Skript: https://developers.google.com/google-ads/scripts/docs/solutions/link-checker

The post Mit Performance-Marketing-Audits Online-Werbung optimieren appeared first on webinale 2026.

Backlinks und SEO

entwickler.de: Hallo Kaspar! Du sagst in deinem Webinale Abstract: „Suchmaschinen lieben Backlinks.“ Sind die Zeiten der Linkfarmen also noch nicht vorbei?

Kaspar Szymanski: Nein, die Zeiten der Linkfarmen sind ganz sicher nicht vorbei, auch wenn manch eine Suchmaschine deren Ende vielleicht ganz gern herbeisehnen würde. Solange Backlinks ein Ranking-Faktor sind, wird es allen Qualitätsrichtlinien, oder seit neuestem “Grundlagen der Google-Suche”, und allen damit verbundenen Risiken zum Trotz dennoch PageRank-Linkaufbau geben. Daran werden auch kurzfristige SEO-Hypes wie ChatGPT nichts ändern.

entwickler.de: Ohne nun deinen Talk vorweg zu nehmen: Vielleicht kannst du einmal einen Tipp geben, wie man sich „gute“ Backlinks aufbaut?

Kaspar Szymanski: Ein wirklich guter Link ist einer, der relevanten, konvertierenden Traffic steigert. Ob das nun ein PageRank- oder nofollow-Link ist, das ist unerheblich.

entwickler.de: Es gibt ja viele Rankingfaktoren. Wie würdest du das Thema Backlinks heute einschätzen, im Vergleich zu anderen Faktoren wie On-Page-Optimierung (Keywords, etc.), User Signale oder andere.

Kaspar Szymanski: Das kommt immer auch auf die Website und die Branche an. Backlinks können einen enorm positiven Einfluss auf den Erfolg einer Online-Plattform haben.

Tatsache ist aber auch, dass die Mehrheit von Websites keine oder nur wenige Backlinks haben. Online-Erfolg auch bei den führenden Suchmaschinen ist also auch ohne Backlink-Aufbau möglich.

Es gibt tatsächlich zahlreiche, vielversprechende Suchmaschinenoptimierungs-Alternativen. Der Fokus auf die Nutzererfahrung ist enorm wichtig und kann, wenn richtig umgesetzt, dazu beitragen, die Konkurrenz weit hinter sich zu lassen.

Eine andere vielversprechende Alternative stellt Performance dar. Google rankt bei vergleichbaren Webauftritten die schnellere Plattform fast immer höher. Das liegt daran, dass Nutzer schnellere Webauftritte bevorzugen. Es ist also durchaus möglich, mithilfe von technischer SEO die Wettbewerber zu schlagen. Und im Idealfall berücksichtigt die SEO-Strategie alle relevanten Faktoren, inklusive jener im On- wie auch Offpage-Bereich.

SEO in Zeiten von ChatGPT & Co.

entwickler.de: Was hältst du von Entwicklungen aus dem AI-Bereich – ChatGPT ist das Stichwort? Manche sagen, solche KI-basierten Systeme werden der klassischen Google-Suche schon bald den Rang ablaufen, da sie Antworten liefern, ohne dass ein User sich erst lange selbst durch Webseiten wühlen muss. Ist ChatGPT das Ende von Google, wie wir es kennen?

Kaspar Szymanski: In der SEO-Branche gibt es regelmäßig neue Trends, von denen einige hoffen, dass sie alles revolutionieren werden. Es ist noch nicht lange her, da war es Voice Search, nun ist ChatGPT in den Vordergrund gerückt. Eine Revolution der Suchindustrie ist aber in absehbarer Zeit eher unwahrscheinlich.

ChatGPT ist ein interessantes Tool, das, an aktuellen Standards gemessen, auf großen Datenbanken und maschinellen Lernprozessen basiert. Von echter KI sind wir da noch ein wenig entfernt. Tests liefern in englischer Sprache teilweise überzeugende Ergebnisse, manchmal aber auch totalen Unsinn. Es gibt durchaus Anwendungsbereiche, in denen ChatGPT als unterstützendes Werkzeug sinnvoll eingesetzt werden kann. Für die überwiegende Mehrheit von Website-Betreibern hat es aber keine Relevanz und sollte nicht von tatsächlich kritischen SEO-Bereichen wie Performance oder dem Alleinstellungsmerkmal ablenken.

entwickler.de: Was ist das wichtigste Take-away, das du den Besuchern deiner Webinale-Session mitgeben möchtest?

Kaspar Szymanski: Linkaufbau mit Fokus auf konvertierenden Traffic ist risikofrei. Ein weiterer Vorteil ist, dass die Erfolgsmessung unmittelbar möglich ist. Der ehemalige Google-Ingenieur und führender SEO-Experte Fili Wiese hat dazu einige Ideen in einem Beitrag veröffentlicht, die direkt in die SEO-Strategie eingebunden werden können. Sehr empfehlenswert: https://online.marketing/guide/linkbuilding/.

entwickler.de: Vielen Dank für dieses Interview!

The post ChatGPT sollte nicht von tatsächlich kritischen SEO-Bereichen ablenken appeared first on webinale 2026.

Diesen Prozess genau so zu gestalten, damit er funktioniert, ist längst zu einer zentralen strategischen Überlegung im Online-Marketing geworden. Doch inzwischen haben das viele Unternehmen bereits erkannt, was ist also zu tun? Differenzierung ist hier das große Stichwort, aber wie? Hier kommt das Konzept der „Content-Experience“ ins Spiel.

Um sich bestmöglich von der Konkurrenz abzuheben, muss der Content so nah wie möglich an den Bedürfnissen und Erwartungen der Nutzer:innen ausgerichtet sein, dabei aber gleichzeitig einen höheren Mehrwert und eine bessere Struktur bieten und dabei noch den eigenen Unique Selling Point überzeugend kommunizieren. Nur so können Unternehmen ein unvergessliches Erlebnis für die Zielgruppe schaffen. In geschickter Kombination mit Suchmaschinenoptimierung und der entsprechenden Reichweite wird Content-Experience zu einem Hebel für nachhaltig höhere Conversion-Rates.

In diesem Artikel erkläre ich, was genau unter Content-Experience zu verstehen ist, wie sie sich von User-Experience unterscheidet und wo genau der Bezug zu SEO und langfristige Conversion-Optimierung zusammenhängt.

Kurze Definition: Was ist Content-Experience überhaupt?

Content-Experience (Content-UX) beschreibt alle Erfahrungen, die Nutzer:innen auf einer Website mit den Inhalten machen. Es ist eine spezielle Variante der User-Experience (UX). Letztere hingegen bezieht sich auf alle Erfahrungen, die potenzielle Kund:innen mit einem Unternehmen machen, nicht nur auf die digitalen. Dabei werden zum Beispiel auch analoge Touchpoints wie Konferenzen oder andere physische Begegnungen mit einem Unternehmen berücksichtigt, also auch die Erfahrung, die sie mit den Produkten oder Dienstleistungen machen. Damit deckt die UX also die komplette Customer Journey ab.

Im digitalen Kontext wird UX oft mit Design und Programmierung assoziiert. Wie sieht die Website aus? Welche Elemente können die Nutzer:innen zur Interaktion nutzen? Welche visuellen Effekte gibt es auf der Seite? Während Content-Management-Systeme immer modularer werden und einige dieser Aufgaben bereits von KI übernommen werden, bleibt der entscheidende Unterschied in den Inhalten selbst. Hier geht es nicht nur um User-Experience oder Content Design – das Stichwort lautet Content-Experience.

Content-Experience und User-Experience: Eine untrennbare Verbindung

Eines sollte deutlich geworden sein: Content-Experience und User-Experience sind eng miteinander verbunden und können nicht isoliert voneinander betrachtet werden. Die User-Experience umfasst verschiedene Disziplinen wie Design, Programmierung und Produktmanagement, die alle zur Gestaltung einer positiven Nutzererfahrung beitragen. Dabei beeinflussen bestimmte Bereiche der User-Experience auch die Content-Experience, denn die Art und Weise, wie digitale Inhalte präsentiert werden, hat großen Einfluss auf ihre Wirkung.

Im digitalen Raum müssen Inhalte nicht nur informativ und lesbar sein, sondern auch ansprechend und benutzerfreundlich gestaltet werden. Die Konzentrationsspanne der Nutzer:innen ist begrenzt, daher müssen sie schnell und intuitiv auf Inhalte zugreifen können, um Interesse zu wecken und Conversions zu fördern. Hier kommen Designer:innen und Programmierer:innen ins Spiel, die passende Elemente zur Gestaltung digitaler Inhalte auf einer Website bereitstellen.

Besonders im B2B-Bereich spielt die Content-Experience eine wichtige Rolle. Eine ansprechende Gestaltung allein reicht nicht aus, um potenzielle Kund:innen zu überzeugen. Es ist ebenso wichtig, dass die Inhalte auf höchstem sprachlichen und fachlichen Niveau kommuniziert werden, um den anspruchsvollen Informationsbedürfnissen der Zielgruppe gerecht zu werden. In diesem Kontext wird Content-Marketing zur Königsdisziplin.

Content-Experience und Content-Marketing: Das unschlagbare Team für eine erfolgreiche Customer Journey

In der heutigen Zeit suchen User:innen auf Websites nach Antworten auf ihre Fragen und Informationen zu Produkten oder Dienstleistungen. Im B2C-Bereich geht es dabei meist um spezifische Produkte, die eine Kaufabsicht hervorrufen. Im B2B-Bereich hingegen kann das Informationsbedürfnis der Zielgruppe sehr viel komplexer sein. Hierbei legen B2B-Kund:innen besonderen Wert auf Vertrauen und Expertise. Um dies zu erreichen, muss der Content genau auf ihre Bedürfnisse und Pain Points ausgerichtet sein. Nur so kann es dir gelingen, deine Zielgruppe abzuholen, dein Unternehmen zu positionieren, deine Marke erfolgreich zu kommunizieren und Vertrauen aufzubauen.

Um diese Ziele zu erreichen, ist es wichtig, User:innen während ihrer gesamten Customer Journey mit relevanten Inhalten zu begleiten und ihnen einen echten Mehrwert zu bieten. Dafür ist es notwendig, die Zielgruppe und ihre Erwartungen genau zu kennen. Zu Beginn der Customer Journey sollten unwerbliche, aber sehr informative Inhalte im Vordergrund stehen, um das Vertrauen der User:innen zu gewinnen. Sobald sie mit deiner Lösung vertraut sind, können sie schrittweise an dein Produkt oder deine Dienstleistung herangeführt werden. Hierbei können Conversion-Elemente wie Whitepaper oder E-Books, Seminare oder Webinare, Checklisten und Ratgebertexte u. v. m. eingesetzt werden, um hochwertige Leads zu generieren.

Nur durch ein starkes Zusammenspiel von Content-Experience und Content-Marketing kann eine erfolgreiche Customer Journey sichergestellt werden. Auf diese Weise kann die Zielgruppe auf allen relevanten Kanälen erreicht, Vertrauen aufgebaut und die Marke erfolgreich positioniert werden.

Was ist mit SEO? Wie man sie erfolgreich mit Content-Experience verknüpft

In den letzten Jahren haben die Google Core Updates gezeigt, dass die Suchmaschine zunehmend den Fokus auf ihre User:innen richtet. Sie möchte ihnen genau das bieten, wonach sie suchen oder was sie benötigen. Infolgedessen rückt das Thema Content-Experience für Website-Betreiber:innen und Unternehmen immer stärker in den Vordergrund. Eine bestmögliche Content-Experience ist daher unerlässlich, um gute Rankings und eine steigende Sichtbarkeit in Suchmaschinen zu erzielen.

Während Mitarbeiter:innen aus dem Marketing solche Entscheidungen oft intuitiv treffen, arbeiten SEO-Expert:innen eher datenbasiert. Tools zur Messbarkeit von Erfolgen sind für das organische Suchmaschinenranking unverzichtbar. Die Herausforderung besteht allerdings darin, dass die Content-Experience als solche kaum messbar ist. Obwohl die Lesbarkeit bereits ein Rankingfaktor im SEO ist, messen Tools lediglich Faktoren wie die Satzlänge oder die Anzahl der Wörter in einem Text. Dies sagt jedoch kaum etwas über die tatsächliche Lesbarkeit und die Nutzererfahrung mit digitalen Inhalten aus. Wie können wir also eine Lösung dafür finden?

Eine Möglichkeit besteht darin, die Lesbarkeit und Nutzererfahrung manuell zu bewerten und sie mit den Daten der SEO-Tools zu kombinieren. Eine andere Möglichkeit ist die Verwendung von Heatmaps und anderen Tools, um das Verhalten der User:innen auf der Website zu analysieren.  Hierbei können beispielsweise Klicks, Verweildauer und Scrolltiefe aufgezeichnet werden, um die Benutzerfreundlichkeit und Nutzererfahrung zu verbessern.

Eine erfolgreiche Verknüpfung von Content-Experience und SEO erfordert eine enge Zusammenarbeit von Marketing- und SEO-Teams sowie eine kontinuierliche Überwachung und Optimierung. Auf diese Weise können Website-Betreiber:innen und Unternehmen nicht nur ihre Rankings und Sichtbarkeit verbessern, sondern auch eine positive User-Experience für ihre Zielgruppe schaffen.

Content-Experience messen mit Benchmarking und UX-Score

Um die Content-Experience messbar zu machen, bietet sich eine Herangehensweise durch Benchmarking an. Hierbei werden die Top 10 Suchergebnisse und Inhalte für die wichtigsten Keywords analysiert und verglichen. Es gilt herauszufinden, welche Inhalte in den Top 3 ranken und was sie von den anderen Suchergebnissen unterscheidet. Ist der Inhalt passend für die Phase der Customer Journey, auf der sich die User:innen befinden? Ein detaillierter Vergleich der Wettbewerbsunternehmen liefert wichtige Indikatoren, um den eigenen Inhalt noch besser und relevanter für die Zielgruppe aufzubereiten. Dabei können zusätzliche Assets wie eine Checkliste zum Download, ein Whitepaper oder ein Video helfen.

Um die Content-Experience im Rahmen des Möglichen zu objektivieren, haben wir bei suxeedo eine Skala zur Bewertung wichtiger Aspekte der Content-Experience entwickelt:

Quelle: suxeedo GmbH

Auf der Abbildung sehen wir, wie eine Skala dabei hilft, unterschiedliche Websites und die Content- Experience auf ihnen einzuordnen und zu vergleichen.

NOCH MEHR ZU WEB DESIGN?

Der Web Design & Development Track

Mehr erfahren

 Eine Skala zur Bewertung der Content-Experience hilft dir dabei, einzelne Kategorien aufzubrechen und Schwachstellen zu identifizieren, bei denen andere Wettbewerber:innen besser performen. Auch wenn Content-Experience prinzipiell subjektiv ist – also eine Erfahrung, die jedes Individuum anders macht – können einige wichtige Kriterien vergleichbar gemacht werden. Folgende Faktoren tragen dazu bei, die Content-Experience in Teilen messbar zu machen:

• Strukturelle Attraktivität: Ist ein Inhalt in snackable Abschnitte unterteilt, die prägnante Zwischenüberschriften aufweisen und sich leicht navigieren lassen?
• Visuelle Attraktivität: Ergibt sich aus Websitegestaltung ein stimmiges und ästhetisches Gesamtbild, das Farben und Gestaltungselemente seiten- und inhaltsübergreifend wiederholt und somit für Wiedererkennbarkeit und Orientierung sorgt?
• Grafiken, Videos und Bilder: Nutzt du eine Variation von Formaten innerhalb deiner Inhalte oder innerhalb eines Beitrags? Grafiken, Videos, Bilder oder Audioelemente können komplexe Inhalte leichter konsumierbar machen und für Abwechslung sorgen.
• Attraktive Listenelemente: Verwendest du Tabellen, Listicles, Aufzählungen oder andere übersichtliche Veranschaulichungen, um Fakten und Informationen darzustellen und somit die Lesbarkeit deines Inhalts zu erhöhen?
• Scrollbarkeit: Wie schnell können sich Nutzer:innen durch deinen Inhalt navigieren und zu der Information finden, nach der sie explizit suchen?
• Sprache: Wie gut verständlich ist deine Sprache und passt sie zur Zielgruppe?

Ausblick: Content-Experience als langfristiger Faktor im B2B und B2C

Ob B2B oder B2C: Content-Experience bleibt ein zentraler Erfolgsfaktor für Unternehmen. Während im B2C-Umfeld Marketing Automation, Retargeting und Conversion-Optimierung im Fokus stehen, sind Produkte im B2B-Bereich oft komplexer und preisintensiver, was den Entscheidungsweg zur Transaktion verlängert. Doch auch hier ist es entscheidend, die Zielgruppe mit passendem Content zur richtigen Zeit zu erreichen, zu begeistern und schließlich zu überzeugen – selbst wenn sich der Erfolg in Form von Downloads und Leads statt direkter Käufe zeigt. Nutze diese Chance, um dich von der Konkurrenz abzuheben und die Customer Experience nachhaltig zu verbessern.

The post Conversion-Optimierung war gestern, jetzt kommt Content-Experience! appeared first on webinale 2026.

Dass die Anforderungen mit einem klassischen Shop von der Stange nur sehr schwer zu bewältigen wären, wurde uns während der Workshops in der Konzeptionsphase für einen Onlineshop schnell bewusst.

Eine fertige Shoplösung bringt zwar bereits viele Funktionalitäten mit sich und der Initialaufwand fällt geringer aus, jedoch konnte keine der Standardlösungen die Anforderungen vollumfänglich abdecken. Anpassungen wären unumgänglich gewesen. Zudem soll eine global konstante Performance erreicht werden – egal ob der Käufer in New York, Zürich oder Tokyo sitzt. Das setzt eine entsprechend skalierende Infrastruktur voraus.

Composable Commerce und Headless

Hier konnte ein Composable-Commerce-System überzeugen: Trotz initial höherem Aufwand lassen sich Anpassungen wesentlich freier und dadurch mit geringerem Aufwand umsetzen. Das System ist bspw. bereits global verteilt. Damit werden Anfragen aus dem Frontend von der Region beantwortet, die dem Anfragenden am nächsten ist. Schnelle Antwortzeiten wirken sich positiv auf den Umsatz aus und erhöhen die Konversationsrate.

Nebst dem Composable-Commerce-System kommt ein Headless CMS für den Inhalt zum Einsatz. Headless bezieht sich auf die Fähigkeit, das Frontend vom Backend zu entkoppeln, in diesem Fall die Commerce- und CMS-Schnittstellen vom Backend-Betriebssystem und PIM zu trennen.

Die Architektur erlaubt es uns, durch verteilte Systeme rasend schnelle Applikationen zu entwickeln, deren Kommunikationsmittelpunkt eine schlanke Mezzio-Applikation ist.

In diesem Artikel werden nur die Schnittstellen zum ERP (SAP) und einem Headless Commerce (CommerceLayer) beschrieben. Der Fokus liegt auf der Kommunikation zwischen den APIs mittels einer Mezzio-Applikation. Welcher Hersteller angebunden wird, ist nicht von Belang. Für ein vollständig funktionierendes Shopsystem sind selbstverständlich weitere Systeme (Headless CMS, Payment Provider etc.) notwendig. Der beschriebene Code ist in einem öffentlichen Repository [1] abrufbar. Genug der Theorie – wie sieht eine solche Implementation nun aus?

NOCH MEHR ZU WEB DESIGN?

Der Web Design & Development Track

Mehr erfahren

Das Mezzio Skeleton

Laminas bietet mit dem Mezzio Skeleton [2] ein Installationsprogramm an, welches ein neues Mezzio-Projekt auf Grundlage von Benutzerentscheidungen erstellt:

composer create-project mezzio/mezzio-skeleton composable-commerce-mit-mezzio

Wenn die Installation aktuell nicht unter PHP 7.4 ausgeführt wird, lässt ein Bug [3] die Installation fehlschlagen. Um diesen zu umgehen, wird das Projekt geklont, die composer.lock-Datei entfernt und anschließend ein composer install ausgeführt:

git clone [email protected]:mezzio/mezzio-skeleton.git composable-commerce- mit-mezzio
cd composable-commerce- mit-mezzio
rm composer.lock
composer install

Ein Assistent führt durch die Installation der neuen Applikation und gibt die Wahl der Applikationsstruktur, des Service-Containers usw. In der ersten Option wird die modulare Struktur ausgewählt. Die Modulstruktur ermöglich eine saubere Trennung der Applikationsteile bzw. -logik. Das wird im späteren Teil der Implementation ersichtlich. Die weiteren Optionen werden beim Standard belassen. Nach Abschluss der Installation steht eine fertige Mezzio-Applikation bereit.

Im Folgenden werden verschiedene PHP Standards Recommendations (PSRs) erwähnt. Interessierte erfahren auf den Seiten der Framework Interoperability Group [4] alles Wissenswerte.

Die wichtigsten Komponenten der eben erstellten Applikation in der Übersicht:

• mezzio/mezzio: Die PSR-15 Kernkomponente zur Verarbeitung von Web-Requests
• laminas/laminas-service-manager: PSR-11 Dependency Injection Container
• mezzio/mezzio-fastroute: FastRoute [5] Router
• laminas/laminas-diactoros: PSR-7 Implementation für die Darstellung von HTTP-Nachrichten
• laminas/laminas-config-aggregator: Komponente zum Sammeln und Zusammenführen von Konfigurationen aus verschiedenen Quellen

Im nächsten Schritt werden die API-Clients umgesetzt. Hierfür wird ein HTTP-Client benötigt. Es kann eine beliebige PSR-18-Implementation verwendet werden. In diesem Projekt wird die beliebte Bibliothek von Guzzle eingesetzt:

composer require guzzlehttp/guzzle

CommerceLayer API

Mit der modularen Applikationsstruktur kann die Applikation in verschiedene Module organisiert werden. Ein Modul repräsentiert hier einen separaten Ordner innerhalb von src. Diesem wird ein eigener Namespace zugewiesen. Für alles Relevante bzgl. CommerceLayer wird nun ein Modul erstellt. Ebenso werden später Module für weitere Schnittstellen und den ApiConnector erstellt.

Mezzio bringt einen Console Command mit, der diese Arbeit erledigt. Standardmäßig wird ein Modul mit einem src– und template-Ordner erstellt. Da keine Templates eingesetzt werden, kann eine flache Struktur mit der Option -f erstellt werden. Dabei wird auf Unterordner verzichtet und der Namespace direkt im Modulordner registriert:

vendor/bin/laminas mezzio:module:create CommerceLayer -f

Im Modulordner wird eine ConfigProvider-Klasse erstellt. Diese ist dafür zuständig, alle Services innerhalb des Moduls zu verwalten. Wo die Services registriert werden, spielt letzten Endes keine Rolle. Es ist ebenfalls möglich, diese in einer großen, global gültigen Datei zu hinterlegen. Wesentlich übersichtlicher ist es jedoch, diese Dienste modulweise zu verwalten.

API-Client

CommerceLayer bietet eine mächtige Schnittstelle, die JSON-API-kompatibel ist und kontinuierlich weiterentwickelt wird. Für die Kommunikation mit der CommerceLayer-Schnittstelle wird der zuvor installierte Guzzle-HTTP-Client zum Versenden und Empfangen der HTTP-Nachrichten eingesetzt. Der HTTP-Client benötigt einen mandantenspezifischen Basis-URL sowie einen gültigen Access-Token. Die Authentifizierung erfolgt über OAuth 2.0. Da die Erstellung des Tokens über OAuth 2.0 den Rahmen des Artikels sprengt, wird lediglich ein TokenProvider-Stub verwendet, das diesen Prozess symbolisch darstellt.

In der Konfiguration wird ein Options-Array deklariert, das dem Guzzle-Client übergeben wird. Darin werden der Basis-URL und die für die JSON API notwendigen Header definiert (Listing 1).

<?php
 
declare(strict_types=1);
 
return [
  'commerce_layer' => [
    'client' => [
      'options' => [
        'base_uri' => 'https://my-app.commerce-layer.com/',
        'headers'  => [
          'Content-Type' => 'application/vnd.api+json',
          'Accept'       => 'application/vnd.api+json',
        ],
      ],
    ],
  ],
];

Um den Client später als Service abrufen zu können, wäre es möglich, eine Factory für Psr\Http\Client\ClientInterface zu erstellen. Jedoch kann mit einem Interface nur ein Service referenziert werden. Aus diesem Grund wird pro Schnittstelle ein eigenes ApiClientInterface erstellt. Das ApiClientInterface erweitert lediglich das Psr\Http\Client\ClientInterface (Listing 2).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer;
 
use Psr\Http\Client\ClientInterface;
 
interface ApiClientInterface extends ClientInterface
{
}

In einer Mezzio-Applikation wird die gesammelte Konfiguration dem Service Container unter dem Schlüssel config übergeben. Damit kann die Factory die Clientkonfiguration abrufen und dem Client-Constructor übergeben (Listing 3).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer;
 
use GuzzleHttp\Client;
use Psr\Container\ContainerInterface;
 
class ApiClientFactory
{
  public function __invoke(ContainerInterface $container): Client
  {
    return new Client(
      $container->get('config')['commerce_layer']['client']['options']
    );
  }
}

Im ConfigProvider werden die Services registriert. Damit weiß der Service-Container, wie ein angefragter Service instanziiert wird (Listing 4).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer;
 
class ConfigProvider
{
  public function __invoke(): array
  {
    return [
      'dependencies' => $this->getDependencies(),
    ];
  }
 
  public function getDependencies(): array
  {
    return [
      'invokables' => [],
      'factories'  => [
        ApiClientInterface::class => ApiClientFactory::class,
      ],
    ];
  }
}

Dieses Muster – die Verwendung einer Factory zur Instanziierung eines Service und die Registrierung des Service im ConfigProvider – illustriert, wie ein Service in einer Mezzio-Applikation erstellt wird. In diesem Artikel wird dieses Muster für sämtliche Services verwendet, jedoch aus Platzgründen nicht explizit erwähnt. Neben der Verwendung einer Factory gibt es einige weitere Möglichkeiten zur Verwendung von Services mit dem Laminas Service Manager. In der Dokumentation [6] sind diese ausführlich beschrieben.

Im nächsten Schritt wird ein CommerceLayer Client erstellt, der Anfragen entgegennimmt, diese mit einem Access-Token ergänzt und schließlich über den API-Client versendet (Listing 5). Wie zuvor erwähnt, ist die Implementation des TokenProviders nicht Bestandteil dieses Artikels.

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer;
 
use CommerceLayer\Client\TokenProvider;
use Psr\Http\Client\ClientInterface as HttpClient;
use Psr\Http\Message\RequestInterface;
use Psr\Http\Message\ResponseInterface;
 
class Client
{
  public function __construct(
    private readonly HttpClient $httpClient,
    private readonly TokenProvider $tokenProvider
  ) {
  }
 
  public function sendRequest(RequestInterface $request): ResponseInterface
  {
    return $this->httpClient->sendRequest(
            $this->withToken($request)
    );
  }
 
  private function withToken(RequestInterface $request): RequestInterface
  {
    return $request->withHeader('Authorization', $this->tokenProvider->getToken());
  }
}

Datentransferobjekt

Um das Interpretieren von Antworten auf API-Anfragen nicht zu wiederholen und Daten einheitlich innerhalb der Applikation weitergeben zu können, wird ein Datentransferobjekt (DTO) eingesetzt (Listing 6). Ein DTO ist ein Objekt, das dazu dient, Daten zu kapseln und sie von einem Teilsystem einer Anwendung an ein anderes zu senden.

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Sku;
 
use Psr\Http\Message\ResponseInterface;
 
use function json_decode;
 
use const JSON_THROW_ON_ERROR;
 
class Dto
{
  public function __construct(
    public readonly ?string $id,
    public readonly string $code,
    public readonly string $name,
  ) {
  }
 
  public static function fromResponse(ResponseInterface $response): self
  {
    $data = json_decode(
      $response->getBody()->getContents(),
      true,
      512,
      JSON_THROW_ON_ERROR
    );
 
    return new self(
      $data['data']['id'],
      $data['data']['attributes']['code'],
      $data['data']['attributes']['name'],
    );
  }
}

Obwohl eine SKU sehr viele Informationen enthalten kann, wird das DTO der Einfachheit halber hier mit nur drei Eigenschaften deklariert:

• id: Repräsentation der CommerceLayer-ID. Diese kann leer (null) sein, z. B. für neue SKUs.
• code: die SKU oder einfach Artikelnummer.
• name: Name der SKU.

Nebst dem Constructor wird ein statischer Constructor bereitgestellt, welcher ein DTO anhand des Psr\Http\Message\ResponseInterface-Objekts instanziiert. Dieser ermöglicht die Erstellung einer DTO-Instanz aus dem Response-Objekt verschiedener Anfragen (wie Read, Create oder Update), ohne Logik duplizieren zu müssen.

Requests

Der Client nimmt für API-Anfragen Psr\Http\Message\RequestInterface-Instanzen entgegen. Die Requests werden in einer separaten Klasse instanziiert und später vom Repository verwendet.

Beispielhaft zeigt die folgende Klasse den Request zur Erstellung neuer SKUs (Listing 7).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Sku\Request;
 
use CommerceLayer\Sku\Dto;
use GuzzleHttp\Psr7\Request;
use Psr\Http\Message\RequestInterface;
 
use function json_encode;
 
use const JSON_THROW_ON_ERROR;
 
class Create
{
  public static function create(Dto $dto): RequestInterface
  {
    $data = [
      'data' => [
        'type'       => 'skus',
        'attributes' => [
          'code' => $dto->code,
          'name' => $dto->name,
        ],
      ],
    ];
 
    return new Request(
      'POST',
      '/api/skus',
      [],
      json_encode($data, JSON_THROW_ON_ERROR)
    );
  }
}

Repository

Mit dem umgesetzten Client, Request und DTO kann nun das Repository implementiert werden. Die Anwendung wird sich des Repositorys bedienen, ohne selbst die Requests zu definieren oder Access Tokens zu generieren etc.

Das Repository bietet zunächst drei Methoden an: readOneByCode, create und update. Alle Methoden geben ein DTO-Objekt zurück, sodass eine einheitliche Signatur angeboten und die Interpretation der HTTP-Antwort nicht wiederholt wird. Das Repository kann erweitert werden, um weitere Anwendungsfälle wie das Löschen einer SKU abzudecken (Listing 8).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Sku;
 
use CommerceLayer\Client;
use CommerceLayer\Sku\Request\Create;
use CommerceLayer\Sku\Request\ReadOneByCode;
use CommerceLayer\Sku\Request\Update;
 
class Repository
{
  public function __construct(
    private readonly Client $client,
  ) {
  }
 
  public function readOneByCode(string $code): Dto
  {
    $request  = ReadOneByCode::create($code);
    $response = $this->client->sendRequest($request);
 
    return Dto::fromResponse($response);
  }
 
  public function create(Dto $dto): Dto
  {
    $request  = Create::create($dto);
    $response = $this->client->sendRequest($request);
 
    return Dto::fromResponse($response);
  }
 
  public function update(Dto $sku): Dto
  {
    $request  = Update::create($sku);
    $response = $this->client->sendRequest($request);
 
    return Dto::fromResponse($response);
  }
}

Mit diesem Stand kann nun mit der CommerceLayer-API kommuniziert werden. SKUs können erstellt, ausgelesen und aktualisiert werden.

Im gleichen Verfahren werden weitere Schnittstellen angebunden. Im Beispielprojekt wird die SAP-Schnittstelle angebunden. Obwohl diese im weiteren Verlauf verwendet wird, ist sie hier nicht explizit beschrieben.

Events

Um Daten auf dem aktuellen Stand zu behalten, gibt es unterschiedliche Ansätze. Klassisch vertretend sind Cronjobs, die Daten von Zeit zu Zeit selbst zuziehen.

Dieses Projekt baut auf eine ereignisgesteuerte Architektur. Das ist ein Softwarearchitekturparadigma, das die Erzeugung, Erkennung und Nutzung von Ereignissen sowie die Reaktion darauf fördert. Das bedeutet, dass Drittsysteme unsere Applikation über ein Ereignis, wie z. B. eine Preisänderung oder Bestellaufgabe, informiert. Auf dieses Ereignis kann nun reagiert und Prozesse können abgebildet werden, wie sie benötigt werden.

Product Update

Als Beispiel wird die Implementierung der Produktaktualisierung aufgezeigt. Unser System wird über eine Produktänderung benachrichtigt. Es holt sich die Daten aus dem Quellsystem und schreibt sie ins Zielsystem. Für die Kommunikation zwischen den Schnittstellen wird ein ApiConnector-Modul erstellt.

Transferrer

Die Transferrer-Klasse hat die Aufgabe, Daten aus dem Quellsystem abzurufen und im Zielsystem zu speichern. Dadurch bedient sie sich der zuvor erstellten Repositoryobjekte. Als Parameter wird ein Wert verwendet, anhand dessen der SKU in beiden Systemen referenziert werden kann – der SKU-Code.

Sollte der SKU in CommerceLayer (SkuRepository) nicht vorhanden sein, generiert der Guzzle-Client aus einer Antwort mit HTTP-Status 404 eine ClientException. Diese wird gefangen und anstelle eines Updates ein Create ausgelöst. Die daraus resultierende Klasse sieht wie in Listing 9 aus.

<?php
 
declare(strict_types=1);
 
namespace ApiConnector\Material\DataToCommerce;
 
use CommerceLayer\Sku\Dto;
use CommerceLayer\Sku\Repository as SkuRepository;
use GuzzleHttp\Exception\ClientException;
use Sap\Material\Repository as MaterialRepository;
 
class Transferrer
{
  public function __construct(
    private readonly MaterialRepository $materialRepository,
    private readonly SkuRepository $skuRepository,
  ) {
  }
 
  public function __invoke(string $skuCode): void
  {
    $material = $this->materialRepository->readOneBySku($skuCode);
 
    try {
      $sku = $this->skuRepository->readOneByCode($material->sku);
 
      $updatedSku = new Dto(
        $sku->id,
        $material->sku,
        $material->name,
      );
 
      $this->skuRepository->update($updatedSku);
    } catch (ClientException) {
      $this->skuRepository->create(Dto::fromMaterialDto($material));
    }
  }
}

Dass das Ereignis „Produktaktualisierung“ den Transferrer aufrufen kann, muss dieser über eine Route exponiert werden. Die Route bzw. die darüber eingehenden Anfragen werden von einem RequestHandler abgearbeitet, welcher wiederum den Transferrer aufrufen.

In einer Mezzio-Applikation werden die Routen an der Applikationsinstanz in config/routes.php definiert [7] (Listing 10). Der erste Parameter definiert den Pfad und optional mögliche Argumente. Der zweite Parameter gibt die RequestHandler-Klasse an. Als dritten Parameter kann man einen Namen angeben. Dieser spielt später noch eine wichtige Rolle.

$app->get(
  '/api/event/material-change/{sku-code}',
  Api\Event\MaterialChange\RequestHandler::class,
  'api.event.material-change'
);

Dem RequestHandler wird ein Request-Objekt übergeben, das vom Router mit Argumenten angereichert werden kann (Listing 11). In diesem Fall wird der SKU-Code ausgelesen. Es folgt eine einfache Validierung, welche im Fehlerfall eine Antwort mit „Status 400 – Bad Response“ zurückgibt.

Anschließend wird der Transferrer aufgerufen. Mögliche Fehler resultieren in einer Antwort mit „Code 500 – Internal Server Error“. Im Erfolgsfall wird eine einfache „204 – No Content“-Antwort geliefert.

<?php
 
declare(strict_types=1);
 
namespace Api\Event\MaterialChange;
 
use ApiConnector\Material\DataToCommerce\Transferrer;
use Laminas\Diactoros\Response\EmptyResponse;
use Psr\Http\Message\ResponseInterface;
use Psr\Http\Message\ServerRequestInterface;
use Psr\Http\Server\RequestHandlerInterface;
use Throwable;
 
use function is_string;
 
class RequestHandler implements RequestHandlerInterface
{
  public function __construct(
    private readonly Transferrer $transferrer
  ) {
  }
 
  public function handle(ServerRequestInterface $request): ResponseInterface
  {
    $skuCode = $request->getAttribute('sku-code');
 
    if (
      ! is_string($skuCode)
      || $skuCode === ''
    ) {
      return new EmptyResponse(400);
    }
 
    try {
      ($this->transferrer)($skuCode);
    } catch (Throwable) {
      return new EmptyResponse(500);
    }
 
    return new EmptyResponse();
  }
}

Endpoint-spezifische HMAC-Validierung

Mittels HMAC signierte Payloads bieten die Möglichkeit einer Authentifizierung unter Verwendung eines gemeinsamen Geheimnisses anstelle von digitalen Signaturen mit asymmetrischer Kryptografie (Public-Key-Verschlüsselungsverfahren).

Die CommerceLayer API signiert Event Payloads mit HMAC. Um die Echtheit des Senders sicherzustellen, wird empfohlen, diese Signatur mit einem geteilten Geheimnis zu verifizieren. CommerceLayer generiert für jeden WebHook ein eigenes geteiltes Geheimnis. Dieses wird in der Konfiguration mit dem Namen der entsprechenden Route hinterlegt (Listing 12).

<?php
 
declare(strict_types=1);
 
return [
  'commerce_layer' => [
    // [..]
    'webhooks' => [
      'shared_secrets' => [
        'api.event.customer_create' => 'my-secret',
      ],
    ],
  ],
  // [..]
];

SharedSecretStore

Die geteilten Geheimnisse werden zur Laufzeit in einen SharedSecretStore gelesen, welcher die Aufgabe hat, ein SharedSecret anhand des Route-Namens auszugeben (Listing 13 und 14).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Authentication\Hmac;
 
class SharedSecret
{
  public function __construct(
    public readonly string $route,
    public readonly string $secret,
  ) {
  }
}

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Authentication\Hmac;
 
use CommerceLayer\Authentication\Hmac\Exception\SharedSecretNotFoundException;
 
class SharedSecretStore
{
  /** @var SharedSecret[] */
  private array $sharedSecrets;
 
  public function __construct(SharedSecret ...$sharedSecrets)
  {
    $this->sharedSecrets = $sharedSecrets;
  }
 
  public function has(string $route): bool
  {
    foreach ($this->sharedSecrets as $sharedSecret) {
      if ($route === $sharedSecret->route) {
        return true;
      }
    }
 
    return false;
  }
 
  public function get(string $route): SharedSecret
  {
    foreach ($this->sharedSecrets as $sharedSecret) {
      if ($route === $sharedSecret->route) {
        return $sharedSecret;
      }
    }
 
    throw SharedSecretNotFoundException::fromRoute($route);
  }
}

Validator

Der Validator ist dafür zuständig, anhand von SharedSecret und Payload die Signatur zu berechnen und überprüfen, ob diese mit der übergebenen Signatur übereinstimmt (Listing 15).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Authentication\Hmac;
 
use ErrorException;
use Throwable;
 
use function base64_encode;
use function hash_hmac;
use function restore_error_handler;
use function set_error_handler;
 
use const E_WARNING;
 
class Validator
{
  private const ALGORITHM = 'sha256';
 
  public function invoke(
    string $sharedSecret,
    string $signature,
    string $payload
  ): bool {
    try {
      set_error_handler(static function (
        $level,
        $message
      ) {
        throw new ErrorException($message);
      }, E_WARNING);
 
      $message = hash_hmac(
        self::ALGORITHM,
        $payload,
        $sharedSecret,
        true
      );
    } catch (Throwable) {
      restore_error_handler();
 
      return false;
    }
 
    restore_error_handler();
 
    if (false === $message) {
      return false;
    }
 
    $calculatedSignature = base64_encode($message);
 
    return $calculatedSignature === $signature;
  }
}

Middleware

Der Validator kann die Signaturen überprüfen. Nun wäre es sehr mühsam, diesen in jedem RequestHandler manuell aufzurufen. An einer Route können eine oder mehrere Middleware-Klassen hinterlegt werden. Diese werden in definierter Reihenfolge abgearbeitet. Eine Middleware hat die Möglichkeit, einen Request frühzeitig zu beenden, wenn bspw. die anfragende IP-Adresse nicht gestattet ist oder ein API-Rate-Limit überstiegen wurde. Dann wird ein Response-Objekt zurückgeliefert. Ist die Überprüfung positiv verlaufen, wird die Anfrage an die nächste Middleware in der Kette weitergegeben, bis schließlich mit einem Response-Objekt geantwortet wird. Die Middleware für die HMAC-Validierung setzt die zuvor erstellten Komponenten ein (Listing 16).

<?php
 
declare(strict_types=1);
 
namespace CommerceLayer\Authentication\Hmac;
 
use Laminas\Diactoros\Response\EmptyResponse;
use Mezzio\Router\RouteResult;
use Psr\Http\Message\ResponseInterface;
use Psr\Http\Message\ServerRequestInterface;
use Psr\Http\Server\MiddlewareInterface;
use Psr\Http\Server\RequestHandlerInterface;
 
use function assert;
use function count;
 
class Middleware implements MiddlewareInterface
{
  public function __construct(
    private readonly SharedSecretStore $secretStore,
    private readonly Validator $hmacValidator,
  ) {
  }
 
  public function process(
    ServerRequestInterface $request,
    RequestHandlerInterface $handler
  ): ResponseInterface {
    $route = $request->getAttribute(RouteResult::class);
    assert($route instanceof RouteResult);
    $routeName = $route->getMatchedRouteName();
 
    if (false === $routeName) {
      return new EmptyResponse(401);
    }
 
    if (! $this->secretStore->has($routeName)) {
      return new EmptyResponse(401);
    }
 
    $signature          = $request->getHeader('x-commercelayer-signature');
    $numberOfSignatures = count($signature);
 
    if (1 !== $numberOfSignatures) {
      return new EmptyResponse(401);
    }
 
    $payload = (string) $request->getBody();
 
    if (
      $this->hmacValidator->invoke(
        $this->secretStore->get($routeName)->secret,
        $signature[0],
        $payload
      )
    ) {
      return $handler->handle($request);
    }
 
    return new EmptyResponse(401);
  }
}

Middleware zur Route hinzufügen

Diese wird nun dem RequestHandler in der Route vorangestellt. Anfragen mit ungültigen Signaturen werden von der Middleware frühzeitig beendet und erreichen den RequestHandler nicht. Auf die gleiche Weise können alle anderen Endpunkte, die eine HMAC-Signatur überprüfen sollen, ergänzt werden, ohne jeden RequestHandler erweitern zu müssen. Mit dem in Listing 17 gezeigten Code ist die Middleware auch schon einsatzbereit.

$app->get(
  '/api/event/customer-create',
  [
    CommerceLayer\Authentication\Hmac\Middleware::class,
    Api\Event\MaterialChange\RequestHandler::class,
  ],
  'api.event.customer_create'
);

Viele Wege führen nach Rom

Dem aufmerksamen Leser ist nicht entgangen, dass die Codebeispiele stark vom eigentlichen Framework entkoppelt sind und wo immer möglich auf PSRs gesetzt wird. Das bedeutet, dass das Framework selbst in den Hintergrund gerückt und ersetzbar(er) geworden ist. Das ist erfreulich, da das Framework oder auch einzelne Komponenten leichter abgelöst werden können, wenn sich bspw. die Anforderungen ändern oder einzelne Bibliotheken nicht mehr gewartet werden. Wahrscheinlich ist es möglich, den gezeigten Fall mit nahezu jedem anderen modernen PHP-Framework umzusetzen.

NOCH MEHR ZU WEB DESIGN?

Der Web Design & Development Track

Mehr erfahren

Fazit

Im Team haben wir vor wenigen Jahren diverse Frameworks evaluiert und uns einstimmig für Mezzio entschieden, um das vorherige Framework abzulösen. Mit unserer Entscheidung sind wir voll zufrieden, weil Mezzio

• es uns erlaubt, das Framework so einzusetzen, wie es die jeweiligen Projektanforderungen erfordern, ohne auf unflexible Vorschriften des Frameworks Rücksicht nehmen zu müssen,
• es einem leicht macht, testbaren Code zu schreiben, der sauber vom Framework getrennt ist und
• eine sehr hilfreiche Community hat, die schnelle Unterstützung im Forum [8] und Chat [9] anbietet.

Wenn wir etwas an Mezzio verbessern könnten, wäre das die Größe der aktiven Community – das ist eine Einladung an alle Interessierten, sich am Laminas-Projekt zu beteiligen. Es wird von wenigen Schultern getragen und hat eine vergleichsweise große Anzahl stiller Benutzer. Mezzio kann von Mitwirkenden profitieren, die Dokumentationen schreiben, Issues bearbeiten, sich als Maintainer einer Komponente begeistern oder finanziell unterstützen [10].

Das beschriebene Projekt ist im Sommer 2021 live gegangen. Eine vollständige Fallstudie kann auf der Seite der Intelliact AG [11] abgerufen werden. Ein rückwärts gerichteter Blick bestätigt, dass mit dieser Architektur die richtige Entscheidung getroffen wurde. Kunden und Endkunden sind von der Performance begeistert. Beim Best of Swiss Web Award wurde das Projekt aus 351 Einreichungen zum Masterkandidat [12] nominiert und gewann u. a. den goldenen Preis in der Kategorie Technologie [13].

Zusammengefasst: Mezzio kann den Global Playern definitiv das Wasser reichen!

The post Composable Commerce mit Mezzio appeared first on webinale 2026.