What tag should be used to make Form layout if we can't use only pure semantic way?

Question

i know it is pure semantic way

<form action="" method="">
        <fieldset>
          <legend>Contact Form</legend>
              <label for="name">Name</label>
              <input name="name" id="name" size="20" />
           </fieldset> 
<form>

But some time for some design purpose it's not sufficient to get needed style. so my question is other than this purely semantic method

isn't this code is also semantic (after pure semantic method) because form is a group of ordered fields which we fill one by one

ol {
  list-style: none; 
  padding-left: 0;
  }


<form action="" method="">
    <fieldset>
      <legend>Contact Form</legend>

      <ol>
        <li>
          <label for="name">Name</label>
          <input name="name" id="name" size="20" />
       </li> 

       <li>
        <label for="email">Email</label>
        <input name="email" id="email" size="20" />
       </li>

      <li>
        <label for=" Choices"> Choices (radio)</label>
          <input type="radio" name=" Choice" /> Choice 1
          <input type="radio" name=" Choice" /> Choice 2
          <input type="radio" name=" Choice" /> Choice 3
      </li>

      <li>    
      <label for=" Choices3"> Choices (checkbox)</label> 
        <input type="checkbox" name=" Choice3" /> Choice 1
        <input type="checkbox" name=" Choice3" /> Choice 2
        <input type="checkbox" name=" Choice3" /> Choice 3
     </li>       

     <li>
      <label for="dropdown">Question</label>

        <select id="dropdown">
          <optgroup label="Group of Options">
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
          </optgroup>
        </select>
      </li>

      <li>  
      <label for="message">Message</label><br />
        <textarea name="message"rows="12" cols="36"></textarea>
      </li>

      <li><input type="submit" value="send it" /></li>

      </ol>

    </fieldset>
  </form>

Answer 1

If the form fields are meant to be completed in a particular order, then yes, I would say an ordered list is semantically meaningful for separating form elements.

Answer 2

If you want to add extra elements to allow more layout styling hooks from CSS, but which have no semantic content in themselves, use <div> (or <span> for inline). That's what they're there for.

Answer 3

You should use a definition list, that way your label / input are linked to one another through the for and id, but also through the definition title (label) and definition description (input).

That way you can do some good styling or hide some stuff if needed.