Guided Website Development Project
Ends soon! Keep adding new skills with 10,000+ programs for $239 (usually $399). Save now.
Guided Website Development Project
This course is part of Front-End Web Development for Beginners Specialization
Included with
What you'll learn
This course isn’t just about building a website—it’s about discovering what you’re truly capable of as a front-end developer.
Skills you'll gain
Details to know
See how employees at top companies are mastering in-demand skills
Build your subject-matter expertise
- Learn new concepts from industry experts
- Gain a foundational understanding of a subject or tool
- Develop job-relevant skills with hands-on projects
- Earn a shareable career certificate
There are 4 modules in this course
This course is where things get real. This is your chance to put all those HTML, CSS, and responsive design skills to work on a project that simulates the real deal—a professional website for a client. Imagine you’re a freelance developer, hired to create a site from scratch. You’ll start by diving into client requirements, mapping out user stories, and building a structure that brings the client’s vision to life. From there, it’s all about rolling up your sleeves and making the magic happen with the tools and techniques you’ve mastered.
But here’s the kicker: this isn’t just a follow-the-instructions project. It’s guided, yes, but we want you to get creative, push boundaries, and explore beyond what’s covered. Plus, you’ll learn how smart developers collaborate with AI to streamline workflows and spark new ideas. Your project will also be peer-reviewed, so you’ll get valuable feedback and see how other people tackled the same challenge. At the finish line, you’ll have a multi-page website ready to wow clients and beef up your portfolio. This course is your chance to prove you’re not just learning web dev—you’re living it.
In this first module, you will begin your capstone project by learning about the goals and expectations. You will study the steps involved in a web project, including how to define the purpose of your website using user stories and planning. You will examine the content, style guide, and assets provided by the client for the Archery website. This module focuses on careful planning before coding, ensuring you are ready to build an effective and user-friendly website.
What's included
9 readings1 peer review1 discussion prompt
9 readings•Total 105 minutes
- About this Course•5 minutes
- Welcome to the Capstone Project: Building an Archery Website•10 minutes
- Email from Giap•5 minutes
- Email: Subject: Re: Website Content for Straight to the Point Archery•5 minutes
- Analyzing Project Requirements•10 minutes
- Defining User Stories•10 minutes
- Designing the Information Architecture•20 minutes
- Email from Designer•20 minutes
- Combining Information Design with Graphic Design•20 minutes
1 peer review•Total 60 minutes
- User Stories & Wireframes•60 minutes
1 discussion prompt•Total 10 minutes
- Welcome to the Project•10 minutes
This module focuses on setting up your development environment and starting to build your website. You will initialize your project with proper version control using Git and GitHub. You will build the basic HTML framework, including the header, navigation, hero section, and overall content layout. The emphasis is on using semantic HTML and organizing content effectively, based on your earlier planning.
What's included
13 readings
13 readings•Total 85 minutes
- Setting Up Your Project Structure•5 minutes
- Initializing Git Version Control•5 minutes
- Connecting to GitHub•5 minutes
- Creating the HTML Boilerplate•5 minutes
- Using Semantic HTML5 Elements•5 minutes
- Building the Header and Navigation•5 minutes
- Creating the Hero Section•5 minutes
- Organizing Content Based on User Stories•5 minutes
- Developing the Classes Section•10 minutes
- Building the Instructors Section•10 minutes
- Crafting the About Us Section•10 minutes
- Setting up the Contact Page•10 minutes
- Using User Stories to Guide Content•5 minutes
In this module, you will transform your HTML structure into a visually appealing and interactive website. You will apply styles from the provided style guide, use advanced CSS for layout and design, and enhance your site with custom fonts, icons, and images. You will also add interactive elements to improve user engagement and ensure your website is accessible to everyone, following best practices.
What's included
19 readings
19 readings•Total 230 minutes
- Setting Up Your CSS Stylesheet•5 minutes
- Implementing the Color Scheme•15 minutes
- Applying Typography Styles•15 minutes
- Incorporating Design Elements•20 minutes
- Testing and Refining Your Styles•5 minutes
- Implementing Flexbox and CSS Grid•20 minutes
- Using CSS Grid for Page Layouts•10 minutes
- Ensuring Consistency Across Pages•15 minutes
- Testing Responsiveness•5 minutes
- Incorporating Images•15 minutes
- Using Font Awesome Icons•15 minutes
- Optimizing Images for Web Performance•5 minutes
- Enhancing Accessibility with Images•5 minutes
- Integrating Backgrounds and Patterns•10 minutes
- Implementing Hover Effects•15 minutes
- Adding CSS Transitions and Animations•10 minutes
- Enhancing Accessibility with Skip Links•15 minutes
- Ensuring Overall Accessibility•10 minutes
- Optimizing Images for Responsive Design•20 minutes
The final module is dedicated to refining your website for a professional finish. You will test and debug your site across different browsers and devices to ensure it works correctly and performs well. You will finalize content and design decisions, possibly revisiting earlier choices based on testing results. You will deploy your website using GitHub Pages, making it live on the internet. Finally, you will reflect on your development journey, document your process, and identify areas for future growth.
What's included
2 readings1 assignment1 peer review1 discussion prompt
2 readings•Total 25 minutes
- Testing and Debugging•10 minutes
- Deployment•15 minutes
1 assignment•Total 60 minutes
- Learner Reflection•60 minutes
1 peer review•Total 60 minutes
- STTP Archery Project Reveal•60 minutes
1 discussion prompt•Total 10 minutes
- 💬 You Did It. Now Tell Us What You Think.•10 minutes
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Instructor
Offered by
Explore more from Mobile and Web Development
- Status: FreeC
Coursera
Guided Project
- Status: Preview
Guided Project
Why people choose Coursera for their career
Frequently asked questions
To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.
When you enroll in the course, you get access to all of the courses in the Specialization, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.
Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.
More questions
Financial aid available,
¹ Some assignments in this course are AI-graded. For these assignments, your data will be used in accordance with Coursera's Privacy Notice.
