Build Websites from Scratch – Curriculum
Set up your local development environment and begin writing well-structured content for your sites.
- Intro to HTML
- HTML Tags
- Setting Up A Text Editor
- Creating Your First Website
- Project: Travel Blog
- Implement an HTML page for your new blog site
- Project: Two Sandals
- Create an HTML page for a hip, new restaurant
Learn best practices for using CSS to style your HTML. Begin using Chrome DevTools to sandbox and debug your code.
- CSS Setup
- CSS Selectors
- CSS Visual Rules
- Chrome DevTools
- Project: Beach Paradise
- Create a travel site using your new-found knowledge of HTML and CSS.
- Project: Dasmoto's Arts & Crafts
- Create a website for a new Arts & Crafts store using HTML and CSS
Command Line + Git
Use the command line and Git to make drafts of your work. With GitHub Pages, deploy your first website to the Internet!
- Command Line Navigation
- Command Line Setup
- Git Basic Workflow
- Git and Github Setup
- Deployment to Github Pages
- Project: Broadway
- Incorporate Git into your workflow and help Broadway, a new design firm, create a landing page for their site.
- Project: Excursion
- Create and deploy a landing page for a video recording app.
Display and Positioning
Learning to size and position elements with CSS. Leverage Flexbox – a powerful new CSS positioning tool.
- CSS Box Model
- CSS Display
- CSS Flexbox
- Project: My Times
- Create a fully-realized clone of a popular newspaper site from scratch.
- Project: The Tea Cozy
- Create a professionally designed site for a new tea cafe from scratch.
Responsive Design and Browser Compatibility
Learn responsive techniques that make it easy to develop sites that look great on all sizes and browsers.
- Responsive Design - Sizing Elements
- Responsive Design - Media Queries
- Browser Compatibility and Polyfills
- Project: Secret Agent Supply Inc.
- Create a fully responsive site that makes it easy to buy the secret agent supplies from any device.
- Project: Tortoiseshell Optics
- Create a fully responsive site for a new glasses site, Tortoiseshell Optics
CSS Documentation and Debugging
Learn how to use documentation and other online resources to solve unfamiliar problems and debug complicated CSS.
- MDN Documentation and Research
- Project: Fotomatic
- Debug a multi-page site for a new photography startup.
Design and UI Feedback
Analyze the decisions that make sites user-friendly and fun to use. Learn advanced color and typographic CSS techniques. Harness the power of pseudo-classes to make your site interactive.
- CSS Pseudo-Classes
- CSS Animation / Transitions
- CSS Typography
- CSS Color
- Design - Color Palettes
Capstone Project (Colmar Academy)
You've been hired to design and implement a completely responsive single page site. Using supplied wireframes, make key design decisions.
- Font Awesome
- Asset Management
- Custom Domains
- Introduction to Bootstrap
- Introduction to jQuery
- Final project
- Choose one of these three projects: