-- Helping You Get The Most Out of Your Website --
July SiteSpinner WebTips

Hi there,

This is the first issue of our monthly newsletter that some of you may remember as IMS Webtips. As before, we'll be bringing you articles on how to get the most from your website, as well as Reader Questions, Tips supplied by readers from the Virtual Mechanics Community Forums. We'll also showcase a website in 'Site of the Month'.

In this issue:
Design  - Stopping Photo Thieves
You build your website and place your images on your pages. You may have purchased those images, you may have made them yourself, or they may be pictures you have taken. Now that you have published your site to the Internet, what's to stop anyone from simply taking them and using them for their own purposes? The simple answer is that you can't stop someone from taking your images if they really want to - if they can see the image on their computer then there is always a way for someone to take it. Having said that there are a few things you can do to make it a bit more difficult for people to simply right-click with their mouse and save your images.

1) Disabling the MS IE 6 Image Copy Toolbar. Microsoft introduced a rather dubious 'feature' with the release of version 6 of Internet Explorer. Now, any image on a webpage that is over 200 by 200 pixels produces a toolbar - from Microsoft's website: "The Image Toolbar feature in Internet Explorer 6 lets you quickly and easily save, e-mail, and print pictures that you find on Web pages". Now, the main point here is that this 'feature' is for pictures "you find" on the web. I don't know about you, but if I create a website and I post my pictures to it I am not assuming that they are therefore 'lost' and free for the taking.

Fortunately you can disable this 'feature' on your web pages without too much trouble. To do that enter the following Meta Tag in the HEAD section of your web page: <meta http-equiv="imagetoolbar" content="no"> and voila - no toolbar. Keep in mind that you have to do this for each and every one of your pages (if you have SiteSpinner or Web Engine V2 you can set your pages to disable this feature using the Page Editor > Special Effects > and check 'No Image Copy tool bar').

2) Image Layering. Unfortunately disabling the IE tool bar does not prevent people from simply right-clicking and saving your images. So the next step is to try to thwart the 'Save Picture As...' function. While you could turn this feature off with JavaScript, a simpler solutions is to confuse it a bit by making it save the wrong image. One way to do that is to create a transparent image and place it over the picture you want to protect. Then if someone right-clicks to download the image they will get the transparent image and not the picture. If you use a small rectangle you can stretch it to fit over the real image without increasing the download significantly. Swap the names so the transparent images would appear to be the legitimate image if you really want to confuse them.

You may also want to consider 'watermarking' your images, this simply means subtly altering the image to include your name, copyright notice, or whatever. This can also be done with SiteSpinner and WebEngine by writing a Title over the image, making the Title semi-transparent, and then combining both Objects into a Permanent Group.

As mentioned, the only foolproof way to safeguard your images is to not post them to the Internet in the first place. However, with a bit of work you can ensure that they are not simply posted for the taking.

For more ideas, see the ongoing discussion on Discouraging Right-Click Save Image in the Virtual Mechanics Community Forums.
How To - Use Clones for better web page optimization
If you look under the Edit Menu of WebEngine, SiteSpinner or WebDwarf you will see Cut, Copy, Delete. In SiteSpinner and WebEngine you'll also see Past-Copy, Paste-Clone and Include commands. Why are there all these options and which ones should you use?

These options are a powerful capability of the software. With SiteSpinner and WebEngine any Object such as text or an image is composed of several separate parts. In the simplest case an Object may contain a single Geometry component such as a GIF image. In WebEngine, the most complex Object may contain a Geometry component, Shading component, Sound Component, Action Component, and Behavior component. Because each component is defined independently, it is possible for an Object to share some or all of its components with one or more other Objects.

Try this experiment. Create a text Object by selecting the Text Editor and typing "This is geometry component 1". Exit the Text editor and with the text Object still selected open the Shading Editor. Select the Fill Settings tab and adjust the sliders to mix any color you like. Exit the Shading Editor. Your text Object should now be filled with the color you just created.

You can see these components listed in the Object Editor by selecting the Object Editor icon on the bottom tool-bar or pressing Alt+o. Exit the editor by selecting the Cancel button.

Create a second text Object by selecting the Text Editor and typing "This is the second text geometry". Exit the Text Editor and position the second text Object next to the first. The first Object will still be colored but the second will not. Select the second text Object and open the Object Editor. The editor should display the Object's name "Obj2" and list a single component "Geo2" in the geometry window.

The Shading window will display "[no shading]" indicating that this Object does not include a Shading component. Select the drop button (down arrow) of the Shading window and select "shd1". Exit the Object Editor. Both Objects should now be filled with the same color.

It is important to note that the second Object does not include a copy of the same Shading as the first. It 'is' the same Shading component. Selecting the second Object and selecting the Shading Editor again can verify this. Select the Attributes tab and use the sliders to change the color. Exit the dialog by selecting OK. Both Objects will now display the new color since they are both using the same component.

What other components can be shared this way? All of them can. Try changing the Geometry of the first Object in the Object Editor to "Geo2". Both Objects will now display the text string "This is the second text geometry". Now if you change the text of one Object in the text editor, the text in the second Object will also change. In this example now Objects "obj1" and "Obj2" are exact 'Clones' of each other because they are comprised of the same components. In fact they are more than Clones since these Objects are fully interdependent.

This then explains some of the differences in the Edit menu. If you Copy an Object and then 'Paste-Copy' you would get a new Object with new components that appear the same as the original but are not. If you "Paste-Clone" however, you will get a new Object with the same components as the first. Changing a component in a Cloned Object will consequently change it in all the clones.

You can find more on this in SiteSpinner and WebEngine under Help > Tutorials > Objects, Components, Clones
Reader Questions - How to make multiple pages with WebDwarf
Do you have a question about web design or development, or about Virtual Mechanics products that you would like to see answered here? Drop us a note at vminfo@virtualmechanics.com, or simply reply to this newsletter
I am a beginner but have worked out how to create a single page in dwarf. How do i link it to other pages if i want a multi-page site???

- mat

WebDwarf only provides the ability to create a single page in each project. SiteSpinner and WebEngine can create large multi page-projects. You can of course create as many projects as you like to create more than one page using WebDwarf.

The first thing you need to do is assign a unique name to each page. The page toolbar at the top displays the name of the current page. By default this is called "Page1". To change the name simply type a new name into the box. Your home page for example would normally be called "index". When you Publish, it will be transferred as "index.html" which is often the default name for a web site's home page. Enter any other name to create other pages. "AboutMe", "Business", "Support" etc. When you publish these pages will be transferred with the ".html" extension automatically added.

To assign a link to one of these pages, select an Object, select the link dialog and enter the name with the ".html" extension. For example you would enter: "index.html", 'aboutme.htm' etc., to link to those pages on your web site (excluding the 'quotes'). To link to another site, enter the entire URL. For example to link to our site enter: 'http://www.VirtualMechanics.com'.

Community Tips - Getting your Website on Search Engines
These Tips are created by readers and SiteSpinner users and posted to the Virtual Mechanics Community Forums

Radiotechscan writes:

Apart from website-technical-things like metatags, keywords and contents which are things you can learn. You should have as much as possible...
> continue reading...

Site of the Month - Gray's Pottery
Site Title: Gray's Pottery

Site Author: Andrew Clarke for P&K Niblett

Site Link:

Site Description:
The pottery founded by AE Gray in Stoke-on-Trent England in 1907 was an innovative maker of pottery until its closure in 1961 when it was subsumed into Portmeirion. This website is a resource for collectors and those interested in the pottery. It will grow to be a comprehensive resource.

Site Built With:


I love it!

Offers and Promotions - Coming Soon - SiteSpinner Pro
As many of you know WebEngine will be renamed 'SiteSpinner Pro'. The new release will have all the functionality of SiteSpinner and WebEngine, but it will also provide the ability to create sites for Mobile Devices, such as the iPhone, and incorporate the Opera browser for Previewing your desktop and mobile site side-by-side.

There are over three and a half billion mobile phone users in the world, significantly more than all computer users combined. Over 25% of these people access the Internet on their phones.

Buy WebEngine for $99 and you will be able to use the SiteSpinner Pro beta now to build your desktop and mobile-ready websites. You will receive the upgrade free when it is posted.
Registered users of SiteSpinner can upgrade to WebEngine at 50% off the regular price, simply reply to this newsletter and include your SiteSpinner Serial Number (available in SiteSpinner under Help > About).


Don't Forget to Forward This Newsletter To Your Friends!

As always, we welcome your feedback.

J. Peter White
Virtual Mechanics Inc.
< Celebrating 10 years in business - 1998 - 2008! >

Virtual Mechanics Home | On-line Store | Products | Privacy Policy
ISSN 1488-7088. TM & © 1998 - 2008, Virtual Mechanics Inc. All rights reserved.