Top HTML Interview Questions (2024) – Updated

Here, in this article, we have included a list of the most popular interview questions and answers for cracking HTML interviews.

This will help to crack the interview for both experienced and for fresher candidates.

Let’s go!!

Q1. What is HTML?

In short, HTML is used to structure of the web pages and it stand for Hyper Text Markup Language.

Q2. What do you mean by HTML5?

HTML5 is the latest version of HTML. It has got some new features like audio, video, canvas and many other features.

Q3. What is the difference between elements and tags in HTML?

A tag usually consists of opening and closing tags, whereas elements are the opening and closing tags plus anything between the two tags.

Example:

Q4. What are HTML attributes?

Attributes provide additional information about HTML elements.

Example:

Attributes always appear on the opening tag of the element that carries them. Almost all attributes consist of two parts: a name and a value.

Q5. What is the difference between Bold vs. Strong tag & Italic vs. Emphasis tag?

Bold

• The bold tag is used to render the text in bold style.

Strong

• Whereas the strong tag indicates that its content has strong importance, seriousness, or urgency.

Italic

• The italic tag is used to render the text as italic.

Emphasis

• Whereas the emphasis tag indicates emphasis that subtly changes the meaning of a sentence.

Q6. What is the difference between <blockquote> and <q> tag?

Blockquote

• The is used for long and multiline quotations.

q

• The tag is used for shorter quotes that sit within a paragraph.

Q7. What is the difference between unordered list and ordered list in HTML?

Unordered List

• An unordered list is used to create a bulleted list of items.
• The <ul>...</ul> tag is used to define an unordered list; whereas, the <li> … </li> tag is used to define the items of the list.

Ordered List

• An ordered list displays a list of items using numbers or letters in either ascending or descending order.
• The <ol>…</ol> tag is used to define an ordered list; whereas the <li> … </li> tag is used to define the items of the list.

Q8. What does href stand for?

href stands for Hypertext Reference.

Q9. What is the use of alt attribute?

All img elements must have an alt attribute. The text inside an alt attribute is used for screen readers to improve accessibility and is displayed if the image fails to load.

If the image is purely decorative, using an empty alt attribute is best practice.

Q10.What are the new media elements that are included in HTML5?

The new media elements include:

<source>, <video>, <audio>, <canvas>, <track>

Q11.What is figure and figcaption tag in HTML5?

In HTML5, an image and a caption can be grouped together in a figure element.

The purpose of a figcaption is to add a visual explanation to an image.

<figure>
  <img src="pic_taj_mahal.jpg" alt="Taj Mahal" />
  <figcaption>Fig1. - Taj Mahal, India.</figcaption>
</figure>

Q12.What is the difference between Serif and Sans-serif fonts?

Serif fonts have small lines at the ends on some characters.

Sans means without – these fonts do not have the lines at the ends of characters.

Q13.When do you use the iframe tag?

When we want to display multiple pages on a single page then we should use the iframe tag.

Example:

<iframe src="https://github.com" height="300px" width="300px"></iframe>

Q14.What is the use of <abbr>…</abbr> tag?

<abbr>...</abbr> tag defines an abbreviation. A title attribute on the opening tag is used to specify the full term.

Example:

<abbr title="World Health Organization">WHO</abbr> is awesome.

Q15.What is the use of <meta> tag?

<meta> tag is used to add a description of an HTML page.

The description that we add about the web page using the <meta> is used by search engines for indexing and ranking the web page.

Example:

<meta name="description" content="An article about JavaScript variable." />
<meta name="keywords" content="let,const,var,variable,js" />

Q16.What is the use of the <aside> element in HTML5?

The <aside> element defines some content aside from the content it is placed in (like a sidebar).

The <aside> content should be related to the surrounding content.

Example: pull quotes, sidebars, author information and ads

Q17.How can you highlight text in HTML?

By using the <mark>...</mark> tag.

Q18.How can we embed video in HTML5?

By using <video> tag.

<video src="movie.ogg" controls="controls"></video>

Q19.Which video formats are used for the <video> element?

Ogg, MP4, WebM.

Q20.What is the use of <wbr> tag in HTML5?

The <wbr> (Word Break Opportunity) tag specifies where in a text it would be ok to add a line-break.

Example:

<p>
  To learn AJAX, you must be familiar with the XML<wbr />Http<wbr />Request Object.
</p>

When a word is too long, or we are afraid that the browser will break our lines at the wrong place, we can use element to add word break opportunities.

Q21.What are the uses of blockquote and cite tag?

When we want to quote a passage from another source, we should use the <blockquote> element. But, we can use the cite attribute on the <blockquote> element to indicate the source of the quote.

The value of this attribute should be a URL pointing to an online document; if possible, the exact place in that document.

Example:

<blockquote cite="http://www.worldwildlife.org/who/index.html">
  For 50 years, WWF has been protecting the future of nature. The world's
  leading conservation organization...
</blockquote>

Q22.How many types of HTML tags are available and what are they?

There are two type of HTML tags and they are:

• Container tag
• Empty tag

Container tag: Which has opening and closing tags.

Example:

<html>...</html> , <head>...</head>,  <body>...</body>

Empty tag: Which has only the opening tag.

Example:

<br>,  <hr>,  <img>

Q23.What are HTML boolean attributes?

There are several attributes in HTML5 that do not consist of a name/value pair but consist of just a name such as required or checked. These are called boolean attributes.

Q24.What is a doctype?

The <!DOCTYPE> declaration is an instruction to the web browser about what version of HTML the page is written in.

<!DOCTYPE html>

Q25.What is the use of the <main> tag?

The <main> tag helps search engines and other developers to find the main content of your page.

Q26.How to keep spaces preserved in HTML while viewing from a web browser?

By using <pre> and   (non breaking space).

Q27.What are the elements that have disappeared in HTML5?

<frame>, <noframe>, <frameset>, <applet>

Q28.Explain what are the differences between the GET and POST?

GET

• When GET is used, the submitted form data will be visible in the page address field.
• The length of a URL is limited (about 3000 characters).
• It is useful for form submissions where a user wants to bookmark the result.
• GET is better for non-secure data, like query strings in Google.

POST

• The POST method does not display the submitted form data in the page address field.
• POST has no size limitations, and can be used to send large amounts of data.
• Form submissions with POST cannot be bookmarked.
• POST is best to use when form data contains sensitive or personal information.

Q29.What is the use of <header> tag in HTML5?

• The <header> tag specifies a header for a document or section.
• The <header> tag should be used as a container for introductory content.
• You can have several <header> elements in one document.

Example:

<article>
  <header>
    <h1>What Does WWF Do?</h1>
  </header>
  <p>WWF's mission</p>
</article>

<header> tag can also include the section heading, the author’s name, time and date of publication, table of contents, or other navigational information.

Q30.What is the use of <head> element in HTML?

The <head> element contains information about the page.

For example, it might contain a title and a description of the page or instructions on where a browser can find CSS rules that explain how the document should look.

Q31.What are block-level, Inline & Inline-block elements?

Block-level

• A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can).
• Example: <div>

Inline

• An inline element does not start on a new line and only takes up as much width as necessary.
• Example: <span>

Inline-block

Inline-block elements are similar to inline elements, except they can have padding and margins added on all four sides. Also, you can set width and height values too.

Q32.How can you change the direction of HTML text?

By using the <bdo>...</bdo> (bidirectional override) tag you can change the direction of HTML element.

Q33.What is the use of the <canvas> element in HTML5?

The <canvas> element is used to draw 2D graphics images on a web page by using javascript.

<canvas id="myCanvas" width="200" height="100"></canvas>

Q34.What are the new APIs provided by HTML5 Standard?

• Geolocation
• Drag and Drop
• Local Storage
• Application Cache
• Web Workers

Q35.What is character encoding?

To display an HTML page correctly, a web browser must know which character set to use.

UTF-8 (Unicode) covers almost all of the characters and symbols in the world.

The default character encoding for HTML5 is UTF-8.

This is specified in the tag:

<meta charset="UTF-8" />

Q36.What does action attribute do?

The action attribute defines the action to be performed when the form is submitted.

Normally, the form data is sent to a web page on the server when the user clicks on the submit button.

Q37.Why is the name attribute important?

Each input field must have a name attribute to be submitted.

If the name attribute is omitted, the data of that input field will not be sent at all.

Q38.What <fieldset> and <legend> tag does?

• The <fieldset> tag is used to group related data in a form.
• The <legend> tag defines a caption for the <fieldset> element.

Q39.What is Progressive Web Apps(PWA)?

A progressive web application is a type of application software delivered through the web, built using common web technologies including HTML, CSS and JavaScript.

Q40.What do you mean by margin in web design?

Margin properties are used to create space around elements, outside of any defined borders.

Q41.What do you mean by padding in web design?

Padding properties are used to generate space around an element’s content, inside of any defined borders.

Q42.What is the use of a definition list?

A definition list is a list of terms and corresponding definitions like in dictionary. The <dl>, <dt> and <dd> tags are used to define description list.

<dl>
  <dt>Fruits</dt>
  <dd>Apple</dd>
  <dd>Mango</dd>
 
  <dt>Country</dt>
  <dd>India</dd>
  <dd>Russia</dd>
</dl>

Q43.What do you mean by row spanning?

When we are merging two rows into one is called row spanning.

Q44.Describe the difference between a cookie, sessionStorage and localStorage.

All the below mentioned technologies are key-value storage mechanisms on the client side. They are only able to store values as strings.

Cookie

• Capacity – 4kb
• Browsers – More older browsers support
• Accessible from – Any window
• Expires or lifetime – As specified (Manually set)
• Storage location – Browser and server
• Data transferred on every http request – Yes
• Supported on SSL – Yes

localStorage

• Capacity – 5mb-10mb
• Browsers – Less older browsers support
• Accessible from – Any window
• Expires or lifetime – Till deleted
• Storage location – Browser only
• Data transferred on every http request – No
• Supported on SSL – No

sessionStorage

• Capacity – 5mb
• Browsers – Less older browsers support
• Accessible from – Same tab
• Expires or lifetime – Till tab is closed
• Storage location – Browser only
• Data transferred on every http request – No
• Supported on SSL – No

Q45.What kind of things must you be wary of when design and develop for multilingual sites?

Properly localizing content for different audiences based on their location, as well as allowing for a user to easily change their country/language.

Q47.What are data- attributes good for?

Custom data- attributes allow you to add your own information to tags in HTML. There are mainly 2 parts of the data- attributes and they are:

1. Attribute Name: Must be at least one character long, contain no capital letters and be prefixed with ‘data-‘.
2. Attribute Value: Can be any string.

<li data-book-author="Rabindra Nath Tagore"> Gitanjali </li>

Q48.What is the difference between HTML5 application cache and regular browser cache?

HTML5 application cache

One of the key features of HTML 5 is “Application Cache” that enables us to make an offline version of a web application. It allows you to fetch few or all of the website contents such as HTML, CSS, images, javascript files etc locally.

Application cache has some advantages: users can use the application when they’re offline, cached resources load faster and reduced server load.

Browser cache

On the other hand, web browsers use caching to store HTML web pages by storing a copy of visited pages. After that, the copy is used to render when you visit that page again.

Q49.Briefly explain cache manifest file in HTML5?

Cache manifest file is simply a text file that dictates the browser, what to store for offline access? It basically lists down the required resources for offline access.

Q50.What is an HTML5 Web worker?

Normally if some script is executing in an HTML page, the page remains unresponsive until the script execution stops.

But an HTML5 web worker is a script (i.e. JavaScript) that keeps executing in the background. At the same time users can interact with the page and will not feel any performance degradation.

Q51.What are the limitations of HTML5 Web Worker?

Few JavaScript objects are not accessible to HTML5 web worker as:

• parent object
• window object
• document object

Q52.What do you mean by <div> element?

The <div> element, also known as a division element, is a general purpose container for other elements.

Q53.What is W3C and WHATWG?

W3C and WHATWG both are giving a shape to our modern web. W3C stands for World Wide Web Consortium, whereas WHATWG stands for Web Hypertext Application Technology Working Group.

WHATWG is a “Living Standard” for HTML, that means, New features can be added, but old functionality cannot be removed.

Q54.What are the new <form> elements available?

datalist, output, color, date, email, url and others.

Q55.What are the new HTML5 graphics tags available?

<canvas> and <svg>

Q56.What are HTML5 semantic elements?

Semantic elements = elements with a meaning.

A semantic element clearly describes its meaning to both the browser and the developer.

Examples of non-semantic elements: <div> and <span> – Tells nothing about its content.

Examples of semantic elements: <form>, <table>, and <article> – Clearly defines its content.

Q57.What is the <section> and <article> tag in HTML5?

Section: A <section> is a thematic grouping of content, typically with a heading.

Example: A newspaper being split into sections: news, sports and real-estate. Each of these has a generic heading and contains information that is related to this heading. Chances are each of these sections will contain articles.

Article: The <article> element specifies independent, self-contained content.

Example: A blog post, a forum post, a movie review, a news article, or an interactive widget.

So using the newspaper analogy above, the sports section will contain articles that are about sports, with each individual piece having its own heading and story and being entirely self-contained.

The basic rule of thumb is that if the content can be syndicated or shared without the rest of the site context, it should be marked up as an article.

<div> – groups content

<section> – groups related content

<article> – groups independent, self-contained content

Q58.What is <SVG>?

• SVG stands for Scalable Vector Graphics and it is used to define 2D graphics for the Web in XML.
• SVG is a W3C recommendation.

Q59.What is the difference between <SVG> and <canvas>?

Canvas

• Resolution dependent
• No support for event handlers
• Well suited for graphic-intensive games

SVG

• Resolution independent
• Support for event handlers
• Not suited for game applications

Q60.What is HTML5 Geolocation API?

The HTML5 Geolocation API is used to locate a user’s position.

Q61.What is HTML5 Server-Sent Events (SSE)?

A server-sent event is when a web page automatically gets updates from a server.

This was also possible before, but the web page would have to ask if any updates were available. With server-sent events, the updates come automatically.

Examples: Facebook/Twitter updates, stock price updates, news feeds, sport results, etc.

Q62.What are the four states of link in web design?

The four links states are:

a:link , a:visited, a:hover, a:active 

Q63.What do you mean by margin collapse?

Top and bottom margins of elements are sometimes collapsed into a single margin that is equal to the largest of the two margins. This is called margins collapse.

This does not happen on horizontal (left and right)margins. Only on vertical (top and bottom) margins.

Q64.What do you mean by box model?

All HTML elements can be considered as boxes. It consists of: margin, border, padding, and the actual content.

The box model allows us to add a border around elements, and to define space between elements.

Q65.What is the use of rel attribute?

The rel attribute specifies the relationship between the current document and the linked document.

<a rel="nofollow" href="https://www.example.com/">Example</a>

Q66.Why you would use a srcset attribute in an image tag? Explain the process the browser uses when evaluating the content of this attribute?

You would use the srcset attribute when you want to serve different images to users depending on their device display width.

Serve higher quality images to devices with retina display enhances the user experience while serving lower resolution images to low-end devices increase performance and decrease data wastage (because serving a larger image will not have any visible difference).

Q67.What is progressive rendering?

Progressive rendering is the name given to techniques used to improve the performance of a webpage to render content for display as quickly as possible.

It used to be much more prevalent in the days before broadband internet but it is still used in modern development as mobile data connections are becoming increasingly popular.

Examples of such techniques:

• Lazy loading of images

Q68.Why is it generally a good idea to position CSS <link> tag between <head></head> section and JS <script> tag just before </body>? Do you know any exceptions?

We usually put the <link> tags in between the <head> to prevent Flash of Unstyled Content (FUC) which gives the user something to look at while the rest of the page is being parsed.

Since Javascript blocks rendering by default, and the DOM and CSSOM construction can be also be delayed, it is usually best to keep scripts at the bottom of the page.

Exceptions are if you grab the scripts asynchronously, or at least defer them to the end of the page.

Q69.What were some of the key goals and motivations for the HTML5 specification?

HTML5 was designed to replace HTML 4, XHTML, and the HTML DOM Level 2. The key goals and motivations behind the HTML5 specification were to:

• Deliver rich content (graphics, movies, etc.) without the need for additional plugins, such as Flash.
• Provide better semantic support for web page structure through new structural element tags.
• Provide better cross-platform support whether running on a PC, Tablet, or Smartphone.

Q70.How can I get indexed better by search engines?

It is possible to get indexed better by placing the following two statements in the part of our documents:

<meta name="keywords" content="keyword keyword keyword keyword" />
<meta name="description" content="description of your site" />

Both may contain up to 1022 characters. If a keyword is used more than 7 times, the keywords tag will be ignored altogether. Also, we cannot put markup (other than entities) in the description or keywords list.

Q71.What is a self closing tag?

In HTML5 it is not strictly necessary to close certain HTML tags. The tags that aren’t required to have specific closing tags are called “self closing” tags.

Eg: <img>, <br>, <meta>

Q72.What is the use of <footer> tag?

<footer> tag is used to hold information that should appear at the end of a section of the content.

Q73.When is it appropriate to use the <small> element?

We can use <small> element where we need to represent legalese, such as a copyright statement in a page footer, a disclaimer, or licensing information. It can also be used for attribution too.

Q74.What is the purpose of cache busting and how can you achieve it?

Cache busting is the process of uploading a new file to replace an existing file that is already cached.

This is useful because the cache will often take a long time to expire from all of its various locations and cache busting properly ensures that any changes to a file be visible to end users sooner, rather than later.

There are a few methods we can use to achieve cache-busting and they are:

• File name versioning (e.g. style.v2.css)
• File path versioning (e.g. /v2/style.css)
• Query strings (e.g. style.css?ver=2)

Q75. What are some differences that XHTML has compared to HTML?

HTML and XHTML are both languages in which web pages are written. HTML is SGML-based while XHTML is XML-based. They are like two sides of the same coin. XHTML is strict but HTML not.

Q76. Explain: noopener, noreferrer, and nofollow Values?

All three terms (noopener, noreferrer, and nofollow) are values of the rel attribute of the anchor tag in HTML.

• rel="noopener" you use on all links opening in new tabs using the target _blank. There are security implications if you don’t use the noopener value on your links opening in new tabs.
• rel="noreferrer" can serve a similar purpose as the noopener, especially in the older browsers.
• rel="nofollow" will inform search engines not to pass the link juice to the linked page, and it will not pass PageRank. You can consider it as a value which is used when you want to link to some another page but without “endorsing” it.

Q77. Can a web page contain multiple <header> and <footer> tags?

Yes, both <header> and <footer> can be added multiple times in a webpage.

Q76. Discuss the differences between an HTML specification and a browser’s implementation thereof.

HTML specifications such as HTML5 define a set of rules that a document must adhere to in order to be “valid” according to that specification.

In addition, a specification provides instructions on how a browser must interpret and render such a document.

A browser is said to “support” a specification if it handles valid documents according to the rules of the specification.

As of yet, no browser supports all aspects of the HTML5 specification and as a result, it is necessary for the developer to confirm whether the aspect they are making use of will be supported by all of the browsers on which they hope to display their content.

This is why cross-browser support continues to be a headache for developers, despite the improved specifications.

In addition, while HTML5 defines some rules to follow for an invalid HTML5 document (i.e., one that contains syntactical errors), invalid documents may contain anything, and it is impossible for the specification to handle all possibilities comprehensively.

Thus, many decisions about how to handle malformed documents are left up to the browser.

Q77. What do you mean by W3C markup validation service?

The Markup Validation Service is a validator by the World Wide Web Consortium that allows Internet users to check HTML and XHTML documents for well-formed markup.

Markup validation is an important step towards ensuring the technical quality of web pages.

Q78. Why use an HTML5 semantic tag instead of div?

As their name says, this is for semantic purposes only. It’s for improving the automated processing of documents. Automated processing happens more often than you realize – each website ranking from search engines is derived from automated processing of all the website out there.

If you visit a web page, you as the human reader can immediately (visually) distinguish all the page elements and more importantly understand the content.

However, machines are dumb and cannot do this: Imagine a web-crawler or a screenreader trying to analyze your webpage with divs everywhere.

How shall they know, what part of the document you intended to be the navigation or the main article, or some not-so-important sidenote?

They could guess by analyzing your document structure using some common criteria which are a hint for a specific element.

E.g. an ul list of internal links is most likely some kind of page navigation. However if instead a nav element would be used, the machine immediately knows what the purpose of this element is.

Example: You, as the user (reading a page without seeing the actual markup), don’t care if an element is enclosed in an <i> or <em> tag.

Probably in most browsers it will be rendered as italic text, and as long as it stands out of the text to easily recognize it, you are okay with it.

However, there is a bigger difference in terms of semantics: <i> simply means italic – it’s a presentational hint for the browser and does not necessarily contain deeper semantic information. 

<em> however means emphasize, which semantically indicates an important piece of information.

Now the browser is not bound to the italic instruction any more, but could render it visually in italic or bold or underlined or in a different color.

For visually impaired persons, the screenreaders can raise the voice – whatever method seems most suited in a specific situation to emphazize this important information.

Q79. How to you link to an internal sections of a page?

a (anchor) elements can be used to create internal links to jump to different sections within a webpage. Below is an example of an internal anchor link and its target element:

<a href="#contacts-header">Contacts</a>

…..

<h2 id="contacts-header">Contacts</h2>

Q80. How to create a link which will open in a new tab of the browser?

We can use target="_blank" attribute from the anchor tag to create a link which will open in a new tab of the browser.

Q81. What is an HTML preprocessor?

In HTML and CSS when it comes to writing it, It is a bit crucial as we have to do the same job again and again like closing the tab and repeating the same attribute for the same element and it will lead to inefficiency.

To overcome these problems there exists the Pre-processors.

So, The Pre-processors in HTML are nothing but the same as that in other languages, it takes the input in the form of data and it converts in other types of data.

In the case of markups like HTML and CSS, the popular preprocessor includes Haml and Sass.

Q82. What is WebP?

WebP is a file format that offers richer, high-quality image, with a smaller size compared than PNG or JPEG.

It is developed by Google.

Q83. How would you select svg or canvas for your site?

SVG and canvas are both technologies that can draw stuff in web browsers.

A little flat-color icon? That’s clearly SVG territory. 

An interactive console-like game? That’s clearly canvas territory. 

Q84. What is accessibility & ARIA role means in a web application?

Accessibility is the practice of making your websites usable by as many people as possible.

We traditionally think of this as being about people with disabilities, but the practice of making sites accessible also benefits other groups such as those using mobile devices, or those with slow network connections.

ARIA is shorthand for Accessible Rich Internet Applications.

ARIA is a set of attributes you can add to HTML elements that define ways to make web content and applications accessible to users with disabilities who use assistive technologies (AT).

When accessibility issues cannot be managed with native HTML, ARIA can help bridge those gaps.

Q85. How do you indent the first line in a paragraphs?

By using text-indent property.

Q86. Can I put markup in alt text?

No. However, character entities (©, &#nnn; and such) are permitted,

Q87. How do you make a custom bullet list?

There are multiple ways:

1) list-style-type property:

Example:

list-style-type: devanageari; 

2) By using an emoticon bullet:

For example, the thumbs up emoticon code is '\1F44D'.

3) By changing the bullet to an image:

Example:

li {
  list-style-image: url(img/iphone.png);
}

Q88. What are the new types for form validation in HTML5?

The new input types for form validation are url, number, tel and date.

Q89. What is the use of required attribute in HTML5?

It forces user to fill text on textfield or textarea before submitting form. It is used for form validation.

Example:

Name: <input type="text" name="name" required />

Q90. If I do not put <!DOCTYPE html> will HTML5 work?

No, browser will not be able to identify that it is a HTML document and HTML5 tags will not function properly.

Q91. What is <datalist> tag?

The HTML5 <datalist> tag provides an auto complete feature on form element. It facilitates users to choose the predefined options.

Q92. What is <details> and <summary> tag?

The <details> tag is used to specify some additional details on the web page. It can be viewed or hidden on demand. The <summary> tag is used with details tag.

Q93. What is <button> tag?

The <button> tag is used to create a clickable button.

Q94. What is the difference between progress and meter tag?

The progress tag is used to represent the progress of the task only while the meter tag is used to measure data within a given range.

Q95. What is a marquee?

Marquee is used to put the scrolling text on a web page.

<marquee>......</marquee> 

Q96. Does a hyperlink only apply to text?

No, you can use hyperlinks on text and images both.

Q97. How to insert a copyright symbol on a page?

We can insert a copyright symbol by using © or © in an HTML file.

Q98. What is image map?

Image map facilitates you link many different web pages using a single image. You can define shapes in images that you want to make part of an image mapping.

Q99. How do you get strikethrough effect in HTML & CSS?

• HTML – <s>...</s> tag
• CSS – text-decoration: line-through

Similar articles you may like

• Top Bootstrap Interview Questions
• How to copy any website using HTTrack
• 100+ Best Sites to Find Free Stock Photos Online
• How to open OR Save As WebP images in Photoshop