Web Design Languages
- Course
HTML Basics
Learn HTML (HyperText Markup Language), the language common to every website. HTML describes the basic structure and content of a web page. If you want to build a website or web application, you’ll need to know HTML.
- Course
Introduction to HTML and CSS
Get started creating web pages with HTML and CSS, the basic building blocks of web development. HTML, or HyperText Markup Language, is a standard set of tags you will use to tell the web browser how the content of your web pages and applications are structured. Use CSS, or Cascading Style Sheets, to select HTML tags and tell the browser what your content should look like. Whether you are coding for fun or planning to start a career in web development, learning HTML and CSS is a great place to start.
- Course
Adobe Illustrator for Web Design
Using a project-based learning approach to Illustrator’s core features, walk through the process of designing a simple website beginning with making a wireframe, and then using that wireframe as the basis for creating a page mock up for mobile and desktop platforms. Along the way, use the basic drawing and shape tools to create an illustrated graphic logo. And with responsive web design in mind, we’ll utilize the benefits of both scalable vector graphics (SVGs) and CSS export capabilities.
- Course
Web Design Process
Going from a blank screen to a finished website can be daunting. In this course, you’ll learn about the major steps involved in designing websites. We’ll learn how to gather information, explore potential concepts, and iterate on a design. By the end, you’ll have the foundation you need to continue your design journey.
- Course
CSS Basics
CSS (Cascading Style Sheets) is a style sheet language that describes the presentation of web pages. Whereas HTML is what forms the structure of a web page, CSS is what we use to style the HTML with colors, backgrounds, font sizes, layout, and more. As you’ll soon learn, CSS is one of the core technologies for designing and building websites.
- Course
CSS Selectors
In this short course, we’re going to go beyond the basic selector concepts covered in CSS Basics. Besides the common ways to select elements with type, ID and class selectors, we’re able to target elements based on their attributes, position in the HTML document, even their relation to other elements.
By the end of this course, you’ll have gained a better understanding of the power and flexibility behind CSS selectors. You’ll have a new set of valuable tools in your CSS toolkit to use on your next project. - Course
HTML Forms
The web is a two-way communication medium. There’s lots of HTML elements for displaying data and producing output, and conversely, there’s also lots of HTML elements for accepting input. Accepting input from the user means creating web forms. In this course, we’ll learn about all the most important form elements that web professionals use on a daily basis.
- Course
HTML Tables
The web is filled with text and images, but it’s also filled with information like sports scores throughout the years, list of employee names and email addresses, or nutrition facts for your favorite foods. HTML tables enable the display information in what is commonly known as tabular data, which is information that’s stored in a table-like structure of columns and rows. In general, anything that you might put into a spreadsheet could go in a table. There are many use cases for a table, so it’s important to add them to your skills because it’s a very common method for displaying information.
- Course
Web Typography
As web features barrel ahead, web typography advances with it. We now have more control over type than ever before. But, as the often-quoted line from Spiderman goes, “With great power, comes great responsibility.” Well-built websites can be plagued by bad typography, creating an unpleasant experience to the user. In this course, we’ll cover all you need to know to begin building websites with good typography, giving users a great experience.
- Course
CSS Layout Basics
Learn to work with common layout and positioning methods used in web design. In this course, you’ll get hands-on practice with basic CSS layout techniques like display modes and floats.
You’ll use your new CSS layout skills to build the layout for a simple web page. Then learn to enhance the layout using relative, absolute and fixed positioning. - Course
Responsive Layouts
Responsive web design is a collection of techniques for building websites that work on multiple screen sizes. In these lessons, we’re going to use the foundational principles of responsive design as a framework for thinking about page layout. By the end, you should have a better understanding of how to approach common decisions in responsive design.
- Course
CSS Flexbox Layout
Flexbox is a set of CSS properties that give you a flexible way to lay out content. With flexbox you can change the direction, alignment, size and order of elements, regardless of their original size and order in the HTML. You can even stretch and shrink elements and distribute space, all with just a few lines of CSS!
- Course
Bootstrap 4 Basics
Learn to use the latest in Bootstrap 4, one of the most popular open source front end frameworks, to help you build a functional design and layout in little time.
- Course
Prototyping in the Browser
Before you design a website, it’s important to have some kind of a plan or a wireframe to guide your efforts. But sometimes when you go from a simple sketch to digital pixels, the results aren’t exactly what you expect. When you work with real HTML and CSS, and you’re able to see your site on a real screens, you’re able to see a more accurate representation of the final result. In this course, we’re going to build a website prototype using the Bootstrap web framework.
- Course
CSS Transitions and Transforms
CSS transitions and transforms can create simple animations that enhance user interactions in websites and apps. In this course, you’ll build an interactive image gallery using CSS transitions and transforms.
You’ll use transition properties to define durations, delays, and easing functions. Then, you’ll learn how to rotate, scale, and move elements in 2D and 3D space, with CSS transforms. - Course
SVG Basics
Scalable Vector Graphics (SVG) is an XML markup language for creating two-dimensional images using vectors. This is different from traditional raster-based image formats that use pixels, like JPEG and PNG. When used on web pages, SVG images provide an infinite level of detail, so they look sharp regardless of screen size or pixel density. In this course, we’ll look at situations where SVGs are better than PNG and JPEG files, as well as when an SVG might not be the best choice. Finally, we’ll learn how to modify SVGs using CSS.
- Course
Animating SVG with CSS
SVG (Scalable Vector Graphics) also supports interactivity and animation, so you can animate and interact with SVG like you’re able to do with HTML. This short course covers the most common methods for animating SVG: CSS transitions, transforms, and keyframe animations.
- Course
Sass Basics
Sass is a stylesheet language that extends CSS with features like variables, nested rules, mixins and functions, in a CSS-compatible syntax. In this course, you’ll learn to use the powers of Sass to boost your front end workflow. The examples will teach you why you should use Sass in your projects. By the end, you will be writing more efficient CSS using code that is easy to read and maintain.
- Course
CSS Grid Layout
CSS Grid Layout provides a built-in, more efficient way of designing grid-based layouts in the browser. It brings a new set of properties, functions and flexible units that let you control the exact placement and sizing of grid components.
- Android
Track Completion