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.
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.
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.
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.
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.
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!
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.
Storing, tracking and handling data is a large part of computer programming. Arrays provide a method for storing multiple values into a single variable. That makes an array a convenient way to pass around a list of items. In this course, you’ll learn how to create arrays and use loops to access their contents. You’ll also learn some advanced methods that make working with arrays easier.
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.
jQuery Basics covers why you’d want to use jQuery, what it is and how to include it in your projects. You’ll build several projects over the course to give you the confidence to integrate jQuery in your own projects and add that level of flair and interactivity to any site you work on.
Bootstrap 4 Basics
Learn to use Bootstrap 4, one of the most popular open source front end frameworks, to help you build a functional design and layout in little time.
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.
HTML Video and Audio
Text and images have always been the foundation of web content, but more than ever, video and audio are also a part of that content mix. Fortunately, we can now create standards-based video and audio players that don’t require the use of plugins. Adding video and audio to a webpage is almost as easy as adding an image or formatting some text.
Create a Media Player with MediaElement.js
MediaElement.js allows you to offer a consistent experience with audio and video across browsers. You can also customize the players to your heart’s content. Let’s learn how to use MediaElement.js to share audio and video with your users.
Accessibility is the practice of making websites available to all people, regardless of their abilities or disabilities.
In this course we’ll cover tools needed in keeping your website in top shape. These tools will help you perform tasks like debugging a problem to improving your page load times.
The console is an important skill for any developer. Many programs can only be used via a command line interface, and often the only access you have to a server will be over a command line interface. Once you are familiar with the basics of the console, you will be able to perform very powerful tasks quickly and easily.
If you’re serious about pursuing a career as a software developer or designer, at some point, you will need to learn a version control system. A VCS is an important, but sometimes overlooked, tool that is essential for keeping all but the most trivial projects on track. In this course we’ll talk about what version control is and how it works before covering the basics of one of the most popular version control systems available today – Git. By the time you’re finished with the course, you’ll be ready to start using Git on your next project.
Introduction to Front End Performance Optimization
People want to use websites that load quickly, and every second counts. If a website takes more than 3 seconds to load, you can lose 40% of your audience. Every additional second in page response can result in a 7% reduction in conversions. In these lessons, we’re going to take a slow website and make it load faster using front end performance optimization. By the end, you’ll know many practical techniques that can speed up any website.
Front End Web Development
An entry-level salary for the technologies covered in this track is about $51,000 / yr on average.
Some companies that use these technologies regularly include: Google, Facebook, Yahoo, eBay, Amazon, and Treehouse