Converting from a WordPress theme I'm converting a WordPress theme. And, yes, I'm following the very good advice listed in a previous question. My question is more granular. So hence, this new question. 

Specifically, I'd like to address the menu creation. Should I use the typical theme() functions to build out Main and Secondary menus? What class names should I pass into that theme function? 

Currently, I've cleaned up the HTML template by extracting all embedded JS and CSS into external files. It appears as 

&lt;div id="navigation" class="ten columns clearfix"&gt;
    &lt;div class="menu-navigation-menu-container"&gt;
        &lt;ul id="nav" class="menu"&gt;
            &lt;li id="menu-item-2691" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-419 current_page_item menu-item-2691"&gt;
                &lt;a title="home" href="new_design_staging.1.html"&gt;home&lt;/a&gt;
            &lt;/li&gt;
            &lt;li id="menu-item-2565" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-2565"&gt;&lt;a href="new_design_staging.1#"&gt;about&lt;/a&gt;
                &lt;ul class="sub-menu"&gt;
                    &lt;li id="menu-item-2571" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2571"&gt;&lt;a href="new_design_staging.1#"&gt;Drop Down 1&lt;/a&gt;&lt;/li&gt;
                    &lt;li id="menu-item-2572" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2572"&gt;&lt;a href="new_design_staging.1#"&gt;Drop Down 2&lt;/a&gt;&lt;/li&gt;
                    &lt;li id="menu-item-2573" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2573"&gt;&lt;a href="new_design_staging.1#"&gt;Drop Down 3&lt;/a&gt;&lt;/li&gt;
                &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li id="menu-item-2566" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2566"&gt;&lt;a href="new_design_staging.1#"&gt;books&lt;/a&gt;&lt;/li&gt;
            &lt;li id="menu-item-2567" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2567"&gt;&lt;a href="new_design_staging.1#"&gt;movies&lt;/a&gt;&lt;/li&gt;
            &lt;li id="menu-item-2568" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2568"&gt;&lt;a href="new_design_staging.1#"&gt;time travel&lt;/a&gt;&lt;/li&gt;
            &lt;li id="menu-item-2569" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2569"&gt;&lt;a href="new_design_staging.1#"&gt;blue box&lt;/a&gt;&lt;/li&gt;
            &lt;li id="menu-item-2570" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2570"&gt;&lt;a href="new_design_staging.1#"&gt;boats&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/div&gt;
&lt;/div&gt;


Or, can I loop over a render variable to produce the &lt;li&gt;, leaving the &lt;div&gt; and  &lt;ul&gt;'s in place? Does this deviate too far from best practice?
Well, here is the code that I've put in place. So far it's respecting the CSS selector patterns that the WordPress theme rendered. 

&lt;div id="navigation" class="ten columns clearfix"&gt;
    &lt;div class="menu-navigation-menu-container"&gt;
       &lt;?php 
       print theme('links__system_main_menu', array(
         'links' =&gt; $main_menu, 
         'attributes' =&gt; array(
           'id' =&gt; 'nav', 
           'class' =&gt; array('menu')), 
         'heading' =&gt; t(''))
       ); 
       ?&gt;
    &lt;/div&gt;
&lt;/div&gt;