I am working on a web project where users can write content and share it – this content is mixed (text/image/video), massive and a bit complicated – so obviously it should be divided into sections (chapters, e.g. 'Introduction', 'Chapter A', 'Chapter B', etc.) to make its easier to navigate through and don't show it like a wall of text on user's screen.
So if there were just 3-4 sections I would simply use traditional tabs, but the problem is that there are 12 sections (and even more can be dynamically added by user if needed) and I have less than 800 pixel width of the content block, so all these tabs would not fit in this width (considering that majority of sections' titles consist of two words).
I don't want to use multi row tabs because it would seem complicated to user and hard to navigate, let alone the unaesthetic look.
I could use side bar on the left (aka 'vertical tabs'), but considering less than 800 pixel width, tabs would use a big amount of contents' space.
Any ideas on the best approach with many sections?