Jump to content

Video Tutorial Layout


phpSensei

Recommended Posts

Okay this is not a website I am launching or anything, I am in the process of making a php video on how to make a blog, and then I am going to sell it. I have plenty of other videos sold, but I would just like to know if this simple layout is okay for the tutorial.

 

This is a simple design made for the purpose of the video tutorial, its not ment to be super awsome, but do you think its okay for a tutorial? Consider it a Sample Layout

 

 

Copy paste this HTML code to this website http://www.jmarshall.com/easy/html/testbed.html and click Display

 

<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #E5E5E5;
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
color: #1D373F;
}
.style2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
.style3 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.style5 {font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
-->
</style><table width="56%" border="0" align="center" cellspacing="1" bgcolor="#FFFFFF">
  <tr>
    <td height="40" colspan="2"><table width="100%" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="70%" class="style5"> November 7th, 2008 5:40 PM </td>
        <td width="30%" align="left"><table width="95%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="63%"><label>
              <input type="text" name="textfield" />
            </label></td>
            <td width="37%" align="center" class="style2">Search</td>
          </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td height="130" colspan="2" bgcolor="#f8f8f8"><img src="images/logo.jpg" width="196" height="130" /></td>
  </tr>
  
  <tr>
    <td width="71%" height="833" align="center" valign="top"><br />
      <table width="98%" border="0" align="center" cellspacing="1">
      <tr>
        <td align="left"><span class="style1">Latest Post </span></td>
      </tr>
      <tr>
        <td align="left"><p class="style2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus euismod   tellus ac nisi. Ut consequat laoreet nulla. In urna turpis, porttitor ac, porta   et, iaculis eget, nunc. Integer tincidunt tincidunt nisl. Curabitur eget erat id   elit commodo feugiat. Vestibulum ante ipsum primis in faucibus orci luctus et   ultrices posuere cubilia Curae; Phasellus pretium, nibh id euismod feugiat, elit   lacus dignissim dolor, a dignissim mauris nisi a erat. In bibendum, quam sed   scelerisque facilisis, nunc odio gravida erat, sit amet fringilla ante elit eu   sem. Nullam vitae orci ac diam commodo bibendum. Pellentesque lectus quam,   bibendum pharetra, dictum quis, convallis in, quam.</p>
          <p class="style2">Aliquam mattis, leo at hendrerit cursus, nunc velit rutrum nisi, at consequat   risus tortor vulputate justo. Pellentesque tristique egestas massa. Sed ipsum.   Nullam malesuada eros sed urna. Pellentesque molestie, nulla et ornare   dignissim, lacus nulla vehicula metus, at consectetuer sapien ante in ligula.   Sed eu erat. Nullam velit dolor, ultrices nec, pretium eu, fringilla non, pede.   Praesent eu ligula quis nisl tincidunt vulputate. Nam facilisis malesuada pede.   Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac   turpis egestas. Sed quis ligula eget tellus vestibulum hendrerit. Duis nibh.   Suspendisse velit. Curabitur eu lorem. Duis magna metus, vestibulum nec, lacinia   nec, egestas eu, risus. Duis turpis.</p></td>
      </tr>
      <tr>
        <td align="left"> </td>
      </tr>
      <tr>
        <td align="left" class="style3"><strong>Posted by:</strong> Admin In Videos 4 Fun </td>
      </tr>
      <tr>
        <td align="left"><span class="style5">Tags:</span> <span class="style3">Funny, Video, Lols </span></td>
      </tr>
    </table>
      <br />
      <table width="98%" border="0" align="center" cellspacing="1">
        <tr>
          <td align="left"><span class="style1">Lorem Ipsum Door </span></td>
        </tr>
        <tr>
          <td align="left"><p class="style2">Aliquam malesuada lacinia lacus. Sed dignissim, odio vitae vehicula posuere,   lacus diam rhoncus neque, id adipiscing tortor massa non velit. Maecenas leo   lacus, pretium vitae, facilisis et, placerat tempor, purus. Morbi interdum.   Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos   himenaeos. Cras non leo. Ut tristique, erat nec semper accumsan, libero purus   facilisis ipsum, a rutrum ipsum felis ac purus. Donec tortor. Phasellus nulla.   Nullam tempus.</p>
          </td>
        </tr>
        <tr>
          <td align="left"> </td>
        </tr>
        <tr>
          <td align="left"><span class="style3"><strong>Posted by:</strong> Admin In Videos 4 Fun </span></td>
        </tr>
        <tr>
          <td align="left"><span class="style5">Tags:</span> <span class="style3">Funny, Video, Lols </span></td>
        </tr>
      </table>
      <br />
       <table width="98%" border="0" cellpadding="0" cellspacing="0" bgcolor="#E5E5E5">
        <tr>
          <td height="23" align="left" bgcolor="#BCD8E0" class="style2"> Page: <strong>1</strong> 2 3 </td>
        </tr>
      </table></td>
    <td width="29%" valign="top"><br />
      <table width="93%" border="0" align="center" cellspacing="1">
      <tr>
        <td height="40" align="left" class="style1">Categories</td>
      </tr>
      <tr>
        <td align="left" class="style2">   • Games </td>
      </tr>
      <tr>
        <td align="left" class="style2">   • Videos </td>
      </tr>
      <tr>
        <td align="left" class="style2">   • News </td>
      </tr>
    </table>
      <table width="93%" border="0" align="center" cellspacing="1">
        <tr>
          <td height="40" align="left" class="style1">Recent Posts </td>
        </tr>
        <tr>
          <td align="left" class="style2">   Post 1 </td>
        </tr>
        <tr>
          <td align="left" class="style2">   Post 2 </td>
        </tr>
        <tr>
          <td align="left" class="style2">   Post 3 </td>
        </tr>
      </table>
      <table width="93%" border="0" align="center" cellspacing="1">
        <tr>
          <td height="40" align="left" class="style1">Archives</td>
        </tr>
        <tr>
          <td align="left" class="style2">   November 2008 </td>
        </tr>
        <tr>
          <td align="left" class="style2">   October 2008 </td>
        </tr>
        <tr>
          <td align="left" class="style2">   Juin 2007 </td>
        </tr>
      </table>
      <table width="93%" border="0" align="center" cellspacing="1">
        <tr>
          <td height="40" align="left" class="style1">Calender</td>
        </tr>
        <tr>
          <td align="center"><table width="100%" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td height="20" colspan="7" align="center" class="style2">September 2008 </td>
              </tr>
              <tr>
                <td width="13%" height="20" align="center" class="style2">M</td>
                <td width="13%" align="center" class="style2">T</td>
                <td width="13%" align="center" class="style2">W</td>
                <td width="13%" align="center" class="style2">T</td>
                <td width="13%" align="center" class="style2">F</td>
                <td width="13%" align="center" class="style2">S</td>
                <td width="13%" align="center" class="style2">S</td>
              </tr>
              <tr>
                <td align="center" class="style2">1</td>
                <td align="center" class="style2">2</td>
                <td align="center" class="style2">3</td>
                <td align="center" class="style2">4</td>
                <td align="center" class="style2">5</td>
                <td align="center" class="style2">6</td>
                <td align="center" class="style2">7</td>
              </tr>
              <tr>
                <td align="center" class="style2">8</td>
                <td align="center" class="style2">9</td>
                <td align="center" class="style2">10</td>
                <td align="center" class="style2">11</td>
                <td align="center" class="style2">12</td>
                <td align="center" class="style2">13</td>
                <td align="center" class="style2">14</td>
              </tr>
              <tr>
                <td align="center" class="style2">15</td>
                <td align="center" class="style2">16</td>
                <td align="center" class="style2">17</td>
                <td align="center" class="style2">18</td>
                <td align="center" class="style2">19</td>
                <td align="center" class="style2">20</td>
                <td align="center" class="style2">21</td>
              </tr>
              <tr>
                <td align="center" class="style2">22</td>
                <td align="center" class="style2">23</td>
                <td align="center" class="style2">24</td>
                <td align="center" class="style2">25</td>
                <td align="center" class="style2">26</td>
                <td align="center" class="style2">27</td>
                <td align="center" class="style2">28</td>
              </tr>
              <tr>
                <td align="center" class="style2">29</td>
                <td align="center" class="style2">30</td>
                <td align="center" class="style2">31</td>
                <td align="center" class="style2"> </td>
                <td align="center" class="style2"> </td>
                <td align="center" class="style2"> </td>
                <td align="center" class="style2"> </td>
              </tr>
              <tr>
                <td height="25" colspan="7" align="left" class="style2"><strong><< Aug </strong></td>
              </tr>
          </table></td>
        </tr>
      </table></td>
  </tr>
</table>

Link to comment
Share on other sites

Bland is my first thought. Way too simple!

 

The header image is broken by the way - do you not have a proper URL you can give us?

 

He didn't want it complex, it's a tutorial, I assume for beginners.  The URL is fine it's just the image that's broken, no big deal. 

 

This is a simple design made for the purpose of the video tutorial, its not ment to be super awsome, but do you think its okay for a tutorial? Consider it a Sample Layout

 

I think it's fine because in this case you're only teaching them how to create a blog with some basic CSS.

Link to comment
Share on other sites

Bland is my first thought. Way too simple!

 

The header image is broken by the way - do you not have a proper URL you can give us?

 

A

 

Simple is what I am aiming for, the coding is what I am concentrating on though, its simply for the purpose of learning and the tutorial.

 

sorry though lol, I'm way to lazy to upload a file to my FTP. WampServer FTW!

Link to comment
Share on other sites

Fair dos!

 

And I appreciate that you're trying to keep it simple, just I personally think it's too simple; it's not achieving the 'effective simplicity' look! Wouldn't take much though.. a couple of nice soft colors here and there to highlight key areas, get the logo up, etc. Probably look better when the content is finished as well..

 

Apologies if you thought I was being a lil' harsh..

 

A

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.