- Katılım
- 2 Ağustos 2010
- Mesajlar
- 393
- Reaction score
- 0
Merhaba değerli arkadaşlar bu dersimizde resim eklemeye devam ediyoruz. Bu dersimizde yapacaklarımız ise resim boyutlarını ayarlama ve alt parametresi (Alternatif text) kullanımını göreceğiz arkadaşlar öncelikle bir önceki dersimizi hatırlayalım resim eklemeyi tam olarak anlayabilmek için aşağıdaki linkten faydalanarak göz atabiliriz.
Width ve Height
Width parametresi arkadaşlar resmin sayfa içindeki genişliği ayarlamaya yararki sadece resimlerde değil tabloların boyutlandırmasındada width parametresini kullanacağız.
Height Parametresi ise width parametresi aksine yükseklik ayarını boyutunu belirlememizi sağlar
Resim Boyutlandırma Uygulaması
Tüm arkadaşlar olarak aynı işlemi görebilmek için aynı resmi kullanalım arkadaşlar aşağıdaki resmi farklı kaydet diyerek bilgisayarınızın masaüstüne gul.jpg olarak kaydedin arkadaşlar ve aşağıdaki kodları boş bir not defteri açarak başlıyoruz yazmaya ve yazınca farklı kaydet diyerek dosya adı resimboyu.html olarak masaüstüne kaydedin yani resimin olduğu yere kaydedin.
Bu resmi farklı kaydet diyerek masaüstünüze gul.jpg olarak kaydedin
<html>
<head>
<title>Web Tasarım Dersleri Html resim Ekleme Ders8</title>
</head>
<body>
<img src=”gul.jpg” width=”300″ height=”250″ />
</body>
</html>
Yukardaki işlemi özetliyim arkadaşlar img src=”gul.jpg” resim ekleme kodu ile gul.jpg isminde bir resim eklemek istediği belirttim width=”300 diyerek genişlik 300 olsun height=”250″ yükseklik 250 olsun dedim ve hata yapmadığınız sürece aşağıdaki görüntüyü elde edersiniz.
Html Resim Boyutlandırma
Resim Boyutlandırmada Dikkat Edilecekler
size verdiğim resim 300 px genişliğinde 250 px yüksekliğinde arkadaşlar bunu sayfanızda genişlik 500 600 derseni resim bulanık olur kalita bozulur onun için boyutları fazla aşmadan çalışmalısınız arkadaşlar.
Resimlere Alt Parametresi Ekleme
Alt parametresi (Alternatif metin demektir) arkadaşlar aslında zorunlu bir kod değildir kulanırsanız avantajlarınız olur nedir bu avantajlar Resimleriniz google resim aramada yer alır ayrıca bir iyaretçi kaynağı sayılır resimlerin üzerine maosla gelince alt parametresi görülür resim hakkında kısa bilgi verilmiş olur.
Alt parametresi işleyişini görmek için yukarda verdiğim resmin üzerine maosla gelin göreceksiniz şimdi birde uygulama yapalım aşağıdaki gibi resim ekliyoruz yine ve alt parametreimizi kullanıyoruz arkadaşlar alternatif metin ne isterseniz yazabilirsiniz.
Aşağıdaki kodları yazıyoruz ve dosya adı altparametre.html olarak masaüstüne kaydedin.
<html>
<head>
<title>Web Tasarım Dersleri Html Resim Alt Parametresi Ders8</title>
</head>
<body>
<img src=”gul.jpg” width=”300″ height=”250″ alt=”Webmasteryolcu İle Dersler” />
</body>
</html>
Html Alt Parametresi Ekleme Resime Dikkat ediniz
Bugünkü dersimizde bu kadar değerli arkadaşlar bir sonraki dersimizde son olarak resimleri işleyecez ne görecez derseniz resimlerin farklı klasörde yayınlanması ve resimlerin hizalanmalarını görüp resimleri geçicez inşeAllah
Width ve Height
Width parametresi arkadaşlar resmin sayfa içindeki genişliği ayarlamaya yararki sadece resimlerde değil tabloların boyutlandırmasındada width parametresini kullanacağız.
Height Parametresi ise width parametresi aksine yükseklik ayarını boyutunu belirlememizi sağlar
Resim Boyutlandırma Uygulaması
Tüm arkadaşlar olarak aynı işlemi görebilmek için aynı resmi kullanalım arkadaşlar aşağıdaki resmi farklı kaydet diyerek bilgisayarınızın masaüstüne gul.jpg olarak kaydedin arkadaşlar ve aşağıdaki kodları boş bir not defteri açarak başlıyoruz yazmaya ve yazınca farklı kaydet diyerek dosya adı resimboyu.html olarak masaüstüne kaydedin yani resimin olduğu yere kaydedin.
Bu resmi farklı kaydet diyerek masaüstünüze gul.jpg olarak kaydedin<html>
<head>
<title>Web Tasarım Dersleri Html resim Ekleme Ders8</title>
</head>
<body>
<img src=”gul.jpg” width=”300″ height=”250″ />
</body>
</html>
Yukardaki işlemi özetliyim arkadaşlar img src=”gul.jpg” resim ekleme kodu ile gul.jpg isminde bir resim eklemek istediği belirttim width=”300 diyerek genişlik 300 olsun height=”250″ yükseklik 250 olsun dedim ve hata yapmadığınız sürece aşağıdaki görüntüyü elde edersiniz.
Html Resim BoyutlandırmaResim Boyutlandırmada Dikkat Edilecekler
size verdiğim resim 300 px genişliğinde 250 px yüksekliğinde arkadaşlar bunu sayfanızda genişlik 500 600 derseni resim bulanık olur kalita bozulur onun için boyutları fazla aşmadan çalışmalısınız arkadaşlar.
Resimlere Alt Parametresi Ekleme
Alt parametresi (Alternatif metin demektir) arkadaşlar aslında zorunlu bir kod değildir kulanırsanız avantajlarınız olur nedir bu avantajlar Resimleriniz google resim aramada yer alır ayrıca bir iyaretçi kaynağı sayılır resimlerin üzerine maosla gelince alt parametresi görülür resim hakkında kısa bilgi verilmiş olur.
Alt parametresi işleyişini görmek için yukarda verdiğim resmin üzerine maosla gelin göreceksiniz şimdi birde uygulama yapalım aşağıdaki gibi resim ekliyoruz yine ve alt parametreimizi kullanıyoruz arkadaşlar alternatif metin ne isterseniz yazabilirsiniz.
Aşağıdaki kodları yazıyoruz ve dosya adı altparametre.html olarak masaüstüne kaydedin.
<html>
<head>
<title>Web Tasarım Dersleri Html Resim Alt Parametresi Ders8</title>
</head>
<body>
<img src=”gul.jpg” width=”300″ height=”250″ alt=”Webmasteryolcu İle Dersler” />
</body>
</html>
Html Alt Parametresi Ekleme Resime Dikkat edinizBugünkü dersimizde bu kadar değerli arkadaşlar bir sonraki dersimizde son olarak resimleri işleyecez ne görecez derseniz resimlerin farklı klasörde yayınlanması ve resimlerin hizalanmalarını görüp resimleri geçicez inşeAllah