Thursday, April 24, 2008

multimedia

As we discussed last week because of the active content bug on ie, putting multimedia files into your HTML is tricky. There is basically no agreement within the industry on what the best way to do this is because the ways that actually work best in the real world are inelegant and not standards compliant. Because of this, i'm taking the practical road on these and showing you some techniques that work now. If you continue in this field, you'll need to keep yourself up-to-date as the argument rages on, and when someone figures out a way that is elegant, standards compliant, and works well on all major browsers and platforms, you'll need to learn that technique in order to provide the best service to your clients.

There is an excellent and full introduction to these issues on the teaching blog of Catherine Garnier

EXAMPLES: all of these, except the youtube example, use the external javascript method of putting content into your site

Thursday, April 17, 2008

Ok-- its time to present your HTML - the assignment from last week was to have an HTML version of your home page that you have validated and have checked on a PC - please post links to your home work pages and post links to this home work on those pages.

We will spend most of the day talking about techniques for making your pages work in HTML- but we will also look at these three things:

The Rule about Javascript is that you are free to use code from anywhwere so long as you a) cite it and b) fully understand how it works. There can be exceptions- For example if you want to use some very complex javascript, so complex that you probably can't figure out how all of it works yourself, like in JQuery or in the Flexcroll above, you just need to talk to me about it- if you have a good reason to use it, and what you want to use it for is not something you could figure out how to do yourself, then i'll make an exception. NO EXCEPTIONS WITHOUT TALKING TO ME FIRST! - some of you already have....and of course you still have to cite where you got the code from - that never changes.

home work

Next week is spring break, so for two weeks from today- the assignment is to have a working beta version of your site.

what is a working beta?

its a version of your site that has all the pages built, and all the pages linking to each other. It might still have some "Lorem Iposom" text in it, it might have stand-in pictures instead of real pictures. It should NOT- have big blank spaces- put in fake text and pictures if you don't have the real text and real pictures so you know how you're going to style them and how you're going to space them. A beta version of a site may still have some bugs and may not look right in all browsers but its got all of its major parts and it pretty-much works. That is your goal for when we come back and you'll be showing them in class on that day. Belive me you want to have all of the remaining weeks to polish and tweak and make every little detail work just right, you're going to need that time- the last little bits always take longer than you think.

Wednesday, April 9, 2008

Post your homework to the comments of this post! which, i believe, was an HTML version of your home page, no?

Last week we spent the whole time talking about design (which is really kind of a good thing) so this week we'll talk about what we were going to do last time, and then, if we get time, we'll talk about mashups and API's

Form Processing with PHP

In order to process the information submitted by a user to a form on your site, you need a way to capture that data. Because HTML, CSS, and JavaScript all happen on the client-side, and can’t send information back to the browser, you need something like PHP, working on the server side, to do this. We’re going to go over two very simple form processing scripts today.

Sample Files: (control+click or right click to download)

Step 1, Set the Form Action

To invoke the PHP code you are going to use to process the form, you are going to submit the form to a .php page. This is accomplished by setting the form action to the name of the page:

<form action=”email_form.php” method=”post”>

Step 2, Create the handler script

Next, you are going to create a .php file to process the form contents. In this example, we are going to name this script email_form.php

By submitting our form to this script, the values from the form are passed to it. These values are automatically stored in an array called $_POST. We can now access the values in this array, and the first thing we need to do is to make them easier to work with:

//Change post variables to regular variables

$ipod = $_POST['ipod'];

$laptop = $_POST['laptop'];

$cell_phone = $_POST['cell_phone'];

$borough = $_POST['borough'];

Note that the values between the brackets [’…’] match the names of the inputs you passed from your form.

The next thing you need to do is turn all these values into a single string so it can be emailed:

//Turn all the variables into a single string.

//Note: .= appends to the current variable value rather than replacing it

$formresults = "Ipod: ".$ipod."\n";

$formresults .= "Laptop: ".$laptop."\n";

$formresults .= "Cellphone: ".$cell_phone."\n";

$formresults .= "Borough: ".$borough;

Next, you will use the built-in function called mail to email the form results to the designated email:

The last thing you need to do is create the text file. Open up a text editor and save a blank document as formdata.txt. Upload it to your site. You may need change the file permissions in order for the script to work right. The permissions should be 666, readable and writeable by everyone.

Mashups, "the distributed web" how to leverage other people's technology for your own client's benifit

Homework for next week

-Revised HTML versions of your client's home page, Validated and tested on A PC! --layout need not be perfect on a PC but I want you to know what problems you are going to have to deal with now, not later - therefore i want a screenshot of your page on a pc to prove you tested it! can be a jpg or any kind of digital file- and it can be anywhere on the web- so long as i can see it

Thursday, April 3, 2008

Form Processing with PHP

In order to process the information submitted by a user to a form on your site, you need a way to capture that data. Because HTML, CSS, and JavaScript all happen on the client-side, and can’t send information back to the browser, you need something like PHP, working on the server side, to do this. We’re going to go over two very simple form processing scripts today.

Sample Files: (control+click or right click to download)

Step 1, Set the Form Action

To invoke the PHP code you are going to use to process the form, you are going to submit the form to a .php page. This is accomplished by setting the form action to the name of the page:

<form action=”email_form.php” method=”post”>

Step 2, Create the handler script

Next, you are going to create a .php file to process the form contents. In this example, we are going to name this script email_form.php

By submitting our form to this script, the values from the form are passed to it. These values are automatically stored in an array called $_POST. We can now access the values in this array, and the first thing we need to do is to make them easier to work with:

//Change post variables to regular variables

$ipod = $_POST['ipod'];

$laptop = $_POST['laptop'];

$cell_phone = $_POST['cell_phone'];

$borough = $_POST['borough'];

Note that the values between the brackets [’…’] match the names of the inputs you passed from your form.

The next thing you need to do is turn all these values into a single string so it can be emailed:

//Turn all the variables into a single string.

//Note: .= appends to the current variable value rather than replacing it

$formresults = "Ipod: ".$ipod."\n";

$formresults .= "Laptop: ".$laptop."\n";

$formresults .= "Cellphone: ".$cell_phone."\n";

$formresults .= "Borough: ".$borough;

Next, you will use the built-in function called mail to email the form results to the designated email:

The last thing you need to do is create the text file. Open up a text editor and save a blank document as formdata.txt. Upload it to your site. You may need change the file permissions in order for the script to work right. The permissions should be 666, readable and writeable by everyone.