In step 3 of the process there is a button with "Upload a document". This button is made from a non-interactive div. When a file is uploaded, the name of the file appears below this "Upload a document" button with a cross icon. See screenshot 10. This icon is a button to delete the files. This button is made from an a-element without an href attribute. This makes this button miss all interactive features and accessible features. The last screen with a heading "Sent!" Has a "Back" button. This button has the same problems. This success criterion includes the lack of a name and the correct role.
The reading software cannot tell its user that these are buttons because they miss the correct role. Now these buttons are coded as neutral (non-interactive) div elements. In addition, the reading software does not know what the function (name) of these buttons is.
The most robust solution is to use the native HTML elements such as button elements. Another possible solution is to use WAI-ARIA.
In step 3 of the process there is a button with "Upload a document". This button is made from a non-interactive div. When a file is uploaded, the name of the file appears below this "Upload a document" button with a cross icon. See screenshot 10. This icon is a button to delete the files. This button is made from an a-element without an href attribute. This makes this button miss all interactive features and accessible features. The last screen with a heading "Sent!" Has a "Back" button. This button has the same problems. This success criterion includes the lack of a name and the correct role.
The reading software cannot tell its user that these are buttons because they miss the correct role. Now these buttons are coded as neutral (non-interactive) div elements. In addition, the reading software does not know what the function (name) of these buttons is.
The most robust solution is to use the native HTML elements such as button elements. Another possible solution is to use WAI-ARIA.