reading-notes

Reading

Explain how the ability to use video and audio on the web has evolved since the early 2000s.

The early 2000s: At this time, web-based video and audio were limited to low-quality, low-resolution formats like RealPlayer, QuickTime, and Windows Media Player. These formats required users to download and install specific software and plugins to access the content, and there were compatibility issues across different operating systems and web browsers. Late 2010s to present day: Streaming services like Netflix, Amazon Prime, and Hulu have become dominant players in the video and audio landscape, offering high-quality, on-demand content that can be accessed from any device with an internet connection. Live streaming platforms like Twitch and YouTube Live have also become increasingly popular, enabling users to broadcast and share live video and audio content in real-time.

Describe the use of the src and controls attributes in the

The src attribute specifies the URL or path of the resource file. The URL points to the media file to display (images) or play (audio and video). The browser uses the URL to locate and load the media file. The URL can be internal (from same website) or external (another website). he controls attribute is a boolean attribute. When present, it specifies that audio/video controls should be displayed. https://www.w3schools.com/tags/att_controls.asp#:~:text=The%20controls%20attribute%20is%20a,video%20controls%20should%20be%20displayed.

Why is it important to have fallback content inside the

content that is to be used when the external resource cannot be used https://www.w3.org/html/wg/wiki/DefinitionFallBackContent

Write a very short story where

Audio and Video were friends. They always did everything together. One day Audio could not hang out with Video and it was a sad day. Then Audio came back amd everything was great again! Fin!

How does Grid layout differ from Flex?

flexbox was designed for layout in one dimension - either a row or a column. Grid was designed for two-dimensional layout - rows, and columns at the same time https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout#:~:text=The%20basic%20difference%20between%20CSS,columns%20at%20the%20same%20time.

Grid container, grid item, and grid line are a few important terms to understand when using Grid. Please describe these terms in a few sentences.

A grid container contains grid items. By default, a container has one grid item for each column, in each row, but you can style the grid items so that they will span multiple columns and/or rows. What is the importance of grid lines? Grid lines are lines that cross the chart plot to show axis divisions. Grid lines help viewers of the chart see what value is represented by an unlabeled data point. Especially for large or complicated charts, grid lines give valuable cues to the viewer. https://www.mit.edu/~mbarker/formula1/f1help/13-ch-a7.htm#:~:text=Grid%20lines%20are%20lines%20that,valuable%20cues%20to%20the%20viewer.

Besides making a site visually appealing across different screen sizes, why should developers make images responsive?

it helps us deliver optimal file size, the right image for the right screen size, improves user experience and improves loading time. https://www.lab21.gr/blog/use-responsive-images/#:~:text=Having%20responsive%20images%20is%20important,for%20creating%20a%20responsive%20image.

## Define the following attributes srcset and sizes. Write an example of how they are used.

The srcset and sizes attributes are used in HTML to provide responsive images that adapt to the size of the viewport, and to prevent unnecessarily large images from being downloaded on small screens.

## How is srcset more helpful for responsive images than CSS or JavaScript?

srcset allows you to define a list of different image resources along with size information so that browser can pick the most appropriate image