Saturday, October 27, 2007

Review of FTP

It's the weekend before the big project is due, so I imagine many of you are wrestling with those final touch-ups and have completely forgotten how to FTP your sites.
Fear not.
Here's a step-by-step of what we went though in class Wednesday.
Remember, I created subdomains for each of you under markcraddock.com. And, even though we used Internet Explorer as an FTP client, there are others out there. You can, if you prefer, download a client, such as WS-FTP or Win-FTP.
Anyway, here's the drill assuming you are using IE and FTPing to the subdomains I created for you......
1) go to ftp://ftp.markcraddock.com/ (you might get a funky error message, but ignore this.)
2) on the browser menu, go file --> log in
3) you'll get a screen that asks for your login name and password. They are....
LOGIN NAME: yourlastname@markcraddock.com
PASSWORD: YourPCC S number

If you get through, you'll see a directory structure that has several html and php pages, as well as a subdirectory called cgi_bin.
4) Just drag the files from your computer and drop them into the browser window. One the files have copied, your website is live.
5) surf to http://yourlastname.markcraddock.com/ to view your live website

Tuesday, October 16, 2007

Here's a copy of last semester's midterm

...OK, not the actual test, but the code it was based upon. Here's the deal: last semester we were much more deeply into CSS, so the page I designed was stylesheet-based. It looked something like this:




For this semester's midterm, I redesigned this page using strictly old-school techmologies (font tags, table tags, etc.). It will look something like this:




For your studying pleasure, I've compiled these screen grabs, as well as the HTML and CSS used to render the cool version of the page, into a PDF document.
Bear in mind that this is NOT THE ACTUAL CODE that will be on the test, but it is pretty close in many respects, so it might help.
You can download it here
(note: to download it, right-click the link, go to "save target as..." and save it somewhere on your computer. Good luck and happy cramming.
--M

Monday, October 15, 2007

URGENT: midterm ahead

For those of you sleeping through the last couple weeks, the midterm is THIS WEDNESDAY, Oct. 17, 9 a.m. Don't miss it. The test will be open book, open notes, open reference books, etc., but the computers will be off. This is an old-fashioned pencil-and-paper test.
See you then.

Tables

What can I say that I haven't already said five times?
Here's the code from a few lectures -- including the midterm review.
http://www.markcraddock.com/blog/webdesign1/tables1.htm
http://www.markcraddock.com/blog/webdesign1/more_tables.htm
http://www.markcraddock.com/blog/webdesign1/midterm_review.htm

Graphics and images on the web

In this lecture we explored the various image file formats that work on the web, as well as discussed techniques for web-optimizing images. The "cliff notes":
1) Your final image resolution should be no greater than 72 dpi.
2) You should try to crop your image to the exact size you want it to appear on your web page (measure the size in pixels and write it down for later use).
3) The image should be in the RGB color space.
4) for photos, save the final as a jpeg, with a quality about 60 (medium).
5) for line art and type, save the file as a gif, with as small a color pallete as possible to correctly render the artwork.
6) png is a newer file format that is perfectly acceptable for the web, but may have some backward-compatability issues.
7) Likewise, bmp is an acceptable file format, but it does not compress the image files, so you are better off with a gif or jpeg

images are brought onto your web page using the <img> tag, or using cascading stylesheets. Here is the code we wrote in class:
http://www.markcraddock.com/blog/webdesign1/image_lecture.htm
http://www.markcraddock.com/blog/webdesign1/graphics2.htm

Lecture III and IV

These lectures covered the various forms of the <a> , or "anchor" tag.
Some quick rules:
1) use the "href=" attribute to make this a link to another web page or site.
2) use the "name=" attribute to make this an anchor within your web page.
3) use "href=#anchor_name" to create a link to a named anchor on your page.

Code from class:
http://www.markcraddock.com/blog/webdesign1/lecture3.htm
>http://www.markcraddock.com/blog/webdesign1/lecture4.htm

Lecture I and II

This introduces the basic rules of the road for HTML and covers many of the basic HTML tags.
Code covered includes the basic 8 tags on every web page, as well as the headline tags, <a> tag and <p> tag; and the various ordered and unordered list tags.
Here is a link to the code we typed in class:
http://www.markcraddock.com/blog/webdesign1/lecture1.html
http://www.markcraddock.com/blog/webdesign1/lecture2.htm
(The link will open in a new browser window.
To save it, go "view"->"page source" and save the notepad document to your computer).