accessibility — First Card - Get more time for what matters

About First Card

Accessibility statement for commercial cards digital service in Finland

This accessibility statement applies to the commercial cards digital service in Finland. The service is subject to Act on Provision of Digital Services requiring the digital services to meet accessibility requirements. This accessibility statement was published in 2020 and updated on 26.9.2023.

General information about Nordea’s accessibility on commercial cards digital service

On this site you can find general information about accessibility of Nordea’s commercial cards digital service. Nordea is developing its commercial cards digital service in order to be accessible for all our customers. There are still some deficiencies in our service contents that we are working our best to solve. Nordea’s goal is that all our service contents are available equally, regardless of the device, special needs or situation of our customers.  

The accessibility of the commercial cards digital service contents has been assessed by a third party. Nordea is following A and AA level criteria of the Web Content Accessibility Guideline 2.1. 

Accessibility status for Nordea’s commercial cards digital service contents related to Finland are listed below, and the accessibility status for each content include detailed information about each content feature. In this accessibility statement you can find the information if the digital service content is not yet fully accessible and how it will be improved. Nordea updates the accessibility statement in accordance with the development of accessibility in our commercial card digital service. If you find any difficulties in accessibility of Nordea’s commercial cards digital service that have not been mentioned in our accessibility statement, please give us feedback.

Accessibility status of the commercial card digital service contents

Nordea’s commercial cards digital service in Finland meets partially the accessibility requirements. The target is to have the identified gaps fixed during 2022, unless otherwise stated below.

  • Firstcard.fi: Fully accessible
  • Cardholder´s online service: Not yet fully accessible ; analysis and implementation of deficiencies planned for 2022. Accessibility statement will be updated accordingly. Inaccessible content can be requested by contacting First Card customer service.
  • Webfile, Statistics Online, and tailor made services for companies: Partially accessible, however given the age and scope of the services, it is assessed to create an unreasonable burden to meet all accessibility requirements. Potential alternative solutions for these services is planned for 2022. Inaccessible content can be requested by contacting First Card customer service.
  • First Card App: Not yet fully accessible, tue to unreasonable burden; analysis and implementation of deficiencies planned for 2022. Accessibility statement will be updated accordingly. Inaccessible content can be requested by contacting First Card customer service.

Inaccessible content of My Card Online

The content partially meets the accessibility requirements. The target is to ongoing close the identified gaps with normal updates of the service content, unless otherwise stated below.

Perceivable
1.1.1: Non-text Content
  • The alt text for the First Card logo does not describe the purpose. It only says "logo".
  • Wrong alt text on image. The alt text is "bell-icon". While this is not the worst default, and identifies what is on screen, it does not identify the purpose (to indicate an announcement or warning). This is a more general issue with icon alt text on the site.
  • Missing alt text, or alt text that does not describe the purpose.
  • Message delete button has alt text that does not describe the purpose.
  • Attachment button has alt text that does not describe the purpose.
  • Missing alt text, or alt text that does not describe the purpose.
  • The alt text for the Nordea logo does not describe the purpose. It only says "logo".
1.3.1: Info and Relationships
  • The header of the page must be wrapped in a header element, to indicate that relationship programmatically.
  • The current page is communicated visually (top black border), so it must be communicated programmatically as well.
  • The title of the banner is visually distinct, like a heading, but not marked up as such. While this might not be a significant barrier, it can be helpful to users navigating with a screen reader, and who list the headings on a page. It would ensure they do not miss announcements.
  • Missing headings. Elements styled like headings are not headings in the HTML.
  • The sort state must be communicated programmatically.
  • Naming of table headings. The table headings have a button with aria-label. The aria-label overrides the accessible name of the button. Thus, the table heading as a whole ends up being called "Change sorting for transaction_date".
  • The modal heading is styled visually like a heading, but not marked up as such.
  • The radio groups for card inputs are not associated with their title programmatically. For example, the second row might describe "Nordics", but the radio buttons only announce "Enabled" and "Disabled". This relationship (grouping) is present visually.
1.4.1: Use of Color
  • The Uninvoiced/Invoiced buttons do not communicate their state visually, but without only relying on color
  • The input to write a message relies only on color (red border) to indicate that something is wrong.
1.4.10: Reflow
  • The navigation is sticky on top of the screen. At medium to high zoom levels (and short screens), it covers significant parts of the page, if not all of it. This can prevent users from effectively browsing the website.
  • The banner is sticky on top of the screen. At medium to high zoom levels (and short screens), it covers significant parts of the page, if not all of it. This can prevent users from effectively browsing the website. Moreover, the button to dismiss the banner can end up off-screen, without a way to reach it.
  • The page requires scrolling in two directions even at mild (200% zoom levels, or on mobile/narrow screens).
  • At high zoom levels, the dialog's bottom half is off-screen and out of reach.
  • The message modal does not work at high zoom levels, or narrow (mobile) screens.
1.4.3: Contrast (Minimum)
  • Element has insufficient color contrast of 4 (foreground color: #7f7f7f, background color: #ffffff, font size: 15.0pt (20px), font weight: normal). Expected contrast ratio of 4.5:1.
  • Element has insufficient color contrast of 3.94 (foreground color: #808080, background color: #ffffff, font size: 15.0pt (20px), font weight: normal). Expected contrast ratio of 4.5:1.
  • Element has insufficient color contrast of 4.04 (foreground color: #ffffff, background color: #3d9014, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1.
  • Element has insufficient color contrast of 2.3 (foreground color: #9e9e9e, background color: #eeeeee, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1.
Operable
2.1.1: Keyboard
  • The Log out menu item is not reachable / operable by keyboard.
  • The previous / next navigation buttons are not keyboard operable, and are hidden from assistive technologies.
  • The close button is not keyboard operable.
  • It is impossible to open messages with the keyboard only (only a 'click' handler for pointers). Also, without a perceivable button to do this action, even sighted mouse users might miss it.
  • Not possible to operate the "add attachment" button by keyboard.
  • Not possible to operate the delete button on a message.
  • The input to add an attachment is not operable by keyboard. This happens because the input has the `hidden` attribute. The hidden attribute, display: none and other properties hide the element not just visually, but also from the accessibility tree.
2.2.1: Timing Adjustable
  • If there is a timeout upon which the user will be logged out, the users must have a mechanism to extend or cancel the timing.
2.4.1: Bypass Blocks
  • Consider implementing a "Skip to content" link, so that keyboard-only users can effectively navigate the site.
2.4.2: Page Titled
  • The page must have a title that describes its content, but on the site all pages have "Cards Online" as the title.
2.4.3: Focus Order
  • The site is a Single Page Application. To make the navigation noticeable to the user, the focus must be handled after navigation.
2.4.7: Focus Visible
  • Menu items have no discernible focus. The focus is shown in a low contrast, light gray on white, which does not pass the 3:1 contrast ratio.
  • There is no focus (or nearly imperceptible) indicator on the close button.
  • The Uninvoiced/Invoiced buttons do not have focus in the active state.
  • The focus indicator gets lost when changing the page, there are no more pages in that direction.
2.5.3: Label in Name
  • The sort button accessible name must contain the visible label.
  • The accessible name of sorting button refers to presumably internal names of columns, for example "Change sorting for transaction_date". These are similar, but not the same as those shown visually. This can be a risk for "Label in name", especially considering localizations, when the internal names stay in English.
Understandable
3.1.1: Language of Page
  • The HTML language (lang) does not reflect the language of the page.
3.3.1: Error Identification
  • The input to write a message must be non-empty. This must be communicated to users.
3.3.2: Labels or Instructions
  • There are no visible labels for the inputs to change a card name. While those are available programmatically, sighted users might miss them.
Robust
4.1.2: Name, Role, Value
  • Role menu / menu item is not fit for this purpose. That role is meant to represent menus in the sense of a desktop-like application, such as the top bar on an Excel. While it may be supported and users could make sense of it, it can also be confusing.
  • The button to close the banner has no accessible name.
  • The button that expands Advanced Search does not communicate its state
  • The Uninvoiced/Invoiced buttons do not communicate their state programmatically .
  • Role figure seems misplaced.
  • Text area for messages has no label.

Inaccessible content of First Card App

Perceivable
1.1.1: Non-text Content
  • The icon does not have a text alternative
1.3.1: Info and Relationships
  • Each page must have headings semantically, when they are presented visually
  • Related elements that all do the same action on activation must be grouped as one, instead of individual elements.
  • Phone number field has no programmatic label. The hint should be separate.
1.3.4: Orientation
  • The app must not restrict orientation to portrait mode
1.4.4: Resize text
  • The text gets truncated at high text sizes.
  • Respect dynamic text sizing, ensure the content remains available
Operable
2.2.1: Timing Adjustable
  • If there is a log-out period after inactivity, ensure that the user knows about it
2.4.2: Page Title
  • Each page must have a title element
2.4.3: Focus Order
  • When navigating to a new view (either via the nav bar or in-page buttons), the focus ends up in unpredictable places. It should at least be consistent
  • When opening a modal, the focus must go to the modal.
2.4.7: Focus Visible
  • Focus can end up behind the modal
Understandable
3.1.1: Language of Page
  • The app must communicate the language that the interface is in, programmatically
3.3.1: Error Identification
  • Errors in the phone number are not identified programmatically
3.3.3: Error Suggestion
  • If there is an error in the format, it should be identified in the error text block.
Robust
4.1.2: Name, Role, Value
  • Must announce their role (button)
  • The button is not communicated as a button
  • Must communicate their role and value (switch, on/off). The role is communicated, but no name is available.
  • No role is announced for 'Locate country'
  • Some buttons are missing roles and labels: Back, Send (up arrow), Add attachment, Delete message. They also do not have the correct role
  • Ensure that the currently selected element is communicated programmatically. There must be a valid role.
  • The label for the message field disappears once the user enters text
4.1.3: Status Messages
  • If there are status updates, ensure those are communicated to assistive technologies.

Accessibility feedback 

Did you find accessibility difficulties in our digital services? If you did not find an answer in our accessibility statement regarding the service, please send us feedback.   

Give feedback on accessibility 

Supervisory authority 

If you notice accessibility issues with the site, first provide feedback to us, the site administrator. The response can take 14 days. If you are not satisfied with the answer you have received or do not receive a reply at all within two weeks, you can report it to the Regional State Administrative Agency of Southern Finland. The website of the Regional State Administrative Agency of Southern Finland explains in detail how the notification can be made and how the matter is handled.  

Contact details of the supervisory authority  

Regional State Administrative Agency of Southern Finland 
Accessibility Control Unit  
www.saavutettavuusvaatimukset.fi 
saavutettavuus@avi.fi  
telephone number exchange 0295 016 000