| Get your FREE home page! |
| >> STAGE 1: THE BACKGROUND | |
|
Save the starfield and upload it. Then your BODY tag looks like this (I renamed mine starfield.gif; use whatever you named yours):
Two things people forget. First, the bgcolor. Set it to almost-black like that, so if the background is slow to load, or somebody has pictures turned off, your light text still shows up. Without it you get pale lavender words on a white page, and nobody can read a thing. Second, don't use the plain blue default link color on a black page. It's nearly invisible. Cyan or yellow links. |
| >> STAGE 2: DIVIDER AND BUTTONS | ||
|
The chrome tube goes between sections:
Always put the width and height in. The browser can lay out the page before the picture arrives, instead of jumping everything around when it does. A button is just a picture inside a link:
border="0" stops the browser from drawing a blue link box around the chrome. alt gives people with pictures off something to click. |
| >> STAGE 3: STAR BULLETS | |
|
You can't swap the dot on a regular <ul> list for a picture in most browsers, so the trick is to line the star up with each item using align="absmiddle":
Which looks like: For long items that wrap to two lines, put the star and the words in two cells of a table instead, so the second line doesn't slide under the star. |
| >> HOW I MAKE CHROME |
|
Everybody asks. Chrome isn't a color, it's a reflection. A shiny tube outdoors reflects the sky on top and the ground on the bottom, with a hard dark line where the horizon falls. So in Paint Shop Pro 5 I fill the button shape with a linear gradient that goes white at the top, pale blue down to just past the middle, then a sudden band of dark navy (that's the horizon), then back up to a light blue at the bottom. That sudden dark band is the whole trick. Without it you just get a gray pill. After that: a one-pixel white highlight along the top edge, a darker outline all the way around, and the lettering in navy so it looks stamped into the metal. The star glint is six frames in Animation Shop. Five of them are the same star with a small highlight moving across, and the sixth is the flash. I set the flash frame short and the plain frames long so it winks instead of strobes. A blinking thing on a page should be calm or it gives people a headache. Last step, color reduction. Space scenes look terrible when you dither them down to a handful of colors, so the starfield keeps enough colors to get the nebula smooth, and the buttons get reduced harder with no dithering so the edges stay clean. The transparent color on the bar and bullet is set to the black they were drawn on. |
| >> TROUBLESHOOTING |
|
Q: My GIFs show up as broken pictures after I upload them. Q: My star has a black square around it on my white page. Q: Nothing shows up at all. |