Udemy Business

Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Build a World-Class Freelance Portfolio Website

Name: Build a World-Class Freelance Portfolio Website
Rating: 4.6 (42 reviews)

Learn how to present your work to help you win profitable clients, grow your income & position yourself as an expert

Created byScott Adam Lancaster | 31,000+ Students | Entrepreneur | Leading Brand Development Consultant

Last updated 5/2024

English

English [Auto],

What you'll learn

Learn how to showcase your work like the biggest and best agencies in the world, who charge up to $1.2 million per project.
How to create a world-class portfolio to attract higher paying clients.
How to position yourself as an expert who can demand higher fees and prices.
Showcase your work in the best light so you close more clients without having to give discounts.

Course content

8 sections • 73 lectures • 6h 48m total length

What we'll learn inside the course1:36
A warm introduction to the course, where we cover what you'll be learning and what you're going to achieve by the end of the course.
How to get Free Website Templates & Webflow Support3:33
Discover how to access free Webflow premium support, templates, icons, graphics, and behavioral tracking tools with the same email for you and clients to ensure delivery to the correct Webflow account.
The difference between a $500 vs $10,000 Website5:26
Compare a $500 website to a $10,000 site by focusing on business objectives, structured design, and persuasive copy that boosts conversions, reduces mental energy, and increases profits.
Examples of Lead Generation Websites9:00
Learn how top lead generation websites showcase work, build trust, and simplify services with clear visuals, pricing, and case studies, then apply these lessons to your own site.
Creating a Seamless Website User Experience6:06
Building a Website that can Promote Brand Growth10:34
Develop a clear, objective-focused website strategy by identifying one primary and one secondary goal, such as selling products or growing an email list, to guide the design.
The 5-Second Rule *Do not miss lesson*5:08
Capture visitors' attention in the first five seconds by clearly showing what you do, how you help, and building trust with the benefits you offer.

Alignment & Grids2:48
Explore how alignment and grids create consistent, hierarchical layouts that improve usability across devices, delivering a professional, on-brand user experience with less mental effort.
Visual Hierarchy2:33
Fonts & Typography5:01
Choose 1 or 2 fonts to create a coherent visual language that shapes brand perception, enhances readability, and maintains a consistent typographic hierarchy across responsive pages.
Creating Website Colour Palettes4:49
Create a brand-aligned color palette for your portfolio site, prioritizing a white background, a single primary color, and purposeful accents, with Color Pro Plus guiding emotion and contrast.
Using Your Website Colours Properly2:49
Button Hierarchy Design3:04
discover how button hierarchy creates great looking, prioritized call-to-actions that guide users through your site with minimal clicks, while maintaining consistent styling and simple animations to bring buttons to life.
The Importance of Great Imagery4:54
Learn to select royalty-free, high-quality imagery that matches your audience and brand perception, maintain a consistent style, possibly by editing stock photos, to create a relatable, immersive user experience.
Where to find Great Stock Imagery (Free & Paid)2:50
Learn to find incredible free stock images on Pixabay and Pexels, and premium options Shutterstock and Adobe Stock, using photographer-based searches to maintain a consistent tone for your website.
Cropping & Framing Images (The Rule of Thirds)2:33
Contrast Rules (Including USA Legal Requirements)3:02
Master contrast principles to boost readability and user experience while meeting USA ADA and WCAG requirements, using white backgrounds, dark text, and clear visual hierarchy.
Repetition & Consistency3:37
Repetition and consistency create a seamless, familiar user experience by unifying colors, fonts, images, and navigation, boosting a professional and trustworthy freelance portfolio website.
Overlapping3:07
Explore how overlapping in web design creates visual depth, adds a modern feel, and highlights key elements like calls to action, especially in the hero section.
White Space3:37

Defining your Websites Strategic Objectives6:00
Define a primary objective, or one primary and one secondary objective, to convert visitors into customers, capture emails, and build trust with FAQs and testimonials.
Lead Generation Best Website Structure Inspiration5:45
Explore how service websites build trust with a simple right-place structure, illustrated by Duolingo and BetterHelp through branding, languages, and clear trust questions.
Finding Inspiration for your Website4:01
Deciding what pages you need to meet objectives4:22
Identify pages for digital service brands, e-commerce, and personal brands—home, about, contact, packages, FAQ, product pages, terms and conditions page, privacy policy, and shipping; include a conversion-driven home page popup.
Creating the Structure of each Website Page Strategically3:08
Why use a Website Template & Where Can You Find Them?3:31
Utilize website templates to build solid, on-brand sites for e-commerce, personal brands, and digital services. Learn to customize templates with Webflow, saving time and money while making a unique website.
More Inspiring Lead Generation Website Examples3:21
Discover how service-based and software platforms like monday.com and Canva structure pages to guide visitors to lead-generation sign-up paths, optimize UX interactions, and inspire your freelance portfolio website.

What is Webflow?3:13
Webflow Packages11:51
Explore Webflow packages to choose the right plan for your portfolio, from starter to CMS and e-commerce. Understand pricing, domain, CMS items, bandwidth, and transaction fees to make time-saving decisions.
Webflow vs Other Website Building Platforms7:46
Breakpoints in Webflow6:05
Learn how breakpoints drive website responsiveness across desktop, tablet, and mobile in Webflow, ensuring your portfolio site is fully responsive by adapting navigation and imagery at key sizes.
Introduction to Box Model2:21
Master the box model by organizing sections, containers, and div blocks to create a responsive, well structured freelance portfolio website.
Sections3:21
Learn to build a simple, responsive section-based layout using sections, containers, and div blocks, adjust padding for spacing, and apply colors by copying code to match designs.
Containers2:37
Create a tidy portfolio section by adding a grid inside the container column and filling two div blocks with text and image for a professional layout in Webflow.
Div Blocks8:12
Master three core elements—section, container, and div blocks—to build a two-column layout with an image and text, and fine-tune typography, spacing, and button styling for a polished portfolio website.
Grids6:29
Learn to build a responsive grid in a freelance portfolio site by adding a grid section, padding, and repeat blocks; explore a container-based two-column workaround for varied image sizes.
Link Blocks8:22
Learn to use link blocks as flexible text like buttons that link to pages, emails, or phones, and apply hover effects and transitions for professional secondary button visuals.
Buttons10:13
Design and animate buttons in Webflow, mastering padding, text size, color, and corner curves. Create linked, accessible buttons with in-page and external links, hover effects, transitions, and clear button hierarchy.
Typography7:05
Images2:58
Learn to add and replace images in Webflow using the assets bar and swap placeholders. Apply responsive sizing across devices with center-aligned adjustments on the responsiveness ladder.
Videos4:41
Learn how to add videos to web flow using Vimeo or YouTube, set a 400px width, and configure start times, autoplay, privacy, controls, mute, and background video features.
Lottie Animations3:29
Learn how to add Lottie animations to a freelance portfolio website, including container setup, replacing sequences, and looping. Discover sourcing JSON animations from Fiverr to showcase your work professionally.
Forms11:41
Build a form in web flow using the form block, labels, and inputs for first name, last name, email, and message, then refine layout and success and error messages.
Navigation Bars4:38
Learn to add and customize a navigation bar from scratch, including branding, logo placement, home link behavior, and hover and active states for clean, consistent navigation across pages.
Symbols2:00
Discover how to use symbols in web flow to create reusable components that update across your site, saving time on the nav bar, footers, forms, and repeated sections.
Lightboxes6:48
Learn to use lightbox links to reveal videos and images on a freelance portfolio site, configure media, and create clean, engaging popups with Vimeo integration.
Tabs8:07
Master tabs to organize a freelance portfolio site, showcasing branding and e-commerce projects, and presenting packages with tab panes that switch content and visuals for easy client navigation.
Adding Social Media Buttons7:08
Add social media icons to your Webflow portfolio with a clean, structured layout using div blocks and link blocks, and apply hover transitions for a polished, interactive social bar.
Classes4:44
Backgrounds4:16
Display Settings & Responsiveness9:15
Image Optimisation & Lazy load2:43
Prioritize hero images and logos with eager load to speed up your homepage, and understand lazy load, auto, and the best load order for a faster site.
Positioning5:16
Learn to use static, relative, absolute, fixed, and sticky positioning to control element placement. Explore z-index concepts to keep navigation bars and images in the right order as you scroll.
Hero Sections3:54
Craft a hero section that states what you do and how you help in the first three seconds, with minimal text, a relevant image, and a clear call to action.
CMS & Dynamic Content5:28

Who does your portfolio have to convince2:12
In this video, we are going to learn about the importance of finding your niche and showcasing your expertise in your portfolio in the way that suits your target audience.
How to select the right work for your portfolio2:57
Now we know who our portfolio needs to convince. The next step is to select the work that would help us persuade the potential clients we are the right fit for them.
Examples of the best portfolios in the world3:11
In this lesson, we are going to explore some of the best portfolios out there and use their advantages to make your portfolio stand out.
How to create a multi-environment portfolio2:27
In this lesson, you are going to learn how to create a multi-environment portfolio that is consistent on all the platforms.
Examples of how to showcase your process2:38
It's necessary to learn from the greatest in your field. In this lesson, we will look at some of the best portfolio examples.
The structure of a perfect portfolio3:15
Every work in your portfolio should be presented effectively. In this lesson, you will learn the perfect structure to showcase your work process.
How to segment your portfolio to maximise conversion3:15
What is segmentation? How can you use it to maximise conversion? You will learn that and a bit more in this lesson.
The best way to share your portfolio with clients2:39
In this lesson, you will learn how to share your portfolio with potential clients, making sure you convert more of them into paying customers.
How to get more higher paying clients (Additional Video)6:43
How to get more clients for your business. Just a little bonus video to help you scale and grow your freelance business.

Service-Focused Brand Website Build - (PART ONE) - Website Structure Development32:09
Structure a Webflow site from scratch using libraries to speed page assembly, with a universal navbar and footer and CMS-driven blog and portfolio pages.
Service-Focused Brand Website Build - (PART TWO) - Finishing Touches & Settings22:44
Service-Focused Brand Website Build - (PART THREE) - CMS Set up & Settings16:08

How to make sure your Website Reaches Google's Page #15:20
How to Secure a Great Domain for your Website5:13
Discover practical strategies to secure a memorable domain for your brand, including adding relevant words, negotiating prices, tweaking spellings, and choosing extensions beyond .com.
Adding a Custom Domain to your Website3:03
Connect a custom domain to your web flow site via site settings, quick connect domain, and plan that supports domains, then publish after DNS completes.

Installing Hotjar to Gather Valuable Data to Improve your Website5:09
Install Hotjar to track visitor behavior, view recordings of mouse movements and clicks, and refine your site for better performance.
Creating a Marketing Strategy to Drive Website Traffic4:46
Learn to drive relevant traffic to your freelance portfolio website with a practical marketing strategy. Follow the four-step funnel: awareness, consideration, conversion, and retention, to build trust and boost conversions.
Refining your Website to Optimise for Conversion4:12

Requirements

No experience. Just a hunger to be the best freelancer you can be and show off your work in the best light.

Description

Did you know that your portfolio is the single best way to increase your fees?

Really.

You didn't know.

Well, isn't it lucky you're here.

I was able to triple my fees for brand identity design (and many other services) simply because I began to utilise some key lessons a follow freelancer taught me.

The mentor who gave me this blueprint charges $40,000 for a 2 day project.

That's some serious dough!

So I thought this would be valuable to share with other freelancers around the world.

To help you make your portfolio the very best it can be so you can begin to charge premium prices for your services.

It all comes down to how you present your work. and the likelihood is you're selling yourself short.

This course will teach you how to position yourself as an expert who can help your client solve the challenge they have.

And by doing so, you'll be able to attract highly-profitable clients easily whilst also having them pay upfront for your services every time.

You (YES YOU) can get to a point where you can charge 5 figures for 2 days of your time.

But only if you understand how to communicate your expertise and showcase your work in a way which maximises impact and showcases the value you can bring in the best light.

This is what this course takes your through.

Step by step.

And of course I'm always here to help you along the way too.

And on that note, I'll see you inside the course!

Who this course is for:

A freelancer who wants to be seen as and expert and professional by future clients.
A freelancer who wants to stand out from the competition.
A freelancer who understands the power of effective communication.
A freelancer who wants to learn from the biggest and best agencies nohow to present their work better.

Build a World-Class Freelance Portfolio Website

What you'll learn

Explore related topics

Course content

What makes an amazing website7 lectures • 41min

Strategic website design mini-bootcamp13 lectures • 45min

Results-driven strategic website design7 lectures • 30min

Webflow essentials crash course28 lectures • 2hr 45min

How to create a great portfolio website on Webflow9 lectures • 29min

Building a service-based portfolio website (another example)3 lectures • 1hr 11min

Launching your website design3 lectures • 14min

How to improve your freelance portfolio over time3 lectures • 14min

Requirements

Description

Who this course is for: