dreamweaver for portfolios take2
TRANSCRIPT
BasicsYour portfolio is similar to a webpage that you can have offline (or online)
Each introduction or each page is a new .html file
.html files are very similar to .doc files, so no need to be afraid of it
Always give your files a name that means something to you (and maybe the reader) so you can find it:
Avoid “paper1”, “LSPA536” or “maite” and use “NPs_in_portuguese”, “spanglish_Correa” or “assessment_strategies”
Keep files organized in folders. Think before you start and have an outline of the organization
Organize Your Ideas in FoldersMain Folder
Overview: usually called “index.html”
Teaching Philosophy
CV
DOMAINS
Domain1: language
Domain 2: culture
…
PDFS
Paper
Another paper
Another paper
LESSON PLANS/RESOURCES
Lesson plan
Another lesson plan
OTHER MATERIALS
Evaluations
Pictures
Videos
There are multiple ways of doing this. Just do it in a way that looks LOGICAL to you
Let’s Start
Use the folder where you already have all your files
Remember that ALL your files and folders will be inside this folder
Now the filesStart with the main page/overview
File->New-> blank HTML (other options available)
First thing you might want to do not to freak out: hide the code and select “design”
Now we are going to format the page layout
AppearanceBe a little conservative with colors (avoid RED to be safe). Remember that, like with PPT presentations, colors get distorted depending on the computer/screen/projector.
Remember your layout and do the same with your other pages (unless you want different backgrounds for different pages, which is a little 90’s )
Explore What You Can Do
Give a “real name” to every page (so it does not say “untitled document”). This name is different from the file name and can be a whole sentence. Make it descriptive enough. It will appear on the browser’s header.
Write some text
Play with the size (heading1, heading2…)
Play with the right click and discover things you can do
Play with the menu on top
Think of the links you are going to have in that page and write the name (not link yet)
Insert a pictureMake sure the picture is already in your “portfolio folder”)
Insert -> Image -> Choose the picture
Make sure you are linking to a picture in your folder by looking at the URL box
Relative to: document
Save, Save, Save
Save this page as “index.html”
Open a new one. For example, “teaching philosophy.html”
Play with it and save it
LinksOpen again the index page
Select the text that you want to link to the teaching philosophy and right click
“Make Link”
Choose “teaching philosophy.html”
Do the same with the pdfs you have
Save, save, save
Open your teaching philosophy and link it back to the index page
Keep on playing
At this time…You should see your files and folders on the right corner of the screen. You can open the files directly from there instead of using the Open command
Check
You can preview from inside Dreamweaver:
This is where you make sure that all links are working
It is never too much to take your USB to another computer that does not have Dreamweaver and check your files by double clicking on the “index” file and seeing if all the links work in a regular browser like Firefox or Internet Explorer.
Important
Check, check, check
Open your files in other computerS to make sure that all the links, pictures and files are still opening
Check, check, check
We are in the 21st Century: avoid an overflow of information and colors and be simple and elegant
Uh, and check
All this info in my webpage (that I proudly created with Dreamweaver):
http://lamar.colostate.edu/~mcorrea/teaching/workshops.html