Skip to Demo
The use of an alert box was once discouraged, but they are actually accessible
Click View Answer to see answers to the following two questions
1: Penn State policy forbids the use of PDF files. View Answer
The examples above show the View Answser element as a both a link and a form field button. Both generate an alertbox which includes a close button.
Once the alertbox is closed, the cursor moves to a position after the View Anwser element so that keyboard users can continue to navigate through the content as needed.
The link includes an onClick event which opens an alertbox when it is clicked on or the user clicks the ENTER button. This works because browsers add a keyboard interpretation and also because the A tag includes a dummy href="#" URL. This allows devices to recognize the link as a link.
The code for the button is a FORM element with a LABEL and a button with the an onClick event triggering the alert box. The FORM tag is needed for the screen reader to enter forms mode, but again browsers are adding their own keyboard interpretation of this tag.
<label for "va1">2: Usability experts recommend using links versus form elements in a consistent manner.</label>
Top of Page