HOME  Subscribe [RSS]  Podcast [RSS]  HTML Tutorials  Podcast Posts  My Design Blog  LinkXchange  CafePress Shop  
Tuesday, June 24

Been Awhile

Wow, it sure has been awhile, hasn't it? Life gets crazy sometimes. Lots of things seem to happen at once, but I'll just mention one. A dear friend's Dad died, so he had to go out of state. My Sister & I were asked to house & dog sit for them, which we did most willingly. We wished them a safe journey, while offering our sincere condolences. Seems like everything piles on at once, doesn't it? Ugh. Well, I guess that's it for now.
Thursday, April 10

htmlnerd-minute: episode 1

Podcast ReDo

As you probably have noticed, I've deleted all episodes. Why? I want to start fresh with better quality episodes. I've gotten video screencast software, so you'll be able to actually see how to do whatever it is that I'm saying. Hopefully, I can post an episode soon.

Mal Unplugged

My Sister's Video on Flickr
Her comments: "This is me playing my red strat.
I am playing the song called "I Dreamed There
Was No War" written by the Eagles.

This isn't great or what I would consider good...
I was just trying to figure out how to do a video
on my Mac.

Unfortunately, this only will play 90 seconds worth.
Oh well.

Let me know what you think..."


Monday, December 10

Moo MiniCards

Well, I did it. I jumped on the Moo MiniCards bandwagon & I'm happy I did. My cards are beautiful. Everyone that sees them just "Ooos" & "Aaahs" over them. The photo below doesn't really do them justice, but at least you get a basic idea of what they look like. They're lovely!

My Moo MiniCards
Tuesday, August 7
Friday, June 22
Saturday, April 7

Audition

This has nothing to do with html or web design,
but some friends of mine have a cafe & they are
looking for musicians to provide their patrons
with entertainment. If you are a musician & live
in the area, click on either link for details.
Friday, March 23

Art & Design by Gloria

I created this Blogger.com template. For more details &
a download link, go to my design blog.

Sunday, March 4

Multi-Touch Computer Screen

Wow, this could change the face of computing!
"Jeff Han and Phil Davidson shows how a multi-
touch computer screen will change the way we
work (and play)." You've got to see this video!
Friday, January 26

No Blogger Button

One of my pet peaves about "new blogger" is the
lack of an updated, compatible blogger button. Well,
I think I've found a solution that works for me.

Did you know that when you click "New Post" & go
to the "New Post" page that the url of this page is
static, instead of dynamic? In other words, it never
changes.

Included in this "New Post" url is your unique blog id #.
For Example, my blog id # is 8755143929966545114. The
url is http://www2.blogger.com/post-create.g? with a blog
id # appended to it.

For Example, mine would look like this:
http://www2.blogger.com/post-create.g?blogID=8755143929966545114
This link with your own blog id will always work.
If you're not already signed in, it'll have you sign in,
but afterwards it'll still take you directly to your blog's
"New Post" page. Nifty, Huh!
Friday, December 8

"Weird Al" on Squidoo

What: Check out this great "Weird Al" Lens.
Why: Because, he's "White & Nerdy".
Friday, November 10

Bose Premonition

Hmm, interesting . . .

Monday, October 30

Lost 5G iPod

Update: I found it, YAY!

I'm in dire straits. I just lost my expensive
(Aaak!) 5G Video iPod & I've been tearing
out my hair looking for it! Augh, Aak, Argh!!!

My Latest Acquisition
Saturday, October 28

Conversation with Leo Laporte

Conversation with Leo Laporte,
Podcast Person of the Year. I
love his podcasts, especially
the MacBreak video podcast!

Thursday, September 28
Sunday, September 3

Geek News Central

Do you like hearing tech news? A great podcast that I really like is Geek News Central. You can grab the feed here.

Frames

What Are Frames?

Frames are kinda different from anything done in html in that you are not making a page in the traditional sense. What you are making is a template where you can put more than one page. Here's an example using TABLE commands:

Page_1


Page_2





Above is a simple table. Read about tables in the Tables Tutorial. In fact, I would strongly urge you to read it first. This will be easier to understand if you do so.

Now imagine that the table above is the entire viewing screen of your browser. Frames are used to do just that, break up the screen. Other pages go in the frame cells. Frames allow you to display more than one page at the same time, in the same screen.

If that table above were a browser screen using FRAME commands, there would be THREE pages involved: The frames page that breaks up the page and "Page1.htm", "Page2.htm". The frame commands that would create a page like the example above would look like this:

<HTML>
<HEAD>
<TITLE>First Frame Page</TITLE>
</HEAD>
<FRAMESET COLS="50%,50%">
<FRAME SRC="PAGE_1.htm">
<FRAME SRC="PAGE_2.htm">
</FRAMESET>
</HTML>

Basic Frame Commands

Neat, huh? There's two pages displayed at the same time. You simply split the screen into two parts and placed a different page in each part. Look again at the HTML frames code above; here's what's going on: FRAMESET starts any frame page. It alerts the browser that FRAMES are going here. COLS denotes that I want columns. In this case, I want two; each 50% of the screen.

Can I do other percentages? Of course you can.
Just separate the percentages by commas and get it all to add up to 99% or 100%. 99%. You see, 33%, 33%, 33% adds to 99 and splits the screen three ways. The browser just distributes the final 1% over the three spaces.

FRAME SRC denotes the source of the frame. Frames read the way you do, from left to right. The first source offered will be the left. I only have two frame sections so I need only 2 sources.

</FRAMESET> ends the whole thing.

Some Quick Questions:

Q: Do I have to write pages skinny enough to fit in only one-half of the page frame?
A: No. The browser will cram it all in the page, but it sometimes looks smashed.
Q: What if my page is taller than the screen? How do I put in a vertical scroll bar?
A: The browser will do it for you.
Q: Can I get rows too?
A: Yup. Here's how you do it...

Page1.htm


Page2.htm







Here's the FRAMES code I'll use to do it:

<FRAMESET ROWS="75%,25%">
<FRAME SRC="Page1.htm">
<FRAME SRC="Page2.htm">
</FRAMESET>

What is Happening Here?
Remember that frames read left to right like you. I told the browser I wanted FRAMES by using the FRAMESET command. I then broke up the page horizonally, instead of vertically, as before.

Naming Cells and Using Targets

Now we know how to break up the screen through FRAMESET percentage commands. Now, to control page changes (links) in your frames. There are 3 basic methods of changing pages within frames:

  • Click on a link in a frame -- just that frame changes.
  • Click on a link in a frame -- another frame on the screen opens the page.
  • Click on a link in a frame -- the frames disappear and you get a regular page.

Here's how you do all three!

Click on a link in a frame -- just that frame changes pages.

This is the default. It just happens without you doing anything extra. So, if that's all you want to do, you already know what you need. Browsers are programmed to handle frame clicks this way. The other two methods require a little more coding.

Click on a link in a frame -- another frame on the screen receives the information.

Now it's time to discuss 2 new commands, "NAME" and "TARGET." Let's say I'm doing a very simple frame page with only three frames. It'll look something like this:

Frame1


Frame2


Frame3









In order for me to ask the browser to send info to another frame, I have to make a point of naming each of the frames. Name them whatever you wish, but keep it simple. Here's what the FRAMESET command will look like, with NAMES:

<FRAMESET>
<FRAMESET ROWS="50%, 50%">
<FRAME NAME="A" SRC="cell_1.htm">
<FRAME NAME="B" SRC="cell_2.htm">
<FRAME NAME="C" SRC="cell_3.htm">
</FRAMESET>

Okay, great... you've named the cells. See the "NAME=" attributes I put in the FRAME SRC tags above? Good. Now that you have the frames named, you can make any link inside of them targeted. Basically, you're going to add a TARGET attribute to the usual <A HREF>. Let's say this example link is in cell a above:

<A HREF="http://www.cbs.com" TARGET="C">

You can guess what will happen. When you click on the link, cell a will remain the same and cell c will open the page.

Leaving a Frames Page Completely

So now you can send information from any frame to any frame. The problem is you're still on the frames page -- and some of the larger pages are squished. Say you want to have someone click on a frame and have the link to pop up as its own page, in a full browser window. Well, you have to tell the browser to do that. Remember, the default is to have the page stay in the same frame. You need to TARGET the link to open by itself. Simple enough. Just follow the format above but make the TARGET, "_top." Note the underline before the word "top." It looks like this: <A HREF="http://www.cbs.com" TARGET="_top">

Encountering Non-Frames-Ready Browsers

That's a problem. Most browsers today accept frames, but many still don't, text-only browsers for example. The "frames-challenged" will get an error code if they attempt to log on to a page with frames. Either that or they'll get a blank page. There's a few ways around it.

  • Don't do frames.
  • Write a page without any frames and offer a choice to go to a framed page or to a non-framed page. That means you have to write two pages.
  • Use <NOFRAME> and </NOFRAME> commands.
More about the NOFRAME command: It's simple. You write a basic framepage like any of the three above -- but -- immediately following the first FRAMESET command you put in a <NOFRAME> command and write a message to the frames challenged. Like so...

<FRAMESET COLS="50%,50%">
<NOFRAME>
The page you are attempting to enter uses frames. Click <A HREF="page.html">Here</A> for a non-frames version of this page.
</NOFRAME>
<FRAME SRC="PAGE_A.htm">
<FRAME SRC="PAGE_B.htm">
</FRAMESET>
</HTML>

Hope This Helps!

The person, whose browser can't see frames, gets the message and the person who can read frames will get the frames page. You know, you could just put the HTML code in there rather than a message. That way, the user would see the page and never know. I hope this
has helped some, Happy Web Building!