0 copyright rebecca anthony & john achrazoglou, 1999. electronic web portfolios developed by:...

1Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Electronic Web PortfoliosDeveloped By:

Rebecca Anthony

John Achrazoglou

Copyright 1999

2Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Importance of technology skills“The expanding use of Internet technologies by businesses has resulted in a growing demand for skilled professionals to develop and support World Wide Web applications.”

Source: “Occupational employment projections to 2006,” Monthly Labor Review

3Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Electronic portfolios increase marketability by:

• Showcasing skills while simultaneously demonstrating technical abilities.

• Using global marketing tools. Provide URL (Internet address) to selected employers through résumés (on-line or paper), email, or traditional correspondence and contacts.

4Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Tools for building portfolios• HTML (Hypertext Markup Language) or, Web page

editors (e.g. Microsoft FrontPage®, Claris HomePage®)

• Graphic editing programs to enhance pictures in portfolio (e.g. Adobe PhotoShop®, Illustrator®)

• Access to multimedia equipment: audio editors, digital/video cameras, page or slide scanners

5Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Tools for building portfolios• Method to upload materials to Web servers.

(“FTP” or “Fetch” utility programs or through HTML editor)

• Knowledge of Java, JavaScript, or CGI for sophisticated Web interactions.

6Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Target materials to audience • Employers want “job-related” materials.• Select professional items targeted for

specific employers. Know professional standards in career area.

• Choose items and artifacts that clearly identify success in past performance.

• Promote skills relevant to viewer.

7Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Key content items for electronic portfolios

• Proof of knowledge/specific training

(academic/career/practical area)• Examples of team work-leadership

(committee, group or individual) • Summaries of related experiences

(internship, field experiences, jobs)• Evidence of presentation-communication skills

(writing, speaking, organizing)

8Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Do not include:• Photographs of friends, family, pets• Personal details - age, race, religion, marital

status, dependents, significant other• Images of licenses, certificates, transcripts• Political or religious affiliations• Tasteless or insensitive material• Copyrighted material

9Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Electronic portfolios start with a “Digital Backpack”

• Collect materials on high capacity drives (hard drive, Zip) and save in digital backpack for future use.

• From backpack materials, choose best items to present to employers.

• As career begins, take portfolio items and build a professional toolbox.

10Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Design rules of thumb• Outline• Density• Alignment• Color• Consistency• Layout

11Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Outline• Create visual map, outline, or flow chart

for portfolio.• Plan ahead - create Web pages by

visualizing content and graphics on paper, then move ideas to the screen.

12Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Density • Space visually connects or disconnects

material on a Web page.• Carefully use space to organize and

present key points. • High density levels of information are hard

to read and discourage viewers. Fewer words and more space is advantageous.

13Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Alignment• Align materials in center, left, or right side.

Choose one alignment and stick with it.• In general, put important information in the

middle of the page. Keep related items in close proximity to each other.

14Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Color• Colors enhance message.• For impact, choose reds and blues.• For large areas of text, choose soothing

colors - brown, black, or burgundy.

15Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Color• Use contrasting colors for text and

backgrounds.

• Use light colored letters on a dark background or dark letters on a light background.

16Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Consistency • Repetition unifies the Web portfolio. • On each Web page use the same

layout/format, fonts, colors, backgrounds, basic graphics, and navigational buttons.

17Copyright Rebecca Anthony &

John Achrazoglou, 1999.

LayoutIncrease readability by limiting the use of:• italics• font variations• CAPTITALIZATION• Blinking text

18Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Layout• Design to fit 15” (or larger) monitors.• Produce many short Web pages rather

than a few long complex ones; avoid prolonged downloads and unnecessary scrolling by the user.

• Navigational buttons should appear in same location on each Web page, usually somewhere on the perimeter of the page.

19Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Layout• Avoid using frames if possible; use HTML

tables to place materials side-by-side.• Frames may not be supported by some

Web browsers and may not work well with software used by people with visual disabilities.

20Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Other tips• Users with visual disabilities may rely on

text readers to speak text out loud.• Include text versions of your portfolio or

have text descriptions under buttons, graphical navigational aids, etc.

21Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Guidelines for graphics• Use graphics on Web pages labeled as .jpeg,

.jpg or .gif. These graphic formats are widely supported and perform well on the Web.

• Overuse of detailed graphics may result in poor downloading performance.

• Use lower to medium resolution graphics with fewer colors in place of detailed high resolution images.

22Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Email and hyperlinks in portfolio• Include email address to accommodate

quick and easy communication.• Add links to other Web sites only if they

enhance your portfolio.• Check links to other Web pages regularly.

Internet addresses can change or be disconnected.

23Copyright Rebecca Anthony &

John Achrazoglou, 1999.

Where can I learn more?• Courses from local college, community

college or technical training center• Tutorials on the World Wide Web• Manuals, documentation, on-line help that

comes with software packages• Textbooks and learning guides from

bookstores

24Copyright Rebecca Anthony &

John Achrazoglou, 1999.

The End