HTML and CSS: build your first web page
HTML structures the content, CSS styles it. This duo is the most visible entry point into coding.
Understanding the HTML/CSS difference
HTML is the skeleton: headings, paragraphs, images, links, buttons. CSS is the skin: colors, fonts, spacing, layout. A page without CSS works but looks like a raw document. A page without HTML has nothing to style. Learn to structure things cleanly in HTML before worrying about design — well-organized content is much easier to style later.
Master modern layout
Forget the old table-based tricks. Today, two CSS tools cover 90% of layouts: Flexbox for aligning items along a row or column, and Grid for grid-based arrangements. Spend a day getting comfortable with each. Once you've got both down, laying out a page becomes logical instead of a fight.
Think responsive from day one
Most web traffic comes from mobile. Your page needs to adapt to every screen size. Use flexible units instead of fixed pixels, and media queries to adjust the layout based on width. Regularly test by resizing your browser window. A great-looking desktop page that breaks on mobile is a failed page.
Apply it now
- Create an index.html file and write a basic structure
- Add headings, paragraphs, images, and links
- Link an external CSS stylesheet
- Learn Flexbox then Grid on small examples
- Make the page responsive with media queries
- Put your page online for free to share it