Creating a Simple Template-Based HTML + CSS Site

An Approach To Making a Multi-Page Site

Getting Started

This set of tutorials will help beginners develop a basic workflow for building efficient, template-based sites using a code editor. Proprietary Dreamweaver template files are not covered here.

Building a Template-Based Website

The following video demonstrations are consecutive and chronological. To learn how to create a fluid, responsive 6-page layout with mobile navigation, watch all videos (total ~3 hours).

Please note: in the Javascript implementation demo, I tell you that you can copy and paste some javascript code. You can download the complete Exercise-4 Javascript Mobile Menu Script. This is the complete code, but when the script is first introduced in the tutorial, it is incomplete and later completed.

Note About the Videos Below

To reduce page load time, the videos below are minimized to a small scale, but you can watch them larger either by clicking the Full Screen player icon, or by clicking the YouTube player button to watch on the YouTube site. Once the video starts, you can also click the gear icon to increase the quality/resolution on faster connections.