Really customized themes I've been toying around with Drupal 7 for a couple of weeks now, and I think I understand how the theming system works, but I have a question.

I'm looking at Zen's default theme right now, and I understand that you're supposed to tweak the CSS files in the starterkit to begin building a more substantial sub-theme, but what if I wanted to change the layout of the page altogether?

Currently the Zen theme has the regions laid out something like this (please pardon the massively crude drawing, I just wanted to illustrate something):



And if I wanted it to be laid out like this instead:



Which of the theme files am I supposed to edit/hack? I'm assuming it's either page.tpl.php or html.tpl.php. Or is this something that's supposed to be done with CSS?
Like Countzero said, regions is the Drupal way. If we have a look at the seven.info file of the Drupal theme Seven:

regions[content] = Content
regions[help] = Help
regions[page_top] = Page top
regions[page_bottom] = Page bottom
regions[sidebar_first] = First sidebar
regions_hidden[] = sidebar_first


You could simply add your banner here.

regions[content] = Content
regions[banner] = Banner
regions[help] = Help
regions[page_top] = Page top
regions[page_bottom] = Page bottom
regions[sidebar_first] = First sidebar
regions_hidden[] = sidebar_first


page.tpl.php would be the best place to print your banner, again we have a look at the Seven theme.

&lt;div id="branding" class="clearfix"&gt;
  &lt;?php print $breadcrumb; ?&gt;
  &lt;?php print render($title_prefix); ?&gt;
  &lt;?php if ($title): ?&gt;
    &lt;h1 class="page-title"&gt;&lt;?php print $title; ?&gt;&lt;/h1&gt;
  &lt;?php endif; ?&gt;
  &lt;?php print render($title_suffix); ?&gt;
  &lt;?php print render($primary_local_tasks); ?&gt;
&lt;/div&gt;

&lt;!-- Print our custom banner region! --&gt;
&lt;!-- START {{{ --&gt;
&lt;?php if ($page['banner']): ?&gt;
  &lt;div id="my-awesome-banner"&gt;&lt;?php echo $page['banner']; /* echo is faster then print */ ?&gt;&lt;/div&gt;
&lt;?php endif; ?&gt;
&lt;!-- }}} END --&gt;

&lt;div id="page"&gt;
  &lt;?php if ($secondary_local_tasks): ?&gt;
    &lt;div class="tabs-secondary clearfix"&gt;&lt;ul class="tabs secondary"&gt;&lt;?php print render($secondary_local_tasks); ?&gt;&lt;/ul&gt;&lt;/div&gt;
  &lt;?php endif; ?&gt;

  &lt;div id="content" class="clearfix"&gt;
    &lt;div class="element-invisible"&gt;&lt;a id="main-content"&gt;&lt;/a&gt;&lt;/div&gt;
    &lt;?php if ($messages): ?&gt;
      &lt;div id="console" class="clearfix"&gt;&lt;?php print $messages; ?&gt;&lt;/div&gt;
    &lt;?php endif; ?&gt;
    &lt;?php if ($page['help']): ?&gt;
      &lt;div id="help"&gt;
        &lt;?php print render($page['help']); ?&gt;
      &lt;/div&gt;
    &lt;?php endif; ?&gt;
    &lt;?php if ($action_links): ?&gt;&lt;ul class="action-links"&gt;&lt;?php print render($action_links); ?&gt;&lt;/ul&gt;&lt;?php endif; ?&gt;
    &lt;?php print render($page['content']); ?&gt;
  &lt;/div&gt;

  &lt;div id="footer"&gt;
    &lt;?php print $feed_icons; ?&gt;
  &lt;/div&gt;

&lt;/div&gt;


Hope this helps. Of course this is absolutely basic stuff and should only help you getting started.