|
Feature Article |
| Browsers
and Platforms, Statistically Speaking! |
| This
month we are sharing some of the
information that is collected by our
website that can be used by just about
everyone creating a website. |
| The
Webstudio.com site doesn't collect the
information everyone talks about that
violates privacy. It collects information
about what pages are viewed most often,
what files are downloaded most (or least),
how many visitors came to the site, how
long they stayed, what interested them
most. |
| In
addition, the site captures information
about what browsers people are using and
what platforms they have. Platforms being
what type of computer and operating system
they have. |
| Why
is this important? |
| At
some point in the life of your website,
you're going to get an email from an
unhappy visitor who couldn't see something
on your site correctly. Perhaps you added
some HTML that their browser couldn't
understand, perhaps you had a Java Applet
on a page and they didn't have Java on
their computer. |
| Before
you run off to spend the time, and money,
to correct the problem, you'll want to
know if it is worth fixing! If only one
person has the problem, maybe it isn't
worth spending the time. If most of your
visitors will have the problem, you'll
want to get right on with the fix! Having
information about what your visitors have
as far as platforms and browsers can help
you make this decision wisely. |
| Platforms |
| Our
site breaks this category up based on the
operating system the visitor was using.
We'll give you the results first and then
add a bit of commentary. |
| Platform |
%
of Hits |
| Windows
XP/2000
Windows 98
Windows ME
Macintosh
PowerPC
Windows NT
Windows 95
Linux
Macintosh
68K
Sun OS
OS/2 |
59.3%
24.2%
11.7%
1.24%
1.1%
0.7%
0.2%
0.1%
0.1%
0.1% |
| Translation |
| As
you can see, Windows is the clear winner
here...but Bill Gates' wealth indicated
that long ago! What is interesting is that
Windows 95 is such a small percentage of
the platforms. There are more people
coming to the site with Macintosh PowerPCs
than Windows 95!
Another
interesting thing is the number of people
who have moved to Windows XP, fully 60%.
The Windows 98/ME people are only
numbering about 35%.
The main
piece of data is that Windows based
computers are being used about 95% of the
time!
Oh, and
then there are the others: Linux, Sun and
OS/2. Clearly these are not platforms that
you should spend much time on.
|
| Browsers
|
| The
Browsers category indicates the browser
the visitors used to view our site.
Believe it or not, there are more browsers
than Internet Explorer and Netscape. It is
these browsers (and Netscape, frankly)
that we need info about so we can set our
priorities. Here's the list, limited to
those with a value 0.1% or more, and to
those of interest because of their purported
popularity. |
| Browser |
%
of Total Hits |
| Internet
Explorer
Netscape
Moozilla
WebStudio
DA 5.3
Opera
Zao
Eudora
GetRight
|
94.9%
3.4%
0.20%
0.10%
0.03%
0.07%
0.01%
0.01%
0.01% |
| Interpretation |
| Obviously
Bill G is in the lead here as well. The
poor showing by Netscape casts some doubt
on if it is wise to spend time on Netscape
related problems. It is the second
highest, but still only about 4%. That's a
tough call. |
| It
is a much easier call with the rest,
however. And the results show how the PR
that some devotees brandish about their
favorites influence our thinking,
specifically the Opera browser. The
browser has a faithful following who love
it, but apparently there are not many who
use it. Spending much time on Opera
wouldn't make business sense, unless you
were in a niche where most of your
visitors used Opera. |
| More
Explorer |
| For
the top two browsers, our system indicates
the percentage of each version of the
browsers people are using. For
Internet Explorer version 6 has 83%,
version 5 has 18% and version 4
clocks in at 0.1%. So, you know what
versions of IE to target. |
|
More
Netscape
|
|
Netscape is
interesting in that the percentages don't
follow the version numbers. Version 7 has
60%, version 5 has 27%, 4 has 7% and 6 has
5%. Clearly, Netscape 6 was not a big hit if
it is eclipsed by version 4 and 5 at this
late date!
|
|
Conclusion
|
|
Armed with
actual statistics about what computers and
browsers people are using can help you make
better business decisions about your website
and its maintenance. Microsoft is the
dominant factor on the internet with Windows
XP / 2000 / 98 / ME being the predominant
operating systems, in that order. The
Internet Explorer browser dominates with
version 6 and 5 pretty much adding up to
95%.
|
|
If you
concentrate your efforts on these OS's, the
Internet Explorer browser with careful
consideration for Netscape, you be reaching
99% of people while not spending time or
money keeping up with the latest fads.
|
|
*top |
Did You
Know...
|
|
… You Can Add Text to Any Rollover Button? |
| Rollover
buttons are new in Web Studio 3.0.
You can make them with the Rollover Smart
button in the Buttons gallery, by
selecting three graphics and dropping the
Rollover Maker onto them, or by dragging
and dropping one from the Rollover
sub-gallery in the Buttons gallery. |
| In
order to add text to one, simply double
click on the button. The Rollover Studio
will appear and you can add your text to
the button. The text is added to all three
of the button's states: Normal, Mouse Over
and Mouse Down. |
| You
can choose any font, size, style and color
for your text. |
| You
can change the text or its font, size,
style or color at any time by double
clicking on the button and making the
changes with the Rollover Studio. |
| Ctrl
+ Space when a range of text is selected
changes the selected text's style to
Plain. |
| ...You
can Add Text to Any Button? |
| Yes,
you can. The trick it to turn it into a
Rollover button first, and then use the
Rollover Studio to add the text.. |
| To
turn any button into a Rollover, simply
make two copies of the button using copy
and paste. Then select all three of them
by holding down the shift key while you
click on each of them individually. Then
go to the Buttons gallery and drop the
Rollover Maker onto one of the Buttons.. |
| The
Rollover Studio dialog will open to enable
you to add your text. You'll also be able
to change the text font, style, color.. |
| And
finally, don't worry about the two extra
graphics taking up space on your website.
WebStudio will notice that they are all
identical and will only upload one of
them.
|
| ...You
can Create Rollovers from the Smart
Buttons? |
| The
so-called "Smart" buttons are
the first eight in the Buttons gallery.
They enable you to create various shaped
buttons with virtually any color. You can
create Hue based Rollovers from any of
these button type by simply holding down
the R key on the keyboard when you drag
one onto your page. |
| Once
you drop the button, the Windows Color
dialog appears. Choose the color you'd
like the button to be and click OK. Then
the Rollover Studio dialog comes up to
enable you to add text to the button and
to change the text font, style or color.
|
|
top |
Manage
Your Subscription
|
You are receiving this newsletter because
you are a registered user of Web Studio or
because you indicated you are interested in
learning about products like Web Studio.
To subscribe or unsubscribe from this
newsletter, please visit our
subscription management page. |
|
top |
|
|
|
President's Corner
|
| We
decided to look to our own website for our
Feature Article this month, "Browsers and
Platforms". This article presents some
important information to you about what
operating systems and browsers people are
using on the internet. You can use this
info to help you make better choices about
what technologies to support with your
site. |
| The
remainder of this issue focuses on
Buttons, some little known secrets and
techniques, "out of the box"
uses for buttons and a lot more fun stuff.
Since we're focusing on one topic, many of
our normal columns aren't included with
this issue. |
| We
hope all of this will come in handy! |
|
Steve Cochard
President
Back to the Beach Software, LLC |
|
*
top |
Site of
the Month Contest Winner
|
Your
Life TV |
Congratulations
to DR, our Site of the Month for June! DR's
site is for a nationally syndicated TV show
that promotes health. Our judges said,
"It has a nice, consistent, well
thought out look to it. Looks like one of
our professionals created it." |
|
Make sure you
check out DR's site
and remember you can ask DR how it was
all done in the WebStudio
Forum! |
|
And for those of
you thinking of submitting a site, this is a
reminder that we're halfway through July -
so
click here to submit your site now! |
|
* top |
Buttons
and Thinking Outside the Box
|
|
The
Versatile Button Gallery and its Hidden
Magic |
| There
is some magic hiding in the Buttons
Gallery. We’ve
got three completely different uses for
the Buttons Gallery here, all of which
have nothing really to do with buttons! |
| The
first bit of magic was first discovered in
the Signs gallery by long time WebStudio
user Jan Sopshire when she used the solid
colored rectangles found in one of the
Signs sub-galleries to create entire web
pages. You can see the results of Jan’s
work at her site, http://jansown.com/Begin.html |
| Here’s
a few examples of Jan’s sample pages:
Everything
on these pages except the text and
photographs were done with the solid
colored signs. You can do the same thing
with the Square Button from the Buttons
gallery.
|
| The
concept is simple, use solid colored
graphics as the main design element of
your page. Jan uses contrasting and
complimentary colors for the graphics in
her pages. She uses them for borders,
backgrounds, the popular triple background
effect, as banners, text backgrounds,
buttons, dropped shadows, dividers and
more. The concept is simple, her execution
of it is brilliant! |
| Using
the graphics in the Signs gallery must
have been difficult for Jan, however,
because it is difficult to get the exact
colors you want. Enter the Buttons gallery. |
| The
first 8 “buttons” in the Buttons
Gallery enable you to drag a solid or
outlined “buttons” onto your page, and
to choose their color with the Windows
Color Dialog. The secret here is to drag
the "Square" button onto your
page, choose its color, and then resize
and position it where you need it.
|
| Here's
one of the secrets, once the “button”
is on your page, it doesn’t
“remember” that it is a button. It is
simply a small, rectangular, solid color
graphic. You can then use this just as Jan
has: as a background, border, shadow, or
yes, even as a button. |
| If
you need a complimentary or contrasting
colored graphic, simply drag another
"Square" button from the Gallery
and choose the appropriate color. If you
need more than one with the same color,
just copy and paste the graphic of your
choice.
|
|
There
is another very cool thing about this
approach to page design with WebStudio. No
matter how many times you use a graphic on
your page, it only gets uploaded once. This
is due to the fact that no matter how large,
wide, narrow, small you make the graphics
they are identical to others of the same or
different size, with the same color. So, you
could stretch one to fill your entire page,
and it will still be as small as the
original button. The technique leads to
small pages, and extremely fast download
times for your visitors. |
|
top |
|
Multiple
Hyperlinks on a Photograph |
| Next,
we have a technique that uses the Buttons
gallery to enable you to put links on
individual parts of photographs or other graphics. |
| First,
an example. Let's say you have a website
about your family. You have a page for
each member of the family. On your home
page is a family picture. You want to
enable visitors to click on anyone's face
and have them go to that person's web
page. This
is easy to do...but not obvious. |
| First
you'll need a solid color graphic to do it
with. So, go to the Buttons gallery and
drag the Square button onto your page.
Choose any color you want. You won't see
the color in the final product, since
we'll make that color the transparent
color of the graphic. |
| Next
drag the graphic onto your photograph and
position it in the approximate location
you want the link to be. Then resize it as
needed.. |
| Once
you have done that, drag the link to the
appropriate page from the Links Gallery
onto the button. That puts the link on
that area on your picture |
| Next,
you'll make it transparent so you won't
see the Button, but will see thru it to
the face below. Right click on the Button
and choose TransparentColor >
ChooseColor from the resulting menu.
When the Choose Color dialog comes up,
just click anywhere in the Button graphic
and it will be transparent. Then click OK.
Now you have a link on an area of your
photo. |
| Repeat
this process as many times as needed to
put all the links you need on your photo! |
| Move
the mouse onto an item in a gallery and
click the Right mouse button. Choose Add
Files from the resulting menu. In the
resulting Open File dialog, choose the
files you want to add to the gallery. If
you want to add multiple file hold down
the Ctrl key while you select files. Press
the Open button to add them to the
gallery. |
|
Taming
a Wild Browser with Buttons |
| Did
you Know
that web browsers have a problem with very
narrow or thin graphics. If you have a
divider, for example, that is less than 15
pixels in height, it will actually be
placed in the wrong place by the browser.
It will be placed such that its bottom is
15 pixels below where you put its top.
Hmmm, very strange. The HTML that
WebStudio creates is correct, but the
browsers move the graphic down the page! |
| A
solution? Merge two graphics, one a solid
color graphic, like from our newfound
friend the Buttons gallery, and the other
your divider. Make the solid graphic the
width or height necessary to meet
the 15 pixel threshold for the browser’s
bug. Then make it as wide as the divider,
align their left sides, move the solid one
below the divider so they just touch,
select them both by holding down the shift
key when you click on them, and then
choose Merge Selected Objects from the
Object menu. Finally, make the Transparent
color of the new divider the same as the
solid colored part. You’ll see through
the solid part, and the original divider
won't move. |
| Another
solution is to this problem is to use a
text object, filled with multiple
underscores and colored with the Text
Color command. Just enter enough
underscores to get the width you need. The
browser won’t move the thin text object
like it does the thin graphic. |
|
Graphic
Rollover
Buttons and Color Hues |
| You
can make your own Graphic Rollovers that
change hues instead of (or in addition to)
changing the graphic. |
| You
do this by using the same graphic for each
of the three states of the Rollover but
with a different color hue.. |
| To
do this simply drag the same graphic three
times from the Button Gallery or copy and
paste an existing one twice. In any event,
get three copies of the same graphic on
your page. Then drag the Photo Correction
Wizard from the Special FX Gallery onto
one of them. Page through the wizard until
you come to the Hue page and change its
hue. Do this to the third button using a
different hue. Finally select the objects
in the order you want them (normal, over
and down) and drop the Rollover Button
Maker onto any of them. |
|
* top |
|
|
