100 Stories To Learn About Html5

Let's learn about Html5 via these 100 free stories. They are ordered by most time reading created on HackerNoon. Visit the /Learn Repo to find the most read stories about any technology.

1. How To Build a Table With Sticky Headers in Pure CSS

While creating user interfaces, we often encounter the problem that there is more data in our tables than can be fitted in the visible viewport. To achieve an excellent user experience on components like Gannt charts, data tables and spreadsheets, we often use the sticky CSS property on the header elements. This is a simple task when doing it only on one edge of the table.

2. Learn HTML & CSS: The Best FREE Online Resources for Beginners

If you're curious about getting started with web development, one of the things you will first have to learn is HTML & CSS, this is the base of web development and the first two inseparable tools you'll have to master

3. Creating a Screen Sharing Application With JavaScript

Have you ever wondered how hard or easy it would be to create your own screen-sharing application? Learn how today using HTML, CSS & JavaScript.

4. How to Take a Photo in Your Browser with JavaScript

Modern browsers are more powerful than ever before. We can do many things in the browser with JavaScript now, we'll capture images in the browser with js.

5. Node.js Tutorial: How to Build a Video Streaming Application in 10 Minutes

hi folks, in this blog we will build a Node.js video streaming application in like 10 minutes.

6. Overriding Bootstrap Classes Using CSS

Are you having a hard time changing some properties of some bootstrap classes with CSS?

7. Top 20 CSS3 And HTML Techniques You Must Know

Today I am sharing with you this advanced CSS & HTML tutorial where we are going to go through some of the best techniques to achieve the effect that you see on

8. HTML, CSS and JavaScript Explained Simply

Learning web development includes understanding & dealing with terms like CSS, Javascript, & HTML. This article aims to bring you up to speed with this concept.

9. Why You Should Use Semantic Elements Even If They Add No Visual Effect To Your Web Page.

Wouldn’t it be easier if for our HTML tags, we had to focus on only <div>’s and <span>’s rather than considering the various HTML5 tags like <article> and <section>? Well, allow me to share an experience that will surely tweak that thought.

10. 9 Tips and Best Practices for HTML 5

Read this article to find out the most common HTM5 best practices.

11. Add Dark Mode to Your Web Page With One Line of CSS 🌓

Create dark mode with 1 line of CSS with filters, and some tips and tricks.

12. How To Format Your CSS Code as a Professional

As a full-stack web developer, I'm building different websites by writing code every single day. Experiencing several situations including solving problems and fixing errors.

13. How I Learned HTML5 CSS3 in 446 Hours with 8 Projects

For some people, the title could look funny or interesting. But it is true because I made that trip, I spent 9 weeks working hard learning HTML and CSS.

14. Introduction to CSS Media Queries

Learning web development is a journey an aspiring software engineer should consider, it involves learning, self-motivation and access to a lot of online resources, it’s also good to have a mentor.

15. Do You Really Understand the Viewport

If you are a web developer, you must have heard about viewport, and the below line may seem familiar to you.

16. After 20 Years Of Web Development, I Am Ready For Disruption

I have been working in web technology for more than 20 years. I spent the first five years of my career as a full-stack developer. Back then, we used the term webmaster. I would set up servers (which included e-mail and FTP), order domain names, create databases and order SSL certificates. I would code the backend and the frontend, plus open up Photoshop to do a little bit of design and UX from time to time. I was the scrum master and the business analyst plus I would support customers and project manage their websites. These tasks and job titles were all just part of being a webmaster. You crafted the web by yourself, and it lived in a box in the room next door, occasionally you would have to go in and check on it, maybe even restart it.

Later in my career, I saw an opportunity to specialise. Living and working in London, I saw the increasing need for the expert. Recruiters started to ring me, asking about specialist job titles. I very much enjoyed the visual element of working in the browser and JavaScript was growing in power and clearly here to stay.

17. 3 Things to Know Before You Start HTML Coding From Scratch

HTML coding requires a specific skill set from developers for robust website development.Based on your requirement and project details, you can use any of the content management systems to get the things started. However, “if you are planning to start your website coding from scratch in HTML”, there are a few things you need to make sure before beginning to code.

18. 8 Platforms: Endless Web Development Possibilities. The Time for Learning to Code is now!

There is no excuse for not learning something anymore. Things are just a click away!

19. How to Create HTML Pages Quickly

When you are creating a website there are several factors to take in count. One is that any website today has to be easy to read on mobile and desktop versions, it has to be friendly and also you should try to make it look good.

20. How To Create And Use Skeleton Loader: An Overview [Part 1]

In this era of digitalization, teams are focusing more on giving best experience to the users. So, user experience keeps on evolving, new methodologies and components are being adopted by the teams. One among them is Skeleton Loader which you might have seen on many web sites and mobile apps.

21. Making a Gradient Color Generator App Using JavaScript

In this article, I have shown you how to make Gradient Color Generator using JavaScript.

22. 17 Most Popular Tools For React Developers

Today we will go into learning tools and libraries to help developers in the process of programming with React JS!

23. Introducing a New, Lightweight WYSIWYG HTML Editor That Fits Any Technology Framework

24. The Power Of HTML And CSS Evolution

The HTML evolution from HTML 2 to HTML 5 has seen an enormous shift of things which has empowered web developers in tremendous ways. Committed web engineers that have been in this space long enough will tell you that these changes have made web development much easier. A release of an HTML version means a better and easier way of doing things and for those that have not been writing HTML some time, catching up with the rest without taking a course is next to impossible. With HTML 2 that was launched in 1995 all the styling and how the page looked was a responsibility of HTML.

25. 8 Ways to Apply UX to Your Website

User Experience is a must on the website as that is the thing people experience first. There are 99% chances that the visitor will go whether you have...

26. The Website Accessibility Checklist

Cheatsheet to make your web app more accessible with little effort

27. Set or Update New Title and Meta Tag - Angular

Set or Update new Title and Meta Tag- Angular

28. A Beginner's Guide to CSS Grid Layout

A Beginner's Guide to CSS Grid Layout

29. How to Get Base64 Encoded Data from an HTML Image Element in JavaScript

This tutorial teaches you how to get the Base64 encoded data of an image displayed in the HTML image element using JavaScript.

30. Creating a Video Background on Your Website with HTML and CSS

Learn how to create an engaging video background for your website using HTML and CSS.

31. Understanding Optional Chaining in JavaScript

Optional chaining is a modern language feature that allows you to safely navigate through and access deeply nested object properties.

32. Virtual DOM, Reconciliation And Diffing Algorithm Explained Simply

Ever wondered what makes react so fast ? Here's a detailed explanation why react is fast and what is virtual DOM.

33. How to Build a Responsive Page Using Bootstrap

One of my every project challenge was to build a responsive page with media querys and a few knowledge about how it works, but after it, Bootstrap came to me...

34. 5 Simple Ways to Replace All String Occurrences in JavaScript

Have you ever been in a situation where you had a string of text and wanted to replace all of its occurrences with something else?

35. 24 HTML Attributes You Want to Use ✨📚

A review of some of the HTML attributes you might want to use.

36. How to Style Horizontal Rules in CSS: Styling the hr Tag

There are a few simple tricks you can use to make your content stand out from the pack.

37. 12 Websites to Take Your CSS Skills From Beginner to Pro

From comprehensive tutorials, to cheat sheets and code snippets—these sites will give you the tools and knowledge necessary to create beautiful, functional.....

38. How To Add a Favicon to Your Site

Adding a Favicon to Your Site

39. How To Create CSS Neon Animation

Guys! Thank you all 🥳, I've hit a 100 subscribers to my Newsletter and I'm over the moon!

40. 21 Valuable HTML & CSS Code Snippets for Web Developers

21 Useful HTML & CSS tips for every project

41. Using Android Studio to Explore the Salesforce Mobile SDK

In the 2nd article of the series, create a native Android application that leverages the Salesforce platform and the Salesforce Mobile SDK.

42. Uderstanding the Basic Structure of a Website

Webpages can and do look pretty different from one another, but they all tend to share similar standard components.

43. How to Master Nested CSS Selectors: Tips to Get Started

Mastering CSS selectors doesn't have to be a daunting task. One of the best ways to set yourself up for success is by learning how to group and nest your select

44. The Secret Trick For Mobile Viewports

How to make handling the viewport on mobile less awful, correctly fill the viewport, and get correct specific viewport sizes.

45. 6 Easy Ways to Improve Accessibility in HTML Tables

HTML tables are a great way of visually representing data in a tabular format.

46. How to Use foreach() to Iterate Through an Array in JavaScript

Knowing how to use forEach in JavaScript is an important first step in writing code that is optimized for speed and efficiency.

47. Free Courses for Learning HTML: 2020 Edition

HTML and CSS are the pillars of web development. They are used to create web pages. HTML provides the structure to your web page while CSS provides them the style to look better. I know most people use Bootstrap: a CSS library to make their web pages look beautiful and professional. But, basic knowledge of the CSS concept is very important to understand how bootstrap works.

48. Building Your Own BMI Calculator: A Step-by-Step Guide

This is a simple BMI Calculator made with pure HTML, CSS & JavaScript.

49. Internationalization in CSS

Internationalization In CSS

Prepare your designs for an international audience.

50. CSS Combinators : Mastering the Use of Multiple CSS Selectors

A Complete guide on CSS combinators 2022. You can find everything you need to know about CSS Combinators in this blog.

51. What You Don't Know About CSS

Since I've been learning CSS, I have met a lot of programmers saying or claiming that CSS is not a hard language or it is not a programming language. However it is or not, it's clear that without CSS, the world of web development wouldn't be the same.

52. How Does the CSS Box Model Work?

Let's think a little bit more about how box models work.

53. How I Designed a Cool Landing Page Using HTML5, CSS3 and Bootstrap

Making project is a fun as well as a challenging task.

54. An Elegant Three Button HTML and JavaScript Audio Animation Player

The HTML and JavaScript code used to build an accessible and responsive design animation and audio player for the Web.

55. The Best Free Resources To Learn Web Development

I have found some of the biggest, best, and most interactive platforms where you can learn web development for free online.

56. Render Lists using Infinite Scroll in AngularJS

How to build infinite virtual scrolling lists in Angular to deal with situations with long lists of data efficiently and without compromising on performance.

57. Creating a Single Page Modular App Architecture Using Pure HTML, CSS & Javascript

In this tutorial, you will learn about SfNav, a web component, which allows you to architect HTML applications in a modular fashion.

58. Cats Taking Over: How to Make a Random Cat Image Generator With React and Cat API

Easy guide to filling your life with (more) internet cats by making a random cat image generator with React and Cat API. If you prefer video format then I have already made a video on YT:

59. How to Include Bootstrap in Your Next Web Development Project

First of all, web development is an interesting discipline because things are always changing, evolving, and improving. But, as a beginner to front end web development, the constant change could be a barrier to your learning and motivation.

60. How to Design a Grid-based Framework Using the CSS Float Property

Basic grid-based framework

61. 6 Best HTML Programming Books Ranked by Review Score

Topping off the 6 best HTML programming books based on Amazon reviews is HTML & CSS: Design and Build Websites.

62. What is Web Accessibility and Why You Should Care

It's amazing how easily we tend to forget about some set of people who don't have the ability to use the web to its fullness because of some form of impairedness or the other. When building websites, web designers often forget(or not in the habit) to make their sites accessible by people of less abilities such as blindness, deafness and so on.

63. How to Best Optimize Your Videos for the Web - A Quick Guide

In this article you will learn several ways to optimize videos, to ensure they contribute to the user experience, without harming it.

64. Semantic HTML: What, Why, and How

There are around 100 semantic HTML elements - don't build what HTML hands to you on a silver platter.

65. How To Generate WCAG Compliant Contrast Color in Bootstrap

The intent of this Success Criterion is to provide enough contrast between text and its background so that it can be read by people with moderately low vision.

66. What is the HLS Streaming Protocol and How Does it Work?

HTML5 live streaming solutions have become more popular lately. One of them is the HLS protocol. There are some reasons why this is so popular, the most important of which is that RTMP lost its support by the end of 2020.

67. Some HTML, CSS Little Secrets In One Article

There are many different guides and guidelines on the Internet. I tried to go through all of them and put together a little cheat sheet.

68. Build a Mobile App Using React Native and the Salesforce Mobile SDK

Check out how easy it is to start building a custom React Native application that leverages the Salesforce platform and the Salesforce Mobile SDK.

69. CSS Underdog Rule: position: sticky;

PH: Hitarth Jadhav from Pexels

70. The Art of Naming: CSS Guide

I have heard lots of developers say they hate CSS. In my experience, this comes as a result of not taking the time to learn CSS. So here is my latest post, I'll tell you about a few naming conventions that will save you a bit of stress and countless hours down the line.

71. Let’s Make a Pie By Using CSS Gradients

Nowadays, web pages use CSS and CSS provides a lot of chances to make different things. Gradients and a pie done by using gradients are some example of them.

72. CSS3 Gradients: The Gradients That Are Not Really Gradients

For beginners, it is intuitively difficult to guess that the pattern above is created with CSS gradients. They will be like, “how possibly can it be gradients while all I see are solid colors?” After all, gradients are supposed to be smooth transitions between colors. That is how I used to think two months ago before I start an HTML & CSS course at Microverse.

73. Introducing the Storybook Comic Book Builder

A Fast Accessible Mobile-First Web Comic Book Builder

74. My Journey to Become a Web Developer

Disclaimer

75. Sass Introduction

INTRODUCTION

76. How to use CodePen Code Inside Your Webpage

With the world rapidly evolving by the minute, staying on top of the in-demand skills’ curve is a voluminous task. Web Development is one such skill that is almost essential to the modern developer. With a market size of about $40Bn in 2020, the need and opportunity for quality web developers are ever so evident.

77. How To Design a Tribute Page with Basic HTML5 & CSS3

Let us discuss (or understand) the components of the Tribute page that I built with HTML5 & CSS3 in a step-by-step guide.

78. HTML5 Websockets API Introduction and Tools

The WebSocket API is an advanced technology that makes it possible to open a two-way interactive communication session between the user's browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply.

79. HTML Fundamentals: How To Get Started [Part 1]

If you are here to begin your journey to become a full-stack developer, understanding the basics of HTML will be your first stepping stone. Or if you are here to simply learn how to build an awesome website of your own, I have got your back. This could be used as an ultimate HTML cheat sheet for beginners.

80. How To Nail Video Email Marketing With Seasonal Email Campaigns

Ah, so you've decided to use video marketing. A wise choice indeed, seeing as, according to Google, "6 out of 10 people prefer online video platforms to live TV".

81. Understanding WebRTC

What is WebRTC?

82. How To Create Truly Responsive Images With Flexbox

 If you're trying to learn CSS Flexbox, I bet you've spent some time watching a few tutorials on YouTube. Maybe you've seen the Wes Bos series, that’s a great one. Maybe you're bi-lingual and found some helpful content in your native tongue. Most technical content on the internet is in English, as we know. Yet, sometimes I find some amazing content in my native Portuguese. (Like this remarkably simple to understand tutorial on Flexbox). Finally, how can you not have resorted to the Interneting Is Hard tutorials?

83. Journey to Become a Web Developer From Scratch [Step-by-Step Guide]

Before getting in, let’s discuss about objectives.

84. Learn How To Create HTML Forms Like A Pro

One of the main drivers of business success is good customer relations. Companies must listen to their customers and take appropriate action. Many online businesses collect feedback from their customers through online forms.

85. How To Make Your Page Look Alive with CSS Transitions

Going Through HTML & CSS courses, I learned A LOT, but surprisingly, I never come across the Transition property up until recently, and I've been loving it ever since.

86. How Relearning HTML Gave Me New Insights as a Web Developer

I relearned HTML to discover my unknown unknowns by taking an Introduction to HTML5 course and by reading the MDN documentation for every HTML element.

87. How To Create Forms in React

Just like we use Forms in HTML, we can use the same thing to React. It’s quite different from other DOM elements but not too complex.

88. A Beginner's Guide to JavaScript's The Intersection Observer API

Have you ever wanted to detect the visibility of an element and create a sleek reveal content on scroll effect in your project or website? Find out how .

89. Top Lesser Known HTML 5 & CSS 3 Tips and Best Practices

There is a lot of information about different HTML/CSS features. I want to tell you about equally useful, but less popular tips for you work!

90. How To Create And Use Skeleton Loader: Simple Example [Part 2]

In this post, we will dive into actual implementation of Skeleton Loader step by step.

91. How To Start Coding Right Now

What if someones asks you to build a website today, would you think that is possible?

92. Top 5 Free HTML and CSS Online Training Courses for Beginners

HTML and CSS are two pillars of web development, they are used to create web pages you see every day. HTML provides the structure to your web page and CSS provides them the style to look better. If you want to become a front-end web developer or web designer then a good knowledge of HTML and CSS is a must.

93. How to Get the Most Out of Your Bootstrap Designs

If you want to make the most of your web design, then it’s time to hop on the Bootstrap bandwagon. With Bootstrap, you can search for content blocks from all categories to create stunning web pages you are proud of.

94. How To Write Semantic HTML

As a Microverse Student in the last time, I have been struggling with some HTML and CSS projects. They challenged me to learn new features of these technologies all the time. My projects were made gradually trying to follow good practices but none was as striking for me as the use of semantic HTML.

95. I Built A Photo Gallery with CSS Animation: Here’s what I learned

The vanilla CSS(without any external JavaScript and CSS libraries) allows animation of HTML elements using CSS properties. This is very powerful and quite simple to learn and use.

96. Free Tools That Will Help You Grow As A Front-End Developer In 2021

You only need this post to become a Front-end Developer because this post has nearly unlimited amount of every type of resources covering everything you....

97. How I Built A 2D Platformer Using Unity3D game engine

Forest Assassin is a 2D adventure platformer game with easy controls and fun gameplay, which helps every one to get started, this is a classic platformer game with wonderfully designed characters and world.

98. 20 Free & Premium Business & Services HTML5 Website Templates to Boost Your Efficiency

Creating websites with pre-built templates is becoming more and more popular nowadays. These powerful instruments have a lot to offer to even the most demanding web developer. One may choose a variety of templates for making websites, in particular, WordPress or Drupal themes, Joomla or E-commerce templates.

99. Top 11 Popular CSS Interview Questions

CSS, Cascading Style Sheets, is a style sheet language that is simple and easy to learn. It is basically about how to represent HTML elements on the screen. It is mainly used for adding styles to web pages. It is one of the favorites of developers and designers for adding styles to web pages. So, today we will be talking about the 11 most asked questions on CSS.

100. Why Does HTML Think “chucknorris" Is A Color? And 10 More FAQs, Answered

HTML, Hypertext Markup Language,  is the standard markup language used mainly for creating pages to display on World Wide Web (WWW). It is very simple, easy to learn, and allows you to create amazing websites. So, today we will be checking out the 11 most asked questions about HTML.

Thank you for checking out the 100 most read stories about Html5 on HackerNoon.

Visit the /Learn Repo to find the most read stories about any technology.