Companies Home Search Profile

The Complete Font Awesome 5 Course: Beginner's Guide

Focused View

devDigest />

58:51

144 View
  • 1. Introduction.mp4
    01:50
  • 2. IMPORTANT! READ BEFORE YOU START.html
  • 3. Getting Started.mp4
    02:38
  • 4.1 Course Resources.pdf
  • 4. Course Resources.html
  • 1.1 Official Link To Font Awesome Website.html
  • 1. UPDATE Using CDN - SVG With JS (EASY METHOD).html
  • 2.1 Project File (CDN - SVG With JS).zip
  • 2. Using CDN - SVG With JS (EASY METHOD).mp4
    01:27
  • 3.1 Official Link To Font Awesome Website.html
  • 3. UPDATE Manual Setup Using Downloaded Files - SVG With JS.html
  • 4.1 Project File (Manual - SVG With JS).zip
  • 4. Manual Setup Using Downloaded Files - SVG With JS.mp4
    02:54
  • 1. About This Section.html
  • 2.1 Project File (Manual - Web Fonts With CSS).zip
  • 2. Manual Setup Using Downloaded Files - Web Fonts With CSS.mp4
    02:56
  • 1.1 Project File - Basic Use.zip
  • 1. Basic Usage.mp4
    04:49
  • 2.1 Project File - Icon Sizes.zip
  • 2. Icon Size Classes.mp4
    02:53
  • 3.1 Project File - Set Icons To The Same Fixed Width.zip
  • 3. Set Icons To The Same Fixed Width.mp4
    01:45
  • 4.1 Project File - List Icons.zip
  • 4. How To Use List Icons To Replace Default Bullets In Unordered List.mp4
    02:51
  • 5.1 Project File - Bordered & Pulled Icon Classes.zip
  • 5. Bordered & Pulled Icon Classes.mp4
    03:32
  • 6.1 Project File - Animated Icon Classes.zip
  • 6. Animated Icon Classes.mp4
    02:15
  • 7.1 Project File - Rotated & Flipped Icon Classes.zip
  • 7. Rotate & Flip Icon Classes.mp4
    02:15
  • 8.1 Project File - How To Stack Multiple Icons.zip
  • 8. How To Stack Multiple Icons.mp4
    03:49
  • 9. Knowledge Check - Section 4.html
  • 1. Introduction - Power Transform.mp4
    00:44
  • 2.1 Project File - Power Transform Scaling.zip
  • 2. Power Transform - Scaling.mp4
    01:56
  • 3.1 Project File - Power Transform Positioning.zip
  • 3. Power Transform - Positioning.mp4
    02:17
  • 4.1 Project File - Power Transform Rotation & Flipping.zip
  • 4. Power Transform - Rotation & Flipping.mp4
    02:42
  • 5. Knowledge Check - Section 5.html
  • 1.1 Project File - How To Mask Icons.zip
  • 1. How To Mask Icons.mp4
    03:45
  • 2. Knowledge Check - Section 6.html
  • 1. Introduction - Layers, Text, And Counters.mp4
    00:45
  • 2.1 Project File - Stacking Multiple Icons by Layering.zip
  • 2. Stacking Multiple Icons by Layering.mp4
    04:29
  • 3.1 Project File - How To Add A Text Layer On An Icon.zip
  • 3. How To Add A Text Layer On An Icon.mp4
    02:12
  • 4.1 Project File - Layer Counters On An Icon.zip
  • 4. Adding Counters On An Icon.mp4
    03:03
  • 5. Knowledge Check - Section 7.html
  • 1. Upgrade From Version 4 To Version 5 By Using Shim Files - Quickest Way.html
  • 1. Thank You And Congratulations.mp4
    01:04
  • 2.1 Optional-Course-Resources.pdf
  • 2. Optional Course Resources.html
  • Description


    The Easiest Way To Build Modern HTML Icon Based Websites With The Most Popular Iconic SVG, Font, & CSS Framework

    What You'll Learn?


    • Solid understanding of Font Awesome 5 icon library and how it works.
    • Basic use of Font Awesome 5 classes.
    • Integrating Font Awesome 5 into your Web projects.
    • Set icon sizes.
    • Learn how to set icons to the same fixed width.
    • Use list icons to replace default HTML bullets in unordered lists.
    • Add borders & Pull icons left or right inside of its parent container.
    • How to add basic animations to icons, especially icons in the Spinner Category.
    • How to stack Icons - (Classic Method)
    • How to position Icons - (Classic Method)
    • Add Power Transform effects [Scaling, Positioning, Rotating & Flipping] - (New).
    • Combine 2 icons to create 1 single color shape by Masking - (New).
    • How to add Layers, Text & Counters to Font Awesome icons - (New).
    • Learn the quickest way possible to upgrade your current projects based on Font Awesome version 4 to Font Awesome version 5 using Shim files.

    Who is this for?


  • Take this course now if you know basic HTML and CSS or just completed any Web Development course.
  • Take this course now if you want to build icon based web designs.
  • Take this course now if you want to add another web development skill to your existing skill set.
  • Take this course now if you want to gain a better understanding of the most popular iconic SVG, Font and CSS framework in the world.
  • Take this course now if you've taken other Font Awesome courses but you are still confused and do not feel confident. This course is perfect for you.
  • Take this course if you want to get started with Font Awesome 5. (Latest Version Currently).
  • Take this course now if you want to easily use completely free, flexible, and scalable icons in your web projects in order to enhance User Experience.
  • More details


    Description

    Do you want to learn the number #1 iconic Web font toolkit that most popular websites use on the Internet?

    Are you tired of wasting your time on random YouTube videos or Font Awesome courses that are too difficult to follow?

    Do you want to learn how to build icon based web designs?

    Does the quality of your image based icons become poor and pixelated when you resize your website?

    OR

    Do you struggle to read and understand documentation of a web framework?

    If your answer is YES... then this is exactly the course you are looking for!

    By the end of this course you will be comfortable with:

    1. Solid understanding of Font Awesome 5 icon library and how it works.

    2. Basic use of Font Awesome 5 classes.

    3. Integrating Font Awesome 5 into your Web projects

    4. Set icon sizes

    5. How to set icons to the same fixed width.

    6. Use list icons to replace default bullets in unordered lists

    7. Add borders & Pull icons left or right inside of its parent container. 

    8. How to add basic animations to icons, especially icons in the Spinner Category. 

    9. How to stack Icons - Classic Method

    10. How to position Icons - Classic Method 

    11. Add Power Transform effects [Scaling, Positioning, Rotating & Flipping] - New

    12. Combine 2 icons to create 1 single color shape by Masking - New

    13. Adding Layers, Text & Counters to Font Awesome icons - New

    14. The quickest way possible to upgrade your current projects based on Font Awesome version 4 to Font Awesome version 5 using Shim files.

    Why is it important to learn the above?

    - These days, just knowing HTML, CSS, and JavaScript is great for beginners, but you have to constantly keep on learning to improve your skill set. 

    - Nowadays, icons are playing a major role in website designing. Developers are constantly focusing on icons because they are very important for any website. Research shows that most users try to scan a website when they visit for the first time.
    Therefore, developers should build a very interactive website that should attract users. One way of creating interactive websites is to add icons to your website.

    So why should you include icons in your web projects?

    a. Because icons support content by drawing attention:

    Pictures are important and worth a thousand words, just like icons too. 
    Websites without icons and pictures turn off people when they visit your website. That is why it's important to integrate icons, images, and other visuals into your designs.

    b. Because Icons can increase readability:

    Lists can increase the readability of your content. However, regular list bullets can be less appealing to the end user visiting your website.
    Instead of using regular list bullets, you can use engaging icons to draw attention to paragraphs and other blocks of content. This is because icons are easier to recognize and remember than regular list bullets. Also, icons make it easier to separate different blocks of text from one another.

    This course is a perfect fit for you if...

    #1. You want to gain a deep understanding of the most popular Iconic Web font framework on the Internet.

    #2. You searched YouTube or other resources only to find outdated lessons and tutorials. 

    #3. Interested in learning how to add icons to your website by using the popular icon library Font Awesome. 

    Now is the time to decide. This is what you get:

    • Lifetime access to HD quality videos. No! monthly subscription. Learn at your own pace, whenever you want. 

    • All videos are downloadable. Learn wherever you want, even without an Internet connection! 

    • Downloadable resources which contain starter code for each section. 

    • Interactive annotations to help you keep track and follow along when looking at the code. 

    • Basic animations to help you understand concepts. 

    • Free and helpful support in the course Q & A when you have questions or get stuck. 

    • Bite-sized and easy to digest videos. 

    • Practice Quizzes in each section to test your understanding. 


    If this sounds great? Then start this adventure with me today by enrolling in this course and join me in the only Font Awesome 5 course that you will need!

    Who this course is for:

    • Take this course now if you know basic HTML and CSS or just completed any Web Development course.
    • Take this course now if you want to build icon based web designs.
    • Take this course now if you want to add another web development skill to your existing skill set.
    • Take this course now if you want to gain a better understanding of the most popular iconic SVG, Font and CSS framework in the world.
    • Take this course now if you've taken other Font Awesome courses but you are still confused and do not feel confident. This course is perfect for you.
    • Take this course if you want to get started with Font Awesome 5. (Latest Version Currently).
    • Take this course now if you want to easily use completely free, flexible, and scalable icons in your web projects in order to enhance User Experience.

    User Reviews
    Rating
    0
    0
    0
    0
    0
    average 0
    Total votes0
    Focused display
    Category
    devDigest />
    devDigest />
    Instructor's Courses
    devDigest(Developer Digest) makes learning how to Program|Code so fun by creating tutorials that contain Tips & Tricks, How To's, Analogies, Visual Illustrations, and Animations.#JavaScript | #nodeJS | #WebDevelopment | #ProgrammingdevDigest strives to deliver high quality online education.Learn topics like web development, JavaScript, NodeJS and more in a fun and engaging way.Currently, you can find courses published by Clarence A.E, more instructors to come!Keep learning!
    Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.
    • language english
    • Training sessions 23
    • duration 58:51
    • Release Date 2022/12/24