HTML Medya Elemanlar\u0131: Resim, Ses ve Video<\/title>\n<meta name=\"description\" content=\"Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML Medya Elemanlar\u0131: Resim, Ses ve Video\" \/>\n<meta property=\"og:description\" content=\"Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2025-06-16T13:15:15+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"HTML Medya Elemanlar\u0131: Resim, Ses ve Video\",\"datePublished\":\"2025-06-16T13:15:15+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\"},\"wordCount\":516,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#respond\"]}],\"copyrightYear\":\"2025\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\",\"name\":\"HTML Medya Elemanlar\u0131: Resim, Ses ve Video\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2025-06-16T13:15:15+00:00\",\"description\":\"Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HTML Medya Elemanlar\u0131: Resim, Ses ve Video\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n","yoast_head_json":{"title":"HTML Medya Elemanlar\u0131: Resim, Ses ve Video","description":"Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/","og_locale":"tr_TR","og_type":"article","og_title":"HTML Medya Elemanlar\u0131: Resim, Ses ve Video","og_description":"Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.","og_url":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2025-06-16T13:15:15+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"3 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"HTML Medya Elemanlar\u0131: Resim, Ses ve Video","datePublished":"2025-06-16T13:15:15+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/"},"wordCount":516,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#respond"]}],"copyrightYear":"2025","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/","url":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/","name":"HTML Medya Elemanlar\u0131: Resim, Ses ve Video","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2025-06-16T13:15:15+00:00","description":"Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"HTML Medya Elemanlar\u0131: Resim, Ses ve Video"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/24225","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=24225"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/24225\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=24225"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=24225"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=24225"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":24225,"date":"2025-06-16T16:15:15","date_gmt":"2025-06-16T13:15:15","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/"},"modified":"2025-06-16T16:15:15","modified_gmt":"2025-06-16T13:15:15","slug":"html-medya-elemanlari-resim-ses-ve-video","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/html-medya-elemanlari-resim-ses-ve-video\/","title":{"rendered":"HTML Medya Elemanlar\u0131: Resim, Ses ve Video"},"content":{"rendered":"

<\/p>\n

HTML Medya Elemanlar\u0131: Resim, Ses ve Video<\/p>\n

Web sayfalar\u0131n\u0131z\u0131 zenginle\u015ftirmenin en etkili yollar\u0131ndan biri, medya elemanlar\u0131n\u0131 kullanmakt\u0131r. HTML, resimler, ses dosyalar\u0131 ve videolar\u0131 sayfalar\u0131n\u0131za eklemenizi sa\u011flayan g\u00fc\u00e7l\u00fc etiketler sunar. Bu rehberde, bu etiketleri nas\u0131l kullanaca\u011f\u0131n\u0131z\u0131, performanslar\u0131n\u0131 nas\u0131l optimize edece\u011finizi ve eri\u015filebilirli\u011fi nas\u0131l sa\u011flayaca\u011f\u0131n\u0131z\u0131 detayl\u0131 bir \u015fekilde ele alaca\u011f\u0131z.<\/p>\n

Resim Ekleme: Etiketi<\/h2>\n

Resim eklemek i\u00e7in etiketi kullan\u0131l\u0131r. Bu etiket, src \u00f6zniteli\u011fi ile resmin URL’sini belirtir. Ayr\u0131ca, resmin alternatif metnini (alt text) belirtmek i\u00e7in alt \u00f6zniteli\u011fini kullanmal\u0131s\u0131n\u0131z. Bu, g\u00f6rme engelli kullan\u0131c\u0131lar i\u00e7in \u00f6nemlidir ve arama motorlar\u0131 taraf\u0131ndan indekslemede rol oynar. \u00d6rne\u011fin:<\/p>\n

\n<img src=\"resim.jpg\" alt=\"G\u00fczel bir manzara resmi\">\n<\/code><\/pre>\nResmin boyutunu kontrol etmek i\u00e7in width ve height \u00f6zniteliklerini kullanabilirsiniz.  Ancak, resmin orijinal oranlar\u0131n\u0131 koruman\u0131z \u00f6nerilir.  Ayr\u0131ca, resimlerinizi optimize etmek, sayfa y\u00fckleme h\u0131z\u0131n\u0131z\u0131 art\u0131rmak i\u00e7in \u00e7ok \u00f6nemlidir.  Bunu, uygun bir g\u00f6r\u00fcnt\u00fc format\u0131 se\u00e7erek ve resmin boyutunu k\u00fc\u00e7\u00fclterek yapabilirsiniz.<\/p>\n
Ses Ekleme: