Skip to main content

Watch Preview

A Designer’s Intro to HTML and CSS

with Chris Converse

Log in or Sign up for FREE and get full access to these and thousands of other Open Lessons in our catalog! Watch 2 Lessons For Free

  •   01 Introduction to HTML and CSS

    06:50
  •   03 Creating CSS Rules for Text Styles

    24:43

Class duration: 1h 53m

See all 6 lessons
  • 5K students

    100% satisfaction guaranteed

  • 100% recommended

    8 student reviews

  • Access anytime

    OFFLINE SYNC WITH iOS APPS

Get the Pass

Unlock this class plus 1500+ more >

starting at $25/month*

$299/year or $39/month

Watch Now

You already have access!

Buy Class

$29

About The Class

Understand the basics of code for better workflow

Learn to take more control over your web designs by learning a few core concepts in HTML and CSS. With a handful of HTML tags, and some basic CSS properties, you’ll be able to share styles with web developers, and insure the integrity of your design’s translation to the browser.

And the best part is, you already know the basics! Think of HTML as “content and structure” (think pages, graphic/text boxes, text), and CSS as “style and layout” (think paragraph, character, and object styles). What’s more, we’ll learn to gather CSS properties directly from Adobe Photoshop or Bohemian Sketch, and apply them directly to our own CSS file.

What you’ll learn:
  • What is HTML and CSS, exactly?
  • Basic HTML tags and how to write them
  • Choosing a text editor for HTML and CSS
  • Where can I put my CSS rules?
  • Using graphics with HTML using CSS
  • Gathering CSS properties from Adobe Photoshop and Bohemian Sketch
  • What role does JavaScript plays with HTML and CSS

Software Used: Panic Coda 2017

Topics Covered


Lesson Plan

  1. 01

    Introduction to HTML and CSS

    06:50
  2. 02

    Beginning the Project: Adding and Formatting the Content

    34:30
  3. 03

    Creating CSS Rules for Text Styles

    24:43
  4. 04

    Creating CSS Rules for Layout and Images

    23:59
  5. 05

    Creating Display Properties for Links

    13:46
  6. 06

    Introduction to CSS Media Queries and Java Script

    10:10

Meet Your Expert

Chris Converse

Chris has over 25 years of experience in graphic design, interactive and animated media, with a unique focus on both graphic design and web development. Chris possesses development skills across such languages as PHP, HTML, CSS, JavaScript, jQuery, and AngularJS, making his design execution ... read more

See instructor's Classes

Bonus Material

Access your course materials here!

Get access to exclusive bonus content when you purchase this class.

  • zip Project Files

100% of students recommend this class.
See what some of them have to say.

  • BolesMA

    BolesMA

    January 2019

    Awesome. So simple and very informative if you are slightly aware of HTML and CSS but aren't sure about using them to construct a page. If you have been relying on templates to build your site and dabbled with a little code to improve them....this class will take you much further. If you've relied on templates and have been frustrated by the limitations of them then this class will help you being to understand how web pages actually work. If you're wanting to take more control over your pages then this is the class to start with! Can't wait to to take his other classes. Super easy to follow and very informative!

  • Lu Gerard

    Lu Gerard

    October 2019

    I am completely new to web design and this video has been a great purchase. I now understand the basics very clearly. I am also happy with the way Chris talks and explains, as I am not an English native speaker and sometimes class contents might not be difficult but the speaker is. Definitely not the case. I used the subtitles and watched each video a couple of times. Highly recommend it for beginners like me!

  • AnissaT

    AnissaT

    June 2017

    I appreciated Chris' direct approach and simple explanations. I've been developing and teaching website development for 20+ years, and enjoyed his pacing and resources. This was a solid, straight-forward introduction for new designers.

    Similar classes you might like

    You know who’d love this class...?

    When gift-spiration strikes, grab it. Give this class to a friend who’d love it. For their birthday or just because. (Or just because you missed their birthday.)

    GIFT THIS CLASS