Working with your artifact files and links

Prepare as many of the files you want to put in your ePortfolio as you can before you begin to create and edit an ePortfolio.

Each artifact presentation page may, in fact, consist of a number of files. For example, a presentation of a teaching unit to demonstrate your capacity to use varied instructional methods might consist of the following:

All of these can be presented on one presentation page. You are best off to have them all handy before you start building the portfolio.

Warning # 1: Always Back up Your Portfolio Files

Chalk & Wire backs up all its files once a day. However, for your own peace of mind we recommenf that you back up all your files on a CD-ROM, a floppy disc, a Zip Disk or even send them to yourself on E-mail. The idea is to have them safely stored anywhere BUT on your prime computer. It is a good idea to keep your backup files in another place altogether (home, a friend’s, a relative’s).

Warning # 2: Do not have any spaces in your file names. The Web reacts very unpredictably to files with names like this:

My project on chemistry.html

Instead, name it any of these:

The digital materials can be of many types:

Images | HTML Pages | Audio | Movies | Portable Document Format (PDF) | Other File Types (non-Web documents)

Images:

These can be taken with a digital camera or scanned into a computer. They must be in either JPEG (.jpg) or GIF (.gif) formats to be viewed on the Web. Avoid using bitmap files (.BMP). These are huge in size, and will take time to show on your web pages. Some software, like Adobe PhotoShop™ and other shareware (cheap) graphic manipulation programs will easily resize your graphics, as well as save them in the right compression format (JPEG or GIF), and at the best resolution (72 dpi). Photoshop™ is ideal because it has a has a save function (SAVE FOR WEB) that optimizes your image for use on the Web ("optimize" is code for compressing it so that it will load in your Portfolio faster). Compression and file dimensions are VERY important. The larger the file size, the longer it takes to display on Web. Try to keep your image files under 100K. This is a good size for people who might be trying to view your ePortfolio via a standard dial-up connection from home.

Image dimensions: ePortfolio™ allows you to use your own images in the graphic themes (templates) in place of the stock photographs already provided. In order to use your own images you must place them on a "canvas" that is 500 pixels wide and 370 pixels high. Chalk & Wire does provide a small utility program called LoadReady™ that you can download and use on Windows machines only that automatically re-sizes images correctly

Alternatively you can crop you image to this size or scale it in graphic manipulation software. If your image is not in these dimensions it will distort when viewed in a graphic theme. If you are looking for inexpensive software to adjust your images, there are a host of options available from software download sites such as Twocows. Two we recommend are:

Sample file names and acceptable extensions that must appear after the file name (no spaces):

Images | HTML Pages | Audio | Movies | Portable Document Format (PDF) | Other File Types (non-Web documents)

HTML Pages:

These are really just text files that are written in HTML code. This is NOT code that you need to know! If you have a relatively new word processor you can make these files easily. Instead, of just saving a page as text, you will find somewhere (usually in the FILE menu) an option to save the file as HTML or "save for the web". This is best done only when the word processed file has no graphics/images on it (see the section on Other File Types (non-Web documents).

Sample file names and acceptable extensions that must appear after the file name (no spaces):

 

Images | HTML Pages | Audio | Movies | Portable Document Format (PDF) | Other File Types (non-Web documents)

Audio:

Most modern computers allow you to record sound (your voice) directly while you sit in front of the screen. Some require an external microphone while others do not. Check your owner’s manual, or talk to a technical assistant to determine your situation.

Sample file names and acceptable extensions that must appear after the file name (no spaces):

Your computer’s sound recording software (or third party software) will give you the option of saving in one of the formats above. Be aware that sound files can be quite large. This will affect how long it takes people viewing your ePortfolio to download the file to their computer to hear you.

Images | HTML Pages | Audio | Movies | Portable Document Format (PDF) | Other File Types (non-Web documents)

Movies:

No matter how you collect these, you need to be concerned about their size. There are ways (software) for optimizing video for the Web. One of best pieces of software for doing this is Cleaner XL, or Cleaner 6 for Mac . Another good bet is QuickTime Pro™ made by Apple™. It is very inexpensive and can do a good job of reducing both the dimensions of a movie and compressing it. This software, like others, compresses your video into a fraction of its original size, and has a simple "wizard" for getting the best results for Web presentation.

Try hard to keep the size of your digital video under 1.5 megabytes. We know this sounds small, but 30 seconds of video is more than you need to show a skill. By reducing the size of the final play screen, and using the right compression format, you can shrink and 5 megabyte movie to 300K of very accept video viewing. Really, we are not making this up! Small is good on the Web. A 30 megabyte movie may be a 5 minute, high resolution, big screen, sound effected, music enhanced marvel ready for Cannes, BUT it is so huge that no one without the fastest access to the Internet will ever be able to view it. If this is what you have in mind, the Web is the wrong medium. Burn this masterpiece onto a CD-ROM or a DVD, and send it along with by courier.

Sample file names and acceptable extensions that must appear after the file name (no spaces):

Images | HTML Pages | Audio | Movies | Portable Document Format (PDF) | Other File Types (non-Web documents)

Portable Document Format (PDF):

This is the document type created by Adobe Acrobat (http://www.adobe.com). This software converts pretty much any document of file into a .pdf file. The software has an attractive educator price. This software is useful for a lot of reasons:

  1. It can be read on any computer after they have loaded the Acrobat Reader Plug-in (which is free from Adobe)
  2. You can annotate the file to add comments, yellow highlights, even your voice to comment on the content people are seeing. This allows you to give a fuller explanation of how this artifact relates to the standard being addressed.
  3. You can add "bookmarks" to the document so that people can "jump to" sections of a larger document instantly rather than wading through the whole document and trying to figure out what parts you want them to see specifically.
  4. All of the above means the same document can be used as the artifact for several standards. This is so because parts of the document can be easily highlighted to focus on different skills, dispositions and knowledge.
  5. Sample file name and acceptable extensions that must appear after the file names (no spaces):

Images | HTML Pages | Audio | Movies | Portable Document Format (PDF) | Other File Types (non-Web documents)

Other File Types (non-Web documents)

There are many other file types that people routinely link to web pages that are not actually directly viewable in a Web-browser like Internet Explorer or Netscape. This is not a problem with ePortfolio™, but you need to know how to use them best. The two most common are Microsoft Word™ documents and Microsoft PowerPoint™ presentations.

Software Application
File extension
Used best
Microsoft Word
.doc
 If your MSWord document is straight text (no images or graphs etc). Then it is simple to convert the document to a Web page.
  • In Windows™, choose the FILE menu; choose SAVE AS; choose WEB PAGE as the format to save the page in. This will rename the file with a ".html" extension.
  • In Macintosh™, choose the FILE menu; choose SAVE AS WEB PAGE. This will rename the file with a ".html" extension.

Upload the web page version of the document to ePortfolio™. It will show right in your audience's Web browser, fully formatted.

If your file has pictures in it (images, charts, graphs), you are probably best to leave it in its original ".doc" format. Upload the file to ePortfolio™ as is, but when asked to name the file type, choose "Other". When someone clicks on a ".doc" file on the Web, the file will be downloaded to the visitor's computer. It will either open automatically in MS Word™, or be saved in a format that is ready to be opened in Word. The only problem here is that you are gambling that the person at the viewing end has MSWord™ on their computer (not a big gamble we realize, but a risk nevertheless).

Why not just save the file to HTML and upload it like you did with the one that was all text? The problem is that when MS Word™ saves files with images as web pages, the code is pretty messy. Also the image files are stored automatically in a separate file folder from the new HTML file (beats us, why they do this!). If you are serious about embedding images in Web pages with formatted text, then we suggest you get your hands on Netscape™ which has a free Web authoring tool in it called "Composer™". It's pretty simple to learn how to use, and it will allow you to create and save all your web files and their images in the same folder so they will work best when uploaded together into your artifacts library of ePortfolio™. Unlike Microsoft document conversions, it also writes very clean code that displays well and reliably in every browser. The choice is yours.
Microsoft PowerPoint
.ppt
 These can be saved to HTML, but again the file and folder structures that are created are complex, and do not always display reliably.

We recommend you leave the file as is (a ".ppt"). Upload it to your Artifact library in ePortfolio™ as a PowerPoint™ file. When asked for a file type, choose "Other" from the drop menu. The only problem here is that you are gambling that the person at the viewing end has PowerPoint™ on their computer (not a big gamble we realize, but a risk nevertheless). Assuming they do, when the browser automatically downloads the file to the viewer computer, it should start up PowerPoint™ and show your presentation. But this is not a 100% guarantee.

Converting PowerPoint™ the files to HTML.

PowerPoint™ will allow you to "Save As" a web page. This creates a mini-web site of your PowerPoint presentation.

If you have an FTP upload option in ePortfolio™, drag and drop all the files and folders created at once into your directory. You need to register only the file that starts the PowerPoint™ mini-web site. This is usually called something like "index.htm(l)" or "start.htm(l)". Open your Artifact directory and click on the files you uploaded until you find this start-up file. REGISTER ONLY THIS FILE. This is the only file ePortfolio needs to know about to access the rest of the presentation.

If you have the Repository method only for uploading files to ePortfolio™ (no FTP), you are using the easiest method for uploading files. The downside is that you cannot upload folders (and PowerPoint™ web sites have lots of folders). In this case, you will have to upload the PowerPoint™ mini-web site to some other web-accessible server (at a University or a commercial provider). Open the directory to this space while you are on the Web. Locate the start-up file for the presentation. You will see its URL (address on the Internet) in the "address" box near the top of the web page. Copy all of this address and paste it into the URL box provided in the "Catalog files on another Web Server" option in the Artifact Library of ePortfolio™ . Give the file a name you want to use as a link title, and register it as a "Web page".