menu icon

HTML Blogs

Autoplay Video In HTML

Autoplay Video In HTML

Author: Sameer Saini Date Published: July 18, 2022

In this blog post, we will learn how to autoplay a video in HTML just as your HTML web page loads. Video elements in HTML can be configured to autoplay as the website loads so that the user doesn't have to play the video manually.

Read More
Open Image In New Tab [With HTML Source Code]

Open Image In New Tab [With HTML Source Code]

Author: Sameer Saini Date Published: July 18, 2022

In this blog post, we will learn how to open images in a new tab using HTML code. You may have seen websites opening their images in new chrome or firefox tabs. That gives a good user experience to the user visiting your website.

Read More
Get Month Full Name From Date In Javascript

Get Month Full Name From Date In Javascript

Author: Sameer Saini Date Published: May 04, 2022

Do you want to get the name of the month (e.g: Oct/October) from the date object in JavaScript? It is now possible to do this with the ECMAScript Internationalization API.

Read More
Get Current Year In Javascript Using getFullYear() Method

Get Current Year In Javascript Using getFullYear() Method

Author: Sameer Saini Date Published: May 04, 2022

Do you want to get the current year (e.g: 2021, 2022) from the date object in JavaScript? In Javascript, we can make use of the getFullYear() method that is available on the Date() object.

Read More
Get Current Month In Javascript using .getMonth() Method

Get Current Month In Javascript using .getMonth() Method

Author: Sameer Saini Date Published: May 04, 2022

Do you want to get the current month of the year on your HTML website? If that's the case, you might be in luck as javascript offers a really easy way to get the current month from the date.

Read More
Get Current Time In Javascript - Javascript Current Time

Get Current Time In Javascript - Javascript Current Time

Author: Sameer Saini Date Published: May 04, 2022

A common question that is asked many times by javascript developers is how to get the current time in javascript. Sometimes, we need to get the current time because we want to perform some actions based on the time of the day.

Read More
How To Print In Javascript - 3 Different Methods To Output Values In Javascript

How To Print In Javascript - 3 Different Methods To Output Values In Javascript

Author: Sameer Saini Date Published: April 29, 2022

If you are new to the Javascript language and you are wondering how can I display a value on to a web page or show it to the user, you've come to the correct post. In this blog post, we will see 3 different ways in which you can output from javascript and print the values to show it to the user.

Read More
How To Add Tab Icon In HTML | Favicon In HTML

How To Add Tab Icon In HTML | Favicon In HTML

Author: Sameer Saini Date Published: April 28, 2022

Favicons are an essential part of a good-looking website. Tab Icon in HTML websites or otherwise known as the favicon is a small image that is displayed next to the page title in the browser tab.

Read More
How To Create HTML Lists Without Bullets

How To Create HTML Lists Without Bullets

Author: Sameer Saini Date Published: April 28, 2022

When we create unordered lists in HTML, we get bullets before each of the list items for the unordered list. But, what if you don't need to show these bullets? What if you want to create HTML Lists without bullets?

Read More
How To Add HTML Border Around Text

How To Add HTML Border Around Text

Author: Sameer Saini Date Published: April 28, 2022

In HTML, you can add a box around text, or a border around text and change it to any color or thickness. Add HTML Border Around Text Using Inline CSS.

Read More
HTML Option Selected Attribute

HTML Option Selected Attribute

Author: Sameer Saini Date Published: April 28, 2022

In this blog post, we will learn about the Selected attribute in HTML Option element. A dropdown list is created using the Select tag in HTML.

Read More
Embed Google Forms In Website

Embed Google Forms In Website

Author: Sameer Saini Date Published: March 06, 2022

In this blog post, we will go step by step into creating and embedding a google form into a website. We can embed google forms in website for so many different reasons. We can embed google forms in HTML like a contact form, like a voting form, like a feedback form, etc.

Read More
How To Make Text Italic In CSS

How To Make Text Italic In CSS

Author: Sameer Saini Date Published: February 25, 2022

HTML and CSS offer us to use italics in a website. For example, this text has been made italic using HTML and CSS.

Read More
Create An Email MailTo Link In HTML

Create An Email MailTo Link In HTML

Author: Sameer Saini Date Published: February 25, 2022

In this blog post, we will see how we can create mailto links in HTML with ease. MailTo links are anchor elements or links which open the default mail program and users can start creating the email subject and body using the default program.

Read More
How To Add A Delay In Javascript - SetTimeout Method

How To Add A Delay In Javascript - SetTimeout Method

Author: Sameer Saini Date Published: February 25, 2022

There are some scenarios where we have to delay the execution of a method by a few milliseconds or a few seconds. A few use-cases of this could be delaying the disappearance of an alert or warning message by a few seconds. Another example could be redirecting a webpage to another webpage and telling the user that this webpage will be redirected in X number of seconds.

Read More
How To Remove Underline From A Link In HTML

How To Remove Underline From A Link In HTML

Author: Sameer Saini Date Published: February 24, 2022

When developing a website, you might use anchor elements to create links in a website that might lead to a webpage internally or externally. By default, links have an underline below them.

Read More
Javascript Get Element By Class

Javascript Get Element By Class

Author: Sameer Saini Date Published: February 24, 2022

In a reactive website, you would need Javascript to interact with the DOM and dynamically add, delete or change elements. In such a case, you would have to select an element. You can select an element by its tag but then this selection will select all the elements for that tag. So sometimes you need to assign classes to elements and then make a selection of specific classes.

Read More
Add Google Analytics Tracking To A Website

Add Google Analytics Tracking To A Website

Author: Sameer Saini Date Published: February 23, 2022

Have you created a new website or are the owner of an existing website and want to see how many people are coming to your website and what pages are they viewing? You have come to the right post. In this post, we will see how we can add Google Analytics to your website step by step and check your website's traffic and real-time information.

Read More
Add A Button OnClick Event In HTML and Javascript

Add A Button OnClick Event In HTML and Javascript

Author: Sameer Saini Date Published: February 23, 2022

Buttons in HTML perform an action. This can be submitting a form, starting or stopping an operation, triggering a process, or just visually changing the website. All of the above happens when the user clicks a button. HTML and Javascript together provide us the functionality where you can add buttons to the website and then use Javascript to trigger the button.

Read More
How To Create A Multi Page Website In HTML

How To Create A Multi Page Website In HTML

Author: Sameer Saini Date Published: February 23, 2022

There are two types of websites. One is a single-page website (not to be confused with a SPA) that has all its content in a single HTML web page or an HTML document. The other type is a website that has multiple pages (multiple HTML documents). Each HTML web page has different content in it. They might or might not share the common stylings, including the header and the footer elements.

Read More
How To Insert An Image In HTML - [Source Code]

How To Insert An Image In HTML - [Source Code]

Author: Sameer Saini Date Published: February 21, 2022

In this modern-day world, a website is nothing without an image. We have seen that websites in the late 90s or early 2000s had more text and less of images. This is not true today, every web page has lots and lots of images that portray their product, their business, or a blog in a much nicer and more descriptive way. Using graphics and infographics, web pages can convey their message in a great way without using too many words. Even in this blog post or other blog posts in this blog, we use a lot of images frequently with text to explain our topic.

Read More
Full Screen Overlay Navigation Bar Using HTML, CSS and JAVASCRIPT [Free Source Code]

Full Screen Overlay Navigation Bar Using HTML, CSS and JAVASCRIPT [Free Source Code]

Author: Sameer Saini Date Published: February 21, 2022

In this blog post, we are going to create a fancy navigation bar using HTML, CSS, and Javascript. This navigation menu would be not just a regular navbar, but, a full-screen overlay navigation menu. This will be a responsive navigation bar menu that will be responsive for both mobile and desktop displays. It will be really fun to code this and navigation bars like these create an amazing impression of your website in the user's head.

Read More
Create A Dropdown List In HTML

Create A Dropdown List In HTML

Author: Sameer Saini Date Published: February 21, 2022

Dropdown lists if you have seen them before on other websites are extremely powerful. They provide the user a clear list to select a single option from the list of options that the dropdown menu provides. They provide a good overall user experience. An example of a dropdown list in a general everyday website is the month picker. Using a dropdown list you can give the user to select the month of their birth.

Read More
Full Screen Background Video For Your Website Using HTML and CSS

Full Screen Background Video For Your Website Using HTML and CSS

Author: Sameer Saini Date Published: February 19, 2022

A lot of websites that are rich in user experience use a full-screen video background to provide rich media content that supports their website. This can be a product demonstration, user reviews, etc. The full-screen video background looks amazing and achieves its purpose.

Read More
Create A Countdown Timer Using HTML, CSS and Javascript - Free Source Code

Create A Countdown Timer Using HTML, CSS and Javascript - Free Source Code

Author: Sameer Saini Date Published: February 19, 2022

A countdown timer as we have seen in many places including one in our mobile phones is a timer that ticks backward from a given time to zero. A countdown timer has several benefits in real life too. This can be used as an alarm to see if food is properly cooked or not, to track activity, and numerous other things. Although we have a countdown timer in our mobile phone, creating a countdown timer from scratch using HTML, CSS and Javascript can be so much fun. This can be a mini project that you can add to your portfolio.

Read More
Create A Hero Banner Image Using HTML and CSS

Create A Hero Banner Image Using HTML and CSS

Author: Sameer Saini Date Published: February 19, 2022

A hero banner is a big size image (sometimes a full-screen image) on the top of the website. The purpose of this hero image is to basically present the overall goal of the website or business. This hero image banner may or may not have overlay text on top of it. It also sometimes has a call to action button so that users coming on to the website click on the call to action button on the hero banner displaying the clear motive of the website or the business.

Read More
Animated Full Page Search Bar Using HTML, CSS and Javascript

Animated Full Page Search Bar Using HTML, CSS and Javascript

Author: Sameer Saini Date Published: February 18, 2022

Medium and Big enterprise-level websites all require a search functionality in their website so that users can search for something particular across their website. This search functionality provides a pleasant user experience and users land straight to the resource they are looking for. In this blog post, we will create an animated full-page search bar for our website using HTML, CSS, and Javascript. First, we will start by creating the HTML and CSS for the header which has the search button in the header.

Read More
Toggle Password Visibility Using HTML, CSS and Javascript [Source Code]

Toggle Password Visibility Using HTML, CSS and Javascript [Source Code]

Author: Sameer Saini Date Published: February 18, 2022

You might have come across this functionality in so many websites, where you see a toggle button that toggles the password visibility for you. Some websites have this as a "Show Password" button, some have a "Password Eye" icon which suggests you can click or hover over it and you will be able to see the password you typed. This "Toggle Password Visibility" is an amazing functionality when you have to give a final look at the password that you just typed.

Read More
Host A Static Website On Github Pages And Add A Custom Domain

Host A Static Website On Github Pages And Add A Custom Domain

Author: Sameer Saini Date Published: February 13, 2022

For developers and users who don't want to use the CLI to publish their website, there is another great option where we can host a static website on the internet. This option is Github Pages. Github offers a great way to host a website using its user interface. Github pages offer free web hosting of static websites and in this free plan, you can also add custom domains to your websites.

Read More
Customize Scrollbar With CSS - Style A Scrollbar Using HTML and CSS

Customize Scrollbar With CSS - Style A Scrollbar Using HTML and CSS

Author: Sameer Saini Date Published: February 13, 2022

We all have seen the old boring scrollbars on websites and they are the default grey scrollbars that browsers provide us. Although they solve the purpose they are built for, sometimes having a custom CSS scrollbar makes a massive visual difference to the onlooker.

Read More
Image Hosting With Google Drive - Use Google Drive As A Image Hosting Provider For Your Website

Image Hosting With Google Drive - Use Google Drive As A Image Hosting Provider For Your Website

Author: Sameer Saini Date Published: February 13, 2022

Hosting images on the internet can be a costly affair. If you want to host and serve your images for your website over the internet, you can use your web hosting provider. But as an alternate, there can be an easier way to publish and use images for your website. Google Drive can be an amazing alternate where you can upload your images and use them in your website.

Read More
Create A Login Page Form Using HTML And CSS - With Source Code

Create A Login Page Form Using HTML And CSS - With Source Code

Author: Sameer Saini Date Published: February 08, 2022

Having a beautiful login page is essential. Users have to instantaneously like your login page to give that best first impression. In today's blog post, we will create a beautiful yet simple login web page using HTML and CSS only and I will also leave the source code so you can use it for your website.

Read More
Create and Embed Google Maps To Your Website - Google Maps Javascript API Tutorial

Create and Embed Google Maps To Your Website - Google Maps Javascript API Tutorial

Author: Sameer Saini Date Published: February 07, 2022

In so many versatile ways, almost every website needs maps in some shape or form. The use cases for these could be infinite. Business websites use maps to show their business location to let potential customers where they are located. On the medical side, we are seeing maps used to show clusters of covid cases for regions and countries. I know this is sad but technology helps us to protect ourselves better. So now that we know how maps could be so important in websites when we think about maps, the first thing that comes to our mind is Google Maps. Google maps have taken over the maps market by far.

Read More
Simple Top Navigation Menu Using HTML and CSS - [With Source Code]

Simple Top Navigation Menu Using HTML and CSS - [With Source Code]

Author: Sameer Saini Date Published: February 04, 2022

Every website needs some sort of navigation so that users coming onto this web page can easily navigate between the pages of the website. There are so many different navigation menus one can create like side navigation on a website, top navigation that stays on the top, maybe, one on the right side?

Read More
Embed A Youtube Video In your HTML Website In 2 Simple Steps

Embed A Youtube Video In your HTML Website In 2 Simple Steps

Author: Sameer Saini Date Published: February 01, 2022

Something as simple as adding a youtube video to your website can be the striking difference between the user staying on your website or just moving away from it. Embedding a youtube video by a link that nobody will click is useless but if the viewer can see a clear youtube video right there in your HTML Website could be amazing.

Read More