Opera tabs or accordion?

Question

User interface

A help interface is planned. Two options are considered in the picture below.



The user works with the help tree. In addition to the tree, there are a couple more tabs with some functionality.
In the first case, “opera tabs” were used to switch sidebar windows (as in the Opera browser), in the second, a regular accordion.

What are we losing/gaining? In the first case, we have an unnecessary vertical bar on the left side of the screen, because there are only a few tabs. But we can safely hide the sidebar to the size of tabs. In the second case, there is no extra band, there is an accordion. Everything is simple. But there is no possibility to hide the panel in principle.

Detail: The end user of the product will experience the browser interface in full screen mode on a widescreen monitor in a vertical position.

Not essential on the screen blurred.

Who will speak constructively?

Answer 1

I'll add my 5 cents. What is drawn on the left is no good, since there is a tiny closed list on the left, and in order to get to the desired section, you need to hit the tiny plus sign with the mouse, which cannot be seen without a magnifying glass. this is a disregard for the user, you should not do this. And yet they do it anyway.
If you do not believe that this is inconvenient, try to open this stupid tree within half an hour from the touchpad from a laptop or from a touchscreen phone. Then you will clearly see all the shortcomings of the tree approach.
If there is a search on one of the tabs, then you don’t need to make it a separate tab - put the search field right there. Why do unnecessary movements when you can not do them?
The accordion is a bad thing because it confuses users and is very inconvenient.
Tabs are also inconvenient (but better), because until you open a tab, you won’t know what is drawn on it.
Summing up, I advise you to still think about how to abandon unnecessary tabs and put everything on one. Maybe some features of your product are not really needed by users.
A simple usability rule is that the fewer active elements and buttons on the page, the less the user needs to think. If you've seen the "Google, Apple and your comapny app" comic, you'll know what I mean.

Answer 2

The vertical position of the monitor hints at the answer. But before making a final decision, it is worth answering a few more questions:
1) How much additional free space is needed for a “pair of tabs with some functionality”?
2) How often does the user use this “pair of tabs” compared to the main directory?
3) What is the probability that, being on one of the “pair of tabs with some functionality”, the user will need to look into the main tree? It seems that by default the accordion only shows one open area, but I think you can come up with a way to keep the tree always visible, if it would be useful.
In general, if the answer to question No. 1 is “not very” or “no”, No. 2 is “not often”, then I would definitely make an accordion, if there are other options, you can think about inserts in the style of the Opera

Answer 3

“In the second case, there is no extra band, there is an accordion. Everything is simple. But there is no way to hide the panel in principle.
How is it not? Make a “hide/show panel” button at the bottom or top, add a little bit of JS there, and everything will crawl in and out.

Answer 4

If there is little information in the headers of the tabs (no more than the width of the monitor), then it is more convenient to use tabs - they can cover the art content of the presented materials at a glance.
The accordion is good, but there is one drawback - when opening the content, the content itself is divided into “there, above” and “somewhere below”, this is not always acceptable.

Answer 5

Sorry for offtopic. I have a problem here that is not entirely clear - to make one crap, but not an accordion.
Actually the question is, but the accordion, what the hell is this? How not to do it by accident.