Portfolio: Content Guidelines and Design Tutorials
Building a Professional Portfolio
As a junior and senior in the school of BIS, you will create a professional portfolio using Adobe Dreamweaver. Many of you have at least some experience using Dreamweaver – worklinks for example – but some of you probably have never used Dreamweaver beyond this application. It's our belief that learning how to use industry-standard software as a tool to complete a project is essential for student learning and will give students an edge in the job market after high school. Let's face it, technology propels our world forward, and is an integral part of our lives and the way we do business – without the skills and tools to keep pace, you might just find yourself left in the dust of the past.
As part of the development of your Professional Portfolio, you will explore a potential career you are interested in. Furthermore, you will research a college or university that you would like to attend so you may secure your dream job. The theme of your portfolio will reflect your collegiate or career interests.
We've divided the steps and guidelines in two sections: Content and Design. You must complete the required content modules before moving on to the design modules. Completing the content modules first will make it easier for you to complete the design.
Student Portfolio Examples
You can explore previous students' portfolios by visiting The Student Portfolio Page. You can see the various changes and improvements over the last few years. We constantly revise and update the requirements each year, building upon the successes and failures of content requirements and design.
Design Modules
Getting Started
Setting Up Page Properties
Building the Shell
- Introducing Tags
- Inserting the Wrapper <div> Tag
- Inserting the Header <div> Tag
- Inserting the Navbar <div> Tag
- Inserting the Content <div> Tag
- Inserting the Footer <div> Tag
- Formatting the Footer
Creating a List-Style Navigation Menu
- Create the Navigation List
- Inserting Link Placeholders
- Styling the Navigation List
- Styling the Navigation Links
Creating New Pages
- Create the Resume page
- Create the Education Research page
- Create the Career Exploration page
- Create the Showcase page
Linking the Navigation Menu
Inserting and Styling Content
Banner
Resume
- Inserting Content for the Resume Page
- Formatting Content for the Resume Page
- Styling Content for the Resume Page
Home
- Inserting Resume Profile for the Home Page
- Creating and Inserting a Graphic for the Home Page
- Inserting Goals <div> Tag for the Home Page
Educational Research
- Inserting the About Content for the Education Research Page
- Inserting the Academics Content for the Education Research Page
- Inserting the Tution and Living Expenses Content for the Education Research Page
- Inserting Second Years Required Content for the Education Research Page
Career Exploration
- Inserting Career Intro Writing (First Years)
- Inserting Career Expert Letter (Second Years)
- Inserting Career Exploration Dream Job (both)
Showcase
Final Details
Content
Video Tutorials
*Quicktime required to view tutorials
Click here to download Quicktime
Getting Started
- Setting Up Dreamweaver Workspace (3:05)
- File Management (5:40)
- Defining the Site (7:38)
Setting Page Properties
Building the Shell
- Introducing Tags (11:27)
- Inserting the Wrapper <div> Tag (12:19)
- Inserting the Header <div> Tag (5:05)
- Inserting the Navbar <div> Tag (8:43)
- Inserting the Content <div> Tag (5:00)
- Inserting the Footer <div> Tag (6:11)
- Formatting the Footer (12:26)
Creating a List-Style Navigation Menu
- Create the Navigation List (5:10)
- Inserting Link Placeholders (6:18)
- Styling the Navigation List (9:06)
- Styling the Navigation Links (13:13)