HTML KODLARI İLE WEB TASARIMI

Transkript

1 HTML KODLARI İLE WEB TASARIMI

2 EĞİTMEN AD SOYAD : TECRÜBE : OKUL :

3 LÜTFEN DİKKAT! SINIFTAKİ BAŞARIMIZIN MAKSİMUM DÜZEYDE OLMASI İÇİN: DEVAMSIZLIK YAPMAYINIZ; KAÇIRDIĞINIZ DERSLER SONRAKİ KONULARA TEMEL OLUŞTURDUĞUNDAN SONRAKİ DERSLERİ DE ANLAYAMAZSINIZ DERSLERE ZAMANINDA GELİNİZ; KAÇIRILAN DERSLERİN TELAFİSİNİN YAPILMADIĞINI UNUTMAYINIZ ANLAMADIĞINIZ KONU OLDUĞUNDA HEMEN EĞİTMENE SORUNUZ

4 LÜTFEN DİKKAT! DERSLERDE CEP TELEFONU V.B. CİHAZLARI KAPATINIZ EĞİTMEN DERS ANLATIRKEN TELEFON, MAKYAJ V.B. ŞEYLERLE İLGİLENMEYİNİZ SINIFIN DİKKATİNİ DAĞITACAK DAVRANIŞLARDAN KAÇININIZ

5 LÜTFEN DİKKAT! LABORATUVARDAKİ BİLGİSAYAR V.B. CİHAZLARIN BOZULMAMASI İÇİN: SINIFTA YİYECEK-İÇECEK TÜKETMEYİNİZ; SIVI VE SUSAM GİBİ MADDELER CİHAZLARA ZARAR VERİR VE DÜZGÜN ÇALIŞMASINI ENGELLER CİHAZLARI KURCALAMAYINIZ; CİHAZDA ARIZA OLDUĞUNU DÜŞÜNÜYORSANIZ BİR KAĞIDA NOT BIRAKINIZ

6 LÜTFEN DİKKAT! BİLGİSAYARLARDAKİ KORUMA YAZILIMI, BİLGİSAYAR KAPANDIKTAN SONRA KAYDETTİĞİNİZ TÜM DOSYALARI & AYARLARI SİLMEKTEDİR LÜTFEN DOSYALARINIZI FLASH BELLEĞE KAYDEDİN VEYA DERS SONUNDA ADRESİNİZE GÖNDERİN

7 LÜTFEN DİKKAT! YAZILIM İSTEMEYİNİZ. KORSAN YAZILIM SUÇTUR; HAPİS VE PARA CEZASI VARDIR LİSANSLI OLARAK SATIN ALINAN YAZILIMLARIN YÜKLENMESİNDE YARDIMCI OLUNABİLİR ÜCRETSİZ VEYA AÇIK KAYNAK KODLU YAZILIMLARI SUNUCUMUZDAN İNDİREBİLİRSİNİZ

8 DERS SLAYTLARI DERS SLAYTLARI VE DİĞER DÖKÜMANLARI SUNUCUDAN ALINIZ Windows Gezgini ->Adres Çubuğu -> \\sunucu\ depo\ Kullanıcı Adı : bilimsel Parola : bilimsel

9 KAYNAKLAR HTML EL KİTABI BETA YAYINLARI MEMİK YANIK HTML BETA YAYINLARI ADEM KARAHOCA

10 KONULAR TEMEL KAVRAMLAR TEMEL HTML KOMUTLARI METİN İŞLEMLERİ LİNKLER RESİM İŞLEMLERİ TABLO OLUŞTURMA FORM İŞLEMLERİ TEMEL SEO BİLGİSİ

11 İNTERNET NEDİR? İNTERNET, İKİ YA DA DAHA FAZLA BİLGİSAYAR AĞININ ROUTER VE HUB/SWITCH LERLE BİRBİRİNE BAĞLANMASI İLE OLUŞAN YAPIDIR. HER PC NİN EŞSİZ BİR IP NUMARASI VARDIR, TCP/IP PROTOKOLÜ İLE BU BİLGİSAYARLAR BİRBİRLERİ İLE KONUŞABİLİR.

12 TCP/IP NEDİR? BİLGİSAYARLARIN BİRBİRLERİ İLE KONUŞABİLMESİ İÇİN KURARALLARA YANİ PROTOKOLLERE İHTİYAÇ VARDIR. TCP/IP, AĞLARDA BULUNAN BİLGİSAYARLARIN BİRBİRİ İLE KONUŞABİLMESİ İÇİN KULLANILAN KURALLAR TOPLULUĞUDUR.

13 TCP/IP NEDİR? TCP/IP DEN BAŞKA, NETBEUI, IPX/SPX GİBİ PROTOKOLLER DE VARDIR. FAKAT TCP/IP GÜNENİRLİLİĞİ NEDENİYLE ARTIK BİR STANDART HALİNE GELMİŞTİR. TCP/IP PROTOKOLÜ VERİYİ PAKET ADI VERİLEN KÜÇÜK BİRİMLERE EYIRIR; BİR YA DA DAHA FAZLA YOL ÜZERİNDEN BU PAKETLERİ GÖNDERİR VE GİTTİĞİ YERDE YENİDEN BİRLEŞTİRİR.

14 İNTERNET UYGULAMALARI SOHBET TELNET (UZAKTAKİ BİR BİLGİSAYARA SANKİ O BİLGİSAYARDA ÇALIŞIYORMUŞ GİBİ BAĞLANMA) FTP WEB

15 HTML SAYFASI NEDİR? HTML HYPER TEXT MARKUP LANGUAGE KELİMELERİNİN BAŞ HARFLERİDİR. METİN, RESİM, SES, GÖRÜNTÜ VE DİĞER NESNELERİN BİR SAYFADA KULLANILMASINI SAĞLAYAN KOMUTLAR TOPLULUĞUDUR.

16 HTML KODU (TAG I)NEDİR? HTML SAYFALARI OLUŞTURMAK İÇİN KULLANILAN KOMUTLARDIR. ÖRNEĞİN <B>...</B> KOMUTU ARAYA YAZILAN METİNLERİ KALINLAŞTIRIR. BİR HTML (WEB) SAYFASI DÜZENLİ BİR ŞEKİLDE BİR ARAYA GELEN HTML KODLARINDAN OLUŞUR.

17 HYPER TERİMİNİN ANLAMI BİR HTML DÖKÜMANINDA HİPER LİNKLER (BAĞLAR) KULLANILARAK DİĞER DÖKÜMANLARA ATLANABİLİR. BELGE1.HTM BELGE2.HTM

18 MARKUP TERİMİNİN ANLAMI BİR HTML DÖKÜMANINDAKİ METNİN BİÇİMLENDİRİLMESİDİR. BU ŞEKİLDE BİR HTML SAYFASINDA METİNLERİN NASIL GÖRÜNTÜLENECEĞİ KONTROL EDİLEBİLİR.

19 HTML İN TARİHÇESİ HTML İN TEMELLERİ İLK DEFA 1986 YILINDA ULUSLARARASI STANDARTLAR KOMİTESİ TARAFINDAN BİR MAKALE İLE ORTAYA ATILDI. MAKALENİN ADI INFORMATION PROCESSING - TEXT AND OFFICE SYSTEMS STANDARD GENERALIZED MARKUP LANGUAGE (SGML) ŞEKLİNDE İDİ VE METNE DAYALI BİR DÖKÜMANI İŞARETLEMEK İÇİN GEREKLİ KODLARA AİT İLK ULUSLAR ARASI STANDARDI TANIMLIYORDU.

20 HTML İN TARİHÇESİ 1989 YILINDA, AVRUPA PARÇACIK FİZİĞİ LABORATUVARINDA ÇALIŞAN TIM BERNERS LEE BİR HİPER METİN DOKÜMAN SİSTEMİ ÖNERDİ. BUNA GÖRE; HTML KODLARINDAN OLUŞAN DOSYALAR BİR WEB SERVER A YERLEŞTİRİLECEK VE İNSANLAR İNTERNET ÜZERİNDEN BROWSER KULLANARAK BU DOSYALARI UZAKTAN OKUYABİLECEKLER.

21 HTML İN TARİHÇESİ 1992 YILINDA, AVRUPA PARÇACIK FİZİĞİ LABORATUVARINDAN İLK METİN BAZLI WEB TARAYICI 1.1 VERSİYONUYLA KULLANIMA SUNULDU. İLK GRAFİK TABANLI TARAYICI OLAN MOSAIC İSE 1993 YILINDA MARC ANDREESEN TARAFINDAN KULLANIMA SUNULDU.

22 HTML İN VERSİYONLARI 1990 YILINDA ORTAYA ATILAN HTML, ZAMAN GEÇTİKÇE YENİ TEKNOLOJİLERE AYAK UYDURDU VE YENİ VERSİYONLAR İLE KULLANILDI. HER YENİ VERSİYON ÖNEMLİ ÖZELLİKLER BARINDIRMAKTA VE WEB TASARIMCILARININ İMKANLARINI ARTTIRMAKTADIR.

23 HTML YILINDA DUYURULDU. SADECE NEXT İŞLETİM SİSTEMİNDE ÇALIŞIYORDU.

24 HTML 2.0 EYLÜL 1995 TE ORTAYA ÇIKTI. HTML İ STANDARD HALE GETİRMEK İÇİN CİDDİ BİR REVİZYONDAN GEÇİRİLEREK OLUŞTURULDU. GÖRÜNTÜ DÜZENLEME VE FORMLARIN DOLDURULMASI İLE İLGİLİ BAZI YENİLİKLERE SAHİPTİ.

25 HTML 3.0 İNTERNETİN İYİCE YAYGINLAŞMASI İLE 2.0 VERSİYONU YETERSİZ BULUNMAYA BAŞLANDI. BUNUN SONUCU OLARAK 3.0 VERSİYONU OLUŞTURULDU. TABLO KULLANIMI, GÖRÜNTÜLER ÜZERİNDE METİN AKIŞI, METİN BİÇİMLENDİRME VE SAYFA YERLEŞİMİNİN DAHA ESNEK OLMASI İLE İLGİLİ YENİLİKLERE SAHİPTİ.

26 HTML 3.2 MAYIS 1996 DA DUYURULDU. ÇERÇEVELER, SCRIPT OLANAĞI, İLERİ MATEMATİKSEL FONKSİYONLAR GİBİ YENİ ÖZELLİKLER İÇERİYORDU.

27 HTML 4.0 HTML İN EN SON VERSİYONUDUR. 18 ARALIK 1998 DE KULLANIMA SUNULDU. NESNE VE KASKAD STİL OLUŞTURMA ÖZELLİKLERİNE SAHİPTİR.

28 XHTML EXtensible HyperText Markup Language KELİMELERİNİN KISALTILMIŞIDIR. EN SON ÇIKAN HTML VERSİYONUDUR YILINDA ORTAYA ATILMIŞTIR. DAHA ÖNCEKİ SÜRÜMLERDEN DAHA KATI BAZI KURALLARA SAHİPTİR. TAGLAR DÜZGÜN AÇILIP KAPATILMALIDIR TÜM TAGLAR KAPATILMALIDIR TAGLAR KÜÇÜK HARFLE YAZILMALIDIR BİR KÖK ELEMAN (html) OLMALIDIR.

29 XHTML TAGLAR DÜZGÜN AÇILIP KAPATILMALIDIR: <b><i>this text is bold and italic</b></i> TAG LAR KAPATILMALIDIR: <p>this is a paragraph <p>this is another paragraph KOMUTLAR KÜÇÜK HARFLE OLMALIDIR. <body><p>this is a paragraph</p></body>

30 HTML 5 HENÜZ BETA (DENEME) AŞAMASINDADIR BETA AŞAMASINDA OLMASINA RAĞMEN ÇOĞU TARAYICI HTML5 KODLARINI ESTEKLEMEKTEDİR ÖZELLİKLER GÖRÜNTÜ VE VİDEO İLE İLGİLİ GELİŞTİRMELER YAPILMIŞTIR

31 WEB SERVER NEDİR? HTML KODLARINI KULLANARAK HTML (WEB) SAYFALARI YAPIYORUZ. WEB SAYFALARI BİR ARAYA GELEREK WEB SİTELERİ Nİ OLUŞTURURLAR. YAPTIĞIMIZ WEB SİTESİNİN İNTERNET KULLANICILARI TARAFINDAN ERİŞİLEBİLMESİ İÇİN SİTEMİZİ BİR WEB SERVER A KOYMALIYIZ.

32 WEB SERVER NEDİR? WEB SERVER LAR HER GÜN 24 SAAT ÇALIŞIRLAR VE SİTEMİZDEN İSTENİLEN SAYFALARI İNTERNET KULLANICILARINA GÖNDERİRLER. ŞU AN PİYASADA WINDOWS(IIS) VE LINUX (APACHE) TABANLI WEB SERVER LAR VARDIR. HTML SAYFALARINIZI HER İKİSİNDE DE BARINDIRABİLİRSİNİZ.

33 HOSTİNG (ALAN) NEDİR? YAPTIĞIMIZ WEB SİTEMİZİN YAYINLANMASI VE İNTERNET KULLANICILARININ BİZİM SAYFALARIMIZA ULAŞMASI İÇİN ARTIK BİR WEB SERVER A İHTİYACIMIZ OLDUĞUNU BİLİYORUZ. SİTEMİZİ YAYINLAMAK İÇİN YA KENDİ WEB SERVER IMIZI KURARIZ YA DA BAŞKA BİR SERVERDAN İHTİYACIMIZA GÖRE BİR MİKTAR ALAN SATIN ALIRIZ.

34 HOSTİNG (ALAN) NEDİR? WEB SERVER BARINDIRMAK ZAHMETLİ VE TEKNİK BİLGİ GEREKTİRDİĞİ İÇİN GENELDE WEB TASARIMCILARI YAPTIKLARI WEB SİTELER İÇİN HOSTİNG YANİ ALAN SATIN ALIRLAR. HOSTİNG FİRMASI İHTİYACINIZA GÖRE SERVER IN HARDİSKİNDEN BİR MİKTAR (5,10, 15, 50, 100,... MB) ALAN KİRALAR VE KARŞILIĞINDA ÜCRET ALIR..

35 DOMAIN (ALAN ADI) NEDİR? WEB SERVER A KOYDUĞUNUZ SİTENİZE TÜM İNTERNET KULLANICILARININ ERİŞEBİLMESİ İÇİN BİR İSİM VERMENİZ GEREKİR. WEB SİTELERİNE VERDİĞİMİZ İSİMLERE DOMAIN YANİ ALAN ADI DENİR. ÖRNEĞİN EDERSANE.TV BİR ALAN ADIDIR.

36 DOMAIN İSİMLERİ DOMAIN İSİMLERİ ALAN ADI, ALAN UZANTISI VE ÜLKE KODUNDAN OLUŞURLAR. ÖRNEĞİN BİLİMSEL.COM.TR BİLİMSEL KURUMUN ADIDIR. COM UZANTISIDIR. TR ÜLKE KODUDUR.

37 ALAN UZANTISI NEDİR? KURUMLAR, YAPTIKLARI İŞE GÖRE FARKLI UZANTILARA SAHİP OLURLAR..COM: TİCARİ KURUMLAR.EDU: EĞİTİM KURUMLARI.GOV: DEVLET KURUMLARI.NET: AĞ SERVİS SAĞLAYICILARI.MİL: ASKERİ KURUMLAR.ORG: DERNEK V.B. KURUMLAR

38 ÜLKE UZANTISI NEDİR? FARKLI ÜLKELER FARKLI UZANTILARA SAHİPTİR. ÖRNEGİN:.TR: TÜRKİYE.GR: YUNANİSTAN.CA: KANADA.FR: FRANSA.DE: ALMANYA

39 ALAN ADI NEDİR? DEU.EDU.TR DEU: KURUM ADI EDU: EĞİTİM KURUMU TR: ÜLKE KODU TÜRKİYE KAVA.NET.FR KAVA: KURUM ADI NET: AĞ SERVİS SAĞLAYICI FR: ÜLKE KODU FRANSA

40 DİKKAT!!! BİR WEB SİTESİ İÇİN: HAZIRLANMIŞ WEB SAYFALARI ALAN (HOSTİNG) ALAN ADI (DOMAIN) OLMALIDIR.

41 NEREDEN ALINIR? DOMAIN VE HOSTING SATIN ALMAK İÇİN ÇOK DEĞİŞİK KURULUŞLAR VARDIR. TURKTİCARET.NET NIOBEWEB.COM WEBSAHİBİ.COM ACİLHOST.COM SANALWEB.ORG BUNLARDAN BAZILARIDIR.

42 URL NEDİR? URL, UNIFORM RESOURCE LOCATORS KELİMELERİNİN BAŞ HARFLERİDİR. WEB DE ADRESLENMİŞ İNTERNET KAYNAKLARINA ERİŞİMİ SAĞLAR. ÖRNEĞİN YAPTIĞINIZ BİR HTML SAYFASININ HANGİ SERVER DA VE HANGİ KLASÖRDE OLDUĞUNU BELİRTİR.

43 URL NEDİR? BİR URL DİR VE İLGİLİ SERVERDAKİ SAYFANIN ADRESİNİ BELİRTİR.

44 HTTP NEDİR? HTTP, HYPER TEXT TRANSFER PROTOKOL KELİMELERİNİN KISALTILMIŞIDIR. ÇOK YÖNLÜ METİN DÖKÜMANLARININ (HTML YA DA WEB SAYFALARININ) HIZLI BİR ŞEKİLDE İNTERNET ÜZERİNDEN ERİŞİLMESİNİ SAĞLAR.

45 HTTP NEDİR? BU PROTOKOL İLE INTERNET EXPLORER YA DA FIREFOX GİBİ BİR BROWSER KULLANARAK SERVERLARDA BULUNAN WEB SAYFALARINA İSTEKTE BULUNABİLİR VE SAYFALARA GÖZ ATABİLİRİZ. ÖRNEGİN: ADRESİNİ YAZARAK BİLKUR.NET DOMAİN İNDE BULUNAN index.asp DOSYASINA İSTEKTE BULUNULUR VE WEB SERVER BU DOSYAYI BİZİM BROWSER IMIZA GÖNDERİR.

46 HTTP NEDİR? SONUÇ OLARAK HTTP, WEB SAYFALARININ TRANSFERİNİ SAĞLAYAN PROTOKOLDÜR.

47 BROWSER (TARAYICI) NEDİR? WEB SERVERLARDA BULUNAN SİTELERE ULAŞABİLEN, WEB SERVER DAN GELEN HTML KODLU SAYFALARI BİZE GÖSTEREN YAZILIMLARDIR. INTERNET EXPLORER FIREFOX GOOGLE CHROME GİBİ YAZILIMLAR BUNLARA ÖRNEKTİR.

48 HTML

49 WEB NEDİR? WORLD WIDE WEB E KISACA WEB DENİR. DÜNYA ÇAPINDA AĞ OLARAK TÜRKÇEYE ÇEVRİLEBİLİR. WEB, INTERNET'E BAĞLANAN TÜM BİLGİSAYARLARIN OLUŞTURDUĞU BİR AĞDIR.

50 WWW NASIL ÇALIŞIR? WEB DEKİ BİLGİLER WEB SAYFASI DENİLEN DOSYALARDA SAKLANIR. WEB SAYFALARI WEB SERVER DENİLEN BİLGİSAYARLARDA BULUNUR. SAYFALARI OKUMAK İSTEYEN CLIENT/İSTEMCİ BİLGİSAYARLAR, BROWSER/TARAYICI DENİLEN YAZILIMLARI KULLANARAK BU SAYFALARI GÖRÜNTÜLEYEBİLİRLER.

51 BROWSER/TARAYICI NEDİR? CLIENT/İSTEMCİ BİLGİSAYARLARIN, WEB SAYFALARINI OKUMASI İÇİN KULLANDIKLARI YAZILIMDIR. INTERNET EXPLORER VEYA FIREFOX EN ÇOK KULLANILAN TARAYICILARDIR. TARAYICILAR WEB SUNUCULARINDA BULUNAN SAYFALARI ALIRLAR VE GÖSTERİRLER. YANİ TARAYICILAR, HTML TAG LARIYLA BİÇİMLENMİŞ METİNLERİ VE DİĞER NESNELERİ GÖRÜNTÜLER.

52 BROWSER NASIL ÇALIŞIR? İLGİLİ WEB SAYFASININ ADRESİ YAZILDIKTAN SONRA, TARAYICI İLGİLİ WEB SUNUCUSUNU BULUR VE SAYFAYI İSTER. SUNUCU İLGİLİ SAYFAYI TAG DENİLEN KOMUTLAR TOPLULUĞU OLARAK İSTEMCİ BİLGİSAYARA GÖNDERİR. İSTEMCİDEKİ TARAYICI BU SAYFAYI ALIR, GELEN TAGLARI (KOMUTLARI) YORUMLAR VE ANLAŞILIR BİR ŞEKİLDE GÖSTERİR.

53 SUNUCU/İSTEMCİ SUNUCU/SERVER (IIS/APACHE) 1.ÖNCE İSTEMCİ SAYFAYI İSTER (REQUEST/İSTEK) İSTEMCİ/CLIENT (IE) İndex.htm 2.SONRA SUNUCU SAYFAYI GÖNDERİR (RESPONSE/TEPKİ)

54 TAG/ETİKET NEDİR? WEB SAYFASI OLUŞTURMAK İÇİN KULLANILAN KOMUTLARA TAG DENİR. <TAG>...</TAG> ŞEKLİNDE KULLANILIRLAR. İKİ TAG ARASINDA KALAN METİN VEYA DİĞER NESNELER BU TAGLARDAN ETKİLENİR.

55 WEB STANDARTLARINI KİM DÜZENLER? WEB STANDARTLARINI MICROSOFT VEYA NETSCAPE GİBİ FİRMALAR BELİRLEMEZ. WEB STANDARTLARI W3C DENİLEN BİR KURUM TARAFINDAN SAPTANIR. W3C WORLD WIDE WEB CONSORTIUM UN KISALTILMIŞIDIR. KURUMUN WEB ADRESİ:

56 WEB STANDARTLARINI KİM DÜZENLER? HTML, CSS VE XML GİBİ STANDARTLAR BU KURUM TARAFINDAN BELİRLENMİŞTİR. EN SON HTML STANDARDI XHTML 1.0 DIR.

57 HTML NEDİR? HTML, HYPER TEXT MARKUP LANGUAGE KELİMELERİNİN KISALTILMIŞIDIR. BİR HTML DOSYASI, TAG LARDAN OLUŞAN BİR METİN DOSYASIDIR. TAG LAR, TARAYICIYA WEB SAYFASININ NASIL GÖRÜNMESİ GEREKTİĞİNİ ANLATIRLAR.

58 HTML NEDİR? STANDART BİR WEB SAYFASININ UZANTISI.HTM VEYA.HTML OLMALIDIR. HTML DOSYALARI NOT DEFTERİ GİBİ BASİT BİR METİN EDİTÖRÜ İLE VEYA DREAMWEAVER GİBİ GELİŞMİŞ EDİTÖRLERLE OLUŞTURULABİLİRLER.

59 HTML EDİTÖRLERİ WEB SAYFASI OLUŞTURMAK İÇİN NOT DEFTERİ GİBİ BASİT BİR METİN DÜZENLEME YAZILIMI YETERLİDİR. FAKAT ÇOK GELİŞMİŞ EDİTÖRLER DE MEVCUTTUR. BUNLAR DREAMWEAVER, EXPRESSION WEB GİBİ YAZILIMLARDIR. BU TÜR YAZILIMLARLA HTML KODLARINI KULLANMADAN, GRAFİKSEL OLARAK, OLDUKÇA KOLAY VE PROFESYONEL WEB SAYFALARI HAZIRLANABİLİR.

60 HTML EDİTÖRLERİ HTML KODLARI BU YAZILIMLAR TARAFINDAN OTOMATİK OLARAK ÜRETİLİRLER. AMATÖR BİR WEB TASARIMCISI HTML BİLMESE DE OLUR: DREAMWEAVER/FRONTPAGE İLE HER İŞİNİ GÖRÜR. BİZİM AMACIMIZ İNTERNET PROGRAMCILIĞI, YANİ HTML KODLARININ ARASINA PROGRAM YAZMAK OLDUĞU İÇİN EN AZINDAN TEMEL DÜZEYDE HTML BİLMEK ZORUNDAYIZ.

61 HTML TAGLARI (ETİKET) HTML TAGLARI, HTML SAYFALARINI OLUŞTURMAK VE DÜZENLEMEK İÇİN KULLANILIRLAR. <TAG>...</TAG> ŞEKLİNDE KULLANILIRLAR. TAGLARIN ARASINDA KALAN METNE TAG İÇERİĞİ DENİR. TAG LER BÜYÜK HARFLE VEYA KÜÇÜK HARFLE YAZILABİLİRLER. XHTML STANDARDI KÜÇÜK HARF KULLANILMASINI ÖNERİR.

62 ÖRNEK HTML SAYFASI HER HTML BELGESİ BELİRLİ SAYIDA STANDART HTML TAGLARI İÇERMELİDİR. BİR HTML BELGESİNDE OLMASI GEREKEN KISIMLAR ŞUNLARDIR; TEMEL <HTML> METNİ BAŞ <HEAD> METNİ GÖVDE <BODY> METNİ İYİ BİR HTML BELGESİNDE BU ÜÇ KISIMDA OLMALIDIR.

63 ÖRNEK HTML SAYFASI <html> <head> <title>sayfa BAŞLIĞI</title> </head> <body> BU BENİM İLK SAYFAM. </body> </html>

64 TAG ÖZELLİKLERİ TAG LARIN ÖZELLİKLERİ DE OLABİLİR. ÖRNEĞİN SAYFANIN ARDALAN RENGİNİ BELİRLEMEK İÇİN <BODY> TAG ININ BGCOLOR ÖZELLİĞİ KULLANILIR. <body bgcolor= red > </body>

65 TAG ÖZELLİKLERİ TAG ÖZELLİKLERİ DAİMA İSİM=DEĞER ŞEKLİNDE BULUNURLAR. YANİ Name= value =>bgcolor= red ŞEKLİNDE OLURLAR.

66 TEMEL HTML TAGLARI BUNLAR <html> <body> <head> <h1>,...,<h6> <br> <hr> <!-- GİBİ TAGLARDIR.

67 <HTML>...</HTML> HER WEB SAYFASI BU TAG LA BAŞLAYIP BU TAGLA BİTER. <HTML> </HTML>

68 <HEAD>...</HEAD> SAYFA İLE İLGİLİ BİLGİLER VERMEK İÇİN KULLANILIR. BU BÖLÜMDEKİ BİLGİLER TARAYICIDA GÖSTERİLMEZ, YANİ ZİYARETÇİ BURADAKİ BİLGİLERİ GÖREMEZ. SAYFA ÖZELLİKLERİ BU BÖLÜME YAZILIR. SAYFA BAŞLIĞI <TITLE> BU BÖLÜMDEDİR.

69 <TITLE>...</TITLE> TARAYICIDAKİ PENCERE BAŞLIĞINDA BULUNAN YAZIYI BELİRLER. <HEAD> <TITLE>BİLKUR BİLGİSAYAR KURSLARI</TITLE> </HEAD>

70 ÖRNEK...<TITLE>...<TITLE> <HTML> <HEAD> <TITLE> BİLKUR BİLGİSAYAR KURSLARI... </TITLE> </HEAD> </HTML>

71 <BODY>...</BODY> SAYFAMIZIN GÖVDE KISMIDIR. TARAYICIDA ZİYARETÇİ TARAFINDAN GÖRÜNECEK BİLGİLERİ İÇERİR. <HTML> <BODY> BU KISMA YAZILANLAR ZİYARETÇİ TARAFINDAN GÖRÜLÜR. </BODY> </HTML>

72 ZEMİN RENGİ (BACKGROUND) İYİ BİR ZEMİN RENGİ WEB SİTENİZİN DAHA GÜZEL GÖRÜNMESİNİ VE DAHA FAZLA ZİYARETÇİ GELMESİNİ SAĞLAYABİLİR. SAYFANIZIN ZEMİN RENGİNİ <BODY> TAG I İÇERİSİNDE TANIMLAMANIZ GEREKİR. ZEMİN RENGİ İÇİN BİR RENK VEYA BİR RESİM KULLANABİLİRSİNİZ.

73 ZEMİN RENGİ (BACKGROUND) SAYFANIZDA ZEMİN RENGİ TANIMLAMAK İÇİN <BODY> TAG INI DEĞİŞTİRMELİSİNİZ <BODY bgcolor= RENK_ADI > BURADAKİ RENK_ADI BÖLÜMÜNDE RENKLERİN İNGİLİZCE KARŞILIĞINI GİRMEMİZ GEREKMEKTEDİR. RENK ADI YERİNE O RENGE KARŞILIK GELEN RGB CİNSİNDEN HEXADESİMAL SAYIYI DA YAZABİLİRİZ.

74 ÖRNEK 1 (ZEMİN RENGİ) <HTML> <HEAD> <TITLE> Bilkur Bilgisayar Kursları... </TITLE> </HEAD> <BODY bgcolor="yellow"> </BODY> </HTML>

75 ÖRNEK 2 (ZEMİN RENGİ) <HTML> <HEAD> <title>bilkur Bilgisayar Kursları...</title> </HEAD> <BODY bgcolor="ffff00"> </BODY> </HTML>

76 ZEMİN RESMİ SAYFANIZIN ZEMİNİNE BİR RESİM DE KOYABİLİRSİNİZ. BACKGROUND ÖZELLİĞİ BU İŞLEM İÇİN KULLANILIR. BUNUN İÇİN; <body background="clouds.gif"> <body background= C:\Windows\desktop\dosyalar\bulutlar.gif"> <body background= "

77 ÖRNEK 3 (ZEMİN RESMİ) <HTML> <HEAD> <title>bilkur Bilgisayar Kursları...</title> </HEAD> <BODY background= "C:\WINDOWS\Desktop\dosyalar\Bulutlar.gif" > </BODY> </HTML>

78 TEXT DEYİMİ BODY İÇİNDE TEXT DEYİMİ KULLANILARAK SAYFADA BULUNAN YAZILARIN RENKLERİ AYARLANABİLİR. KULLANIMI <BODY TEXT= RENK_ADI > ŞEKLİNDEDİR.

79 BASEFONT VE FONT SEÇİMİ BİR WEB SAYFASINDA BİR YAZININ FONTU BELİRTİLMEMİŞSE ÖNCEDEN TANIMLI OLAN BİR FONT KULLANILIR. BASEFONT DEYİMİ İLE BİZ BU FONTU DEĞİŞTİREBİLİRİZ. <BASEFONT FACE= Arial >

80 ÖRNEK 4 (METİN RENGİ) <HTML> <HEAD> <title>bilkur Bilgisayar Kursları...</title> </HEAD> <BODY bgcolor= yellow text="blue"> Bu yazı mavi renkli olarak görünecek. </BODY> </HTML>

81 AÇIKLAYICI EKLEME SAYFANIZDA İSTEDİĞİNİZ YERDE AÇIKLAMA BİLGİLERİ EKLEYEBİLİRSİNİZ. EKLEDİĞİNİZ AÇIKLAMALAR TARAYICIDA (INTERNET EXPLORER) GÖRÜNMEZ. AÇIKLAMA YAZISI <!-- İLE BAŞLAR VE --> İLE BİTER.

82 ÖRNEK 5 (AÇIKLAMA) <HTML> <HEAD> <title>bilkur Bilgisayar Kursları...</title> </HEAD> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <BODY text="blue"> Bu yazı mavi renkli bir yazıdır.. </BODY> </HTML>

83 SAYFALARA METİN GİRMEK İKİ BODY DEYİMİ ARASINA YAZILARIMIZI YAZABİLİR VEYA DİĞER NESNELERİ (TABLO, RESİM) KOYABİLİRİZ. BİR WEB SAYFASININ İÇERİĞİNİ İNTERNET EXPLORER PROGRAMIYLA GÖREBİLİRİZ. YAZILARIMIZI BİÇİMLEME DEYİMLERİ KULLANARAK DÜZENLERİZ.

84 ÖRNEK 6 (YAZI GİRME) <HTML> <HEAD> <title>bilimsel Akademi</title> </HEAD> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <BODY text="blue"> Bilimsel Akademi </BODY> </HTML>

85 <BR> DEYİMİ BİR ÖNCEKİ ÖRNEĞİMİZDE DESEM YAZISINDAN SONRA, ALT SATIRA GEÇMEK TARAYICIDA HİÇBİR DEĞİŞİKLİĞE YOL AÇMADI.. ALT SATIRA GEÇMEK İÇİN <BR> DEYİMİ KULLANILIR.

86 ÖRNEK 7 (BR DEYİMİ) <HTML> <HEAD> <title>desem Bilgisayar Kursları...</title> </HEAD> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <body text="blue"> Bilimsel Akademi <BR> T.C. M.E.B. Özel Bilkur Eğitim Merkezi </BODY> </HTML>

87 YAZILARIN ORTALANMASI SAYFA İÇİNDE ORTALANMASINI İSTEDİĞİMİZ NESNELER İÇİN <CENTER>...</CENTER> DEYİMİNİ KULLANABİLİRİZ. ORTALAMAK İSTEDİĞİMİZ METNİN BAŞINA <CENTER> BAŞLATMA DEYİMİNİ, SONUNA İSE </CENTER> DEYİMİNİ YERLEŞTİRECEĞİZ. BU İKİ DEYİM ARASINDA KALAN YAZI ORTALANIR.

88 ÖRNEK 7 (<CENTER>) <HTML> <HEAD> <title> Bilimsel Akademi </title></head> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <BODY text="blue"> <CENTER> Bilimsel Akademi <BR> T.C. M.E.B. Özel Bilkur Eğitim Merkezi</CENTER> </BODY> </HTML>

89 YAZI BOYUTU/BAŞLIKLAR (H1,H2,...,H6) <HTML> <BODY> <h1>this is a heading</h1> <h2>this is a heading</h2> <h3>this is a heading</h3> <h4>this is a heading</h4> <h5>this is a heading</h5> <h6>this is a heading</h6> </BODY> </HTML>

90 KALIN, İTALİK VE ALTI ÇİZGİLİ YAZI BİR ÖNCEKİ ÖRNEĞİMİZDE YAZIMIZIN İSTEDİĞİMİZ BÜYÜKLÜKTE OLMASINI SAĞLAYABİLİYORDUK. BENZER ŞEKİLDE METİNLERİN KALIN, İTALİK VE ALT ÇİZGİLİ OLMASINI DA SAĞLAYABİLİRİZ. KALIN İÇİN <B>..YAZI</B> İTALİK İÇİN <I>..YAZI..<I> ALT ÇİZGİ İÇİN <U>..YAZI.. <U> KULLANILIR

91 ÖRNEK 10 (K, İ, ALT) <HTML> <HEAD> <title> Bilimsel Akademi </title> </HEAD> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <BODY text="blue"> <CENTER> <FONT SIZE=+6 >DESEM</FONT><BR> <B> Dokuz Eylül Üniversitesi </B><BR>

92 ÖRNEK 10 (DEVAM) <I> Mühendislik Fakültesi </I><BR> <U> Bilgisayar Mühendisliği Bölümü... </U> </CENTER> </BODY> </HTML>

93 <STRONG>,<EM> DEYİMLERİ YAZIMIZI KALIN YAPMAK İÇİN <B> DEYİMİ YERİNE <STRONG> DEYİMİNİ KULLANABİLİRİZ. AYNI ŞEKİLDE YAZIMIZI İTALİK YAPMAK İÇİN <I> DEYİMİ YERİNE <EM> DEYİMİNİ KULLANABİLİRİZ.

94 ÖRNEK 11 (STRONG, EM) <HTML> <HEAD> <title> Bilimsel Akademi </title> </HEAD> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <body text="blue"> <CENTER> <STRONG> Dokuz Eylül Üniversitesi </STRONG> <BR>

95 ÖRNEK 11 (DEVAM) <EM> Mühendislik Fakültesi </EM> <STRONG><EM> Bilgisayar Mühendisliği </EM></STRONG> </CENTER> </BODY> </HTML>

96 YAZI BÜYÜKLÜĞÜ WEB SAYFAMIZDA KULLANDIĞIMIZ YAZILARIMIZIN FARKLI BÜYÜKLÜKTE OLMASI GEREKEBİLİR. BÜYÜKLÜK AYARI İÇİN <FONT> DEYİMİ İÇİNDE KULLANILAN SIZE PARAMETRESİ KULLANILIR. <FONT SİZE=X>..YAZIMIZ..</FONT> BURADA X HARFİ YAZIMIZIN BÜYÜKLÜĞÜDÜR.

97 ÖRNEK 8 (YAZI BÜYÜKLÜĞÜ) <HTML> <HEAD> <title>bilkur Bilgisayar Kursları...</title> </HEAD> <!-- Aşağıda verilen satırda Web sayfasındaki metinlerin rengi değiştiriliyor. --> <BODY text="blue"> <CENTER> <FONT SIZE=6 >Bilimsel</FONT> <BR> T.C. M.E.B. Özel Bilkur Bilgisayar Kursu </CENTER> </BODY> </HTML>

98 YAZI RENGİNİ AYARLAMAK YAZI RENGİ AYARI İÇİN DAHA ÖNCE BİR YOL TANIMLAMIŞTIK. FAKAT SADECE TÜM SAYFAMIZIN YAZI RENGİNİ DEĞİŞTİREBİLİYORDUK. BAZI METİNLERİN FARKLI RENKTE OLMASINI İSTİYORSAM <FONT> DEYİMİNİN COLOR PARAMETRESİNİ KULLANIRIM. <FONT color= YAZI RENGİ >YAZI</FONT> KULLANILIR

99 ÖRNEK 12 (YAZI RENGİ) <HTML> <HEAD><title> Bilimsel Akademi </title> </HEAD> <body text="blue"> <CENTER> <FONT color=red > BİLKUR</FONT> <BR> <FONT color=yellow> Dokuz Eylül Üniversitesi </FONT> <BR> <font color=green>mühendislik Fakültesi </font> </CENTER> </BODY> </HTML>

100 FONT DEĞİŞİKLİĞİ YAZILARIMIZI WORD PROGRAMINDA OLDUĞU GİBİ BİR FONT BELİRTEREK DE BİÇİMLENDİREBİLİRİZ. ÖRNEĞİN Arial, Times New Roman, Technical v.b. FARKLI FONT ÇEŞİTLERİDİR. WİNDOWS İŞLETİM SİSTEMİ BU FONTLARDAN BİR ÇOĞUNU DESTEKLER.

101 FONT DEĞİŞTİRME WINDOWS İŞLETİM SİSTEMİNİN DESTEKLEDİĞİ FONTLARI RAHATLIKLA WEB SAYFALARIMIZDA KULLANABİLİRİZ. BU FONTLARI KULLANMAK İÇİN <FONT> DEYİMİNİN FACE PARAMETRESİNİ KULLANIRIZ. <FONT face= arial >BİLKUR</FONT>

102 ÖRNEK 13 (FACE PARAMETRESİ) <HTML> <HEAD><title>Bilgisayar Kursları...</title></HEAD> <body text="blue"> <CENTER> <FONT face=arial >BİLİMSEL</FONT><BR> <FONT face="courier New"> Dokuz Eylül Üniversitesi.</FONT><BR> <FONT face=verdana>mühendislik Fakültesi </FONT> </CENTER> </BODY> </HTML>

103 ÖRNEK 14 (FACE PARAMETRESİ) <HTML> <HEAD> <title>bilgisayar Kursları...</title> </HEAD> <BODY > <CENTER> <FONT color="red" face=arial>desem</font> <BR> <font color="green">dokuz Eylül Üniversitesi</font> <BR> <FONT face=verdana>mühendislik Fakültesi </FONT> </CENTER> </BODY> </HTML>

104 HTML RESİMLERİ ÖZELLİKLE BANT GENİŞLİĞİNİN ARTMASIYLA WEB SAYFALARINDA ÇOK FAZLA RESİM KULLANILMAYA BAŞLANDI. BUNUN SONUCU OLARAK <IMG> TAGININ İYİ BİLİNMESİ GEREKMEKTEDİR.

105 HTML RESİMLERİ BİR RESMİ WEB SAYFAMIZA YERLEŞTİRMEK İSTİYORSAK İLK OLARAK RESİM DOSYAMIZ HARD DİSKİMİZ ÜZERİNDE OLMALIDIR. AYNI ŞEKİLDE İNTERNET ÜZERİNDEN YAYINLAYACAĞIMIZ RESME AİT DOSYA DA İNTERNET TE OLMALIDIR.

106 RESİM TİPLERİ İNTERNET ÜZERİNDEN YAYINLAYACAĞIMIZ RESİMLERİN FORMATI: JPEG, JPG BMP GIF XBM PNG

107 <IMG> VE SRC ÖZELLİĞİ <IMG> TAGININ BİTİŞ TAGI YOKTUR, SADECE ÖZELLİKLERİ VARDIR. BİR SAYFADA RESİM GÖRÜNTÜLEYEBİLMEK İÇİN <IMG> TAGININ SRC ÖZELLİĞİ KULLANILIR. YANİ; <IMG SRC= URL > <IMG SRC= C:\İSMAİL.GIF >

108 ÖRNEK12 (Resim Ekleme) <HTML> <HEAD><title>Bilgisayar Kursları...</title></HEAD> <body text="blue"> <CENTER> <FONT face=arial >DESEM</FONT><BR> <FONT face="courier New"> Dokuz Eylül Üniversitesi</FONT><BR> <FONT face=verdana>mühendislik Fakültesi </FONT> <IMG SRC = C:\WINDOWS\Backgrnd.gif height=200 width=100> </CENTER> </BODY> </HTML>

109 Örnek 13(Resim ekleme) <HTML> <HEAD><title>Bilgisayar Kursları...</title></HEAD> <BODY text="blue"> <CENTER> <FONT face=arial >DESEM</FONT><BR> <FONT face="courier New"> Dokuz Eylül Üniversitesi</FONT><BR> <FONT face=verdana>mühendislik Fakültesi </FONT> <IMG SRC =../dosyalar/bulutlar.gif > </CENTER> </BODY> </HTML>

110 SAYFALARDA YATAY ÇİZGİ SAYFALARIMIZA YATAY BİR ÇİZGİ EKLEMEK İSTİYORSAK <HR> TAGINI KULLANMAMIZ GEREKİR. SAYFANIZIN İSTEDİĞİNİZ BİR YERİNE <HR> DEYİMİNİ EKLERİZ. KAPANIŞ TAGI YOKTUR. <HR align="center" width="250" size="5" noshade color="#0000cc">

111 <P>...</P> PARAGRAFLARI BELİRTMEK İÇİN KULLANILIR. <P>BURASI BİR PARAGRAFTIR.</P>

112 ÖRNEK 16 (<P>) <HTML> <HEAD><title>Bilgisayar Kursları...</title></HEAD> <BODY text="blue"> <p align="left">burasi İLK PARAGRAF </p> <p align="center">burasi DA İKİNCİ PARAGRAF </p> <p align="right">burasi ÜÇÜNCÜ VE SAĞA DAYALI</p> <p align="justify">ve DE İKİ KENARA DAYALI</p> </BODY> </HTML>

113 HTML LİNKLERİ HTML SAYFALARINDAKİ BİR SAYFADAN BAŞKA BİR SAYFAYA GİTMEK İÇİN HYPERLINK LERİ KULLANMALISINIZ. BUNUN İÇİN <A> TAGI KULLANILIR.

114 <A>...</A> (ANCHOR) KULLANIMI AŞAĞIDAKİ GİBİDİR. <A HREF= URL > GÖRÜNTÜLENECEK METİN </A> <A HREF= > tıklayınız...</a> HEMEN HEMEN TÜM NESNELERİ KULLANARAK LİNKLER OLUŞTURABİLİRSİNİZ. RESİMLER, SES DOSYALARI, GÖRÜNTÜ DOSYALARI, METİNLER V.B.

115 Örnek 20 <A> <HTML> <HEAD> <title> Bilimsel Akademi </title> </HEAD> <BODY> Dokuz Eylul Üniversitesi web sayfası için <A HREF="htpp:// <br> <A HREF="index.htm">Ana Sayfa</A> </BODY> </HTML>

116 Örnek 22 <img> <HTML> <HEAD> <title> Bilimsel Akademi </title> </HEAD> <BODY> <p>dokuz Eylul Üniversitesi web sayfası için <A HREF="htpp:// <br> <A HREF="index.htm">Benim Sayfam</A> <br> <a href=" src= image.gif"></a> </BODY> </HTML>

117 Örnek 23 <mailto> <HTML> <HEAD> <title> Bilimsel Akademi </title> </HEAD> <BODY> Dokuz Eylul Üniversitesi web sayfası için <A HREF="htpp:// <br> <A HREF="index.htm">Benim Sayfam</A> <br> <a href=" src= image.gif"></a> <a mail yolla<a> </BODY> </HTML>

118 HTML LİSTELERİ WEB SAYFALARINDA NESNELERİNİZİ LİSTELER HALİNDE SIRALAYARAK DAHA DÜZENLİ GÖRÜNMELERİNİ SAĞLAYABİLİRSİNİZ. HTML LİSTELERİ SIRALI, SIRASIZ VEYA TANIMLI OLABİLİR.

119 SIRASIZ LİSTELER (UNORDERED LIST) SIRASIZ LİSTELERDE NESNELER MADDE İMLERİ İLE LİSTELENİR. <UL> <LI>KAHVE</LI> <LI>ÇAY</LI> <LI>ŞEKER</LI> </UL> SONUÇ: ÇAY KAHVE ŞEKER

120 SIRALI LİSTELER (ORDERED LIST) ELEMANLAR NUMARALANDIRILARAK LİSTELENİR. <OL> <LI>ÇAY</LI> <LI>KAHVE</LI> <LI>ŞEKER</LI> </OL> SONUÇ 1. ÇAY 2. KAHVE 3. ŞEKER

121 HTML TABLOLARI HTML DİLİNDE TABLO OLUŞTURMAK İÇİN <TABLE> TAGI KULLANILIR. İYİ BİLİNMESİ GEREKEN KONULARDAN BİRİDİR ÇÜNKÜ SAYFA İÇİNDEKİ NESNELER TABLOLARLA DÜZENLENİR VE HİZALANIR.

122 <TABLE> TABLOLAR <TR> TAGIYLA SATIRLARA VE HER SATIR DA <TD> TAGIYLA SÜTUNLARA BÖLÜNÜR. BU İŞLEM SONUNDA OLUŞTURULAN HÜCRELERDE METİNLER, LİSTELER, RESİMLER, PARAGRAFLAR, FORMLAR VE BAŞKA DİĞER NESNELER DE OLABİLİR.

123 <TABLE>...</TABLE> <HTML> <HEAD><title> Bilimsel Akademi</title></HEAD> <BODY> <TABLE border="1"> <tr><td>hücre 1</td> <td>hücre 2</td></tr> </TABLE> </BODY> </HTML>

124 BORDER ÖZELLİĞİ <TABLE BORDER= 1 > ŞEKLİNE TABLONUN SINIRLARININ KALINLIĞI BELİRTİLİR.

125 TABLE BORDER <table border="1"> <tr> <td>isim</td> </tr> <tr> <td>dokuz Eylül</td> </tr> </table>

126 BOŞ HÜCRELİ TABLOLAR BOŞ HÜCRELER ÇOĞU TARAYICIDA KÖTÜ BİR ŞEKİLDE KENARLARI OLMADAN GÖRÜNÜRLER. <TABLE BORDER="1" > <TR> <TD>HÜCRE 1</TD> <TD>HÜCRE 2</TD> </TR> <TR> <TD>HÜCRE 3</TD> <TD></TD> </TR> </TABLE>

127 BOŞ HÜCRELİ TABLOLAR BU SORUNDAN KURTULMAK İÇİN BOŞ HÜCRELERE (&NBSP;) KOYULUR VE BU ŞEKİLDE HÜCRE KENARLIKLARININ GÖRÜNMESİ SAĞLANIR. <TABLE BORDER="1" > <TR> <TD>HÜCRE 1</TD> <TD>HÜCRE 2</TD> </TR> <TR> <TD>HÜCRE 3</TD> <TD> &NBSP; </TD> </TR> </TABLE>

128 BİR TABLO ÖRNEĞİ <TABLE BORDER="1" > <TR ALIGN="CENTER" VALIGN="TOP"> <TD WIDTH="94"><B>ÜLKE ADI</B></TD> <TD WIDTH="72"><B>NÜFUSU</B></TD> <TD WIDTH="153"><B>BULUNDUĞU KITA</B></TD> </TR> <TR> <TD>AVUSTURYA</TD> <TD>8,000,000</TD> <TD>AVRUPA</TD> </TR>

129 BİR TABLO ÖRNEĞİ(devam) <TR> <TD>ALMANYA</TD> <TD>80,000,000</TD> <TD>AVRUPA</TD> </TR> <TR> <TD>TÜRKİYE</TD> <TD>70,000,000</TD> <TD>AVRUPA</TD> </TR> </TABLE>

130 HTML FORMLARI VE BİLGİ GİRİŞİ FORM, FORM ELEMANLARI BARINDIRAN BİR ALANDIR. FORM ELEMANLARI KULLANICILARDAN BİLGİ GİRİŞİNE İZİN VERMEK İÇİN KULLANILAN METİN KUTULARI, SARKAN LİSTELER, RADYO (SEÇENEK) BUTONLARI, ONAY (CHECK) KUTULARI V.B. NESNELERDİR.

131 FORM ELEMANLARI ŞİMDİ DE FORMDA KULLANILAN BAZI ELEMANLARI LİSTELEYELİM FORM ALANI SUBMIT VE RESET BUTONLARI (BUTTON) METİN KUTUSU(TEXT) SEÇME LİSTELERİ (SELECT LISTS) ONAY KUTUSU (CHECKBOX) SEÇENEK DÜĞMESİ (RADIO) METİN ALANI (TEXT AREA)

132 <FORM>...</FORM> FORM OLUŞTURMAK İÇİN <FORM> TAGI KULLANILIR. <form> <input> <input> </form>

133 <INPUT> (VERİ GİRİŞİ) FORMLARDA EN ÇOK KULLANILAN TAGLARDAN BİRİDİR. BİLGİ GİRİŞİNİN (INPUT) NE ŞEKİLDE OLACAĞI TYPE ÖZELLİĞİ İLE BELİRLENİR. Adı: <input type="text" name= ad size=25 maxlength=25>

134 SEÇENEK DÜĞMESİ (RADIO) BİRKAÇ SEÇENEKTEN SADECE BİRİNİ SEÇMEK İÇİN KULLANILIRLAR. <input type="radio" name= cins" value= bay > Bay <input type="radio" name= cins value= bayan"> Bayan

135 ONAY KUTULARI (CHECKBOXES) BİR VEYA BİRDEN FAZLA SEÇENEK SEÇİLEBİLİR. <input type="checkbox" name= motor"> Motor kullanıyorum <br> <input type="checkbox" name= araba"> Araba kullanıyorum

136 ŞİFRE ALANLARI FORMUMUZ İÇİNDE ŞİFRE GİRİLMESİ GEREKEN YERLERDE KULLANILIR <input type= PASSWORD name= sifre size= 12 max= 8 >

137 TEXT AREA ELEMANI UZUN MİKTARDA BİR YAZI GİRİLECEKSE BU DURUMLARDA TEXT AREA KULLANILIR. <TEXTAREA NAME= yorum ROWS=7 COLS=30>buraya düşüncelerinizi yazınız... </TEXTAREA>

138 SEÇME LİSTELERİ SEÇME LİSTELERİ; KULLANICILARI BELİRLENMİŞ OLAN BİR LİSTEDEN BİR YADA DAHA FAZLA ELEMAN SEÇMELERİNİ SAĞLAYAN OLDUKÇA ESNEK BİR YAPIDIR. ÖRNEĞİN BİR ÜLKE LİSTESİNDEN ÜLKE SEÇMEK GİBİ...

139 ÖRNEK <SELECT NAME= sec > <OPTION VALUE= tur SELECTED>türkiye <OPTION VALUE= ing > ingiltere </SELECT> BİR ELEMANIN SEÇİLİ OLMASINI İSTİYORSAK SELECTED DEMEMİZ LAZIMDIR.

140 SEÇME LİSTELERİ İSTENİRSE TÜM LİSTEDEN BİRDEN FAZLA ELEMAN SEÇİMİ AYARLANABİLİR. BUNUN İÇİN MULTIPLE YAZISININ EKLENMESİ YETERLİDİR. AYRICA SIZE PARAMETRESİ İLE DE GÖRÜLECEK ELEMAN SAYISI DA BELİRTİLİR

141 ACTION ÖZELLİĞİ VE SUBMIT BUTONU SUBMIT BUTONUNA TIKLADIĞINIZDA, FORM İÇERİĞİ BAŞKA BİR DOSYAYA GÖNDERİLİR. ACTION ÖZELLİĞİ, FORMDAKİ BİLGİLERİN GÖNDERİLDİĞİ DOSYAYI BELİRLER. BU MUHTEMELEN BİR ASP VEYA PHP DOSYASIDIR, GÖNDERİLEN BİLGİLER ALINIR VE İŞLENİR.

142 ACTION ÖZELLİĞİ VE SUBMIT BUTONU <form name= kayit" action= kayit.asp" method="get"> Username: <input type="text" name= ad"> <input type="submit" value= Tamam"> </form>

143 HTML HEAD ELEMANI HEAD TAGI, SAYFA İLE İLGİLİ GENEL BİLGİLER İÇERİR. AYRICA META-INFORMATION ŞEKLİNDE DE ADLANDIRILIRLAR. META, BİR ŞEY HAKKINDA BİLGİ DEMEKTİR.

144 HTML HEAD ELEMANI META-DATA DENİLDİĞİ ZAMAN DATA (VERİ) İLE İLGİLİ BİLGİ, META-INFORMATION DENİLDİĞİ ZAMAN DA SAYFA İÇERİĞİ İLE İLGİLİ BİLGİ ANLAŞILIR.

145 HTML HEAD ELEMANI BU BÖLÜMDEKİ BİLGİLER BROWSER DAN GÖSTERİLMEZ. BU BÖLÜMDE SADECE BİRKAÇ TAG KULLANILABİLİR. BUNLAR; BASE, LINK, META, TITLE, STYLE VE SCRIPT TAGLARIDIR.

146 HEAD TAGLARI BASE LINK META TITLE STYLE SCRIPT

147 <META>...</META> SAYFA İLE BİLGİLER VERİR. ÖRNEĞİN SAYFANIN TASARIMCISI, HANGİ PROGRAMLA OLUŞTURULDUĞU, ANAHTAR KELİMELER V.B.

148 ARAMA MOTORLARI İÇİN ANAHTAR KELİMELER BAZI ARAMA MAKİNELERİ META TAGININ NAME VE CONTENT ÖZELLİKLERİNİ KULLANARAK ARAMA YAPARLAR. BU NEDENLE META TAGININ BAZI ÖZELLİKLERİ ÖNEMLİDİR.