HTML (HYPER TEXT MARKUP LANGUAGE) TEMEL ETİKETLERİ

Có thể bạn quan tâm

... konulu sunumlar: "HTML (HYPER TEXT MARKUP LANGUAGE) TEMEL ETİKETLERİ"— Sunum transkripti:

1 HTML (HYPER TEXT MARKUP LANGUAGE) TEMEL ETİKETLERİ

2 HTML Komut Yapısı Html (Hypertext Markup Language), web sayfaları hazırlamak için kullanılan bir dildir. Html komutları herhangi bir metin (text) düzenleme editöründe (NotePad, Word gibi) yazılabileceği gibi, çeşitli web tasarımı editörlerini (Dreamweaver, FrontPage, Netscape Composer gibi) kullanarak da oluşturulabilir.

3 Web sayfasında standart olarak bulunması gereken kodlar şunlardır:<html> <head> <title> SAYFANIN BAŞLIĞI </title> </head> <body> SAYFANIN TÜM İÇERİĞİ: RESİM,YAZI,VİDEO vb. </body> </html>

4 Html komutları etiketlerden (tag) oluşur.Html komutları yazılırken aşağıdaki kurallara dikkat edilmesi gerekir; Html komutları “<” ve “>” işaretleri arasına yazılır. Burada yer alan“< >” etiketleme yapmak için kullanılan işarettir. <etiketadi>……</etiketadi>, <tag>…..</tag> Html etiketleri yazılırken Türkçe karakterler kullanılmamalıdır. (ş, ç, ö, ü, ı, ğ)

5 Html komutları büyük küçük harf duyarlı değildirHtml komutları büyük küçük harf duyarlı değildir. Başka bir deyişle tümü büyük harflerle açılmış olan bir etiket tümü küçük harflerle yazılan aynı etiket ile kapatılabilir.<body>….</BODY> veya <Html>….</html> Açılan bir etiket kapatılmalıdır. İlk açılan etiket en son kapatılır ve etiketi kapatma sırasında “/” işareti unutulmamalıdır. Etiketler parametreler kullanılarak biçimlendirilir. Parametrelere tırnak işaretleri arasında değer atanır. Değerle parametre arasına eşittir işareti konur.

6 HTML dosyaları sunucu bilgisayarın sabit diskinde. html ya daHTML dosyaları sunucu bilgisayarın sabit diskinde .html ya da .htm uzantısı ile saklanır. Kaydetme işlemi sırasında Dosya-Kaydet seçeneğine tıklanır.

8 Dosya-Kaydet komutuna tıklandıktan sonra karşınıza gelen Farklı Kaydet penceresinden sırasıyla Dosya Adı ve Dosya türü belirlenir.

10 <HTML> <html> etiketi, html kodlarının yazımına başladığımızı gösteren etikettir. Tüm html kodları <html>…</html> arasında yer alır. </html> ile html kodlarının yazımının bittiği anlaşılır. Bu etiketin hiçbir parametresi yoktur.

11 <HEAD> HTML belgesinin ilk böümüdür.Hazırlayacağımız sayfa ile ilgili bilgilerin bulunduğu sayfa başlığı (title), link özellikleri, siteyi tarayıcıya ve arama motorlarına tanıtmak amacıyla kullanılan bölümdür. Head etiketinin yorum aralığında Meta etiketleri yer alır. Meta etiketi ile tanımlanan bilgiler kullanıcı tarafından görüntülenmez.

12 Meta etiketinde kullanılan parametreler aşağıdaki Tabloda gösterilmiştir.NAME: Sayfanın yazarı, sayfanın yayın tarihi gibi bilgileri içerir. <meta name="author" content="özgü"> <meta name="description" content="sayfanın tanımını yazınız"> <meta name ="description" content ="Bu sayfa web tasarımı dersi modülleri için hazırlanmıştır. "> <meta name="keywords" content="siteniz arama motorlarında hangi anahtar kelimelerle tanımlansın istiyorsanız buraya yazınız."> Şekillerinde yazılır.

13 Sıklıkla kullanılan meta etiketleri ve açıklamaları: HTTP-EQUIV: İçinde yer aldığı sayfanın, web server tarafından ziyaretçiye gönderilmesinde oluşturulacak karşılık başlığı bölümünde yer alacak bilgiler içerir. Sıklıkla kullanılan meta etiketleri ve açıklamaları: <meta http-equiv=Content-Type content="text/htm; charset=windows-1254"> <meta http-equiv=Content-Type content="text/htm; charset=iso "> <meta http-equiv=Content-Type content="text/htm; charset=utf-8"> Bu etiketler Türkçe karakter sorununu ortadan kaldırmak ve Türkçe karakter desteği sağlamak için kullanılır.

14 <meta http-equiv="expires" content ="Tarih">Bu etiket ile belirtilen tarihten sonra bu sayfa açılmak istenirse sayfanın tekrardan serverdan yüklenmesi sağlanır

15 <meta http-equiv="expires" content ="Wed, 29 Dec 2011 15:21:59 GMT"><meta http-equiv="refresh" content="5; url=anasayfa.htm"> Sayfanın belirtilen süre sonra yenilenmesini sağlar. Yukarıdaki örnekte sayfa 5 saniye sonra yenilenir ve URL de belirtilen anasayfa.htm sayfası açılır. Eğer URL boş bırakılırsa aynı sayfa tekrarlanır.

16 <meta name="robots" content="all veya none">Hazırladığımız sayfanın arama motorlarının robotları tarafından taranmasına izin vermek veya engellemek için kullanılır. İzin için all, engelleme için none kullanılır

17 <BODY> Html belgesinin tüm içeriğinin yer aldığı bölümdür.Bu bölümde yer alan içeriğin tümü tarayıcıda görüntülenir. Body etiketi ile birlikte kullanılabilecek parametreler ve görevleri aşağıda gösterilmiştir.

18 Bgcolor: Hazırlamış olduğunuz web sayfasının arka plân rengini belirlemek için kullanılır.Kullanımı; <body bgcolor=”blue”>…</body> Background: arka plânda kullanılmak istenilen resmi belirlemek için kullanılır. <body background=”resim.jpg”>….</body>

19 Link: Web sayfanızda kullanacağınız linklerin rengini belirlemek için kullanılır.Alink: Web sayfanızdaki herhangi bir Linke tıklandığı zaman oluşacak rengin ne olacağını belirlemek için kullanılır. Vlink: Web sayfanızdaki önceden ziyaret edilmiş linklerin renginin hangi renk olacağını belirlemek için kullanılır.

20 <TITLE> Sayfanın tarayıcıdaki başlığının ne olacağını belirlemek için kullanılır. Title etiketleri <Head>….</Head> etiketleri arasında yer alır. Kullanımı; <title> görüntülenmesini istediğiniz başlık </title>