Bruceee's Sandpit
Web Design with SiteSpinner
Web Design with SiteSpinner
home
home
home
site map
site map
site map
Marquee Selection
A marquee is a box you draw around one or more objects on your workpage. Hold the left mouse button and drag with the mouse. Make sure you fully enclose the objects within the box. This will work even on objects hidden behind others, and even when the object is invisible. Add another object to the selection by holding down the CTRL key and clicking on the the new object.
You can marquee a group of objects and SiteSpinner will make them all a selection (temporary group), which you can then copy, or make into a permanent group. The button for this is on the bottom toolbar.
A marquee is a box you draw around one or more objects on your workpage. Hold the left mouse button and drag with the mouse. Make sure you fully enclose the objects within the box. This will work even on objects hidden behind others, and even when the object is invisible. Add another object to the selection by holding down the CTRL key and clicking on the the new object.
You can marquee a group of objects and SiteSpinner will make them all a selection (temporary group), which you can then copy, or make into a permanent group. The button for this is on the bottom toolbar.
Glossary
Here are some terms I have used on this site without always explaining exactly what they mean.
Anti-alias(ing)
If you look at diagonal lines on your screen, you may see that they look jaggy -- not completely smooth. This is a built-in result of how the lines are rendered (drawn) on screen -- one bit at a time. If you draw a diagonal line on graph paper by either filling in the squares completely, or leaving them completely empty, you will see a similar effect.
Anti-aliasing is the process of filling in along jaggy edges with shades that are midway between foreground and background colors. This gives a smoother looking line but also makes it more blurry. You can even anti-alias horizontal and vertical lines -- the effect then is just to make them more blurry.
In order for anti-aliasing to be really successful, you have to anti-alias against a background that matches your final background. If you anti-alias against a white background, then use the same image against a colored background, you will see a white halo effect.
Anti-aliasing done successfully, always results in an image file.
Modern computers anti-alias all text drawn on screen -- and they do a good job. For this reason a title made as a Text object can look sharper than one made as a Title object with anti-alias on. (The implication here is that sometimes SiteSpinner does not do as good a job of anti-aliasing as it might.)
If you look at diagonal lines on your screen, you may see that they look jaggy -- not completely smooth. This is a built-in result of how the lines are rendered (drawn) on screen -- one bit at a time. If you draw a diagonal line on graph paper by either filling in the squares completely, or leaving them completely empty, you will see a similar effect.
Anti-aliasing is the process of filling in along jaggy edges with shades that are midway between foreground and background colors. This gives a smoother looking line but also makes it more blurry. You can even anti-alias horizontal and vertical lines -- the effect then is just to make them more blurry.
In order for anti-aliasing to be really successful, you have to anti-alias against a background that matches your final background. If you anti-alias against a white background, then use the same image against a colored background, you will see a white halo effect.
Anti-aliasing done successfully, always results in an image file.
Modern computers anti-alias all text drawn on screen -- and they do a good job. For this reason a title made as a Text object can look sharper than one made as a Title object with anti-alias on. (The implication here is that sometimes SiteSpinner does not do as good a job of anti-aliasing as it might.)
Big four (browsers)
The four most popular browsers are Internet Explorer, Mozilla Firefox, Netscape and Opera (in about that order). If your pages look good in those four browsers, you have more than 95% of your viewers covered. I test with only recent versions of each browser.
IE is by far the most prevalent browser -- the big ONE. Need I say, it is essential that your pages look good in that. That means you must hold your nose and test with it.
The four most popular browsers are Internet Explorer, Mozilla Firefox, Netscape and Opera (in about that order). If your pages look good in those four browsers, you have more than 95% of your viewers covered. I test with only recent versions of each browser.
IE is by far the most prevalent browser -- the big ONE. Need I say, it is essential that your pages look good in that. That means you must hold your nose and test with it.
Case sensitive
File names can be sensitive to whether they are capitalized or not. Upper or lower case.
On some servers, a file called 'MyImage.jpg' can be different to 'Myimage.jpg'. This is because the server is running under Unix, a different operating system to the Windows on your home computer.
Because Windows is not case sensitive, your project may preview beautifully. However when you upload to your server you may find a broken link. The link may point to a file 'MyImage.jpg', but the file on your server may really be 'Myimage.jpg' -- an entirely different animal when it is on the server.
File names can be sensitive to whether they are capitalized or not. Upper or lower case.
On some servers, a file called 'MyImage.jpg' can be different to 'Myimage.jpg'. This is because the server is running under Unix, a different operating system to the Windows on your home computer.
Because Windows is not case sensitive, your project may preview beautifully. However when you upload to your server you may find a broken link. The link may point to a file 'MyImage.jpg', but the file on your server may really be 'Myimage.jpg' -- an entirely different animal when it is on the server.
Code
When referring to web pages, 'code' usually means HTML (Hyper-Text Markup Language -- special text that tells the browser what to put on the page.) When you preview or publish your project, SiteSpinner creates all the HTML code needed.
You can have other code in your pages too, most notably Javascript.
When referring to web pages, 'code' usually means HTML (Hyper-Text Markup Language -- special text that tells the browser what to put on the page.) When you preview or publish your project, SiteSpinner creates all the HTML code needed.
You can have other code in your pages too, most notably Javascript.
CSS (Cascading Style Sheets)
CSS is a way of separating the formatting and positioning of objects on your page from the content. In practical terms for SiteSpinner, it controls the position of objects on your finished page, and very accurately too -- to the exact pixel. In the old days people used tables to control positioning, but with SiteSpinner and CSS most of that is no longer needed.
CSS gives you good control over visual aspects of your pages -- things like fonts and spacing -- and a whole lot more.
CSS is a way of separating the formatting and positioning of objects on your page from the content. In practical terms for SiteSpinner, it controls the position of objects on your finished page, and very accurately too -- to the exact pixel. In the old days people used tables to control positioning, but with SiteSpinner and CSS most of that is no longer needed.
CSS gives you good control over visual aspects of your pages -- things like fonts and spacing -- and a whole lot more.
Default
The default setting is the initial setting of some control. You can change it if you want, but you don't have to. e.g. Drop a rectangle on your workpage and its default setting is 100 pixels wide x 100 high. Often you will change this setting.
The default background color of your pages is solid white. Often you will not change this setting.
The default setting is the initial setting of some control. You can change it if you want, but you don't have to. e.g. Drop a rectangle on your workpage and its default setting is 100 pixels wide x 100 high. Often you will change this setting.
The default background color of your pages is solid white. Often you will not change this setting.
Hi-Render
Hi Render controls how the objects are displayed on your workpage (= high resolution). The only reason to turn it off is if your workpages update slowly. The downside is that your workpage view may then deviate from what you see when you publish. One-pixel lines may not display. This setting does not affect the published pages.
Set Hi-Render from the Quick Editor > Object tab or the Main Menu > Options.
Hi Render controls how the objects are displayed on your workpage (= high resolution). The only reason to turn it off is if your workpages update slowly. The downside is that your workpage view may then deviate from what you see when you publish. One-pixel lines may not display. This setting does not affect the published pages.
Set Hi-Render from the Quick Editor > Object tab or the Main Menu > Options.
Re-Render
Render=draw on screen. All objects when displayed on screen are rendered or drawn.
When SiteSpinner re-renders an object, it usually modifies the object in some way, then re-draws the image on screen. The practical effect of this is that re-rendering an object always creates an image file, which will then form part of your web-page.
Put re-render off if you don't want SiteSpinner to create an image file. Sometimes this will have no effect -- if SiteSpinner can't do what you want without an image file, it will create one anyway.
If you make a permanent group of a group of objects, you may want to put re-render on in order to create a fresh composite image. Often this composite will be smaller than the sum of all the individual images -- so will load more quickly.
Render=draw on screen. All objects when displayed on screen are rendered or drawn.
When SiteSpinner re-renders an object, it usually modifies the object in some way, then re-draws the image on screen. The practical effect of this is that re-rendering an object always creates an image file, which will then form part of your web-page.
Put re-render off if you don't want SiteSpinner to create an image file. Sometimes this will have no effect -- if SiteSpinner can't do what you want without an image file, it will create one anyway.
If you make a permanent group of a group of objects, you may want to put re-render on in order to create a fresh composite image. Often this composite will be smaller than the sum of all the individual images -- so will load more quickly.
Target
When you are displaying a page inside an i-frame, the target is the i-frame where the page is to be displayed. The name of the target is the geometry name of the i-frame. You can change the geometry name to make it easier to remember. See i-frames.
When you are displaying a page inside an i-frame, the target is the i-frame where the page is to be displayed. The name of the target is the geometry name of the i-frame. You can change the geometry name to make it easier to remember. See i-frames.
URL (Uniform Resource Locator)
A way of uniquely identifying anything on the Internet, be it file, image, or web page. Because it is unique, by definition, no two items can have the same URL.
The URL can be full or relative. In SiteSpinner you can enter just page names into the URL field of a link -- the assumption then is that the rest of the URL is the same as that of the page with the link. So a page link is relative to the current page.
A way of uniquely identifying anything on the Internet, be it file, image, or web page. Because it is unique, by definition, no two items can have the same URL.
The URL can be full or relative. In SiteSpinner you can enter just page names into the URL field of a link -- the assumption then is that the rest of the URL is the same as that of the page with the link. So a page link is relative to the current page.
WYSIWYG
What You See Is What You Get -- Pronounced whizzy-wig
When you work with SiteSpinner, what you see on your workpage is usually what you get when you preview or publish. Some items, like Code Objects are not WYSIWYG, because they show their action only when you preview or publish your page. When on your workpage, they show in a similar manner to text.
What You See Is What You Get -- Pronounced whizzy-wig
When you work with SiteSpinner, what you see on your workpage is usually what you get when you preview or publish. Some items, like Code Objects are not WYSIWYG, because they show their action only when you preview or publish your page. When on your workpage, they show in a similar manner to text.
CSS Positioning
Sometimes you will have a code object that has no physical representation on your page. In this case, you can set CSS positioning off -- it doesn't need to be positioned. When you are dealing with tables, you may not want CSS positioning either -- you want the table structure to control the position of any objects it contains. Just like the old days <img src='images/wink.gif'>
If you don't need CSS positioning, in particular for code objects, turn it off -- you will save yourself about 200 bytes of code.
Sometimes you will have a code object that has no physical representation on your page. In this case, you can set CSS positioning off -- it doesn't need to be positioned. When you are dealing with tables, you may not want CSS positioning either -- you want the table structure to control the position of any objects it contains. Just like the old days <img src='images/wink.gif'>
If you don't need CSS positioning, in particular for code objects, turn it off -- you will save yourself about 200 bytes of code.
Pixel (px)
A pixel is a little dot on your computer monitor screen. Look very closely and you should be able make them out. A typical browser page might be about 800 across by 600 high. 'Pixel' is often abbreviated to 'px'.
When you design your web page, you will set a design size, typically 800 x 600px to be compatible with your visitors' screen resolution, also expressed the same way.
Each pixel has a color associated with it. These colors are expressed in terms of values of Red, Blue, and Green, the three primary colors which can make up any of the other colors. Often we use three bytes of computer memory to store a pixel, one byte for each color. Each color value can range between 0 (no color) to 255 (full color). So:
A pixel is a little dot on your computer monitor screen. Look very closely and you should be able make them out. A typical browser page might be about 800 across by 600 high. 'Pixel' is often abbreviated to 'px'.
When you design your web page, you will set a design size, typically 800 x 600px to be compatible with your visitors' screen resolution, also expressed the same way.
Each pixel has a color associated with it. These colors are expressed in terms of values of Red, Blue, and Green, the three primary colors which can make up any of the other colors. Often we use three bytes of computer memory to store a pixel, one byte for each color. Each color value can range between 0 (no color) to 255 (full color). So:
- White is R=255, G=255, B=255 (All colors fully on)
- Black is R=0, G=0, B=0 (All colors fully off)
- Red is R=255, G=0, B=0 (Only red fully on, the others off)
