We may earn an affiliate commission when you visit our partners.
Course image
Guil Hernandez

Already know the basics of HTML and CSS? Then it's time to take the next steps in Web Development with Scrimba's "Build a Product Splash Page" course!

This hands-on, engaging course is designed for learners with a basic understanding of HTML and CSS. Consisting of 22 comprehensive lessons, the course offers just over an hour of immersive content, accompanied by 15 interactive challenges. You'll create a stunning product splash page from scratch, employing contemporary design methodologies and adhering to responsive web design principles.

Read more

Already know the basics of HTML and CSS? Then it's time to take the next steps in Web Development with Scrimba's "Build a Product Splash Page" course!

This hands-on, engaging course is designed for learners with a basic understanding of HTML and CSS. Consisting of 22 comprehensive lessons, the course offers just over an hour of immersive content, accompanied by 15 interactive challenges. You'll create a stunning product splash page from scratch, employing contemporary design methodologies and adhering to responsive web design principles.

Each lesson builds on the previous, ensuring you develop practical skills in HTML, CSS, and Flexbox. Upon completion, you will deploy your project on Netlify to showcase your new skills live.

In this course, you'll build a unique hands-on project: a tool to transform your photo into an iconic Scrimba avatar. This project reinforces your learning and adds a personal touch to your portfolio.

Ready to elevate your frontend capabilities and take one more step towards becoming ready for that first developer job? Let's get coding!

Enroll now

What's inside

Syllabus

Traffic lights

Read about what's good
what should give you pause
and possible dealbreakers
Develops HTML and CSS, which are core skills for web developers
Builds a project from scratch and adds it to a portfolio
Teaches responsive web design and contemporary design methodologies
Suited for learners with a basic understanding of HTML and CSS
Uses Scrimba's platform, which may not be familiar to all learners

Save this course

Create your own learning path. Save this course to your list so you can find it easily later.
Save

Reviews summary

Hands-on html/css splash page building

According to learners, this course is a highly practical and engaging introduction for those with basic HTML/CSS knowledge, focusing on building a responsive product splash page. Students appreciate the hands-on coding and interactive challenges, which make learning effective. The course covers essential Flexbox concepts and culminates in deploying a live project, providing valuable skills for a first developer role. Some learners might find it too brief for advanced topics, but its conciseness is often seen as a strength for quick skill acquisition.
Teaches crucial project deployment for portfolio.
"Deploying the project on Netlify was a fantastic bonus, making my work live and shareable."
"I appreciate that the course included the deployment process, which is often overlooked elsewhere."
"It's great to have a deployed project for my portfolio right after finishing the course."
Ideal for quick learning for those with basic knowledge.
"The course is short and to the point, perfect for reinforcing my basic HTML and CSS skills."
"As a beginner, I found the pace just right and the content easy to follow."
"It quickly gets you up to speed on building a complete page without unnecessary fluff."
Provides solid understanding of modern layout techniques.
"The Flexbox sections were explained very clearly, which helped me understand responsive layouts."
"I finally feel confident using Flexbox after completing the challenges in this course."
"This course really solidified my understanding of responsive design principles with practical examples."
Emphasizes building a live project from scratch.
"I loved how I could immediately apply what I learned to build a real splash page."
"The hands-on coding and projects are the strongest part of the course for me, solidifying concepts."
"Learning by doing made complex CSS and Flexbox much easier to grasp."
May not delve into complex or advanced web development topics.
"While great for basics, I wished for more in-depth coverage on advanced CSS techniques or JavaScript integration."
"It's perfect for what it promises, but don't expect to become an expert developer from this hour-long course alone."
"Could use more detailed explanations on optimization or specific edge cases for responsive design."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Build a product splash page with HTML and CSS with these activities:
Review HTML and CSS Fundamentals
Solidify your understanding of HTML and CSS before taking the course to enhance your learning experience.
Browse courses on HTML
Show steps
  • Review course syllabus
  • Read online articles or tutorials
  • Take practice quizzes
Practice Writing HTML and CSS Code
Reinforce your understanding of HTML and CSS syntax by practicing writing code snippets.
Browse courses on HTML
Show steps
  • Set up your development environment
  • Create a new HTML and CSS file
  • Write HTML code to structure your page
  • Write CSS code to style your page
Join a Study Group for Web Development
Gain new perspectives and insights by collaborating with peers in a dedicated study group focused on web development.
Browse courses on Web Development
Show steps
  • Find or create a study group
  • Set regular meeting times
  • Discuss course materials and assignments
  • Work on projects together
Five other activities
Expand to see all activities and additional details
Show all eight activities
Follow an Online Tutorial on Flexbox
Enhance your understanding of Flexbox by following a guided tutorial that provides step-by-step instructions.
Browse courses on Flexbox
Show steps
  • Find an online Flexbox tutorial
  • Follow the tutorial instructions
  • Experiment with different Flexbox properties
Build a Resource Library for Web Development
Compile a collection of useful tools, tutorials, and articles to support your web development learning journey.
Browse courses on Web Development
Show steps
  • Create a document or spreadsheet
  • Gather resources related to HTML, CSS, Flexbox
  • Organize and categorize your resources
  • Share your resource library with others
Design a Mockup of Your Splash Page
Apply your HTML, CSS, and Flexbox skills to create a visual representation of your product splash page.
Browse courses on Web Design
Show steps
  • Sketch out your design
  • Create a wireframe
  • Design the visual elements
  • Export your design
Find a Mentor for Web Development
Connect with an experienced web developer who can guide you, provide feedback, and help you advance your skills.
Browse courses on Web Development
Show steps
  • Identify potential mentors
  • Reach out to mentors and introduce yourself
  • Establish a mentor-mentee relationship
  • Meet regularly and discuss progress
Contribute to an Open-Source Project
Make a hands-on contribution to an open-source web development project relevant to the course topics.
Browse courses on Open Source
Show steps
  • Find an open-source project related to web development
  • Identify an area where you can contribute
  • Create a pull request
  • Review feedback and revise your contribution

Career center

Learners who complete Build a product splash page with HTML and CSS will develop knowledge and skills that may be useful to these careers:

Reading list

We've selected 50 books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in Build a product splash page with HTML and CSS.
Is the official specification for CSS. It comprehensive reference for web developers who want to learn everything about CSS.
This comprehensive guide provides a thorough overview of CSS, covering everything from basic syntax to advanced techniques. It is an essential resource for web developers who want to master CSS and create visually stunning websites.
Focuses specifically on responsive web design using HTML5 and CSS3, a crucial contemporary topic. It's ideal for those who have a basic understanding of HTML and CSS and want to learn how to build websites that adapt to different devices. It provides practical examples and techniques for modern web development.
Considered a classic in the CSS world, this comprehensive guide covers all aspects of CSS, including detailed explanations of layout models like Flexbox. The latest editions are updated to include modern CSS features. is an excellent reference tool and is often used in academic settings to provide a foundational and deep understanding of CSS. Its authority comes from its long-standing reputation and expert authors.
Comprehensive guide to CSS for experienced web developers. It covers advanced topics such as CSS preprocessors, animations, and debugging.
Following the popular Head First approach, this book uses a visually rich and engaging format to make learning HTML and CSS fun and effective. It focuses on understanding the 'why' behind concepts, which is beneficial for solidifying knowledge. While not the most recent, its teaching methodology makes it a valuable resource for beginners.
Comprehensive guide to responsive web design. It covers everything from basic concepts to advanced techniques such as media queries and flexbox.
Comprehensive guide to CSS Grid Layout. It covers everything from basic concepts to advanced techniques such as auto-placement and named areas.
Employs a unique, interactive approach with short chapters and exercises designed for better retention. It focuses on building a strong understanding of the fundamentals of HTML and CSS. It's particularly useful for those who prefer a hands-on learning style.
Based on the popular online guide, this book provides a structured approach to learning HTML and CSS. Shay Howe's online resources are well-regarded, suggesting this book would offer clear explanations and practical examples for beginners.
A well-regarded book that provides a comprehensive introduction to web design, including HTML, CSS, and JavaScript. It's structured like a textbook with exercises and quizzes, making it suitable for structured learning. is great for gaining a broad understanding of the web development landscape.
Specifically targets Flexbox, offering a dedicated and in-depth look at its properties and usage. It's a valuable resource for those who want to focus on mastering Flexbox specifically. It helps solidify understanding through detailed explanations and examples.
Known for its clear and concise style, Murach's books are often used in educational settings. provides a solid reference and training guide for HTML5 and CSS3, covering essential concepts and responsive design. It's a good resource for both learning and looking up specific topics.
Emphasizes an interactive approach to learning HTML and CSS, likely with hands-on exercises and projects. It's good for learners who want to actively practice coding while they learn and solidify their understanding through building.
Provides insights and guidance on building a portfolio that effectively showcases your skills, experience, and creativity as an artist or designer.
Provides a thorough exploration of CSS, going beyond the basics to cover complex topics like Flexbox and Grid in detail. It's particularly useful for solidifying understanding through practical examples and explanations of how CSS truly works. While not solely focused on Flexbox, its in-depth coverage makes it a valuable resource for those looking to deepen their knowledge and understand contemporary CSS layout techniques.
Argues for a mobile-first approach to responsive design.
A quick and accessible guide for beginners to grasp the core concepts of HTML and CSS. It provides a simplified approach to building a coding foundation and understanding responsive design. is good for a rapid introduction to the subject.
This textbook focuses on responsive web design, building upon HTML5 and CSS concepts. It's likely used in educational settings and provides a structured approach to learning how to create websites that work across various devices. It's a solid resource for a deeper dive into responsive design.
Must-read for UX designers and provides practical guidance on building a portfolio that effectively showcases their skills, expertise, and user-centric approach.
Provides a modern and comprehensive approach to portfolio development and covers topics such as developing a digital portfolio, using social media to promote your portfolio, and adapting your portfolio to the changing needs of the job market.
This comprehensive book aims to teach HTML, CSS, and JavaScript in a structured, time-based format. It's a valuable reference for beginners and intermediate learners looking for an all-in-one resource. While it covers a lot, the depth on HTML might be less than a dedicated HTML book.
This is the foundational book that introduced the concept of responsive web design, which primary use case for Flexbox. While it predates widespread Flexbox adoption, it provides essential context for why flexible layout techniques are necessary. Reading this book helps solidify the 'why' behind using tools like Flexbox for creating websites that adapt to various devices. It's a classic and a must-read for understanding the evolution of web layout.
Offers a jargon-free introduction to HTML5, covering its new features and capabilities. It's helpful for beginners who want to understand the specifics of the latest HTML standard. While it might not cover every aspect in extreme detail, it's a great guide for getting started with HTML5.
Great introduction to CSS for web designers. It covers the basics of CSS, as well as more advanced topics such as responsive design and media queries.
Save
Great introduction to CSS for beginners. It covers the basics of CSS, as well as more advanced topics such as responsive design and media queries.
Collection of practical recipes for using CSS to solve common web development problems. It great resource for web developers who want to learn how to use CSS to create more effective and efficient websites.
Offers a comprehensive guide to creating and promoting a portfolio that showcases the skills, experience, and creativity of web designers.
Save
A visually oriented guide that uses clear examples and step-by-step instructions to teach HTML5 and CSS3. It's a good resource for learners who benefit from visual aids and want a quick way to get started or reference specific tasks.
By a renowned CSS expert focuses specifically on CSS Grid. As Flexbox and Grid are the two primary modern layout methods, understanding Grid is crucial for choosing the right tool for the job and creating sophisticated layouts by combining them. This book provides in-depth knowledge of Grid.
Part of the 'In Easy Steps' series, this book provides a straightforward and easy-to-follow guide to learning HTML. It's suitable for beginners and covers the essential elements of HTML. It can be a good supplementary resource for getting a clear understanding of basic HTML.
Is aimed at those who want to deepen their CSS knowledge and become more proficient. It covers a range of intermediate to advanced CSS topics, which would likely include Flexbox and its nuances. It's suitable for developers looking to level up their CSS skills beyond the basics.
Provides a visual guide to HTML, CSS, and JavaScript, aiming to help users build for the web. It likely focuses on practical application and visual examples, making it suitable for beginners who prefer a visual learning style.
Classic guide to web design, which includes a section on responsive design.
A follow-up to the original Responsive Web Design book, this delves into design patterns and principles for creating responsive experiences. It provides valuable context for applying Flexbox and other layout techniques effectively within a responsive design strategy. It's more focused on the design thinking behind responsive layouts.
Delves into advanced CSS techniques and explores the future of CSS. While it might not be solely focused on Flexbox, it provides valuable context for understanding how Flexbox fits into the broader landscape of advanced CSS and modern web design. It's suitable for those who have a solid grasp of CSS fundamentals.
Aimed at a younger audience (ages 9-12), this book offers a fun and project-based introduction to HTML, CSS, and JavaScript. It's excellent for absolute beginners, including younger learners, to get hands-on experience building simple web projects.
While focused on CSS, this book is highly relevant as CSS is intrinsically linked to HTML for web design. It's considered a strong resource for understanding CSS in depth and is valuable for anyone wanting to go beyond basic HTML structure to create well-styled web pages.
This comprehensive book covers the three core technologies of web development, including CSS with modern techniques like Flexbox. It's a good resource for gaining a broad understanding of the web development landscape and how Flexbox integrates with HTML and JavaScript. It can serve as both a learning resource and a reference.
This concise reference book is invaluable for quickly looking up CSS properties, including those for Flexbox. While not a tutorial, it's an essential tool for anyone working regularly with CSS. It's best used as a reference alongside more comprehensive learning resources.
A novelty book designed to introduce very young children to the visual patterns of HTML markup. While not a technical learning resource for the target audience of these courses, it highlights the foundational nature of HTML and can be a fun, very-early introduction to the concept of code.

Share

Help others find this course page by sharing it with your friends and followers:

Similar courses

Here are nine courses similar to Build a product splash page with HTML and CSS.
Build Responsive CSS3 Flexbox Holy Grail Layout
Most relevant
Responsive Website Development and Design Capstone
Most relevant
Creating Basic Web Layouts
Most relevant
Learn Responsive Web Design
Most relevant
Foundations of Modern HTML & CSS
Most relevant
Practical Grid and Flexbox Website Projects
Most relevant
Web Design: Wireframes to Prototypes
Most relevant
Web Design for Everybody Capstone
Most relevant
Modern JavaScript (Complete guide, from Novice to Ninja)
Most relevant

Coursera Buyer Protection & Guarantee

Verified partner policies & purchase protections

Accredited University Partner
Free Trial & Audit

7-Day Free Trial & Free Audit

7-day free trial on monthly Coursera Plus subscriptions; free audit option available on most individual courses to explore video lectures and readings at no charge.

Return & Refund Policy

14-Day Refund Guarantee

14-day refund window on annual Coursera Plus subscriptions and single-course purchases prior to certificate issuance. Monthly subscriptions do not offer refunds once billed.

Buyer Protections

Verified Academic & Industry Partner

Accredited university and industry certifications (e.g. Stanford, Google, IBM, Yale), secure SSL payment processing, and verifiable digital certificate links.

Key Purchase Protections
14-day refund window on annual Coursera Plus and single courses
7-day free trial on monthly Coursera Plus subscriptions
Free course audit option for lectures and readings
Verified certificates from top universities & companies
OpenCourser Verified Partner Policy details last reviewed: 2026-10-22
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2025 OpenCourser