12: Creating a Media Portfolio
- Page ID
- 293778
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\( \newcommand{\dsum}{\displaystyle\sum\limits} \)
\( \newcommand{\dint}{\displaystyle\int\limits} \)
\( \newcommand{\dlim}{\displaystyle\lim\limits} \)
\( \newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\)
( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\id}{\mathrm{id}}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\kernel}{\mathrm{null}\,}\)
\( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\)
\( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\)
\( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\AA}{\unicode[.8,0]{x212B}}\)
\( \newcommand{\vectorA}[1]{\vec{#1}} % arrow\)
\( \newcommand{\vectorAt}[1]{\vec{\text{#1}}} % arrow\)
\( \newcommand{\vectorB}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vectorC}[1]{\textbf{#1}} \)
\( \newcommand{\vectorD}[1]{\overrightarrow{#1}} \)
\( \newcommand{\vectorDt}[1]{\overrightarrow{\text{#1}}} \)
\( \newcommand{\vectE}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash{\mathbf {#1}}}} \)
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\(\newcommand{\longvect}{\overrightarrow}\)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\(\newcommand{\avec}{\mathbf a}\) \(\newcommand{\bvec}{\mathbf b}\) \(\newcommand{\cvec}{\mathbf c}\) \(\newcommand{\dvec}{\mathbf d}\) \(\newcommand{\dtil}{\widetilde{\mathbf d}}\) \(\newcommand{\evec}{\mathbf e}\) \(\newcommand{\fvec}{\mathbf f}\) \(\newcommand{\nvec}{\mathbf n}\) \(\newcommand{\pvec}{\mathbf p}\) \(\newcommand{\qvec}{\mathbf q}\) \(\newcommand{\svec}{\mathbf s}\) \(\newcommand{\tvec}{\mathbf t}\) \(\newcommand{\uvec}{\mathbf u}\) \(\newcommand{\vvec}{\mathbf v}\) \(\newcommand{\wvec}{\mathbf w}\) \(\newcommand{\xvec}{\mathbf x}\) \(\newcommand{\yvec}{\mathbf y}\) \(\newcommand{\zvec}{\mathbf z}\) \(\newcommand{\rvec}{\mathbf r}\) \(\newcommand{\mvec}{\mathbf m}\) \(\newcommand{\zerovec}{\mathbf 0}\) \(\newcommand{\onevec}{\mathbf 1}\) \(\newcommand{\real}{\mathbb R}\) \(\newcommand{\twovec}[2]{\left[\begin{array}{r}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\ctwovec}[2]{\left[\begin{array}{c}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\threevec}[3]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\cthreevec}[3]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\fourvec}[4]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\cfourvec}[4]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\fivevec}[5]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\cfivevec}[5]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\mattwo}[4]{\left[\begin{array}{rr}#1 \amp #2 \\ #3 \amp #4 \\ \end{array}\right]}\) \(\newcommand{\laspan}[1]{\text{Span}\{#1\}}\) \(\newcommand{\bcal}{\cal B}\) \(\newcommand{\ccal}{\cal C}\) \(\newcommand{\scal}{\cal S}\) \(\newcommand{\wcal}{\cal W}\) \(\newcommand{\ecal}{\cal E}\) \(\newcommand{\coords}[2]{\left\{#1\right\}_{#2}}\) \(\newcommand{\gray}[1]{\color{gray}{#1}}\) \(\newcommand{\lgray}[1]{\color{lightgray}{#1}}\) \(\newcommand{\rank}{\operatorname{rank}}\) \(\newcommand{\row}{\text{Row}}\) \(\newcommand{\col}{\text{Col}}\) \(\renewcommand{\row}{\text{Row}}\) \(\newcommand{\nul}{\text{Nul}}\) \(\newcommand{\var}{\text{Var}}\) \(\newcommand{\corr}{\text{corr}}\) \(\newcommand{\len}[1]{\left|#1\right|}\) \(\newcommand{\bbar}{\overline{\bvec}}\) \(\newcommand{\bhat}{\widehat{\bvec}}\) \(\newcommand{\bperp}{\bvec^\perp}\) \(\newcommand{\xhat}{\widehat{\xvec}}\) \(\newcommand{\vhat}{\widehat{\vvec}}\) \(\newcommand{\uhat}{\widehat{\uvec}}\) \(\newcommand{\what}{\widehat{\wvec}}\) \(\newcommand{\Sighat}{\widehat{\Sigma}}\) \(\newcommand{\lt}{<}\) \(\newcommand{\gt}{>}\) \(\newcommand{\amp}{&}\) \(\definecolor{fillinmathshade}{gray}{0.9}\)
This portfolio guide has been adapted from the Southern Illinois University Edwardsville CODES program's e-Portfolio Guide. It has been modified to address a Journalism/Mass Communication student audience.
What is a media portfolio?
A media portfolio is a digital space for you to track your achievements, reflect on your growth as a media writer and producer, and craft a digital identity to share with others. In almost all media professions, having a portfolio is a necessity. It enables you to show your work to potential employers and to share your capabilities with those who might hire you on a freelance basis as well.
A media portfolio functions as a personal website, a public-facing record of achievements that can be shared not only with potential employers but also with peers, mentors, community groups, and graduate schools.
In most Journalism and Mass Communication programs, portfolios serve three purposes:
- Repository: For each course you take where you produce original media content, you’ll have a page to store all your major assignments and reflections on how the work was created, what you learned from the process, and what the work means to you. As you progress through your program, you should add works to your portfolio that demonstrate your best work. Curating your own content is essential to your learning process. As your work improves, you should find yourself adding and featuring your best content and removing or de-prioritizing other work.
- Vivid Digital Resume: Potential employers want to see your best work more than they want to see a progression from novice to more experienced student, so your portfolio should have a few standard sections outlined in the assignment below along with any additional sections you find relevant to your particular career goals. Note that most media portfolio sites are limited to 3-4 tabs
- Reference for Mentors: Over the course of your time in your Journalism or Mass Communication program, you should track your own development as you add to and update your portfolio site. Your portfolio site is your place to establish your brand and tell your story demonstrating what you have learned and what you have the potential to be.
Assignment: Media Portfolio Website
Objective
Develop a personal media portfolio website that showcases your writing and production skills. This should serve to define and promote your professional brand and should make the most of web resources that allow for a professional presentation
Instructions
Research and Planning
- Begin by searching for and examining a few portfolio websites from media professional you admire to gather inspiration. Take note of the layout, color palette, navigation tabs and tools, and how content is presented.
- Draft an outline for your portfolio. Decide on the type of work you’ll showcase and how you will divide up your content for the most professional presentation.
Content Creation
- Select your best work. Ensure each piece is professionally presented and accompanied by a description of how the work was produced. If a work in your portfolio was the result of a group project, indicate your contribution in clear, unambiguous terms.
- Include the following four sections.
- About section should highlight your background, expertise, and professional goals.
- Portfolio tab should feature your best multimedia pieces and media writing examples with clear descriptions explaining what each included piece says about your capabilities. Use thumbnail images and links and/or embedded media players to demonstrate each piece.
- Contact page should include links to your email, LinkedIn, and other relevant social media profiles.
- Resume document should be included in its own tab. Use a document display plugin.
Website Tools and Setup
- Choose a Platform
Select a content management system that suits your level of experience and your tolerance for cost. Many portfolio and blog sites operate on a freemium model, which means they have functional free layouts that may work for students looking for entry-level positions. Freemium sites also offer premium options that may include additional layout options and web hosting. The following is a list of portfolio sites still active in 2026. The list is not exhaustive, and the technology changes so quickly that all students should conduct their own search for media porfolio website options when they are ready to build.- Wix and Squarespace have drag-and-drop capabilities and functional free versions, but users can expect to be pushed to use paid versions.
- WordPress or Webflow can allow for more customizable portfolio sites. Many media professionals who purchase their own domains and pay for webhosting elect to install WordPress as a versatile, open-source software option.
- Framer and Ghost are for more art-focused portfolios
- Adobe Portfolio is an option for those who subscribe to the Adobe Creative Cloud software suite and plan to continue to do so.
- Design and Layout
Using pre-made templates will work for most student portfolios, however, AI tools make it quite easy to develop your own website, if you are willing and able to manage the hosting and upkeep of a site. If you choose to develop your own portfolio site design, remember to focus on simplicity, ease of navigation, and accessibility. - Embedded Media
Ensure video clips and other multimedia projects are optimized for quick loading speeds so content can be displayed quickly and clearly on all devices.
Key Features to Consider
- Search Engine Optimization
Add meta descriptions, alt text for images, and use descriptive headings. - Analytics Setup
Consider integrating a basic analytics tool, such as Google Analytics, to track visits and engagement. This is optional but recommended to understand user interactions.
Submission and Presentation
- Submit the URL of your completed website along with a short summary of 250-300 words that explains your design choices, tools used, and the strategy behind your portfolio layout.
Suggested Evaluation Criteria
- Design (30%)
Is the design visually appealing and consistent with the media portfolio’s purpose? - Content Quality (30%)
Are the chosen works of high quality, relevant, and well-organized? - Functionality and Responsiveness (20%)
Does the site function well on different devices? Are all links and media working? - Professionalism and Clarity (20%)
Is the site free from errors, and does it communicate your professional brand effectively?