corona-warn-app / cwa-website

Corona-Warn-App website. The CWA development ended on May 31, 2023. You still can warn other users until April 30, 2023. More information:

---

About this Repository • Development • Documentation • Support and Feedback • How to contribute • Licensing • Web Site

---

Corona-Warn-App: Website

About this Repository

This repository contains the source files of the official website for the Corona-Warn-App as it is available at coronawarn.app. For information about the project, please see our documentation repository.

Development

Requirements

You need the Node.js 18 (Active LTS) version of Node.js (which includes npm) to build the website.

In case you use a Mac computer with Apple Silicon, make sure that Rosetta is installed.

Getting started

Clone the repository and ensure you have the requirements (from above) installed. To build and display the website in a web browser, switch to the cwa-website base directory and execute the commands:

npm install
npm start

• npm install installs the necessary packages to build, display and test the website on your local system. You only need to run this once or if the packages defined in package.json are changed.

• The command npm start triggers the commands npm run build followed by npm run start-server described below and which can be used individually if desired. If you want to debug you can build the web and start the local server using the command npm run dev as an alternative to npm start.

Build

The command:

npm run build

builds the website and creates a new folder public in the repository's base directory. It contains the generated files for the complete website.

Start-Server

To view the generated content after using npm run build, execute the command:

npm run start-server

This command starts a local web server and a browser window is also automatically opened at http://localhost:8000 so that the website can be viewed. The web server uses public as its base directory. It also watches for file changes and refreshes the browser contents if necessary.

Depending on your network setup, you may also be able to view the website on a connected mobile device using http://<ip_address_of_localhost>:8000, for example http://192.168.0.100:8000.

Start-Fast

The command npm run start-fast is similar to the command npm run start: it builds the web then starts a web server, displaying the web site in a browser. The difference is that start-fast disables image compression which can shorten the build time.

Check and compare the build log line Finished 'build' after xx showing the time taken to build if you are experiencing long build times to see if it is helpful in your own environment.

Changing Things

Manuals for the most common use cases of updating website content are available in the docs folder.

Testing

Most tests run automatically when a pull request is submitted. If you are making changes which affect hyperlinks in the web it is recommended to run the links test locally before submitting a pull request or making changes to it.

npm run test:links

More details on testing are available in the TESTING document.

Updating coronawarn.app

Any direct commits and merged pull requests will automatically trigger follow-up actions to build and deploy the changes to coronawarn.app. The respective GitHub Actions are available in the .github/workflows directory of this repository.

Documentation

The full documentation for the Corona-Warn-App can be found in the cwa-documentation repository. The documentation repository contains technical documents, architecture information, and white papers related to this implementation.

Support and Feedback

The following channels are available for discussions, feedback, and support requests:

Type	Channel
General discussion, issues, bugs
Other requests

How to contribute

The German government has asked SAP and Deutsche Telekom AG to develop the Corona-Warn-App for Germany as open source software. Deutsche Telekom is providing the network and mobile technology and will operate and run the backend for the app in a safe, scalable and stable manner. SAP is responsible for the app development, its framework and the underlying platform. Therefore, development teams of SAP and Deutsche Telekom are contributing to this project. At the same time our commitment to open source means that we are enabling -in fact encouraging- all interested parties to contribute and become part of its developer community.

For more information about how to contribute, the project structure, as well as additional contribution information, see our Contribution Guidelines. By participating in this project, you agree to abide by its Code of Conduct at all times.

Repositories

A list of all public repositories from the Corona-Warn-App can be found here.

Licensing

Copyright (c) 2020-2024 Deutsche Telekom AG and SAP SE or an SAP affiliate company.

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License.

You may obtain a copy of the License at https://www.apache.org/licenses/LICENSE-2.0.

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the LICENSE for the specific language governing permissions and limitations under the License.

The "Corona-Warn-App" logo is a registered trademark of The Press and Information Office of the Federal Government. For more information please see bundesregierung.de.

cwa-website's Issues

Provide simplified "How does the app work" section

Where to find the issue

On the landing page for both German and English versions

Describe the issue

Many people are very critical with regards to data protection and privacy. I know that you guys have been doing a tremendous job in this regard (thanks!), and it would thus be great if the app is used widely. Technology is only one aspect though. We should also make sure that people with concerns can understand why this app is no threat to their privacy.

The homepage is giving an explanation of this in the "How does the app work" section. However it is in my opinion too hard to understand for anyone who does not have a technology background. It mentions frameworks, identifiers, cryptographical keys, backend, and so on. I would assume that a majority of people would not be able to understand this, maybe leading to a reduced acceptance.

Suggested change

Provide a "How does the app work" version in simplified English and German (could be text or even video). It should be explained in such a way that it can be understood by the "average citizen" (i.e. without technology background or university degree).
There could still be a more detailed, technology-oriented explanation on a second level for those people who want to dive deeper of course.

SAP has tons of UA experts that are surely happy to support.

[iOS] FAQ: Further infos on installation (for different devices )

Like seen in issue corona-warn-app/cwa-app-ios#638, installation can turn out to be difficult.

Suggested Enhancement

It might be helpful for people / useful to have in the FAQ:

• how updating smartphone devices in general works ( with links to tutorials). -- Some people might have to upgrade to iOS 13.5.1 before installation and might not know, how this works.
• install instructions/workarounds for different devices (steps)

Expected Benefits

Knowledge about updating the operating system and how to install on the specific device enables more people to use the app.

---

Internal Tracking ID: EXPOSUREAPP-12774

Add troubleshooting information for each error code on website

There are a good number of error/crash reports out there. Many are certainly not surprising because they happen due to outdated software versions etc.

It would be great if in addition to abstract error codes: "cause 3" there was a troubleshooting article on the website that explains why this particular error may have happened and how it could be circumvented.

This could include general steps: check your phone runs Android 6+ (link to how to do so) and more specific issues if known to cause this error.

Now that a good number of errors have been reported it's a good time to start this and get it out while lots of people are still installing and having exactly these issues.

We want the app to be accessible to even the least tech savvy quintiles right?

JSON-Syntax-Error when compiling "faq_de.json" and "faq.json"

In the above mentioned files a few closing parentheses are missing, which cause "gulp build" to fail.

[christopher@ArchDesktop cwa-website]$ gulp build
[11:41:39] Using gulpfile ~/Schreibtisch/cwa-website/gulpfile.js
[11:41:39] Starting 'build'...
[11:41:39] Starting 'pages'...
[11:41:39] Starting 'javascript'...
[11:41:39] Starting 'images'...
[11:41:39] Starting 'copy'...
[11:41:40] 'pages' errored after 89 ms
[11:41:40] SyntaxError: /home/christopher/Schreibtisch/cwa-website/src/data/faq_de.json: Unexpected token 
 in JSON at position 21610
    at parse (<anonymous>)
    at Object.Module._extensions..json (internal/modules/cjs/loader.js:1234:22)
    at Module.load (internal/modules/cjs/loader.js:1049:32)
    at Function.Module._load (internal/modules/cjs/loader.js:937:14)
    at Module.require (internal/modules/cjs/loader.js:1089:19)
    at require (internal/modules/cjs/helpers.js:73:18)
    at Panini.module.exports [as loadData] (/home/christopher/Schreibtisch/cwa-website/node_modules/panini/lib/loadData.js:21:14)
    at Panini.module.exports [as refresh] (/home/christopher/Schreibtisch/cwa-website/node_modules/panini/lib/refresh.js:10:8)
    at module.exports (/home/christopher/Schreibtisch/cwa-website/node_modules/panini/index.js:41:12)
    at pages (/home/christopher/Schreibtisch/cwa-website/gulpfile.js:60:7)
[11:41:40] 'build' errored after 91 ms
[11:41:40] The following tasks did not complete: javascript, images, copy
[11:41:40] Did you forget to signal async completion?
[christopher@ArchDesktop cwa-website]$ 

Accessibility: Missing alternative texts for images

Where to find the issue

1. Decorative images in the section Wie funktioniert die App? or How does the app work? on the main page
2. GitHub Icon in the header and the footer
3. Card images for news articles on /news

Describe the issue

1. The decorative images on the main page have no alternative text.
2. The GitHub icon functions as a link but lacks an alternative text to describe its destination
3. The images, used in the news cards have no alternative text.

Suggested change

1. Add an empty alternative text alt="" to declare the image as purely decorative, as recommended by the WCAG.
2. Add an alternative text, describing the GitHub repository as the links destination, for example alt="GitHub Repository"
3. Add an alternative text to the <img/> tag. Depending on, whether these images are deemed purely decorative or functional, the alt text has to be empty alt="" or a description of the iamge content.

Is it the right author in the package.json of the cwa-website

Your Question

• Repository: package.json
  In the package.json the author is Zurb Foundation, but i think it should probably be SAP?

"author": "ZURB <[email protected]>",

Add app installation counter to website

Feature description

Add an actual counter for the number of installed apps to the website.

Problem and motivation

A lot of people are probably interested in this number, because it also gives an indication of how much of a difference the app can possibly make.
I know this can be roughly seen in the play store but the granularity decreases with increasing installs (next value above 10M is 50M). I think this info is not public in the AppStore at all.

It would probably motivate people to install the app if they see how many others have already installed it as well and could be shared on social media to motivate others.

Is this something you're interested in working on

This can only be done by people with access to the publisher accounts in the AppStores

Telephone number in footer not place correctly

Where to find the issue

https://www.coronawarn.app/en/ in the footer

Describe the issue

When opening the website on a mobile device, the telephone number is not fully displayed.

Here tested on an iPhone 11 Pro Max

Suggested change

The placement of the telephone number should adapt to smaller screen sizes.

Use WebP Images with PNG Fallback to improve performance

To create a significant reduce of loading time, bandwidth, render time we can generate WebP Images out of PNG/JPEG on the Build Process.

To support Browser without WebP support (Safari) we can still add PNG/JPEG as Fallback.

Glitching border on FAQ page

This is only a very minor CSS bug that is easy to fix. In fact I already have a fix prepared that I can open a PR for.

Where to find the issue

See bottom border of each closed FAQ item on https://www.coronawarn.app/de/faq/.
It seems to happen in every browser.

Describe the issue

See screenshot above: the bottom border in the inactive state of each item is not styled correctly.

Suggested change

Changing two lines of CSS. I can create a PR for a fix of this issue. 🙂

Carousel Slick Arrows dont have a visible focus/av

Where to find the issue

Describe the issue

Suggested change

Enable http2

For better performance enable http2.

Introduction to HTTP/2

https://developers.google.com/web/fundamentals/performance/http2

inconstentcy regarding pull request guide lines

Here, you are encouraging pull request:

cwa-website/src/data/community.json

Lines 28 to 30 in 2256ee3

	"title": "Get involved",
	"subtitle": "You can submit a pull request in GitHub",
	"text": "As a general rule for any contribution: please make sure you provide as much information as you can to ease collaboration (follow the instructions <a href='https://github.com/corona-warn-app/cwa-documentation/blob/master/CONTRIBUTING.md#issues-and-planning' target='_blank' rel='noopener noreferrer'>here</a>). When creating a pull request, follow the <a href='https://github.com/corona-warn-app/cwa-documentation/blob/master/CONTRIBUTING.md#pull-request-checklist' target='_blank' rel='noopener noreferrer'>Pull Request Checklist</a> to ensure reviews can happen promptly. Also, if you plan to do something more involved, please reach out to us and send an <a href='mailto:[email protected]' title=''>email</a> first. This will avoid unnecessary work and give you and us a good deal of inspiration."

cwa-website/src/data/community_de.json

Lines 64 to 65 in 2256ee3

	"title": "Eine einfache Korrektur oder eine Verbesserung melden",
	"text": "Lege einen Pull Request an, in dem Du eine für den Code verantwortliche Person im entsprechenden Repository ansprichst (siehe z. B. die der Dokumentations-Repo <a href='https://github.com/corona-warn-app/cwa-documentation/blob/master/CODEOWNERS' target='_blank' rel='noopener noreferrer' title='Code Owners'>Code Owners</a>)."

here corona-warn-app/cwa-app-ios#732 (merged) and here corona-warn-app/cwa-app-android#675 (open) @tkowark changes the contribution guidelines to
Pull Requests that are not linked to an issue with you as an assignee will be closed.

Please try to be consistent. If in doubt, you could ask people to read the CONTRIBUTING.md of the specific sub-project.

[svengbr] Server configuration recommendations

I analyzed the Website with Ryte and Lighthouse from Google and here some recommended changes on the Hosting Setup:

404 Sites:
Currently non-existing sites return a 403 error code instead of the correct one (404)

Compression:
The Server is currently not compressing Text-based resources (gzip, deflate or brotli). This reduces the loading-time espacially for mobile user.

---

Internal Tracking ID: EXPOSUREAPP-8525

Implement easy end-to-end testing

To make sure features / hotfixes are didn't break anything I would recommend to implement a simple end-to-end testing system.

For this I would recommend Cypress, which is very straight forward ans easy manageable with npm.

This will also improve the ability to detect bugs faster.

The default test command will run End-To-End tests in a headless electron browser.

As an alternativ tests can also run with chrome or firefox.

I will submit a Pull-Request with the framework and a first test in the next minutes

Remove duplicate content from robots.txt

Where to find the issue

cwa-website/src/root-assets/robots.txt

Describe the issue

It is not necessary to declare the /sitemap.htm again if the root directory is already within the allowed path.

Suggested change

@@ -1,4 +1,3 @@
User-agent: *
Allow: /
-Allow: /sitemap.htm
Sitemap: https://coronawarn.app/sitemap.xml

Outdated sitemap.xml

Where to find the issue

https://www.coronawarn.app/sitemap.xml

Describe the issue

The sitemap provided seems to include an older version with another URL structure (w/o www. sub) as well.

Suggested change

Update the https://www.coronawarn.app/sitemap.xml with a newer version.

Add lock file of a node package manager

Push the yarn.lock file to the repo leading to faster install times and better version control of the installed packages with yarn.

Add "Enhancement" and "Feature" labels to website issues

Right now there's only "Bug", "Question" and "Anything else" available as labels for website issues.

I had enhancement/feature requests but couldn't label them appropriately.

Please add these two labels as they exist on the app repos.

Always output source maps

Describe the issue

Currently, source maps are only written in development (using gulp-if and !PRODUCTION as condition). This makes it harder to inspect the code of the live site in the browser's DevTools and as far as I see doesn't really have any advantages, the code is open source anyway.

Suggested change

Shipping source maps makes it easier to inspect and debug code on the live site and also is nice for beginners who might want to take a look at the website's code to discover how something was implemented. :)
So I suggest removing the guarding calls to $.if() that currently wrap $.sourcemaps.write() as well as the condition for the devtool webpack config.

I'd be happy to submit a PR if you agree. :)

---

Internal Tracking ID: EXPOSUREAPP-12958

What technology or framework are you using?

What technology or framework are you using?

I've taken a look at the code but i couldn't find out whether the website is built using some framework like Hugo, Vue or just plain HTML and JavaScript?
I want to know this in order to learn the framework/technology to be able to contribute.

Missing information that the GAP design itself is vulnerable to profiling and possibly de-anonymizing infected persons

There are several privacy-related FAQ on the website, such as "Können die übermittelten Informationen zu mir und meinen früheren Aktivitäten zurückverfolgt werden?". Unfortunately, the answer to this particular question is not complete, in my honest opinion.

Since there is empirical evidence in real-world scenarios, that the GAP Exposure Notification API itself is a source of risk, I would expect, to be fully transparent, a hint in the FAQ, that the current GAP design is in fact vulnerable to profiling and possibly de-anonymizing infected persons.

[svengbr ?] Is text compression enable?

Is text compression enable?

• Website URL Path: https://www.coronawarn.app/
• Description:
  Maybe the website can you gzip, Brotli or deflat

https://web.dev/uses-text-compression

---

Internal Tracking ID: EXPOSUREAPP-8525

`dist` folder should be cleaned before `gulp build`

See #80 (comment). I guess at some point this was the case since rimfaf is already included in the project.

Website needs simpler language

We want many millions of people in Germany to install the app, right? To achieve this the landing page needs a much easier-to-understand language.

One example:
When looking at the german version of the website, one of the first senteces that the user reads is: "Das Exposure Notification Framework (von Apple und Google) auf einem mobilen Gerät sendet einen Rolling Proximity Identifier und sucht gleichzeitig regelmäßig mithilfe der Technologie Bluetooth Low Energy nach IDs anderer Smartphones und speichert die IDs lokal."

How many percent of people in Germany are able to understand this?

Don't forget that the challenge is not to develop this app, but rather to bring it onto the smartphones of about 50 million people in germany. So the marketing team should be larger than the development team.

Is there any strategy for that already in place?

Accessibility: Low color contrast on blue text elements

in addition to #16

Where to find the issue

Blue text elements throughout the page

<h5> and <span class="enumeration"> on
https://www.coronawarn.app/

<a> on
https://www.coronawarn.app/de/
https://www.coronawarn.app/en/
https://www.coronawarn.app/de/#privacy
https://www.coronawarn.app/en/#privacy
https://www.coronawarn.app/de/community
https://www.coronawarn.app/en/community
https://www.coronawarn.app/de/imprint/

Describe the issue

The given elements have the text color #1294d4, which has a contrast ratio of only 3.38:1 to the #ffffff background. Since this falls under the category small text it should have at least 4.5:1 to meet the WCAG AA Recommendations

Additionally, in the section <section id="privacy"> the link color #1294d4 is paired with the background color #edf2f7, resulting in an even lower contrast ratio of 3:1. Again, since this is small text, a ratio of at least 4.5:1 is desirable to meet WCAG AA.

Suggested change

Adapt the color scheme to meet WCAG AA contrast ratios or - if possible - WCAG AAA contrast ratios. The WCAG specifications can be read here.

Two too huge images

Where to find the issue

https://www.coronawarn.app/en/

Describe the issue

Two of the images used on the website aren't optimized regarding their (file) size.

Suggested change

The images used on the website should get optimized.

FAQ deeplinks: Answer does not unfold by default

Deeplinks were added yesterday to the FAQs as requested in #71

Unfortunately, when one clicks on a deeplink, it doesn't unfold the answer, which is disorienting to a reader who expects to see the answer and not have to find the correct question and click on the answer manually. This is clearly unexpected behaviour, thus a bug.

Missing Focus styles

Where to find the issue

Homepage DE/EN

• Buttonlinks in general
• Bleib auf dem Laufenden! / Stay up to date! - Carousel Buttons an Slick-Dots

Describe the issue

• There is no visible indicator showing an active or focus state on textlinks
• There is no visible difference on hover/active/focus states on slick carousel arrow-buttons
• Slick-Dots are accessible via keyboard, but there also no indication of focus

Suggested change

Textlinks should have at least a focus style for accessibility
Slick-Arrow-Button-Styling should be extended by other Button-styles and have at least a focus state for accessibility
Add Slick-Dots focus state for keyboarduser

[Discussion] Header/footer: color contrast ratio is too low

Where to find the issue

The issue can be found in the header and footer on every site.

Describe the issue

The contrast ratio of foreground/background color is too low (1.77:1). This makes it hard for some people with visual impairment to read the text. According to WCAG 2.1, it should be at least 4.5:1 for normal text and 3:1 for large text.

See: https://webaim.org/resources/contrastchecker/?fcolor=FFFFFF&bcolor=80CDEC

The actual contrast ratio is hard to determine since there's a color gradient. The ratio of white text on red background would be fine (6.27:1), but almost all of the content area is in brighter colors.

Suggested change

Either background gradient or text should be in darker colors. Maybe it would be possible to use text shadow or a solid background color for some parts of the header/footer, e.g. main navigation.

CSP inline style on brave-browser

Where to find the issue

Request via Browser
https://www.coronawarn.app/assets/documents/cwa-datenschutz-folgenabschaetzung.pdf
(from https://www.coronawarn.app/de/ )

Describe the issue

Brave-Browser is configured more strict to respect the CSP Rules.

Suggested change

Fix the Response Header CSP Rule to allow safe inline-styles

Add button to FAQs to automatically unfold all answers

If someone wants to read all the FAQs, they currently have to click on every single question to see the answer. It would be good if there was a button to "expand all".

Make individual FAQs deeplinkable by providing IDs plus maybe link address directly copiable

The FAQs https://www.coronawarn.app/en/faq/ are a great resource.

There is a lot of information. Unfortunately, it's not possible to deeplink to particular questions at the moment, since the divs don't have any unique ids.

So please add ids.

In addition, ideally at the bottom right for every question a copiable link, so that the answer can be shared when answering questions on Social Media or in Whatsapp groups.

HTTP request to /assets/img/icons/ results in a 403

Where to find the issue

https://www.coronawarn.app/en/

Describe the issue

When analyzing the network requests, a 403 on the request https://www.coronawarn.app/assets/img/icons/ comes up:

Suggested change

Could be related to the entry /cwa-website/src/data/global.json on line 3, but not sure so far how this actually works.

Capitalization of "Du", "Dein", "Dich", "Dir" in coronawarn.app/de

I've noticed that in the German version most occurrences of "Du" are capitalized, but in some places I found lower case notation ("du") too.

The notation should certainly be harmonised. But the question arises: In which direction?

Duden (https://www.duden.de/sprachwissen/sprachratgeber/Gross-oder-Kleinschreibung-von-duDu-und-ihrIhr) says that nowadays the lower case notation is correct (only in letters, SMS and emails upper case is still tolerated).

From my point of view the upper case version looks pretty old-fashioned in this context. Therefore I'd recommend to write all occurrences of "Du", "Dein", "Dich", "Dir" etc. consequently in lower case - according to Duden's rules.

I can send a related PR, but first I'd like to ask if it would be okay to make the adjustment in this direction(?)

Website lacks many Security- and Privacy Features

Disclaimer: I am not sure if the website issues for https://www.coronawarn.app should be post here. So please feel free to forward this to whom is responsible for)

Though the website claims to be privacy-friendly, there are still these issues:

• Unsafe TLS Encryption Configuration
  TLS 1.3 is not enabled, TLS 1.0 is still active (!)
  Please check Ciphers aswell.
• CSP (Content Security Policy) is missing
• "no-referrer" tag is missing. Referers are told to 3rd parties.
• Several X-Headers (X-Content-Type, X-Frame, X-XSS-Protection) are missing

Please use common test suites to check website for security and privacy:

• https://observatory.mozilla.org/
• https://webbkoll.dataskydd.net/de
• https://www.ssllabs.com/ssltest/

Website responds with 504

Where to find the issue

Disable you browser-cache, then go to

https://www.corona-warn-app.de

Describe the issue

The website seems to be under a lot of load right now. When I request it, most of the time,

This page isn’t working
www.corona-warn-app.de took too long to respond.

HTTP ERROR 504

The site beyond the redirect works fine...

Suggested change

Maybe the redirecting servers have to be scaled up.

Fix typo

"COVID-19 Auslöser" should be "COVID-19-Auslöser" as it's one word and therefore needs to be connected with a hyphen.

Add background running information to FAQ

Where to find the issue

No information in FAQ about running app in background is needed

Describe the issue

In the FAQ is no information about if the app must be started and run in background to work or the exchange of the keys is managed by operation system and the app do the analysis of "infected" keys only. (maybe the wrong wording "infected" sorry)

Suggested change

Add information to FAQ or better display the information in the app directly

List devices on which the app does not work (e.g. Xiaomi, Huawei)

In your FAQs you state:

Android: The app will run on phones with Android 6 ('Marshmallow') or higher. The Exposure Notification API has been installed on these phones automatically via the Google Play services. (https://www.coronawarn.app/en/faq/)

Unfortunately, there seem to be exceptions to this rule, not mentioned in the FAQ - the FAQs read as if any phone with Android 6+ and Play services up to date works.
E.g. Xiaomi, Redmi, Huawei, see issues corona-warn-app/cwa-app-android#495 corona-warn-app/cwa-app-android#490 corona-warn-app/cwa-app-android#487

The fact that these devices won't work isn't clear from your documentation, so it's a bug. Please add it to the FAQs and the Play Store App Compatibility List as excluded devices: https://support.google.com/googleplay/android-developer/answer/7353455?hl=en

If Google has a list of devices that are compatible/incompatible, it would be worth linking to. Rather than just saying contact Google/Apple. You know they won't be of any help.

I remember that a week ago someone asked you for a Green List of devices. You said you didn't want to make one. I asked for a public beta test to figure these issues out before release and be prepared with messaging. You didn't want to beta test. Well, now we have the salad.

---

Internal Tracking ID: EXPOSUREAPP-2957

General feedback on handling PRs and issues

I was a bit disappointed, when I saw that @SebastianWolf-SAP commited a change to add a new feature that was requested as an issue. However, I already created a PR to address this issue (with a more generic and scalable solution) a few hours before his change. Ultimately, the change created a merge conflict for my PR.

So, please comment on issues / feature requests, when you put it in your backlog for you to implement / fix by yourself. That way, contributors will not work on stuff you already work on. On the other hand, please review PRs first, before you start implementing stuff, which may have been already implemented by contributors.

Thanks for helping us helping you.

Yes

Favicon as SVG

Add a Favicon as SVG would be better because only one line is needed to tell the browser where it is located and it will look good in any size.

Illogical value for font-family attribute

cwa-website/src/assets/scss/_variables.scss

Line 401 in 3849875

$font-family-sans-serif: 'Roboto', Roboto, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;

1. Roboto is a duplicate entry in the list (quotations make no difference if font family doesnt contain any spaces)
2. the generic font family sans-serif in the middle of the list makes it impossible for the following entries ever being used

Feature Request: Move the App-Store-Icons to the top of the page...

Where to find the issue

Open the website under https://www.coronawarn.app/de/ or https://www.coronawarn.app/en/

Describe the issue

The buttons for iOS and Google are on the bottom and should be, as with https://www.bundesregierung.de/breg-de/themen/corona-warn-app/corona-warn-app-englisch, at least in the top region.

Suggested change

The links should be moved to the top or at least added there in addition.

Text optimization website (user friendly)

I don’t know who is responsible for the texts on
The website. The point 01 is pretty complicated for most of the people. Where can be submitted a suggestion for optimization? Best Jan

![9C915304-7F4A-4C03-9726-300AF1FFC52D](https://user-images.githubusercontent.com/8312244/85177706-ea036000-b27c-11ea-99bd-088158089e98.jpeg

Resource not found - aja

As noted by @Julian-B90 in this comment the page we get a 403 for the file

https://www.coronawarn.app/assets/css/ajax-loader.gif

Untrusted root ca certificate https://corona-warn-app.de/

The URL used in the iOS applications:
https://corona-warn-app.de/
Shows a certificate error due to untrusted root CA on MacOS/Chrome and iOS/Safari

.

Phine numbers in footer cut off on mobile

Where to find the issue

Footer of home page
https://photos.app.goo.gl/i6USG8N9QzhYTSw79

Describe the issue

Phone numbers don't wrap and are therefore cut off on mobile screens.

GDPR and BDSG compliance not given on Homepage of Corona Warn App

Homepage: https://www.bundesregierung.de/breg-de/themen/corona-warn-app/corona-warn-app-englisch

I am sure this issue is wrongly placed here - on the other hand I hope this is the short way; I just tried for an hour to figure out who is responsible for the homepage, but as so often in Germany, no one seems to be responsible.

Where to find the issue

https://www.bundesregierung.de/breg-de/themen/corona-warn-app/corona-warn-app-englisch

Describe the issue

There are social network icons wrongly placed on the homepage which do ! send referrer information to its owners, here twitter, facebook, instagram and youtube, also they definitely transfer the visitors IP on the social networks servers, ready for analysis..

It shouldn't be news that this wasn't nor isn't allowed under BDSG nor GDPR and its predecessors.

These social buttons have to be explicit turned on by a user and the user must explictly accept this before the buttons are activated.

I think, in times were we discuss months about data security regarding our Corona Warn App, such a (minor) flaw shouldn't happen. Nor should it start a new discussion like 'if they do not protect data here, how should this be the case for the app... Alu heads even might find this good for a new 'the theory'...

At least, it seems as if the icons are not downloaded directly from facebook & co, but still, the information given about the "consequences" by clicking them is in this form not right.

Suggested change

2014, 6 years ago, heise.de started a project c't shariff that handles this issue (btw. that was two years before GDPR ;).

I suggest to implement the current version of this project or similar projects, of which you can easily find several.