Jump to content

What should I use to replace frames?


FreeBenzine

Recommended Posts

Hello,

I am new to web design. I'm using DreamWeaver and initially I used frames. The simple reason was that I wanted to keep the right column of my webpages separate from the rest of the webpages so that if needed i could change that column easily. As using a frame is really out-of-fashion what should I use? Should I use some server-side scripts to generate the right column of the web pages. Should it with php? Any tips will be highly appreciated.

Cheers,

Tim

Link to comment
Share on other sites

You could do something like this:

 

<html>
<head>
  <title>My Website</title>
</head>
<body>
  <table width="100%" border="0" cellpadding="2" cellspacing="3">
     <tr>
        <td id="sidebar">
           <a href="?go=home">Home</a><br /><br />
           <a href="?go=page-1">Page 1</a><br />
           <a href="?go=page-2">Page 2</a><br />
           <a href="?go=page-3">Page 3</a><br />
        </td>
        <td id="content">
        <?php
        $default = "content/home.php";
        if (isset($_GET['go'])) {
           switch ($_GET['go']) {
              case "page-1": include("content/page1.php"); break;
              case "page-2": include("content/page2.php"); break;
              case "page-3": include("content/page3.php"); break;
              default: include($default);
           }
        } else { include($default); }
        ?>
        </td>
     </tr>
  </table>
</body>
</html>

  • Like 1
Link to comment
Share on other sites

What alternative is there to tables?

 

Floating Divs? I prefer to use tables as they work in almost every browser.

 

I have a lot of issues with floating divs, i'd switch to them however if Internet explorer was never invented.

 

however..

 

<html>
<head>
  <title>My Website</title>
  <style type="text/css">
     .center, body, #container {
        text-align: left;
        margin-left: auto;
        margin-right: auto;
     }
     #container {
        width: 900px;
     }
     #sidebar {
        float: left;
        width: 150px;
     }
     #content {
        float: right;
        width: 750px;
     }

  </style>
</head>
<body>
  <div id="sidebar">
     <a href="?go=home">Home</a><br /><br />
     <a href="?go=page-1">Page 1</a><br />
     <a href="?go=page-2">Page 2</a><br />
     <a href="?go=page-3">Page 3</a><br />
  </div>
  <div id="content">
  <?php
  $default = "content/home.php";
  if (isset($_GET['go'])) {
     switch ($_GET['go']) {
        case "page-1": include("content/page1.php"); break;
        case "page-2": include("content/page2.php"); break;
        case "page-3": include("content/page3.php"); break;
        default: include($default);
     }
  } else { include($default); }
  ?>
  </div>
</body>
</html>

Link to comment
Share on other sites

Tables are meant for tabular data. Divs will give you equal or better results than tables. Positioning is an issue within tables whereas divs you can have more control of the layout/design. You can't position a cell to overlap another cell.

 

Using nested tables will cause slower download (even a second is important)

 

Tables can hurt SEO typically because the left nav gets viewed before the content. Of course there are ways to overcome that with a bit of creative layout with the cells but then you will have more html code than you need.

 

Screen Readers. If you don't lay it precisely, visually impaired people will have difficutly with navigating around the site.

 

There are many other reasons. Just google 'why I should not use tables'

Link to comment
Share on other sites

I have a lot of issues with floating divs, i'd switch to them however if Internet explorer was never invented.

If you force yourself to use tables for a little bit and figure out the positioning, it does get a lot easier as you gain experience. I actually find divs easier to work with than tables, especially for more complicated layouts.

Link to comment
Share on other sites

Thanks a lot everyone who contributed, but sadly I could not solve my problem - due to my ignorance.

let me repeat my problem. I have three columns - each column for one html page and I used before frames. Now I want to get rid of frames and I understood that I can use php includes to do the job. Still it is not clear to me how can I combine the three html files using the php includes.

Cheers, Tim

Link to comment
Share on other sites

...The simple reason was that I wanted to keep the right column of my webpages separate from the rest of the webpages...

 

If it's just to keep the right column separate then you can use normal <div> elements. But make the <div> of your right column have "position:fixed" css attribute. Then it will stick on the side of the page even though you scroll the main body. Easiest example would be the bottom panel on facebook which sticks to the bottom of the browser as you scroll, which effectively keeps it "separate". If you want more info then just google "position fixed" and you will get some articles, and also how to trick Internet Explorer 6 (because it doesn't know what position:fixed is :rolleyes: )

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  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.

Loading...
×
×
  • Create New...