Sunuyu indir
Sunum yükleniyor. Lütfen bekleyiniz
1
HTML
2
WEB NEDİR? WORLD WIDE WEB’E KISACA WEB DENİR.
WEB, INTERNET'E BAĞLANAN TÜM BİLGİSAYARLARIN OLUŞTURDUĞU BİR AĞDIR. BU AĞDAKİ TÜM BİLGİSAYARLAR BİRBİRİYLE “HTTP İLETİŞİM STANDARDI”NI KULLANARAK KONUŞUR.
3
WWW NASIL ÇALIŞIR? WEB’DEKİ BİLGİLER “WEB SAYFASI” DENİLEN DOSYALARDA SAKLANIR. WEB SAYFALARI “WEB SERVER” DENİLEN MAKİNELERDE BULUNUR. SAYFALARI OKUMAK İSTEYEN “CLIENT” MAKİNELER, “BROWSER” DENİLEN PROGRAMLARI KULLANARAK BU SAYFALARI OKUYABİLİRLER.
4
TAG NEDİR? WEB SAYFASI OLUŞTURMAK İÇİN KULLANILAN KOMUTLARA TAG DENİR.
<TAG>.....</TAG> ŞEKLİNDE KULLANILIRLAR.
5
HTML NEDİR? HTML, “HYPER TEXT MARKUP LANGUAGE” KELİMELERİNİN KISALTILMIŞIDIR. BİR HTML DOSYASI, TAGLARDAN OLUŞAN BİR METİN DOSYASIDIR. TAG’LAR, BROWSER’A WEB SAYFASININ NASIL GÖRÜNMESİ GEREKTİĞİNİ ANLATIRLAR.
6
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Ü VEYA “Dreamweaver” GİBİ GELİŞMİŞ EDİTÖRLERLE OLUŞTURULABİLİRLER.
7
HTML EDİTÖRLERİ HTML KODLARINI YAZMAK İÇİN BASİT BİR METİN DÜZENLEME PROGRAMI YETERLİDİR. FAKAT KOD YAZIM KONUSUNDA ÇOK GELİŞMİŞ EDİTÖRLER MEVCUTTUR. BUNLAR DREAMWEAVER MX MS FRONTPAGE OFFİCE WORD vs.. BU TÜR PROGRAMLAR İLE OLDUKÇA PROFESYONEL WEB SAYFALARI HAZIRLANABİLİR.
8
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. GENELDE KÜÇÜK HARF TERCİH EDİLİR.
9
Ö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.
10
-İlk Sayfa- Öncelikle çalışmalarınızı saklamak için kullanacağınız boş bir klasör oluşturup uygun bir ad verin, mesela html_ders olsun. Daha sonra bu ad bize lazım olacağından kolaylık olması için siz de yeni klasöre bu adı verebilirsiniz. Şimdi de bu klasörü açıp yeni bir metin belgesi oluşturun (sağ fare/Yeni/Metin belgesi). <html> <head> <title>İlk sayfam</title> </head> <body> Sayfama Hoşgeldiniz </body> </html>
11
Şimdi dosyayı kaydedin (Dosya/Farklı Kaydet...).
Dosya adı kısmına şöyle yazın: "sayfa1.htm" (tırnaklar dahil) ve Tamam'a basın. Notepad'i kapatın, metin dosyasını silin ve oluşan yeni dosyayı açın. Dosya varsayılan browser'ınız (Internet Explorer, Netscape Navigator gibi) tarafından açılacaktır. Şöyle bir görüntü elde edeceksiniz:
13
<HTML>...</HTML>
HER WEB SAYFASI BU TAG’LA BAŞLAYIP BU TAGLA BİTER. <HTML> ...... </HTML>
14
<HEAD>...</HEAD>
SAYFA İLE İLGİLİ BİLGİLER VERMEK İÇİN KULLANILIR. BU BÖLÜMDEKİ BİLGİLER BROWSER’DAN GÖSTERİLMEZ. SAYFA ÖZELLİKLERİ BU BÖLÜME YAZILIR. SAYFANIN BAŞLIĞI “<TITLE>” BU BÖLÜMDEDİR.
15
<TITLE>...</TITLE>
PENCERE BAŞLIĞINI BELİRLER. <HEAD> <TITLE>WEB SAYFASI TASARIMI DERSİ UYGULAMASI...</TITLE> </HEAD>
16
ÖRNEK...<TITLE>...<TITLE>
<HTML> <HEAD> <TITLE> WEB SAYFASI TASARIMI DERSİ UYGULAMASI... </TITLE> </HEAD> </HTML>
17
<BODY>...</BODY>
SAYFAMIZIN GÖVDE KISMIDIR. BROWSER’DA 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>
18
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 İSTERSENİZ TEK BİR RENK VEYA BİR RESİM KULLANABİLİRSİNİZ.
19
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.
20
ÖRNEK 1 (ZEMİN RENGİ) <HTML> <HEAD> <TITLE>
WEB SAYFASI TASARIMI DERSİ UYGULAMASI... </TITLE> </HEAD> <BODY bgcolor="Yellow"> </BODY> </HTML>
21
ÖRNEK 2 (ZEMİN RENGİ) <HTML> <HEAD>
<title> WEB SAYFASI TASARIMI DERSİ UYGULAMASI...</title> </HEAD> <BODY bgcolor="FFFF00"> </BODY> </HTML>
22
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=" YAPABİLİRSİNİZ.
23
ÖRNEK 3 (ZEMİN RESMİ) <HTML> <HEAD>
<title> WEB SAYFASI TASARIMI DERSİ UYGULAMASI...</title> </HEAD> <BODY background= "C:\WINDOWS\Desktop\dosyalar\Bulutlar.gif" > </BODY> </HTML>
24
TEXT DEYİMİ BODY İÇİNDE “TEXT” DEYİMİ KULLANILARAK SAYFADA BULUNAN YAZILARIN RENKLERİ AYARLANABİLİR. KULLANIMI <BODY TEXT=“RENK_ADI”> ŞEKLİNDEDİR.
25
ÖRNEK 4 (METİN RENGİ) <HTML> <HEAD>
<title> WEB SAYFASI TASARIMI DERSİ UYGULAMASI...</title> </HEAD> <body background="C:\WINDOWS\Desktop\dosyalar\Bulutlar.gif“ text="BLUE"> Bu yazı mavi renkli bir yazıdır.. </BODY> </HTML>
Benzer bir sunumlar
