Educational Technology Foundations
Module 12: ePortfolio Web Design
Wikipedia's article about electronic portfolios is at en.wikipedia.org/wiki/EPortfolio. This article identifies three main types of ePortfolios: developmental, reflective, and representational.
ePortfolio Resources
In his article entitled ePortfolio, George Siemen provides alternate definitions of the term ePortfolio. At the end of this article, Siemens recommends the Electronic Portfolio Resources from the EDUCAUSE Resource Center.
Sample ePortfolios
The following ePortfolios contain design elements and navigational strategies that you may wish to consider emulating in your own electronic portfolio:
- Highly rated by the UD faculty who reviewed it is Rachel Leibrandt's ePortfolio.
- Another example with a different look and feel is Megan Easter's ePortfolio.
- SOE Master of Education student Bud Clark, who works as the Manager of Music Technology Systems here at the University of Delaware, has created a beautiful ePortfolio template that you can download in a variety of color schemes. As you will notice, this template was designed for use by music students, but you can customize it for a wide range of purposes. The template is freely downloadable, courtesy of Bud Clark.
- You may also wish to consider the favorite Web designs that are downloadable from the Open Source Web Design (OSWD) site.
- A simple yet well-designed source of good CSS templates is www.mollio.org.
CSS
CSS stands for cascading style sheets. CSS is an emerging technology that is improving Web design by permitting developers to separate content (which goes in the HTML file) from styling (which goes in the CSS file). Over the past few years, the Web has been transitioning from table-based page design, in which HTML tables were used to layout Web pages, to CSS layout, which uses absolute positioning to place so-called divisions onscreen. You create divisions with DIV tags in your HTML, then you use CSS to position the DIVs onscreen.
One of the greatest advantages of CSS is that it makes Web pages more accessible for users with special needs. In fact, you can use different style sheets for different classes of users, depending on their needs. You can also design a style sheet for printing and use it to give users the option of displaying a printer-friendly version of your page.
The World Wide Web Consortium's Web Accessibility Initiative recommends that whenever possible, Web pages should use CSS instead of HTML tables for layout. This recommendation is one of the Quick Tips for Web accessibility.
Consider using CSS to create the layout for the ePortfolio project you will create in this course.
