İçerik

• adımlar
• Yöntem 1/1: HTML Sayfası Yazma
• İpuçları
• Uyarılar
• Neye ihtiyacın var

HTML (Köprü Metni İşaretleme Dili), web sayfaları geliştirmek için birincil programlama dilidir. Basit ve kullanışlı bir programlama dili olarak oluşturuldu. İnternetteki sayfaların çoğu bu dilin formlarından biri (ColdFusion, XML, XSLT) kullanılarak geliştirilmiştir. Bu makaleyi okuduktan sonra internetteki diğer kaynakları kullanarak eğitiminize devam edebilirsiniz. Bu konuyla ilgili diğer makaleler için internette arama yapmayı deneyin.

adımlar

Yöntem 1/1: HTML Sayfası Yazma

1. 1 Burada sunulan adımlardan birini tanımaya başlamadan önce, “Neye İhtiyacınız Var” bölümüne bakın.
2. 2 Bu konuyu anlamaya başlamadan önce bilmeniz gerekenler:
3. 3 Temeller. Etiketi hiç duydunuz mu? Etiket, içinde kelime bulunan köşeli parantezlerle çevrilidir. Bitiş etiketi aynı biçimde yazılır, ancak ilk açılı ayraçtan sonra bir eğik çizgi eklenir. Nitelik, bir etikete ayrıntı eklemek için kullanılan, etiketteki isteğe bağlı bir kelimedir.
4. 4 Belgenin başlangıcı. Hangi metin düzenleyiciyi kullanıyorsanız kullanın, aşağıdakini yapıştırın:
   html> head> title> wikiHow / title> / head> body> Merhaba Dünya / body> / html> büyük> / büyük>
   Etiket aynı etiketle kapatılmalıdır, ancak ilk açılı ayraçtan sonra bir eğik çizgi ile kapatılmalıdır. Etiketler gibi istisnalar var META veya DOKTİP.
5. 5 DOKTİP
   • Tipik olarak, çoğu web sayfası DOKTİP ”. Bu, kodlamanın yanı sıra web tarayıcıları tarafından nasıl algılanacağını belirlemeye yardımcı olur. Çoğu sayfa onsuz çalışacaktır, “ancak eşleştirmek istiyorsanız bu gereklidir (İnternetteki kodlama türlerini ve nasıl kullanıldığını düzenlerler)... HTML 4.01 için DOCTYPE aşağıda sunulmuştur:! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> Bu bir tane en yaygın olanlardan DOCTYPE, internetin her yerindeki sayfalarda kullanılır.İlk olarak, 'html'yi açıklayan sayfanın türünü gösterir, ardından kodlama türünü vurgular ve son olarak, sonuç olarak web tarayıcısı için sayfayı tanımlayan DOCTYPE'ın konumunu vurgular.
   • Farklı HTML türleri vardır (yıllar içinde geliştirilen farklı sürümler), örneğin yeni etiketler veya belirli etiketler. Bazı etiketler kullanımdan kaldırılmıştır (bunun yerine daha kullanışlı başka etiketler kullanılmıştır).
   • b> ve ben> - şu anda etiketlere dayatılan budur, çünkü bunlar metni dönüştürmek için kullanılır, ancak özellikleri değil, sonuç olarak, diğer etiketler bunların yerini alır. Etiket güçlü> yerine geçer b>, ve em>, için bir yedek ben>.
   • Önceki etiketlerin, biçimlendirmeden daha fazlası olan etiketlerle değiştirilmesi önemlidir. Metin çevrilirse, yalnızca biçimlendirme değil, anlamı da aynı kalır. Bu anlamsal olarak doğrudur.
   • XHTML sürüm 2.0'da b> ve ben> kullanılmaz, tıpkı HTML 3+ sürümündeki gibi.
6. 6 HTML "Kapsülleme Kuralı".
   • Şu anda kullanımda olan daha önemli etiketlere bir göz atalım. Sayfanın oluşturulması sırasında basit bir yapı kullanılmıştır. Bir etiket açılmışsa, sonuç olarak, kapalı olmalı... Bu tüm yapı için geçerlidir. İşte XHTML düzen yapısının geçerli bir örneği:
   • ! DOCTYPE html KAMU "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   • html xmlns = "http://www.w3.org/1999/xhtml">
   • kafa>
   • meta http-equiv = "İçerik Türü" içerik = "metin / html; karakter kümesi = utf-8" />
   • başlık> Merhaba Dünya! / başlık>
   • / kafa>
   • vücut>
   • h1> Merhaba Dünya! / h1>
   • / vücut>
   • / html>
   • Bir mesaj veren örnek kod Selam Dünya... Buna test denir Selam Dünya.
7. 7 Başlık
   • Web sayfası başlığı, etiket arasındaki içeriktir. kafa>... Bu içerik kullanıcı tarafından görüntülenemez (sadece sayfa başlığında gösterilen başlık). Etiketler arasındaki bilgiler kafa>, aşağıdakiler gibi diğer etiketleri içerebilir:
     
     
     • META etiketi, arama motorları ve diğer yardımcı programlar için yararlı olan bilgiler için kullanılır.
     • Belgeler arasında bir bağlantı oluşturan LINK etiketi, örneğin Stiller (CSS) için.
     • SCRIPT etiketi, bu, uzaktan erişim yeteneği (başka bir belgeden) ile hemen hemen her web kodlamasını içerir.
     • Esasen bir sayfaya uygulanabilen bir stil olan STYLE etiketi.
     • TITLE etiketi, web tarayıcınızda bir sayfanın başlığı olarak görünen başlıktır.
   • Bu web sitesinden alınan örnek bir başlıkta bunlardan bazılarının bir demosunu görelim (kısaltılmış):
     • kafa>
     • başlık> ... / başlık>
     • meta isim = "açıklama" içerik = "..." />
     • link rel = "stil sayfası" type = "metin / css" href = "..." />
     • meta http-equiv = "içerik türü" içerik = "metin / html; karakter kümesi = UTF-8" />
     • stil tipi = "metin / css" medya = "tümü"> ... / stil>
     • komut dosyası türü = "metin / javascript" src = "..."> / komut dosyası>
     • / kafa>
       
       Fark etmediyseniz, tek tek etiketler, asıl bilgiler kaldırılarak vurgulanmıştır. Örnek oldukça kısa, içinde bulunabilecek hemen hemen her etiketi gösteriyor. kafa>HTML yorumu hariç (Bunun hakkında basit etiketlerde konuşacağız).
8. 8 Her yerde basit etiketler
   • Devam edelim ve diğer etiketleri görelim. Etiketlemenize dikkat edin ve genel kural olan "Encapsulation"ı unutmayın.
     
     
     • güçlü> Önemli metni vurgular.
     • küçük> Metni küçültür. Yazı tipi boyutu 1'den 7'ye kadar standart birimlerle ölçülür, varsayılan metin boyutu 3'tür. ...
     • pre> Bir zengin metin bloğu tanımlar. Doğru olduğu gibi, bu tür metinler aynı boyutta ve kelimeler arasında boşluk bırakılarak yazılır.
     • em> Metni bir cümle olarak gösterir.
     • del> Metnin üzerini çizer.
     • ins> Belgeye eklenen metni tanımlar.
     • h1> Birçok başlık etiketinden biri. Bu tür etiketler, sayı farkıyla 'h' ile başlar. Etiketi aynı numarayla kapattığınızdan emin olun.
     • p> Bir paragraf tanımlar.
     • ! --- ... ---> Diğer etiketlerin aksine, yorum etiketin içinde olmalıdır. Bu bilgi yalnızca kod görüntülendiğinde görünür.
     • blok alıntı> Alıntı gösterir, alıntı> etiketiyle kullanılabilir.
     • Yukarıdaki birkaç örnek, mevcut etiketlerin tam listesi değildir. Başkaları hakkında bilgi edinmek için ziyaret edin.
9. 9 Net bir yapı oluşturmak
   • Sayfalar, bilgileri paragraflara ayırabilmemiz için verileri basit etiket kümelerinde tutacak şekilde tasarlanmıştır. Bilgisayar verileri tanır; bağlam veya kavramsal bağlantı hakkında bilgi sahibi değildir. Bilgisayar dostu HTML sayfaları oluşturmalıyız. Bu, div etiketi kullanılarak elde edilir. Çok sayıda sayfa oluşturmaya yardımcı olur. CSS ile biçimlendirilebilir ve mizanpaj için büyük kod tabloları oluşturmaktan daha kolaydır.
     • div> Bu etiket özeldir çünkü biçimlendirilebilir ve hem kullanıcının hem de bilgisayarın anlayabileceği ayrı bilgi blokları kullanabilir.
   • Bir div etiketi kullanan basit bir HTML düzenine bir göz atalım.
     • ! DOCTYPE html KAMU "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     • html xmlns = "http://www.w3.org/1999/xhtml">
     • kafa>
     • meta http-equiv = "İçerik Türü" içerik = "metin / html; karakter kümesi = utf-8" />
     • başlık> Merhaba Dünya! / başlık>
     • / kafa>
     • vücut>
     • h1> Merhaba Dünya! / h1>
     • div kimliği = "contentOne">
     • p> Bu, div # contentOne'daki bir metindir. / p>
     • böl>
     • p> div # contentOne / p> alt bölümünde bir paragraf
     • / böl>
     • / böl>
     • / vücut>
     • / html>
   • div> etiketlerinin kullanılması, CSS ve Javascript ile çalışırken stillerin bulunmasına ve değiştirilmesine yardımcı olur. HTML, daha iyi ve daha duyarlı bir kullanıcı deneyimi oluşturmak için CSS stilleri ve Javascript ile çalışmak için farklı kodlama kullanır.

İpuçları

• Bu makaleyi okuduktan sonra durmayın ve bilmeniz gereken her şeyi öğrendiğinizi düşünmeyin. Özellikle bu teknolojide her zaman öğrenecek bir şeyler vardır.
• Öğrenin, anlayın ve kod yazın.
• Bazı etiketlerin yalnızca> kullandığını unutmayın. Para ve br bazı örneklerdir. > ile açılan diğer etiketlerin daha fazla kapatılması gerekir. Örneğin, "div> / div>".
• İnsanlar yeni keşifler bekler, bu nedenle yeniden icat edin, tasarlayın veya kodlayın.
• Çok şey öğrendikten sonra sunucu programlamayı öğrenmeyi deneyin.
• Javascript'in yanı sıra CSS ile çalışmayı öğrenin.

Uyarılar

• Unutmayın, HTML tamamen içeriği düzenlemekle ilgilidir. Bu, HTML'nin yalnızca içeriği tanınan bir biçimde depolamak için kullanıldığı anlamına gelir. Diğer değişiklikler, CSS gibi diğer teknolojiler kullanılarak yapılmalıdır. Aynı zamanda “Semantik olarak doğru” yapmak anlamına da gelir.diğerleri kabul etmese bile. Diğer programlama dilleri, web sayfaları oluşturmaya yardımcı olur (CSS, Javascript ve XML). HTML bir içerik oluşturucudur.

Neye ihtiyacın var

• ANSI kodlamasını destekleyen bir metin düzenleyici
• Internet Explorer veya Mozilla Firefox gibi bir web tarayıcısı
• (İsteğe bağlı) Adobe Dreamweaver, Aptana Studio veya Microsoft Expression Web gibi wysiwyg veya wykiwyg HTML düzenleyicisi