Framed Websites

Websites using frames are generally thought to be incompatible with search engines for two main reasons:

1) Search engines historically had problems indexing framed sites;

This is now not usually the case and it can also be helped by the use of <noscript> tags, which can include links to other pages on the site and to a site map, which the SE's then index.

2) Orphaned pages;

When a user follows a link from a SE he will be taken to the page in question, without the other frames that include navigation etc. This is the biggest stumbling block to getting extra useful traffic to framed sites from SE's. The users don't see the site navigation and therefore don't get to see any more of the site.

All is not lost though if you really must use frames, and a technique known as "Self Referencing Framesets" overcomes both of these problems.

In essence it uses JavaScript to load the full frameset if a page is loaded without it. All it takes is a small amount of code and a change to the <Base Target> tag.

For an excellent tutorial on this see www.silverdisc.co.uk/articles/srf/

 




Bug Report
Fri, 07 Sep 2007 12:00:00 +0100
  • Multi-Column Ordered List Renumbering 

    If you style an ordered list that contains links with the experimental -moz-column-count the list items of the last columns will be renumbered when a link in that column is clicked.

  • Backgrounds show through in invisible tables 

    Background colors given to <col>, <tr>, and <tbody> on a table that is supposed to be invisible (visibility: hidden) still show up. Backgrounds given to individual cells or to elements inside cells are not shown (like expected).

  • Buttons with an image don&#39;t align with text ones 

    Sometimes you might want to mix text buttons with image buttons and insist on using the button tag. However, Firefox aligns the text buttons lower then the image buttons.

  • Absolute/Fixed elements align with Adjacent elements 

    I have a fixed div that is supposed to reside on the left side of the page and remain static using fixed positioning. There is another div adjacent to it that has a margin property that ensures it remains shifted to the right of my fixed element.

    This looks fine in Firefox and Opera, but in IE7 the fixed element seems to 'inherit' somehow the margin of the adjacent element and positions itself relative to it, so that they share the same left margin. Any repositioning of the fixed element is relative to its adjacent node. This also happens if the node is adjacent.

    Consider two adjacent divs: one with id "floater" and its adjacent sibling with id "bodyContent"

    /* The fixed element is supposed to appear on the left */ #floater { position: fixed; background: yellow; } /* The right side (via margin) appears 280px to the right */ #bodyContent{ background-color: #ffeeb4; width: 100px; sposition: absolute; margin-left: 280px; }
  • IE7 Uncle Double Class Selector Bug 

    Creating a [.class|*|element] + element selector rule will cause IE7 to apply .class1.class2 element or .class1.class2 > element as though it was also a .class1.class2 + element:first-of-type; assuming the final element getting selected in all the above rules are the same element type.

  • IE incorrectly handles &lt;param&gt; tags when scripting 

    When scripting an object tag for the param tags, IE reports all param tags of all object tags as children of all object tags.

  • IE will not submit unless file field is correctly specified 

    When a file upload field has an incorrectly specified file, browsers respond in different ways.

    IE solves the problem by preventing form submission.
    This approach is reasonably sensible, however it would be much better if IE popped up a warning dialog saying "File not found".

    Firefox takes a totally different approach; it lets the server sort out an appropriate response.
    It means I have to code the server for this use case (good practice anyhow) and I can put up my own warning messages.

    In summary, the Firefox approach needs a bit more coding but gives me complete control over the page. IE means well, but leaves my users confused and unable to leave the page.

  • MSIE7 fieldset bug 

    There is a div element with float:left inside a fieldset. The fieldset has "border:1px solid #64461A;".

    Inside the fieldset is <em> element. When <em> tag is removed, there is no more border bug.

    Workaround: remove em tags when using float items inside the fieldset.

    (ppknote: this bug does not occur in IE6.)

  • Opera img max-width bug Opera honors max-width for images, but still uses the un-resized image width to stretch a table column.
  • IE7 with haslayout and cursor text problem This problem appears only in IE7, move your cursor to the #container1 filed (the red rectangle), it turns in to a text shape. Remove the hasLayout trigger(zoom:1 here) makes it return to normal arrow shape(the blue rectangle). This does not affect my IE6 and IE5. A single cursor:default; would be a cure, but it also changes the text cursor on normal text.
  • duplicate ID dom damage Sometimes it is useful to switch two DOM objects with each other, and to reassign their ID's to make the process transparent. But in Safari and Safari alone, assigning an ID which already is being used does something bad. One of the objects can no longer be retrieved via document.getElementById, ever.
  • alphaimageloader filter shows backgrounds on zoom using ie7 Images using the AlpaImageLoader filter as a workaround to provide png transparency in ie6, work ok in ie7 unless the page is zoomed in or out.

    On zooming, some or all of the images' backgrounds become apparent.

    A possible workaround is to hide the alphaimageloader from ie7 as transparent images placed using css render/zoom ok.
  • overflow: auto with floats in Firefox 

    When an element containing floats has overflow: auto, it is allowed to get focus. This can affect layout and cause problems with tabbing.

  • Built-in functions are not objects Built-in functions in Safari are not Function objects, and not even Object objects. They appear to be of type "function" instead of type "object". This makes it impossible to use .call() and .apply() on them.
  • IE7:hover ghosts bug 

    If you nest several elements inside each other and you tie the display of child elements to the :hover of the parent element, it can happen that after a first, correct display of the nested elements, these elements will stay displayed in IE7 even if the element directly above them does not have :hover! (And if simultaneously an indirect-parent element does have it.)