NOTE: External links on this page open a new window.
For each of the websites listed in the
OFP Websites page, I
created the banners and graphics. This page will tell you
how I did most of them for
LYAO-Online.
All were done in Microsoft Image Composer (MSIC), which came free
with FrontPage.
In 1997, I began forwarding jokes I received in email at
work, to family and other online friends. I forwarded them
home, where I'd clean them up,
give them names (headings), and send them in batches. Around
February, 1998, I began naming them LYAO (Laff Your Ass
Off), based on the chat/messaging abbreviation, LMAO. Almost
immediately, I created a banner. Originally, I was going to
send it at the top of the joke-letter, but it proved a
little difficult with the email client I was using at the
time. So, it "sat on the shelf" for a while. (See
LYAO - History for
more about the history of LYAO.)
Remember... I like frogs. I'd already come up with the name
"Orange Frog Productions", and wanted the orange frog to be
a logo. For my own sites, I would use a couple of different
images. For LYAO, I wanted a laughing or definitely smiling
frog, so I looked around on the 'net for frog images,
starting in the clip-art galleries, searching in vain (at
that time). I finally found a neon sign image with a frog I
liked and thought would work. I cut everything but the frog
out of the image, tried various orange settings in MSIC
until I found one that looked "neat" to me, set the eyes to
be somewhat contrasting, and there was my LYAO logo.
(Actual image used to make LYAO Banner.)
I tried a few other things, but the one I really wanted to
work was this one:
(Nice, but probably too much for a webpage or banner.)
Creating the rest of the LYAO banner simply meant creating a
text-box of the letters "L-Y-A-O" in yellow, with a few
spaces between them, putting a dark edge on the letters,
then, using different colored text boxes (and much smaller),
putting the rest of the words in the blank spaces. Making
the black background on the frog logo transparent, I put him
on the left, the lettering on the right, created a green
(remember? I like green, too) background, and there's my
banner.
(Original LYAO Banner.)
After trying it a couple of times, I realized it needed an
"edge", and changed the color INSIDE the frog to
match the background ...
(Edged LYAO Banner.)
Perfect!
Some time before, I had found a picture of a braying jackass in a magazine that I
liked, and had, for some reason, saved it. I thought would fit in well
with LYAO, and scanned it. At that time, I wasn't positive about how
I'd use it, but I liked it anyway. NOTE: The following
version has been cleaned up, fixing a couple of problems I
had with the scan, and a cut corner.
(Actual image used to make LYAO "Braying Jackass" images.)
After working with Dad's website (Bud Sanders Appraisals) for
some time, I thought seriously about making one for LYAO. I'd used an image as a "left frame" background for my Dad's
site, so decided I'd do the same with the donkey. I played
in MSIC with the color image for a while, then decided it
would be best to play with a black-and-white version.
Knowing it would be green (remember...?) I kept at it, and
came up with a version I really liked.
(LYAO Left Frame/Border and Sidebar background.)
Here, you can see what was "fixed" in the upper image.
I created a lighter color for the right side (somewhat THIS
page's background color), put a darker "extension",
to make it over 1020px, on it for
wider screens (remember, back then 600px was pretty much the
max), put a smaller version of the above green JA on the
left side, and saved it as a GIF (this page's is saved as
JPG). There was my (original) background tile.
(The
"pixilation", above, was caused by making the
image a GIF, and using a color NOT in the "browser-safe"
216-color-palette, which caused the image to "dither",
meaning it used other colors to try to MAKE my color. I
think it turned out more gray than green. Although it was
used on the original LYAO-Online site, I've since created another version,
a little wider and without the
dark right side, and saved it as a lo-res JPG ...
In either case, the images repeated down the page to create the background.
I
had an idea for an LYAO database, but no knowledge in PC
programming to pull it off. At that time, working all day,
cleaning up the jokes for future joke letters, and surfing
the 'net, took too much time for me to do much else. I
changed jobs and one of the guys at work who DID have the
programming acumen said he'd work with me.
As he worked on the db, I worked on button images, some of
which I knew we needed, some he said we needed, and some we
later decided we needed.
We used the same rollover JavaScript by
Roy Whittle
(I don't believe I found it at his site, but it's still around -
10/27/2006).
I used colors from the LYAO banner, to create a "button
template." Obviously, I did a lot more work than I needed
to:
(Inner Button... The idea was to contrast
with the page and sidebar (JA))
(Orange Edge... Border for the button.)
(Brown Edge... Border for the button.)
I believe I separated the inner button and two edges, so I
could put a solid drop-shadow the inner button, on upper and
left corners for "in" buttons and lower and right corners
for "out" buttons. There were other problems. This is also
where I believe I first noticed that when you built an image
larger than you needed, and shrunk it, the image bottom and
right edges left a pixel or two of transparent space around
the lower and left sides, causing MSIC's Composition
Space color to show through. As you can see in the borders,
above, there's an extra pixel or so between the bottom and
left of the color and the actual edge of the image, causing
a light "line" to appear between them (visible here, because
of the 1px borders I put on the images to help separate them
from the background).
The one pixel solid drop-shadow I used to make the subtle
shift between "in" and "out" turns out to be not quite
enough. I should have made them at least 2px.
Put 'em together and shift the borders slightly in opposite directions, and VIOLA: In and out buttons.
(Nav Button Blank - IN)
(Nav Button Blank - OUT)
Just add a word, centered horizontally and vertically, to a
copy of each, name them appropriately, build a
table (remember, this was 2000) around whichever I decide is
OUT, put them in the Rollover JavaScript, and I have buttons
that look like they're pushed when the cursor rolls over
them. (See
LYAO
Rollover Button (JS) Example
to see some of them in action.)
A few years ago, I learned how to make buttons using tables,
and text alone. I've since created them in a sidebar <div>
using specially defined paragraphs. I think, logically, this
works, though many may argue for using a specially defined
LIST.
I had tried to use the banner and background a few times when
sending out LYAO joke-letters, but the email client I was
using at the time didn't do it very well, and few people
were using HTML emails. Many STILL turn the HTML off for
security reasons. However, I now send out LYAO with new
stationary. I have not heard anyone say they've received it
incorrectly, and to be sure, am not sure what happens if
someone receives TEXT ONLY. I have received text replies to
OFP emails, where the banner's ALT text is used, and the
names of the images used (background and banner) are shown,
rather than the images themselves, so believe that's how
they are received.
Since that was the case, I removed the stationary. When I
created the new version of the site, I recreated stationary,
set up the CSS for it, and now send LYAO joke-letters using
it.
Basically, I used the background, image, and basic CSS from
LYAO-Online's page. I changed the "under-banner" note so I
could edit it for the date, and I had my stationary.
Here's a sample version (NOTE: Everything is full-size,
except the actual page-width, shrunk to fit here. The banner
and copyright text would normally be centered in the about where the text of the
message is shown):
LYAO - 99/99/9999
Why Men Can't Be Secretaries
Husband's note on refrigerator for wife:
Someone from the Gyna Colleges called.
They said the Pabst beer is normal.
I didn't know you liked beer.
----------
5 Rules for Men
FIVE RULES FOR MEN TO FOLLOW TO ACHIEVE A HAPPY LIFE:
- It's important to have a woman who helps at
home, who cooks from time to time, cleans
and has a job.
- It's important to have a woman who can make
you laugh.
- It's important to have a woman who you can
trust and who doesn't lie to you.
- It's important to have a woman who is good
in bed and who likes to be with you.
- It's very, very important that these four
women do not know each other or ever meet!
----------
Greaser Babies
This is cute!
Check out this website
http://members.shaw.ca/anabw/grease.htm
LYAO Email Stationary and Background & Banner Graphics © 2006 by Bill
Sanders - All rights reserved
CMA Stuff: LYAO is a semi-periodic (sometimes sporadic) "joke"-letter
comprised of jokes, stories, urban legends
and other stuff received in email in a "cleaned up" format.
If you are not on my LYAO Mailing List (and those who are know who you are),
you have proobably received LYAO as a forward from one of your friends
who ARE on MY mailing list. Don't Blame ME!
If you are not on the mailing list and wish to be included,
or are on it and wish to be removed,
send an email to lyao @ orangefrogproductions.com (remove the spaces)
and your wish will be granted immediately.
The LYAO Mailing List is mine and mine alone. No one else has access to it,
and no one will.
It will never be sold to anyone.
Send comments/questions about this page to Bill Sanders at:
Go to Graphics Capabilities/Build Graphics For Websites
Go to
OFP Websites Home page
Visit
Bud Sanders Appraisals
![Welcome to Orange Frog Productions Owner Section [Banner]](images/owner/ofp_banner_owner.jpg)
