Multimedialla ja upottamalla sisältö on ratkaiseva rooli verkkosivujen visuaalisen vetovoiman ja vuorovaikutteisuuden parantamisessa. Tässä on lisätietoja ja esimerkkejä multimedian käytöstä ja sisällön upottamisesta HTML:ään.
Kuvat
Voit näyttää kuvia verkkosivulla käyttämällä tunnistetta <img>. Määritä kuvan lähde määritteen avulla src ja anna vaihtoehtoinen teksti attribuutin avulla alt saavutettavuuden parantamiseksi.
Tässä on esimerkki:
<img src="image.jpg" alt="A beautiful sunset">
Audio
Käytä tunnistetta äänitiedostojen upottamiseen <audio>. Määritä äänilähde määritteen avulla src, ja voit lisätä toiston ohjaimia määritteen avulla controls.
Tässä on esimerkki:
<audio src="audio.mp3" controls></audio>
Video
Käytä tunnistetta videoiden upottamiseen <video>. Aseta videolähde attribuutin avulla src ja sisällytä attribuutti controls videon toiston ohjaimia varten.
Tässä on esimerkki:
<video src="video.mp4" controls></video>
Kartat
Voit upottaa karttoja palveluista, kuten Google Mapsista, käyttämällä tunnistetta <iframe> ja lisäämällä palvelun tarjoaman kartan upotuskoodin.
Tässä on esimerkki:
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3024..." width="600" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
Web-sovellukset
Jos haluat upottaa verkkosovelluksia tai ulkoisia verkkosivustoja, käytä uudelleen <iframe> tunnistetta ja anna verkkosovelluksen URL-osoite.
Tässä on esimerkki:
<iframe src="https://www.example.com" width="800" height="600" frameborder="0"></iframe>
Nämä esimerkit havainnollistavat, kuinka upottaa erityyppistä multimediaa ja ulkoista sisältöä HTML-sivuillesi. Muista säätää määritteitä ja mittoja tarpeen mukaan oikean näytön ja toiminnan varmistamiseksi.