How should I design scrolling on my web site?

I'm redesigning an old reporting application for the Web, - previously it was a Windows Application. I have in mind two approaches, and I do not know which one is preferable for the users, so I hoped to find an answer here. The layout looks like this:

enter image description here

  • The red part represents a navigation bar menu that allows users to go through different parts of application, like reporting, configuratione etc. Currently I am discussing only reporting.
  • The green part represents a side navigation bar and allows users to select a report. They are added by the users, so can be many.
  • The blue part represents the report result itself. It can be very long, easily containing 300+ plots.

This design was used in the old application and in order to support the switch for the old users, we are stuck with it.

The question is how do I design a scrollbars. I have two approaches:

Scrollbars are marked as white in the next pictures

Have scrollbars per layout as in old application:

There is no page scrollbar, and instead each layout has it's own scrollbar: enter image description here

Or have a single scrollbar and long page as in most web sites

The red menu is stuck on top and green and blue scrolls together enter image description here

I prefer the first option as it is closer to what the old application was, but it feels not very web-oriented. Am I right if I go with the first option? Are there any good examples like this over there in the web?

Tags: