Web Site Building-101

Chapter 5 / All the Extra Stuff...

"Web Site Building-101"

Forms / Fonts / Flash / Audio / Video

 


Creating sign up forms or online forms of any kind, can require a serious amount of skill. For the sake of this course, I found a really great short cut for getting the job done without having to go to school and learn Java scripts.

Click here if you have a real need for any kind of form other than the basic optin box we created earlier. This service offers a free account to create forms in a step one, step two kind of fashion. Then the html code for the form is created automatically, and you just paste it inside the source of your page, wherever the form needs to be.

For $29.00 I think I purchased the full blown, lifetime membership that has no limitations to the amount of forms you can create. Great service, and a great deal!

Fonts should be a no brainer for you at this point, I mean you already got through the real hard stuff. There are the obvious choices right in the top tool bar. The small capital A and larger capital A. Guess what that does... Right, makes your font quickly bigger or smaller, a very convenient font size change. 

Then you can choose your text style located under the "Format tab, then select "font." The most popular font for web pages I find is Georgia. That's what you are reading now. Also popular are "Courier" and "Courier New." The look is ultimately up to you.

The other three buttons are quite common, if you have ever worked with any kind of word processing software. First one B for bolding, next I for italic and last U for underlining text. Just highlight the text you want to change then click the appropriate button of choice.

Also available is text color. Just to the left of the 5 buttons we just discussed, are two small squares, one just on top of the other. If you click on the black square, it will bring up the color chart. There are "predefined colors," that you can choose or make your own. You can even duplicate a color from another site if you can find the "hex" number in the source code of that page. Just copy and paste it into the color chart. 

If you have a page inside your NVU editor that has a color you need to duplicate, you can simply highlight the text, then click on the color square and it will show the hex number for that color. Copy and paste. That's it!

This is the part I have always had fun with, once I figured out how to do it, Flash audio and or video. First let's cover audio. The absolute easiest, quickest, get audio on your site solution is to use Audio Acrobat.

Audio Acrobat is a service you have seen on my web sites. It will allow you to record a personal message, (best done over the phone)  store that message, and make it available in html for a web page, complete with all the audio buttons, play, stop, pause, etc.

Is this the method of truly creating your own flash buttons and streaming audio? No, it's really not, but wow does it work really well, and so easy. I have hundreds of audios saved and ready to throw on a site any time I want. You can even chose to save you audio to make it compatible for email. I really like it. Keeps things so organized. Click here to visit Audio Acrobat. Pretty sure they offer a free trial version. 

A real cool thing I learned is how to import music to your audio account, and add it to a site. The Audio Acrobat back office area explains how to do it real easily.

Check this out:

Once again, to match the color of the player buttons to this page theme, I simply copied the hex number into my audio account selections and presto, matching colors.

Now, If you want the real deal, no messing around, custom flash buttons, and streaming audio, then this next part will be for you! I never liked the idea of being tied to some company for my needs, so with this you will be totally self sufficient, other than your web hosting company.

There will be a couple of programs you will need to pay for one time, but then they are yours. There not expensive, but they are an expense, so you may want to get more comfortable with all of this before jumping into some programs you might not be ready for. It's up to you...

I use MP3 Sound Stream. At the time of writing this, it is just under $40 bucks, and worth every penny! Click here to visit the MP3 Sound Stream web site.

Another important tool, or program you may find you will need is called Total Audio Converter. Did you know that the Apple iPod (MP3 player) actual plays MP4 files? If you want to add them to your site as streaming tunes, you will need to fist convert those MP4 files to the MP3 file format. Total Audio Converter is the software I use. Click here to visit the Total Audio Converter page. Have a look at the difference between Audio Acrobat and my own streaming audio and flash buttons:

What's the main difference? I don't have to pay Audio Acrobat their fee every month, then when I cancel the account, all my audios are gone. Doing this way also leaves out the "Audio Acrobat" advertisement from your audio buttons.

How did I do it? Here's how:

First I converted an MP4 file from my iTunes account to MP3 using the Total Audio Converter program, and saved the file on my desk top.

Next I loaded that new MP3 file into the MP3 Sound Stream program. Click on "options" to select the style of player buttons you want, as well as other features like auto play or loop play. Select to save all output to your desktop.

The final 3 steps all go together. There are 3 files that will be created. Open up FileZilla, and log on to your site through FTP (file transfer protocol.) Navigate to your desktop and find the two swf files with the name you gave them, probably "mp3 something."

Drag and drop the two folders into your site on the right hand side of FileZilla, then you can close that program. Now on your desktop, search for the html file with the same MP3 file name as the two swf files you just uploaded, and click on it. When the player opens in a new browser, view the source code, and copy it to your clip board. Go back into your NVU editor, and place your cursor where you would like the audio buttons to be located.

Finally, past the html code from your clip board into the source of your new site and publish. That's it, you just created your own streaming audio and flash buttons! Good job.

Another great program for working with audio is called Audacity. At the time of writing this, it is a free program! There are multiple uses for this so I won't go into them all, but if you are into audio, you should grab it. Click here to visit the Audacity site.

Want video on your site? How easy is this... You're like a pro now, and adding a quick YouTube video to your site almost needs no explanation. Grab the html code to a video you have already done with YouTube, Viddler, or any other program you use. Copy it to your clipboard and past it into the source of your web page inside NVU. Publish, and you're done. You may want to add the <center> command in front of the html to center the video, but that's  all there is to it.

Want to add video without YouTube or the like? You just need another program to convert your original video file created by your camera, into a flash file format. The best video to flash encoder I have found is by a company called Sothink.

Click hereto visit the Sothink video to flash encoder page. Once you have the video to flash encoder program loaded, simply grab your original video file from your camera, through the encoder program. Select your options, and click to convert. The most popular video size for publishing to the web is 240 X 320. Not too big as to take forever to load, and not too small that you can't even see the thing. As always I like to set my desk top as the destination for new files so they are easy to find.

Just like with the audio, there will be a few files to work with. Open FileZilla and up load the flash video files to your site. Next click on the html file for the video on your desktop. Copy the source to your clip board and past it wherever you want the video to appear on your site. That should do it.

Seems like a lot to do as I'm writing this so if you feel confused, just go over it again and again, until it all makes sense. Remember you only need to learn it once, hen it's yours to keep.

Continue to Chapter 6

 
 
 

 


WebSiteBuilding-101

(c) 2009 Web Site Building-101 - All Rights Reserved.