Build World Class Websites like "BBC. com" with HTML5 & CSS3

Create a structured project working environment by organizing folders for css, js, images, and fonts. Prepare to download the necessary software in the next lecture.

Download and install essential web development tools for BBC-like websites, including Brackets, a responsive grid system, jQuery, normalize.css, wow.js, icon fonts, and Google fonts.

Install five productivity plugins for Brackets, including Emmet, to streamline coding with faster HTML5 markup expansion and features like auto prefix, auto save, and file duplication.

Import the BBC project folder into your code editor, verify the four folders, and create the necessary files like index.html to prep for the next lecture.

You build a basic HTML5 document structure using Emmet, link stylesheets and fonts, include JavaScript, and apply a global CSS reset and initial grid styling.

Plug in normalize.css to normalize browser styles and complete the setup for building world class websites with HTML5 and CSS3.

Create the BBC-like top navigation by adding a logo, a black background, a horizontal list of items, and a white search box.

Learn to build a BBC-style top navigation with a dropdown using HTML and CSS, including inline list items, hover effects, and a toggle to reveal the hidden menu.

Build the featured image section with image on the left and text, implement CSS styling, typography, spacing, color, and text effects to achieve a polished BBC-style layout.

Create the featured image section for a live blog using HTML5 and CSS3, with a responsive grid, anchor-wrapped images, and left-right blocks.

Create a sports news section in HTML5 and CSS3, using a three-column layout with images and anchors, styled headlines, and a hover border for clean typography and spacing.

Learn to build a BBC-style sports section with HTML5 and CSS3 by adding a sport class, adjusting margins and layout, and integrating weather and news elements.

Create an editor's pick section by structuring anchors and lists, applying padding, background color, and typography, and styling images for a polished grid layout.

Learn to build an editor's pick section with two-column layouts, using inline blocks, padding, and borders; tweak font sizes, colors, and list styling with HTML5 and CSS3.

Create a featured video section by adjusting layout, padding, font size, and borders. Implement fancybox lightbox for YouTube iframes, wire up JavaScript and CSS, and test the feature.

Build a featured video section with an image gallery and lightbox, implement responsive iframe videos, apply CSS styling, captions, text shadow, and typography adjustments for a BBC-like site.

Build and style the dress section by adjusting background color, padding, margins, and typography, while integrating images and anchor tags to align with the news and video sections.

Add a background color to the featured video section using a hex code, and adjust padding and fonts to mirror the BBC-style layout with inline icon list and anchors.

Copy and reposition sections to adjust columns and layout, then refine with images, avatars, margins, padding, and border radius to create a BBC-like HTML5 and CSS3 webpage.

Create a multilingual languages section with HTML5 and CSS3 by building a language link list, wrapping anchors around items, and styling fonts and spacing to mirror the BBC menu.

Apply CSS to create a BBC styled navigation with margins, padding, and typography; target list items and anchors, adjust colors, font weight, and hover effects for a polished look.