Wishlisted Wishlist

Please confirm that you want to add Build Your First Glass Web App Theme With HTML5 And CSS3 to your Wishlist.

Add to Wishlist

Build Your First Glass Web App Theme With HTML5 And CSS3

A complete step by step code along series to help you deisgn the most prettiest glass footer with HTML5 and CSS3
4.1 (58 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
4,696 students enrolled
Created by Hini Majesty
Last updated 1/2016
  • 2.5 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
Create an eye catching glass looking footer with HTML5 and CSS3 and would be able to do it for thier clients to make money and contact.
Learn to use the basics of html in any of your projects
Get up and running with HTML5 and CSS3
Learn to use the basics of CSS3 in any of your projects
Learn to build websites using HTML5 and CSS3
Get a copy of my free ebook titled "A JOURNEY INTO MEMORY" which teaches you how to study while retaining the information for a very long time
View Curriculum
  • Student needs to know the basics of working with a computer.
  • Students needs to know how to create files and folders
  • You need to have a computer on which you can test your codes
  • Finally you need to be ready to learn in a relaxed and a fun way.

My story is simple and as you can tell from the promo video, i gave up so many times when i started in web design. I gave up only because i was learning a lot of HTML and CSS but i was creating very poor designs and this was discouraging. The only way i overcame this was when i took a course that taught me how to create a website with HTML5 and CSS3 and most of what i did was to pause the video and type exactly what the instructor had typed. I barely understood anything but the final look of the site and the pressure i got from friends and relatives wanting me to create websites for them after i had shown them what i had done, forced me to learn without ceasing until i could put everything together to become a good web designer/developer. With that experience, i decided to get you up and running with this course by teaching you only the essential parts of HTML5 and CSS3 needed for what we would be building in this project.

The things we would learn are in the following order:

1. After introducing you to the course and giving you a feel of how the glass footer looks like, we would talk about how we can install the necessary text editors.

2. We would learn to install and use some essential sublime Text plugins that would help us to code faster and easier.

3. We would learn the basics of HTML5

4. Also we would learn the basics of CSS3

5. Next we would learn how to create the basic file structure for creating the glass project.

6. We would then code the HTML part of the glass footer with the knowledge you have gained from the basics of HTML and we would do same for the CSS3 part of the project too.

7. We would fix bugs that we encountered and that would mark the end of the glass footer.

8. In the bonus lecture you would get to know the source of the glass footer and also get my contacts.

upon completion of this course you would have adequate skills necessary to begin building very nice looking HTML5 and CSS3 websites on your own.

You would also be able to build the same project for clients and make money.

It would take you just 2 and half hours to complete the course while having a lifetime access to the course. After the course you would have all the skills necessary to build the nicest glass looking footer ever. Trust me, your clients would really be amazed at how well you are good with your designs and your work.

Who is the target audience?
  • This course is for the beginner to the pro. It is for every level since all that you need to understand the course would be taught in a very simple and easy to understand way.
  • The aspiring web programmer and designer
  • Anyone with the interest to build websites from scratch using HTML5 and CSS3
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 25 Lectures Collapse All 25 Lectures 02:25:53
Course Introduction and Installation of Text editors and Plugins
4 Lectures 14:32
  • In this video you would get a general overview of what we would be building in this course.
  • Also you would get a fair idea about the structure of the course.

  • Know what a text editor does.
  • Know the text editor we would be using in this video and how to get it and other alternatives.
Text editors

Sublime Text plugins

  • Learn to make use of the sidebar in sublime to help understand your document file structure.
  • Understand sublime text projects and how to create a project to aid in our workflow.
Sublime Text Sidebar and projects.
Basics Of HTML5
3 Lectures 16:38
  • Learn the very basics of HTML 5 as a pre-requisite for the final project.
  • Only the essential parts of HTML 5 would be taught to avoid boredom.

  • With the HTML UL tag we can create an un-ordered list which we would later build on that knowledge to build the glass footer.

  • Learn the three ways that you can use to include stylesheets in to your html documents.
  • Inline style
  • Internal style sheet
  • External style sheet
HTML and stylesheet
Basics Of CSS3
7 Lectures 37:54
  • In this video we would learn how to select and style html elements using css selectors.
  • Learn to use the id, class and descendant selectors. All are pre-requisites for the final development.
  • Learn to debug css code to make quick fixes.
CSS selectors

  • In this video we would be learning the basics of css such as:
  • Height
  • Width
  • Border and boarder-radius.
  • Background and background-image
  • Color Values
  • Learn css measurements
Css basics

  • In this video we would learn how to use css to style the html anchor tag in all its states.
  • Learn how to select and style multiple states of an element.
CSS and Anchor style.

In this video we would be learn how to work with CSS text and box shadow.
Text and Box shadow

CSS Positioning

  • In this video we would learn to use the @font-face rule in css to create a custom font for use in our project.
  • Learn how to make firefox display custom fonts.
Creating a custom font using css.

In this video we would learn how to use a custom stylesheet to reset the default styles that come with html elements.

Reset CSS
Let the Glass Footer Begin
10 Lectures 01:13:36

In this video we would learn how to structure our documents for the coding of the project to begin.

File setup for the glass footer project

  • In this video we would begin the coding of the actual project starting with the glass footer.
  • We would learn layout our divs, spans and other tabs to form the backbone of the glass footer.
Coding the HTML section of the glass footer.

  • In this video, we would learn how to get our coded HTML ready for styling.
Identifying the coded HTML uniquely using ids and classes.

  • This video continues where we left off in the previous video.
Adding the helper classes.

  • This video is the beginning of a journey into creating the glass footer.
  • We would begin styling the glass footer element in this video.
  • We would also be changing the background image in this video.
  • We would be creating the font that would be used on the tabs on the footer.
  • Learn to use css comments to note changes to the document for future reference.
Styling the footer element.

  • In this video, we would learn how to style the ul tag and some of the tabs in the footer.
Styling the footer menu tab and the other tabs on the page

  • In this video we would style the other tabs that were not styled in the previous video.
Styling the other tabs

  • With the use of css animations, in this video we would learn to make the notification icons move up when we hover on them.
  • Also we would learn to fix basic css coding issues.
Animating the notifications icon.

  • In this video we would give the logout tab its unique style and behavior.
Styling the logout tab.

  • In this video we would learn how to fix all the styles that are not currently rendering properly.
Fixing the bugs
Bonus Lecture
1 Lecture 03:13
Bonus Lecture
About the Instructor
4.1 Average rating
57 Reviews
4,696 Students
1 Course
Instructor at Udemy, Software developer

Majesty works as a freelance software developer who specialized in web development. As an experienced network marketer working with GNLD, i have always focused my web development towards building financial Apps. As of this wirting, i have taught several groups computer programming mainly the web languages even though i program in C++ and Java. I have developed quiet a number of web sites and many database driven web apps using HTML,CSS,JQUERY,JAVASCRIPT, PHP, MYSQL and other language extensions like JSON and PDO. I also do volunteer work for my church where i developed and update the churches website and database.

Introduced to computer programming at the age of 14 by an uncle who was then a Java Programmer. One day, he asked me after observing my enthusiasm towards computing if i wanted to learn how to make animations and boy "that, moment i was like a kid in a candy shop". I became so excited that in no time, i would be building stuffs with my computer. Up until then i was practicing general computing like fixing broken pcs and local area networking. He introduced me to action script where we created a flash project together. It was so exciting. I am a firm believer in video tutorials due to the flexibility it gives in studying.

I have been working in the I.T field for the past 7 years and currently studying to get an official Bachelors certificate in I.T at the university of energy and natural resources (Ghana).

Report Abuse