WEB 101: HTML and CSS I
Learn fundamental coding skills
In order to build a Web site today, you need to know how to code using HTML and CSS. In this online HTML/CSS course, you'll learn just how fun and creative hand coding and designing Web sites can be. Working with a professional Web designer, you'll discover how to create Web pages with HTML and control page design and layout with CSS and get up to speed with current Web design practices including HTML5, semantic coding, CSS Grid, Flexbox, Web fonts, and CSS3 effects. The course will also provide an introduction to techniques used to test website accessibility.
Visit the Student Gallery.
About This Course
Project-Based Learning
In this creative course, you will build a responsive website with a working navigation, from scratch using HTML and CSS, FTPing your files to the web, and testing and validating your site.
What Skills Will I Develop?
Students in this course can expect to learn to:
- Write clean, standards-compliant HTML and CSS code.
- Understand and apply how today's Web coding environment works, using HTML and CSS to control the display of web content.
- Reserve Web hosting and FTP files to the Web.
- Create and structure HTML documents using common tags, adding hyperlinks and images.
- Utilize semantic HTML tags to structure and webpage content.
- Use HTML5 code to add audio and video content.
- Write CSS rules and apply styles using stylesheets.
- Use CSS to control color, typography, and layout.
- Use selectors: classes, IDs, and spans to apply CSS styles.
- Design page layouts and layout components using CSS Grid.
- Write media queries to display web content at different browser or screen sizes.
- Design page layouts and layout components using Flexbox.
- Add Web fonts to your site's HTML and CSS.
- Apply CSS3 effects and layout positioning techniques to style web content.
- Learn basic techniques for assessing important aspects of website accessibility.
- Following instructor guidance, take a simple web site from raw content to a polished live website design.
What Software and Supplies Do I Need?
- Computer with Internet connection.
- An account with an ad-free Web hosting service (free services are available and listed in the course).
- Photoshop or equivalent program recommended not required.
Course Instructor(s)
The course is taught by the following instructor(s):
Piper Nilsson
Piper Nilsson is a graphic/Web designer and educator. Piper has been working with the Web since 1997, working in various roles as a designer, programmer, and information architect, Piper blueprinted sites for such global clients as MetLife, Pepsi, ETS, and Citibank.
Course Outline
An Intro to HTML
The course begins with an overview of today's Web coding environment. You'll learn how HTML works in combination with CSS and establish a foundation for writing clean, standard-compliant code. Using a text editor, you will create and structure an HTML page and add images and hyperlinks, using important HTML tags used to structure content. To prepare for your course assignments, you'll also learn how to organize Web site files and FTP them to the Web.
HTML Semantic Elements
HTML5 has introduced new ways of structuring and delivering Web page content. This week we will explore this new world with a look at how to use HTML5 semantic elements to mark up Web pages to improve layout control and search accessibility. As HTML5 has set new standards for multimedia, you'll learn how to audio and video content to your Web pages.
Page Layout with CSS
Web design is all about using CSS (Cascading Style Sheets) to style the color, typography and layout of your Web site pages. In this session, you'll learn the benefits of using CSS to control the design of a Web site. Through practical, step by step examples, you'll learn the three primary ways of applying CSS to an HTML page, explore how to correctly write CSS rules, and then apply your design styles using CSS selectors: classes, IDs, and spans. You'll also get an overview of how to use CSS to style key aspects of type: font, size, weight, alignment, spacing, lists, and links and discover how to use the CSS Box Model to manipulate the space around HTML elements.
CSS Grid
First introduced in 2017, CSS Grid has quietly revolutionized web design. With properties like grid-template-columns, grid-template-rows, and grid-auto-flow, CSS Grid allows designers to create complex layouts with far less code and greater flexibility. In this lesson, we'll focus on how to implement grids and study how to use media queries to create responsive designs, so you can adapt your grid layouts to different screen sizes.
Flexbox
Flexbox was developed a few years before CSS Grid. It works slightly differently, but there are also similarities. The good news is that they work well together—you can combine CSS Grid and Flexbox in a single layout.
In this lesson, we'll focus on Flexbox properties that will complement your CSS grid layouts. You’ll learn how to create a flex container, add gutters between flex items, change the direction of flex items, determine whether flex items wrap, and more.Advanced CSS Techniques
The continued evolution of HTML and CSS has provided so much more flexibility for designers. The session explores various techniques that will improve your site designs. You’ll begin with an introduction to the many typographical options offered by Web fonts and Google fonts. You'll learn how to add CSS3 effects—like rounded corners and telecom-shadows—to further customize your work. We'll also explore different ways of applying background images and explore ways to achieve relative and absolute positioning and floats.
Frequently Asked Questions (FAQ)
How Do The Courses Work?
Our courses are project-based and instructor-led. In each course you’ll complete a series of lectures, projects, discussions, and critiques designed to stretch your creative skills. Weekly assignment deadlines keep you on track, and with no set-logins or Zoom meetings, you can build your studies around your schedule.
Who Are The Instructors?
Our courses are developed and taught by our industry-leading faculty of creative professionals. This means that you’ll learn in-demand skills, get feedback on your work, and build a portfolio of creative work. View our Student Gallery for featured student projects.
When Can I Start?
Classes start January, April, and August, and this course is completed in a 15-week term. College credit from this course can be applied to a range of Degree and Certificate programs at Sessions College. You can enroll in this course on an individual basis or as part of a program.
Explore our Programs: Bachelor's Degree | Associate Degree | Undergraduate Certificate
How Do I Register?
To register for a program, complete our program application. To register for this course on an individual basis, please contact our admissions team at admissions@sessions.edu. An Admissions Advisor will contact you to setup your enrollment.
| Course Tuition and Fees | |
|---|---|
| Tuition | $300/credit |
| Registration Fee* | $200 |
| Total Course Price | $1100 |
Registration fees are nonrefundable after 5 days from enrollment.
Is Sessions College Accredited?
Yes. Since 2001, Sessions College has been accredited by the Distance Education Accrediting Commission (DEAC). The Distance Education Accrediting Commission is listed by the U.S. Department of Education as a recognized accrediting agency and is recognized by the Council for Higher Education Accreditation (CHEA).