| |
|
 |
Feature Article -
Using Fonts on Web Pages
|
| First,
you need to know that Fonts on
web pages have been a problem since the
beginning of time (internet time, that is). |
| With
Word Processing and other tasks you can
use whatever fonts you like. With Web
Pages that is not true. When you use a
font for some text on your web page, the
person viewing your page on their computer
may see it correctly or may not. The
reason he may not is because the browser looks for
the font you used in your page, but looks
for it on your visitor's
computer, not yours. If they don't have
the font, the browser substitutes one it
thinks is close. In almost all cases the
font that is substituted is not close and
results in text overlapping graphics, overlapping
other text, line breaks being wrong, and a generally
ugly, messed up web page. |
| So,
if you have some really cool fonts that
you want to use and your viewers don’t
have those exact fonts, they won’t see
them. A relatively ugly font will be
substituted and to make it even worse, the
browser will reformat the text for the new
font. This really messes up the layout of
web pages. |
| Web
Safe Fonts |
| There
are certain fonts that every Windows
computer is guaranteed to have, fonts that
they should have, fonts they might have,
and fonts they probably don’t have. |
| If
you want your pages to be viewed as you
designed them you’d want to use fonts
everyone is guaranteed to have (or take
special precautions to get around the
problem, which you’ll shortly see, Web
Studio will do for you). The fonts that
everyone has are
know as Web Safe Fonts. |
| Web
Studio to the Rescue |
| The
Text Gallery in WebStudio uses color
coding to tell you how safe a font is: |
- Fonts
colored Black are always safe.
- Blue
fonts are shipped with Windows. You
can be reasonably sure that your
visitor will have these fonts on their
system.
- Yellow
fonts are Cautionary fonts. These
fonts are not as common as the blue
and black fonts so viewers of your Web
site might not have them. If they
don't, the text will look different.
(These are more likely to be
substituted). If you want to make sure
your font doesn't get substituted then
check the "Always convert object
to web page graphic" checkbox in
the text object's properties
"Text" tab.
- Red are
Wacky fonts, less common. These fonts
do not contain any information that
would let a browser come up with a
plausible substitution; therefore
these fonts are always substituted by
a browser. However, Web Studio knows
this and will automatically turn a
text object that contains these fonts
into a graphic when uploaded.
|
| Strange
as it may seem, with Web Studio the Red
fonts are actually web safe, in fact the
safest. Why? Because Web Studio will turn
the text object that contains them into a
graphic when it creates your web site. The
web browser never gets a chance to do its
ugly font substitution voodoo because
there are no fonts -- it is a graphic
image! The downside to this is that the
graphic will increase the size and slow
the download of your page a bit. |
| If
you really want to use red fonts and
don’t mind the increased size, use them!
If you are concerned about the size of the
page, choose
Object>PageProperties>Download Size
and see how big the page is with the red
fonts. Then change the font of the entire
text object to Arial, or any other Black
font and check the download size again.
Then make your choice. |
| To
change all of the text in the object to a
black font for this check, simply drop a
black font onto the text object from the
Text gallery (the text object should be
de-selected). To restore the text object to
its original red font state simply choose
Edit>Undo. |
| Don't
Go Overboard |
| Using
the tools WebStudio gives you, you can use
any font you like on your web pages.
However, there is no free lunch when you
turn your text into graphics. As
previously stated, the size of your page
can increase. However there is another
problem you need to avoid. If you use red
or yellow fonts for the body text in your
site, its size will definitely get out of
hand. |
| Body
text is the text that is not a headline,
or attention getter. It is the text that
contains you message. It is like this
paragraph in this article. It is body
copy, or body text. It is not a headline.. |
| You
do not want to use red or yellow fonts in
a text object that contains body copy,
because WebStudio will turn the entire
text object into a graphic. It will do
this even if most
of the text uses a web safe font. The reason is
WebStudio turns any object that contains
Red fonts into a graphic. The solution is
to use separate text objects for titles,
separate text objects for body text. That
way, your headlines will turn into
graphics, your body text will remain text.
And one last point, remember to go to the
Properties dialog for those headlines that
have Yellow fonts in them to check the
"Always convert object to web page
graphic" checkbox. Then all your
pages will be Web Safe! |
| A
Myth Exposed |
| Many
people us the Flip or Reverse effects from
the Special FX gallery on
their text objects to turn them into
graphics. This solves the problem, but it
is less desirable. This is so because
checking the "Always convert object
to web page graphic" checkbox enables
you to edit your text at any time in the
future, while turning into
a graphic with Flip or Reverse does not.
It is turned in to a graphic and will stay
that way. |
|
*top |
Tips
and Techniques...
|
| Getting
Rid of Underlines in Your Text Links |
| Many
people have been asking how to remove the
underlines that WebStudio adds to all text
links. There is no button you can push, or
setting you can change to do this.
However, due to the nature of WebStudio
(infinitely expandable by users) you can
add a little Cascading Style Sheet to your
page that will turn off the underlines. |
| Don't
worry if you don't know what a Cascading
Style Sheet (or CSS) is. All you have to
do is add the CSS below to your page and
it will work. Here's how. |
| Run
WebStudio, open your site, go to your home
page, or a page with text links in it. Go
to the Object Menu and choose Page
Properties, or right click on the page's
background and choose Page Properties from
the resulting menu. When the Properties
dialog comes up, click on the PageHTML
tab. Click on the "Inside Page
Header" button and then copy the
following CSS from this page and paste it
into the PageHTML window. |
<style>
<!--
a{text-decoration:none}
__>
</style>
|
| Make
sure you've entered it exactly as it is
above and then click the OK button. |
| Now
that page will not have underlines on its
links. If you want other pages, or all of
your pages to not have underlines on their
links, do this to all of those pages.
That's it!. |
|
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
|
| This
month we feature a discussion of "Web
Safe Fonts". If other people tell you
your web site's text is overlapping other
things on you page, but it looks OK to
you, you are probably using Un-Safe Fonts.
This article will explain it all and the
cool solutions offered by WebStudio. |
| Find
out why you should use MP3's instead of
WAVs in the Did You Know column.
And find out how to remove underline from
your text links in Tips and Techniques. |
| We
hope all of this will come in handy! |
| Oh,
and one last thing. If you have any
subject you'd like us to cover in future
newsletters, please send us an email
describing the subject you'd like to see.
Send it to techsupport |
|
Steve Cochard
President
Back to the Beach Software, LLC |
|
*
top |
Site of
the Month Contest Winner
|
BoTiff's DeMars
Family website |
Congratulations
to BoTiff,
our Site of the Month for August 
BoTiff's site
is the family site for the DeMars
family. Our judges said it is a,
"very good example of the type of
personal website that a typical new
WebStudio owner would want to make. In other
words, it has heart and it's all Web Studio." |
|
Make sure you
check out BoTiff's site
and remember you can ask BoTiff 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
September -
so
click here to submit your site now! |
|
* top |
Did You
Know
|
|
...that
you should use MP3 sound files instead of
WAV files? |
| We
encourage people to use MP3 files when
they want to add sound to their site.
Windows has its WAV file format that
WebStudio uses for all of its sound
effects. Why would we recommend a file
type that we don't use ourselves? |
| Good
question, glad you asked. . |
| The
WAV files we have in WebStudio are meant
to be short, cute, sound effects. They are
about 1 second in duration for the most
part. This results in files that are 30k
or less in size for each sound. Many
people are attempting to use WAV files for
songs lasting a few minutes or more. These
WAV files are multi-megabytes in
size. |
| The
large file size of WAVs is the big
problem. If you add a large WAV file to
your page, it has to be downloaded before
people will see your page. It takes so
long to download a 1meg or larger file,
that people think there is something wrong
with your site and they leave. In fact,
there is something wrong with your
site...you used a giant WAV file instead
of a reasonable MP3 file. |
| The
solution, as you've probably gathered by
now, is to convert the WAV files to MP3
files. MP3 has superior compression that
makes it viable for sound files on the
web. There are many conversion programs
available on the web to convert from WAV
to MP3. Your current music program may
even have it built into it. If not, search
the web for one of the free programs or
ask around. |
| Once
you have your MP3 files, you'll want to
add them to WebStudio. Here's a link
to an FAQ (frequently asked question) on
our website that tells you how to add your
MP3s to your pages.
|
| So,
to recap. If your WAV file is more than
about 1 second or 30k in length, use an
MP3 file instead. Have fun! |
|
top |
What's
New Online
|
|
New Web Studio Articles |
|
Visit
WebStudio
Articles in the Resources section of our
website. There are 16 different articles
there with varying topics, all designed to
give you valuable insights into using
WebStudio and creating your site. |
|
Many
of the featured articles from our past
newsletters are included there for your convenience.
Here's a list of many of the articles,
complete with links to our site: |
|
|
|
* top |
|
|
|
|
