Untitled

<!DOCTYPE html>

<html>

<head>

<title> Semantic page Design 2 - LinkedIN </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script src="scripts/modernizr.custom.71658.js"></script>


</head>

<body>

<header>

 <h1>LinkedIN</h1>

</header>

<nav>

 <ul>

  <li>

   <a href="#">Home</a>

  </li>

  <li>

   <a href="#">What is LinkedIN? </a>

  </li>

  <li>

   <a href="#">Join today</a>

  </li>

  <li> Sign In

   <form name="signIn" method="post">

    <ul>

     <li>

      <label for="email_ID">Email:</label>

      <input type="email" name="email" id="email_ID" required="required" pattern="[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}"/>

     </li>

     <li>

      <label for="password_ID"> Password </label>

      <input type="password" name="password" id="password_ID" required="required"/>

     </li>

     <li>

      <input type="submit" name="signIn" value="Sign in" disabled="disabled"/>

     </li>

    </ul>

   </form>

  </li>


 </ul>

</nav>

<hr/>

<section>

 <header>

  <h2>Over 175 million professionals use LinkedIn to exchange information, ideas and opportunities </h2>

 </header>

 <article>

  <ul>

   <li>Stay informed about your contacts and industry</li>

   <li>Find the people & knowledge you need to achieve your goals</li>

   <li>Control your professional identity online</li>

  </ul>

 </article>

</section>

<section>

 <header>

  <h3>Join LinkedIn Today</h3>

 </header>

 <form name="join" method="post">

  <fieldset>

   <legend>Sign up

   </legend>

   <ul>

    <li>

     <label for="firstID"> First name</label><br>

     <input type="text" name="firstName" id="firstID"/>

    </li>

    <li>

     <label for="lastID"> Last name</label><br>

     <input type="text" name="lastName" id="lastID"/>

    </li>

    <li>

     <label for="emailID"> E-mail</label><br>

     <input type="email" name="email" id="emailID" pattern="[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}" />

    </li>

    <li>

     <label for="passwordID"> Password : </label><br>

     <input type="password" name="passwordPid" id="passwordID" required="required" pattern="[a-z A-Z 0-9.%+-]{6,}"/>

    </li>

   </ul>

   <div>6 or more characters</div>

   <input type="submit" name="join" value="Join us"/>

   <a href="#">*</a>

   <p>Already a member of LinkedIn?

    <a href="#">Sign in</a>

   </p>

  </fieldset>

 </form>

</section>

<section>

  <form name="search" method="get">

 <h4>Search for someone by name: </h4>

 <ul>

  <li>

  <label for="first">First Name</label>

  <input type="search" name="firstName" id="first" placeholder="First Name"/>

  </li>

  <li>

  <label for="last">Last Name</label>

  <input type="search" name="lastName" id="last" placeholder="Last Name"/>

  </li>

 </ul>

 <input type="submit" value="Go"/>

 </form>

</section>

</body>

</html>