After reviewing some published HTML pages, I have seen quite a lot of rectangle objects being used as a framed border for other objects, for groups of objects, or to give a page a layered background look.

In most of these cases, the rectangle is published as an image file. This slows down page loading since an image now has to be unnecessarily displayed.

If your rectangle frame is "square" to the page (i.e., not rotated), then using the Object Editor->Options for that object, you should turn off the Re-render and Anti-alias options. This will cause SiteSpinner to generate pure HTML code to have the browser paint your rectangle. Since there is no image to download, so your page loads faster.

These are very useful things to know about!

A few rules of thumb:

The rectangle must have a flat color or no color.

A border is acceptable but must be one or two pixels.

Where there is a background, Render Background (Geometry Editor > Options tab) must be off. The default condition is off.

If you deviate from these rules e.g., use a wide border or gradient fill, SS and WE will make an image file anyway, ignoring your re-render off setting.

Bonus: It works for rectangles filled with a tiled image too -- the only image required is for the much smaller tile.

Bruce, has the border limitation been reported as a bug? I could not find anything doing a search.

I'm not sure that it has, and I haven't been able to find a reference either. Two years ago with SS V2.50f, I created this page on cheap rectangles, and an example there has a rectangle with a 3-pixel border. So the 2 pixel restriction has arrived more recently.

If you want a rectangle with a thick border, make one using a code or text object -- that still works. As with the rectangle, set the border and shading from the Quick Editor.

Hi Bruce and Larry,

The rendering of rectangles with outlines wider than 2 px as images, is by design. The reason for this is that an outlined div can be appear as different sizes in different browsers. Some (FF, Opera) render the outline outside the rectangle and others (IE5/6) render it half outside, half inside. Now it looks like IE7 renders it completely inside so even 2px border will not be exactly the same. SiteSpinner uses an image to ensure that the everything stays as WYSIWYG as possible by default.

The image does mean an extra call for the file but if you use PNG8 the size of the file won't be very big (e.g. under 140 bytes for a 100x100 rectangle with a 10px outline or 270 bytes for 500x500 with a 10px outline).

Don't forget you can always use an empty code object with an outline and/or shading to create an outlined div if you need one.

Thanks Harpo -- that clears that up. There is a huge difference in the way that Firefox and IE7 handle borders. So there's a very good reason for not allowing cheap (un-rendered) rectangles with thick borders.

Preview a code or text object with a thick border in both IE and Firefox and see the difference yourself.

Lesson for today: if you use code or text objects with thick borders, make sure you test in the browsers that are important to you. At least IE and Firefox.

I wish to insert my blog in a page of my website, I thought that it would be done as if it were an image, in dreamweaver, when I insert an image, there is a panel on the lower half of the pallette, where a URL can be placed, I tried this it does not work, if I knew what to call it I could find it in the directions for dreamweaver, but I cannot think of a word that is listed in the table of contents? HELP?

You may be able to use an i-frame. See Help->Tutorials->I-Frames.

IFRAme doesn't work any more ideas, I tried setting it up to stream with google, then going to the streamed webpage and copying the source, but no source is visible on it, so that doesn't work, still looking for a solution.

I asked Google but who knows when they will answer.

Angi Marek

Can you publish a test page showing what you have so far, and post a link to it?

I still have not discovered how to source the page of my blog and make it appear within my website, so I have linked it, My boss, the owner of the company I design for says it can be done through javascript and that it will have directions on the blogger site, but I have searched and not found them.

Anyway know how to do it please let me know!

If your blog is a regular web page then an i-frame ought to do it (as Larry said). Can you post a link to your blog or a page like your blog?

the blog we are discussing.
http://choriocarcinoma.blogspot.com/

I created an image frame and then sourced the page as an image within that frame, it didn't work?

Angi Marek

In your I-frame where you want the blog to appear you just write http://choriocarcinoma.blogspot.com/ as your Filepath and don't forget to check Use Scroll Bar. That's working.

I opened a new project and clicked the Foreign Object tool. In the Foreign Object/Media window, I made sure the Format I wanted to use was HTML. Then in the Filepath box, I filled in the link to your blog (as posted). I also clicked the "Use Scroll Bar" box since your blog is longer than I want to show on my page.

When I previewed this project, your blog popped up in my i-frame.

Is there something special you are trying to do in addition to just including the blog on another page?

I noticed that the links on your blog are set to open in a new window, so when someone clicks on a link from within the i-frame, it will break out of the i-frame and be shown in a new window or browser tab. This is to be expected.