update 'src' attribute content and examples

content/html/concepts/attributes/terms/src/src.md

@@ -32,6 +32,13 @@ The **`src`** attribute specifies the location of a digital source, which is typ
 | [`<track>`](https://www.codecademy.com/resources/docs/html/elements/track)   | Specifies the subtitles and closed captions for `<audio>` and `<video>` elements. |
 | [`<video>`](https://www.codecademy.com/resources/docs/html/elements/video)   | Embeds movie clips or other video sources into an HTML file.                      |
 
+## Best Practices
+
+- **Use relative paths** whenever possible to make code maintenance easier.
+- **Always include alternative text (`alt`)** when using `<img>` to improve accessibility and SEO.
+- **To optimize page loading**, use `loading="lazy"` for images and `defer` or `async` for scripts.
+- **When uploading large videos**, consider using a streaming service or CDN to improve performance.
+
 ## Example 1: Image
 
 The following code snippet below shows how the `<img>` element uses the `src` attribute to display an image called `logo.png`:
@@ -62,3 +69,30 @@ The gif below shows how the video would be displayed:
 ![HTML src attribute gif](https://raw.githubusercontent.com/Codecademy/docs/main/media/html-src-attribute-video.gif)
 
 > **Note:** This example demonstrates how to display a video from a local source. To display a video from an external source, such as YouTube, use the [`<iframe>`](https://www.codecademy.com/resources/docs/html/elements/iframe) element to embed videos from these platforms.
+
+## Example 3: Audio
+
+The following code snippet below shows how the `<audio>` element uses the `src` attribute to embed an audio file called `audio.mp3`:
+
+```html
+<audio controls>
+  <source src="audio.mp3" type="audio/mpeg">
+  <source src="audio.ogg" type="audio/ogg">
+  Your browser does not support the audio element.
+</audio>
+```
+
+This will embed an audio player on the webpage.
+
+> **Note:** Providing multiple file formats (`mp3`, `ogg`, etc.) ensures better compatibility across different browsers.
+
+## FAQ
+
+- **How does the `src` attribute work?**
+The `src` attribute accepts a relative or absolute URL to embed content. If not specified, the browser can't display the resource.
+
+- **What happens if the `src` attribute is incorrect?**
+If the `src` attribute points to a non-existent or incorrect URL, the browser will not be able to load the content, and it may display an error or a broken link.
+
+- **Can `src` be used with more than one file?**
+Yes, some tags, like `<source>` inside `<video>`, allow multiple sources and the browser chooses the best available one.