YoVDO

HTML & CSS Coding for Beginners: Build your own portfolio!

Offered By: Skillshare

Tags

HTML & CSS Courses Computer Science Courses Web Development Courses Project Management Courses Animation Courses Flexbox Courses HTML Courses Responsive Design Courses Media Queries Courses CSS Grid Courses

Course Description

Overview

Welcome to this class!

If you want to learn HTML & CSS to build websites, this course will teach you all of the core fundamentals you will need to know to build amazing websites from scratch!

Together, we will build your own portfolio website, which you can use to showcase your projects. 

Here is my live version here:

https://chris-dixons-portfolio.netlify.com

No coding experience is necessary, and I will do my best to explain everything we do along the way. Although if you have used HTML & CSS Before, you can hopefully sharpen your skills and learn some new tricks.

During this course you will learn all the basics of HTML & CSS, along with some more intermediate topics such as animations, media queries, responsive design, hover effects, Flexbox & Grid, how to include a parallax effect and so much more.

We finish things off by uploading your project to the web for the rest of the world to see!

Looking forward to seeing you in the class!


Syllabus

  • Introduction
  • Share Your Work On Skillshare!
  • What is HTML & CSS
  • Setting up our portfolio project
  • Sketch your ideas and gather your project images
  • The header section & semantic elements
  • CSS first look and linking our stylesheet
  • Quick Aside: Inspecting CSS with the devtools
  • Background images & the parallax effect
  • Quick Aside: Margin, padding and the box model
  • Block, inline and nesting content
  • First look at the CSS Flexbox
  • Contact us section and final mobile first CSS
  • CSS Media queries
  • Custom CSS animations
  • Animation libraries
  • Quick Aside: Browser compatibility
  • Setting up our projects page
  • Including our projects page HTML
  • Mobile first project layout using Flexbox
  • First look at the CSS grid
  • Grid areas for more advanced layouts
  • CSS text overlay, hover effects and animations
  • Hosting
  • Final thoughts
  • Follow me on Skillshare!

Taught by

Chris Dixon

Related Courses

Intro to HTML and CSS
Udacity
Responsive Web Design Fundamentals
Google via Udacity
HTML5 and CSS Fundamentals
World Wide Web Consortium (W3C) via edX
CSS Basics
Microsoft via edX
Advanced CSS Concepts
Microsoft via edX