I have a site I am developing. The site has a lot of articles on the site's topic. Most article pages have the main content of the article then, to the right, a sidebar which contains new content that was recently added or updates, social links, a few internal links to important pages (IE: donation link, volunteer link, etc. the site is a non-profit) and related articles.
For some articles there is a sidebar of additional content which is an aside.
My question is what is the best way, from a UX point of view, for adding a second sidebar?
I do not want to stack the aside on top of the main sidebar as that could produce a very long sidebar.
- The options I see are adding a sidebar to the left of the main content for the aside. But my concern is when the site is viewed on mobile you have a long page as the sidebars are underneath the content.
- Adding a button at the top of the current sidebar that says
Additional Information(or similar wording) and upon clicking it, the sidebar switches out for the aside side bar. Click the same button and the original sidebar shows again.
- Same concept as above, but the aside is in an off canvas container that slides into view.
What is the best approach for multiple sidebars from a UX perspective?