How to do a section of bulleted text within our page?

Generally since WordPress' biggest selling point is it's content management, what clients want the most are sites they can edit without any code in the way or any chances that they might break something - so putting html in the text editor beyond unordered/ordered lists is bad practice and defeats the point of making content easy to manage.

Judging by the image you provided as an example, it looks like these bulleted lists aren't inline with the rest of the content as well so you're going to need html to get that layout. To keep the html outside of the text editor and keep editing as clean as possible for you and your client, I'd suggest to stop relying on page.php and make your own page template.

In the template, you can lay out any html you need and use the loop to call anything in the main text editor. Without using plugins, you can take advantage of custom fields or with a plugin, having a Magic Field where they can edit their bulleted list. Having your template assigned to each page, calling the page content and the list coming from a field will grab the content only from that specific page. And it will also eliminate any complicated HTML in the text editor by leaving it in the template wrapped around your loops and functionality.

If you really, really don't want the client to have to write any html at all, even uls/lis, if you're using Magic Fields and your own template, you can make a field that can be duplicated on the WP Admin and use a foreach with PHP in your template. Something like this:

<?php if ( get_field('list-item') == TRUE ) : ?>
<!--This checks to see if your client is writing anything in this field, if not, your html won't show on the template at all, it'll be cleaner this way -->
<ul>
<?php $listItems = get_field('list-item');
  foreach($listItems as $listItem) {
    echo "<li>" . $listItem . "</li>";
  } ?>
</ul>
<?php endif; ?>

This example is explained more on the Magic Fields 2 Wiki under "Working with groups, duplicate groups and duplicate fields". Basically it's taking the fields from that page, and with every duplicated field, it will wrap it in an li. And if your client doesn't use the field at all, the if statement around the entire thing will just hide the HTML completely on the front-end. Hope this helps to put you in the right direction. Good luck!

Simply click the 'list icon' in the WordPress visual editor to create a list, then surround the list in 'Code view' with <div style="float: right"> ... </div>

Probably the most user-friendly way of doing this would be to create a new visual editor button which creates the <div> and list for you. Your user would then simply add each list item...

In comments you have few good ideas for complex solution, but if your client is moving a static site and won't change lists very often, you should consider simply wrapping lists in a div/aside with custom css class.

Adding more complex solution is not necessarily good thing. Especially if lists contain relative links to site content. With simple aside+css you can easily move content in the future to new site/theme without plugins/additional code etc. Shortcodes/metaboxes etc. break this content/mechanic separation, so IMHO should be avoided when possible.

<aside class="gs-pull-right">
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
    </ul>
</aside>

<style>
.gs-pull-right {
    border: 1px solid black;
    float:right;
    width: 300px;
}
</style>

If lists content should be dynamic, and for example show last 10 posts, using metabox+shordcode's is best way to do it.

This is a solution you can provide to your client, using, as already said, a metabox. You can copy/paste this in your functions.php :

add_action( 'add_meta_boxes', 'bullet1545_add_custom_box' );

add_action( 'save_post', 'bullet1545_save_custom_meta_box' );

function bullet1545_add_custom_box( $post ) {

    add_meta_box(
        'Bullet Meta Box', // ID, should be a string
        'Side List', // Meta Box Title
        'bullet1545_custom_meta_box_content', // Your call back function, this is where your form field will go
        'post', // The post type you want this to show up on, can be post, page, or custom post type
        'normal', // The placement of your meta box, can be normal or side
        'high' // The priority in which this will be displayed
    );

}

function bullet1545_save_custom_meta_box(){

    global $post;

    // Get our form field
    if( $_POST ) :

        $bullet1545_custom_meta = esc_attr( $_POST['bullet1545-custom-meta-box'] );

        // Update post meta
        update_post_meta($post->ID, '_bullet1545_custom_meta', $bullet1545_custom_meta);

    endif;

}

function bullet1545_custom_meta_box_content( $post ) {

    // Get post meta value using the key from our save function in the second paramater.
    $bullet1545_custom_meta = get_post_meta($post->ID, '_bullet1545_custom_meta', true);

    echo '<label>Custom Meta Box:</label>
    ';

    echo '<textarea name="bullet1545-custom-meta-box">'.$bullet1545_custom_meta.'</textarea>';

}

This will provide you a textarea in your post edit page.

Frontend

Now in your page.php, you could use that code :

<?php 

$myBullets = get_post_meta(get_the_ID(), "_bullet1545_custom_meta", true); // retrieve the content of your metabox

echo '<ul>';
$textareaData = '<li>'.str_replace(array("\r","\n\n","\n"),array('',"\n","</li>\n<li>"),trim($myBullets,"\n\r")).'</li>'; // this line converts all the lines that are inside your textarea in li lines, removing empty lines
echo '</ul>';

?>

I hope that it is as clear as possible. With this solution, you don't have to maintain a plugin as well and the website owner won't have to use li tags.

This is fairly straightforward by enabling editor styles. It adds a styles dropdown to the editor which lets you easily add class names to specific elements.

Add the following to your functions.php:

// pushes the style select dropdown into the list of
// TinyMCE controls on the 2nd line of the toolbar
add_filter( 'mce_buttons_2', 'custom_mce_buttons_2' );
function custom_mce_buttons_2( $buttons ) {
    array_unshift( $buttons, 'styleselect' );
    return $buttons;
}

// this adds items to the styles dropdown we just added.
// The options in the array control how it works, you can
// add styles that wrap content in a block or inline element
// with a specific class, you target specific elements only
// and more
add_filter( 'tiny_mce_before_init', 'custom_mce_before_init' );
function custom_mce_before_init( $settings ) {

    // array of items for styleselect dropdown
    $style_formats = array(
        array(
        'title' => 'Bulleted list',
        'selector' => 'ul',
        'classes' => 'alignright big-bulletted-list'
        )
    );

    $settings['style_formats'] = json_encode( $style_formats );

    return $settings;
}

Full tutorial here: http://alisothegeek.com/2011/05/tinymce-styles-dropdown-wordpress-visual-editor/

In order for the client to see the changes this makes you can add an editor stylesheet. Again in your functions.php use:

add_editor_style('editor.css');

In that editor.css you could then add appropriate styles eg.

.alignright { float: right; }
.big-bulleted-list { padding: 20px; list-style: none; }
.big-bulleted-list li { padding-left: 20px; background: url(bullet.png) no-repeat left center; }

Codex page on editor styles is here: http://codex.wordpress.org/Editor_Style

You can wrap your bullet lists using a div in text editor and then style the div accordingly. No need to create meta boxes or shortcodes. For example:

<div class="blright">
  <ul>
    <li>List Item 1</li>
    <li>List Item 1</li>
    <li>List Item 1</li>
    <li>List Item 1</li>
    <li>List Item 1</li>
  </ul>
</div>

Then simply style the class accordingly. In our example, something like this will float the lists right to the text.

.blright {
  float:right;
  width:auto;
  max-width:30%;
}
.blright ul {
  width: 100%;
  display:block;
  list-style: none;
}
.blright ul li{
  list-style: disc outside url("images/li.png");
}

JSFIDDLE
http://jsfiddle.net/rCaCw/2/