Home  > Teaching > Digital Portfolio Seminar

Digital Portfolio Seminar

Digital Portfolio Sitemap Example
File Size: 20 kb
File Type: pdf
Download File
Digital Portfolio – Building your Portfolio
 
Options  
Select a theme
You will want to select a theme that reflects your personality, but is also appropriate for your career field. Remember, you can always change it later or make adjustments to the design.
 
Creating pages
You will want to begin by setting up all of your pages, so you can easily navigate through your site and add content later.
  • Create all of your pages
    • Structure pages according to your site map
      • You can hide pages that you do not want to appear in your main navigation
      • These would be your sub-navigation sections
  • Weebly: Pages (top navigation)
  • Wix: Select navigation bar > Manage Menu
 
Best Practices
  • Avoid layouts that cause your navigation to add a ‘More’ dropdown option to show your additional navigation
  • Complete page information (Under the Advanced tab)
  • Consider adding headings to each of your interior pages
  • Avoid using the default image in headers
 
Set-up your homepage
You will want to start by developing your home page first. This page should be treated as an introduction to your entire site and provide users with basic details on what your site is about.
 
Best Practices
  • The content on your homepage should answer the questions:
    • What is the site about? Provide an ‘About’ blurb, which can include your name, expertise, career path, etc. (your short bio), then link to your About page.
    • Where can I go next? Provide content blocks that link to interior pages and consider profiling your best work or the work that demonstrates your knowledge of the field.
      • Digital Media Production: Consider a slideshow, gallery or single image of your best design, or your best video.
      • Journalism: Consider making your homepage a blog and begin writing a weekly blog post or use the blog as a way to showcase some of your writing.
      • PR/IMC: Consider previewing a media kit or setup a blog related to your field.
      • BA: Consider any of the above options or if you are considering graduate school, I would lean towards showcasing your research.
      • Whatever you show, you should provide a link to your portfolio page or individual work page to provide more details.
    • What is new here?
      • Always consider updating your home page with fresh content
  • Structuring content
    • Option 1: use the template provided by the site
    • Option 2: look for inspiration from other sites (bestwebgallery.com) to customize the design
 
Editing features for content
All of these sites allow for you to add a variety of textual and visual elements to your site. This is where it becomes important to have a vision for how you would like your site to be structured. Weebly allows you to start from scratch, where the other three options provide you with a general layout and placeholder content.
  • Weebly: Build > Toolbar on left-hand side
  • Wix: Edit Toolbar & Selecting objects gives you editing capabilities
 
Best Practices
  • Don’t forget about information hierarchy through textual adjustments (size, style, color) – create a scheme for your site (style sheet)
  • Text is important (SEO), so make sure you are writing strong content
 
Structuring Portfolio Content
A major portion of your site will be the portfolio page(s). You will want to have a plan for how you would like to structure the content on your pages before diving into setting it up. As I mentioned before, do your research and look for portfolio sites you could potentially replicate their content area layout.

Options
  1. One portfolio page: List all of your portfolio pieces on one page with section headings
  2. Individual portfolio section pages
  3. Individual portfolio pages with thumbnails to unique pages for each portfolio piece
 
Best Practices
  • Create a grid structure for your content – don’t just randomly throw it on the page
  • Design/Art
    • Add a JPG/PNG and allow it to open as a larger file
    • Use slideshows or image galleries for work, add captions to each image
    • Add a text block for each piece or set of pieces with: title and description
  • Video
    • Publish video to YouTube
    • Create a thumbnail of video and make it a link out to your YouTube or Vimeo video
      • Make the thumbnail a link
      • Add a link at the end of the description, i.e. View “Video Title” on YouTube/Vimeo
    • Embed YouTube or Vimeo video on page
    • Add a text block with: video title, description, and time
  • Audio
    • Weebly requires a Premium account, but you can always upload your music to Soundcloud or an external site that allows for embeds on a website.
  • Writing
    • You do not need a visual, unless you want to post your title page or a supporting image for your piece
    • Add a title, description and link to the piece – consider making the title a link to the piece or add a textual link at the end: Read “Title”
  • Files
    • If you load a file, you will want to upload a PDF.  This will load a PDF icon on your site, so make sure to rename the file to the title of your piece.
    • You should consider linking text or a button to a file, rather than having the icon – i.e., Resume (PDF)
  • PowerPoint or Prezi
    • If you want to post a PowerPoint, I recommend creating a Slideshare account, uploading your PowerPoint, selecting Share underneath your PowerPoint and using the embed code to embed it on your site.
      • For Weebly, you will want to use the ‘Embed Code’ option on your Build toolbar
      • For Wix, you will want to select ‘More’ > HTML code from the Add option
    • If you want to post a Prezi, the presentation provides you the embed code for your site.
  • Media Kits or Multiple Piece Projects
    • Group all of the elements in a slideshow
    • List of links under the descriptions
    • Unique page with all of your project elements on the page
  • Resume
    • Type out your resume onto the webpage and add a link to a PDF version
  • Contact
    • Add a contact form
 
Publishing your site
When you are ready to publish your site, you will want to do the following:
  • Weebly: Click ‘Publish’ (orange button) in the upper right corner
  • Wix: Click ‘Publish’ (blue button) in the upper right corner
Note: Every time you make changes to your site, you will have to click publish for them to load on your live site.
 
Mobile Layout
In the age of mobile devices, it is important that you adjust your layouts for mobile devices. These options are available at the top of the browser window (Desktop or Mobile phone icon)
 
Best Practices
  • You will want to wait until you are done with your Desktop layout before making adjustments to the mobile layout.
 
 Advanced Practices
  • Custom Domain Name
  • Social Media feed (Twitter) - similar to embedding a PowerPoint from SlideShare
  • SEO: you can apply SEO knowledge to your site
  • Google Analytics: you can setup a Google Analytics account and run them on your site