Taking a dive into GoLive

This week I have to build a new web site for a non-profit organization. So, it's time to use my recently purchased copy of Adobe's GoLive and try it out. What better way to get a head start than to check out some tutorials:

20 Tips for GoLive 5.0

As Microsoft releases Windows XP to OEM's this week, the real debate isn't about the Dept. of Justice's case against MS, it is about how many new security holes are going to be created with this new version. If you're going to upgrade, you better be prepared to stay current with any security patches that are released.

One of my favorite sites for security tips and hints is over at Gibson Research:
The GRC.COM Denial of Service Pages

Do you know where that web page has been?

I've heard about web pages that contain malicious JavaScript before. Stick that in an HTML based e-mail and you've got the latest ploy to screw up a Windows PC.

News: Trojan horse breaks Windows PCs

eWEEK: Anything you code can and will be used against you �

More on Netscape 6.1

Maybe I'm not totally off the mark on this one. Here's a positive review of Netscape 6.1 on SitePoint:

WebmasterBase - Netscape 6.1

Today I'm trying out the latest and greatest in browsers: Netscape 6.1 (Mac version). I'll admit, it's looking pretty good. It is even behaving well with those "bleeding edge" CSS sites (oh, you know the ones).

Now, if you're one of those that just have to have the latest, check it out here.

Random link of the day...

Think you're getting away with something by using the latest P2P file swapping software? Well, nothing in life is free. Here's an excellent example:

Salon.com: The parasite economy

I wonder how that web site looks like in Netscape 4?

I guess it's just been second nature to me, since I've always tried to create web pages that are cross-browser compatible. Here at the "randompsycho computer lab," I run PC IE versions 2, 4, 5, Netscape 4 and 6; Mac IE 5, Netscape 4; Unix Netscape 4 and Lynx. Heck, if you can design a web page that looks half way decent in IE 2 and Lynx, you've accomplished something [big grin].

For a good introduction to design testing, check out this article:

WebmasterBase - Step-by-Step Web Testing

What will they think of next?

Some sources are saying that Windows XP will be ready to ship this fall. Although there are lots of little details yet to be worked out, one feature directly effects web designers.

It seems that IE6 has "Smart Tags" built in - the browser scans the web page you are viewing and spots words and phrases that might be related to a Microsoft product or service. It then creates a hyperlink to the appropriate MS site where you can make a purchase. Not a very good thing if you happen to have a web page about a service/product that competes with Microsoft, now is it?

The good news is that the web coder can disable smarts tags:

The Register - Banish those WinXP, IE6 smart tag blues!

Even better news is that MS has decided now to leave Smart Tags turned off when it releases XP:

Microsoft shuts off smart tags - 2001-07-02 - The Business Journal of Portland

Still, you might want to include the meta tag that disables them if you have a commercial site and definately don't want competitive links cropping up on your web pages. After all, there are all those beta versions of IE6 and XP floating around.

Ok, if you still haven't applied that patch to your Windows NT or Win2K web server, here's another reason why you should:

Web Develepor News - New Worm On the Loose

Why ask why?

Sure, lots of new, cool, hip web sites are using Flash. But should someone stop and examine the reasons why before going that route? Is being "cool" just for the sake of being cool really a good thing?

Take a look at these tips for usability:

Create a Usable Flash Site

Macromedia - Flash: Usability Tips

Digital Future

This story is probably old news to some. But, in this month's Web Techniques magazine, Lincoln Stein explores some issues brought up in the wake of the Kaycee blog fiasco.

Can't Believe My Eyes (Web Techniques, Sep 2001)

Let's talk accessibility...

Both owlick and sarah have mentioned this topic in previous posts. For someone just beginning to create web pages, there is no better way to have an accessible site than to plan it into the design from the very beginning.

The Standard: Sites for the Blind

Putting it all together...

I was so interested in bugz and owlick's previous posts, that I decided to put it all together into a little script.

First, I'd like to give credit to HTML Goodies and O'Reilly's Dynamic HTML: The Definitive Reference as source material.

Ok, let's start off with a few ground rules. We want to preload our images and use two functions to swap the buttons. Let's call these functions 'mouseOn' and 'mouseOff' (when you write your own script, you can name the functions anything you want to). We're also going to use the same name that bugz created for this rollover: pic1 (again, you can choose any name you want, in fact, to use the script on more than one rollover button, you can use different names).

The entire script goes into the <Head> section of your web page.

<script language="JavaScript">
//Preloading the images and setting the width and height
Image1= new Image(140,130)
Image1.src= "bubble1.gif"
Image2= new Image(140,130)
Image2.src= "bubble2.gif"

//Defining the two functions
function mouseOn()
{
document.pic1.src= Image2.src; (look familiar?)
return true;
}

function mouseOff()
{
document.pic1.src= Image1.src;
return true;
}

</script>

Then, somewhere in your page, use this anchor tag to call the functions:
<a href="yourURL.htm" onMouseOver="mouseOn()" onMouseOut="mouseOff()">
<img name="pic1" src="bubble1.gif" width="140" height="130" border="0"> </a>

Click here to see an example

P.S. bugz, I only had to edit this post 8 times :p

One good thing to look at when creating image rollovers is the pre-load function. This will help eliminate the time it takes for the images to swap out during onMouseover and onMouseout events. Even though all the images get loaded during the initial visit it takes no time to swap them due to the fact they are in cache.

You can use this for as many images as needed.

The following code needs to be placed in the <head> section of the page with the rollovers:

image1 = new Image();
image1.src = "image1.gif";

image2 = new Image();
image2.src = "image2.gif";

Image Rollover's

Ahh, the image rollover. To clue you in on me, I just learned alot of JavaScript last night with some tutorial's, so if I can learn it, you can too.

Ok the first thing you need is 2 images.. preferably the same size, once you have that you're ready to start.

You should recognize this tag

<a href="http://randompsycho.org"><img src="bubble1.gif" name="pic1"></a>

That by itself does not make an Image Rollover, You need a little more added to it, shown below we added the onMouseOver event, this event happens when the user moves over the image with the mouse.

<a href="http://randompsycho.org" onMouseOver=""><img src="bubble1.gif" name="pic1"></a>

Now just that alone will not make it work either, the JavaScript has to know what image to change so we'll add that part now..

<a href="http://randompsycho.org" onMouseOver="document.pic1.src='bubble2.gif'"><img src="bubble1.gif" name="pic1"></a>

Ok now that will change it to the graphic, it wont change it back when the mouse moves away from it though, I'll add the OnMouseOut event, which is in the event of the user moving the mouse off the image.

<a href="http://randompsycho.org" onMouseOver="document.pic1.src='bubble2.gif'" onMouseOut="document.pic1.src='bubble1.gif'"><img src="bubble1.gif" name="pic1"></a>

Now that should work for you, if it doesnt make sure check your quotes. Anything that uses quotes inside our events (OnMouseOver,OnMouseOut) must single quotes, ' <-- like so, Well i hope I helped you into rollover heaven. Here's an example :))



Ok, after I gave Darrell the link to the tutorial's, he then said 'post it on the log too' so here ya go!

JavaScript Primers

Ok, now since I've edited this post about 9 times now, I think that's enough. hehe :))

For all of you IIS sys admins...

I have to admit, I'm partial to NT and IIS, but I also manage a web site running on Linux too. It's just I never have any problems to talk about with the Linux server (big grin).

Here's the latest on IIS and that pesty little worm:
Internet Watchers: Code Red Impact Minimized

Tomorrow will be the last day for the Blog-a-thon log. I'll be editing out the non-web design related posts, but leaving the links and tutorials.

For the sake of prosperity, you will still be able to read the entire 24-hours worth of ramblings in the Archives section.