Tech Tips for BHSEC Students » Web Design

Instructions for setting up KompoZer

pkolbe — Mon, 14 Jan 2008 17:28:53 +0000

Select EDIT — Publishing Site Settings…

For BHSEC, write in:

For the first time you set this up, select “Save password”. However, if you’re not on your own computer with your own username and password, after you’re done with Kompozer don’t forget to go back and uncheck the box. You don’t anyone else being able to access the site.

After all of this is set up, under Site Manager you should be able to see the name of the site you entered, with a plus in front of it.

Once you click on that plus sign, Kompozer should take all of one second to access into your site, after which you should be able to see all of the directories and files of your site under the site name.

Also, the proxy needs to be setup. Select TOOLS — OPTIONS — ADVANCED.

In the Connection box, click on Connection Settings, then fill in the following:

Posted by Joana

Web Basics 101 -WYSIWYGs and Editors

pkolbe — Fri, 19 Oct 2007 16:32:48 +0000

Dreamweaver is your classic WYSIWYG (what-you-see-is-what-you-get). A WYSIWYG user does not need to know how code works because s/he can simply use the program’s interface (buttons and tools) to do all the formatting. A WYSIWYG is like making web pages with MS Word. In an editor, you work only with the code. The best way to teach web design is with an editor, but as your code gets more complicated a WYSIWYG is more efficient. Bhsec owns a few copies of Dreamweaver. All the macs in the music department have it, the yearbook pc in the CTO has it, and so does my computer. As you can see, it’s somewhat hard to come by in Bhsec. For this reason, I install kompoZer for many of the staff who need to do webdesign. KompoZer is open source and works on osx/win/linux.

General points to remember:

Don’t reveal email addresses. This is a sure way to get lots of spam.
Watch your relative links. IOW, will only work if this css file *really* is in the directory above the current one. (Double dots mean the directory above.) You could also use static links (ie http://www.bard.edu/bhsec/yadayada/bhsec_stylesheet.css”) but this is generally poor practice because if any folder name is changed, in the path above the file, all the static links will break.
Make use of our pre-defined format styles found in our css file so that the look and feel will be consistent across the bhsec website. In kompoZer, switch to the Html Tags view (tab at the bottom) to enable the css pulldown on the top left.
Think about how to make it easier for the faculty to change the the content of their webpages without having to deal with code. For example use inc files for the content (just one idea). But also maybe make a form (in php) to edit their content.

Web Basics 101 -FTP and Backups

pkolbe — Thu, 18 Oct 2007 13:34:26 +0000

The first “web basic” I want to impart is to make backups of all your work! For this you’ll need an FTP client.

FireFTP is, IMHO, the simplest ftp client. It works on osx/win/linux. It’s opensource (”free as in beer and free as in speech”). It’s a firefox addon, so you’ll need firefox. Go ahead and bookmark it so you can easily find it. On the top left look for a new toolbar with: Manage Accounts>New…

Ok> then select “Connect”. Notice it changes to “Disconnect”. The left hand side is the filesystem of the computer you’re working on right now, the right hand side is the remote server you’re editing. You don’t need the left hand side (you can drag/drop from outside firefox) but I recommend you use an ftp client so you can easily keep backups while you edit web pages… and the left hand side makes copying entire folders much easier.

I recommend you first make a backup of the entire site. It won’t take long, websites are often very small in size.
Next, I recommend that before you edit any file, you make a copy and name it something like filename.html-bkup01. Then, each time you edit the file again, increase the number eg bkup02.

Occasionally I need an sftp client, which fireftp isn’t, and I use filezilla. On OSX I hear you can use fugu or cyberDuck.