Learn Web Development

Setting Up

Get a step-by-step guide on setting up class files for our Web Development tutorial, including detailed instructions for both Mac and Windows users.

Coding After HTML and CSS

Congratulations on completing the Web Development with HTML and CSS class! What are some next steps you could take on your journey to mastering coding?

Understanding HTML's Semantic Elements

Use semantic HTML tags to clearly structure and outline web content for improved readability, accessibility, and meaningful markup. Watch this tutorial to...

Web Layouts for Mobile View- Code Updates

Looking at this finished page here, resizing the window to simulate different-sized screens, at first glance it appears that this page would be done, but...

CSS Styling for Optimal Web Layout

We're back to continuing work on this Revolution Travel website. In the exercise, there will be a sidebar talking about some ready files that are only to be...

Understanding Image Resolution for Web Display

Our coding determines whether an image on a page will appear low-res or high-res. Is it going to appear blurry and pixelated or sharp and crisp with a lot of...

Responsive Web Design- Grid and Media Queries

We saw how Flexbox is one way that we can start to lay things out, and there's another way that we can lay things out using something called Grid. So just...

Custom Fonts and CSS Techniques

Load custom fonts into your webpage using Google Fonts and apply them with CSS. Watch this tutorial to learn the key concepts and techniques.

HTML & CSS Intro Course: CSS Classes

In this video, you'll see how classes are used by HTML and CSS. A class is a way to name something. You'll see how we can use CSS to apply a style to something...

HTML & CSS Course: Intro to HTML

In this video, you'll learn how to create your first webpage. To do that, we're going to need to learn HTML code. HTML stands for Hypertext Markup Language.

Bootstrap: Spacing & Adapting Layout Across Screen Sizes

Master the art of web development with our comprehensive tutorial covering a variety of topics such as adjusting spacing, changing the layout across screen...

Bootstrap: More About Grids & Components

Enhance your web development skills with our tutorial that covers nesting grids, adding a navbar, and other components, as well as showing and hiding elements...

Bootstrap: Getting Started

Discover how to accelerate your web development projects using Bootstrap. This tutorial covers everything from grid systems and components to containers, rows,...

Grid: Vertical Centering on a Full Screen Background

Explore this in-depth web development tutorial on vertically aligning content with the grid, a crucial part of creating responsive, visually appealing websites.

Grid: A Responsive Image Gallery (Masonry Layout)

Discover how to create an image grid layout that looks good on all screens and understand the process such as setting up the grid for different screen sizes,...

Grid: Laying out an Article

Explore a comprehensive tutorial on web development, covering topics such as using Grid to lay out an article, making elements go full-width, and adding...

Grid: Alignment, Centering, & Reordering Content

Learn how to align and order grid items in web development, as well as aligning within the grid container, through an in-depth, step-by-step tutorial.

Grid: Template Areas

Deepen your understanding of web development by learning to position and size grid items using grid template areas with our comprehensive tutorial and practice...

Grid: Minmax, Auto-Fit, & Auto-Fill

Explore this comprehensive Web Development tutorial that covers various topics like sizing with Minmax, Auto-Fit vs. Auto-Fill, Max-Content & Min-Content, and...

Grid: Sizing & Placing Items Within the Grid

Deepen your web development knowledge by learning how to position and size elements using numbered grid lines in a detailed tutorial, featuring exercises that...