About this Course

HTML and CSS are markup languages and the building blocks that make up the web. This course is called "Not your Typical Intro" because it does not follow the usual pattern of other courses and tutorials that you find on the Internet. Usually HTML and CSS are taught with a focus on language syntax. But knowing syntax alone does not enable you to create a webpage from a design. You need to know where to start and how to approach the task, in other words - you need to learn how to think like a front-end developer.

In this course you will learn how to convert digital design mockups into static web pages. We will teach you how to approach page layout, how to break down a design mockup into page elements, and how to implement that in HTML and CSS.

You will also learn about responsive design techniques, which are increasingly important in a world where mobile devices and TV screens are used more and more often to look for information and entertainment.

Course Cost
Free
Timeline
Approx. 3 weeks
Skill Level
Beginner
Included in Course
  • Icon course 01 3edf6b45629a2e8f1b490e1fb1516899e98b3b30db721466e83b1a1c16e237b1 Rich Learning Content

  • Icon course 04 2edd94a12ef9e5f0ebe04f6c9f6ae2c89e5efba5fd0b703c60f65837f8b54430 Interactive Quizzes

  • Icon course 02 2d90171a3a467a7d4613c7c615f15093d7402c66f2cf9a5ab4bcf11a4958aa33 Taught by Industry Pros

  • Icon course 05 237542f88ede3178ac4845d4bebf431ddd36d9c3c35aedfbd92e148c1c7361c6 Self-Paced Learning

  • Icon course 03 142f0532acf4fa030d680f5cb3babed8007e9ac853d0a3bf731fa30a7869db3a Student Support Community

Join the Path to Greatness

This free course is your first step towards a new career with the Full Stack Web Developer Nanodegree Program.

Free Course

Intro to HTML and CSS

Enhance your skill set and boost your hirability through innovative, independent learning.

Icon steps 54aa753742d05d598baf005f2bb1b5bb6339a7d544b84089a1eee6acd5a8543d

Course Leads

  • Gundega Dekena
    Gundega Dekena

    Instructor

  • Cameron Pittman
    Cameron Pittman

    Instructor

  • Jessica Uelmen
    Jessica Uelmen

    Instructor

What You Will Learn

Lesson 1

From Design to Code

  • Diligently employ a code/test/refine strategy.
  • Precisely translate initial design documents into static web pages.
  • Investigate the Document Object Model (DOM).
Lesson 1

From Design to Code

  • Diligently employ a code/test/refine strategy.
  • Precisely translate initial design documents into static web pages.
  • Investigate the Document Object Model (DOM).
Lesson 2

Your Own Framework

  • How to create and personalize your own multi-platform, responsive CSS framework.
  • Publish your professional portfolio projects to the web.
Lesson 2

Your Own Framework

  • How to create and personalize your own multi-platform, responsive CSS framework.
  • Publish your professional portfolio projects to the web.
Lesson 3

Learning and Using Bootstrap

  • Investigate an existing professional CSS framework
  • Build a website using responsive design principles while maintaining code readability.
Lesson 3

Learning and Using Bootstrap

  • Investigate an existing professional CSS framework
  • Build a website using responsive design principles while maintaining code readability.

Prerequisites and Requirements

You should have ability and skills to download and use a text editor for editing your web pages, we recommend Sublime Text or Atom. You can use another text editor if you want, but it should have the ability to highlight code syntax for your own convenience.

You should be able to download and install Google Chrome, which is the browser we’ll be exploring developer tools with in this course.

See the Technology Requirements for using Udacity.

Why Take This Course

Front-end Web Developers must have a fundamental understanding of HTML and CSS, which we’ll accomplish in this course by converting digital design mockups into static web pages. To build the web pages you will use HTML, CSS and Bootstrap, the popular Twitter CSS framework.

After completing this course you will be able to build a responsive portfolio site with your own CSS framework. You'll also have the functionality in place to add future projects to your portfolio. Most importantly, you will have an understanding of the DOM and how HTML, CSS, and JavaScript relate to each other.

This course's project is part of our Front-End Web Developer Nanodegree.

What do I get?
  • Instructor videos
  • Learn by doing exercises
  • Taught by industry professionals
Icon globe e82eae5d45465aba4fbe4bb746905ce55dc3324f310b79c60e4a20089057d347

Udacity 现已提供中文版本! A Udacity tem uma página em português para você! There's a local version of Udacity for you!

前往优达学城中文网站 Ir para a página brasileira Go to Indian Site or continue to Global Site