Address usability concerns on openFEC API swagger page

[JonellaCulmer]

What we're after: We need to improve the usability of the swagger page. We've implemented language changes and the API key sign up form. While those were necessary and immediate changes to support the API, we need to now take another look at how the page functions.

openFEC API swagger page: https://api.open.fec.gov/developers/

Potential problems:

• Form usability
• Page usability
• Ease of page navigation

Action items:

• Document usability pain points and problems
• Consider and mock-up improvements
• For consideration: are our users benefitting by having the api key signup form embedded on our site? One pain point at the moment is that the form does not work on all browsers. Some users have reverted to using the link that was provided previously. This "action item" is meant to generate discussion from multiple viewpoints (added by @jason-upchurch) (resolved by reporting to api.data.gov)

Completion criteria:

• Documented usability problems are addressed and mocked up for future implementation
• Follow-up implementation ticket is opened

[johnnyporkchops]

One enhancement is that this could be put into an accordion. Also a click event on the accordion could trigger the form load--possibly solving the concern for intermittent non-loading of form:

Also see Issue submitted on https://github.com/18F/api.data.gov/ here:
18F/api.data.gov#554

[realimpat]

Hi,

I was looking to explore the API but the swagger page looks broken. I find it very hard to read, to the extent that I've been using the bulk data downloads instead, because I can navigate them.

Here is a screenshot.

Is this what is supposed to show up? (live demo of open source swagger ui from swagger.io)
https://petstore.swagger.io/?_ga=2.253231433.192694618.1598826364-1119385499.1598826364&_gac=1.125568504.1598826364.CjwKCAjwnK36BRBVEiwAsMT8WKdMUROAaeKrC9W5uAKtxBP5XrMZVTWULkcLumoXtF5Y88Uxs0JTWRoCQhQQAvD_BwE