How do I create different editable sections within a WordPress page?

If you are writing the theme, maybe you would like to consider using a WordPress Framework so you don't have to start from scratch.

If that is not the case, think of the end user. How will they add sections to pages and posts? Will they have to move across places within the WordPress UI, or would they rather user short codes?

My recommendation is to build a plugin that render the section within the document content. Or widget content if that is the case.

I wrote a little piece of code to illustrate how you can accomplish such a thing, and also because I kind of need it right now :D. You can find it on github here https://github.com/lionpage/Front-Office-Document-Sections

Hope this helps

Unfortunately adding multiple editable fields in a single page is not particularly easy using WordPress by itself.

Many WP devs I know (myself included) rely on the Advanced Custom Fields Plugin for additional content fields.

The steps to make this happen:

1) Install the ACF the plug.
2) In the settings area for ACF create some new fields.
3) Assign the new fields to appear for a specific page or set of pages.
4) Update your page-template for the given page(s) so that the new fields are displayed.

For instance you might create a set of standard wysiwyg fields and then assign them to the 'overview' page. Let's call these fields: main_text, products_info and about_company. Once the fields have been created and assigned to a page, when you edit that page the additional fields will be available to edit.

For these new fields to be seen by visitors, they must be added to the page-template you use for your overview page. The code could be something like this:

<div id="maintext">
   <!-- Text -->
   <?php if(get_field('main_text')){ //if the field is not empty
        echo '<p>' . get_field('main_text') . '</p>'; //display it
    } ?>
</div>
<div id="products">
   <!-- Text and Images -->
   <?php if(get_field('products_info')){ //if the field is not empty
        echo '<p>' . get_field('products_info') . '</p>'; //display it
    } ?>
</div>
<div id="about_company">
   <!-- Text boxes -->
   <?php if(get_field('about_company')){ //if the field is not empty
        echo '<p>' . get_field('about_company') . '</p>'; //display it
    } ?>
</div>

There are lots of good examples here. If you are feeling really ambitious, rather than install the plugin you could even include ACF directly in your theme.

You've got three options I believe:

1. Create a widget area where you can then display the content in a text widget: http://codex.wordpress.org/Function_Reference/register_sidebar
2. Create a template where you then get the content of a different page: http://codex.wordpress.org/Page_Templates#File_Folders
3. Create a new meta box for all your pages: http://codex.wordpress.org/Function_Reference/add_meta_box

I believe that the thing you are looking for is option 2. The others are more full-site oriented, if you want the extra content to show up on every single page.