Should I use multiple dropdown menus in mobile design?

Question

I am developing a documentation website for a JavaScript framework I've developed.

On Desktops

The main navigation only has three links:

When you navigate to "API Documentation", there is then a dropdown menu that allows the user quick access to the documentation page for each specific API method. This is a shortcut for the long list of API methods that link to their individual pages. There's also a list of "Other pages", which go to other pages that still fall under the API Documentation category. The decision was made to have the "Other pages" sub-navigation just be a list, since there are relatively few list items:

As a side note, whenever the user clicks an item in "Other pages", the link "API Documentation" remains bold, and the link for the page that was clicked on becomes bold as well, acting as a breadcrumb trail for the user:

On Mobile Devices (my question)

On mobile devices, the main navigation menu with the three links is collapsed into a typical mobile expandable menu:

Then, when a user clicks "API Documentation", there are now two dropdown menus. The first dropdown menu, which is the method list, and the second dropdown method, which holds the links to the other pages (which, in desktop mode, are a list of links and NOT a dropdown menu):

Categorically this layout makes sense. If I grouped all the "other pages" into the "select a method" dropdown list, categorically they wouldn't really belong together, which could confuse the user. But on the other hand, is it confusing for the user to have three navigation options? (One main navigation and two sub-navigations?) Also, as a side note, this navigation still maintains a sort of breadcrumb thing, which lets the user know where they are at any given time:

Answer 1

I think the dual dropdown menus may be a little confusing, since they appear to be conditional or part of the same form action (i.e. selection from first dropdown changes what's available in second dropdown, or any number of other assumptions).

Would you consider moving the 3 sub-page links into your mobile navigation? It's very common to see sub-navigation items below the main nav rows, but styled or indented to show they're sub-pages of that section. You wouldn't even need it to be an expandable/accordion element since there are so few nav items. You could style it so they all fit into one outlined row, with a smaller regular case font, indented or bulleted.

Your site structure is so small that you could even get away with having more traditional breadcrumbs to communicate the structure when the navigation is closed. Since you're showing a fancy title, your breadcrumb above could simply be "API Documentation >" which would serve all your filtered API methods well. I don't know if you're only showing one method at a time, or if the user can then scroll up and down to see the rest. If you made the breadcrumb title and the dropdown "sticky" or fixed at the top, the content would scroll under it and make for some pretty nice navigation in that section.