HTML Ile Basit Bir Web Sayfası Nasıl Oluşturulur? - WikiHow

Có thể bạn quan tâm

Anasayfa
Rastgele
Makaleleri Tara
wikiHow Hakkında

Giriş yap / Kaydol

Terms of UseHTML ile Basit Bir Web Sayfası Nasıl Oluşturulur?

Makaleyi İndir Ortak yazarlar wikiHow Kadrosu

Makaleyi İndir X

Bu makale editörler ve araştırmacılardan oluşan, makalenin doğruluğu ile kapsamlılığını onaylayan, eğitimli bir ekip tarafından ortaklaşa yazılmıştır. wikiHow’ın İçerik Yönetim Ekibi, yüksek kalite standartlarımızın sağladığından emin olmak için, editör ekibimizden gelen her çalışmayı dikkatli bir şekilde denetler. Bu makale 32.914 defa görüntülenmiştir.

Bu Makalede: Web Sayfasını Oluşturmak Web Sayfanı Kaydetmek ve Açmak İpuçları ve Uyarılar İlgili Makaleler Referanslar

Bu wikiHow makalesi sana HTML ile basit bir web sayfasını nasıl yazacağını öğretir. HTML World Wide Web’in ana bileşenlerinden birisidir; web sayfalarının yapısını oluşturur. Web sayfanı oluşturduğunda onu bir HTML dokümanı olarak kaydedip web tarayıcında görüntüleyebilirsin. Hem Windows hem de Mac bilgisayarda bulunan basit metin düzenleyicilerle bir HTML sayfası oluşturmak mümkündür.

Adımlar

Kısım 1 Kısım 1 / 2:

Web Sayfasını Oluşturmak

Makaleyi İndir

1 Bir metin düzenleyici aç. Windows bir bilgisayarda genelde Not Defterini veya Notepad++’ı kullanırsın. Mac kullanıcıları ise TextEdit’i kullanır:
- Windows - Başlat’ı aç, {{kbd|not defteri} veya notepad++ yaz ve pencerenin en üstünde Not Defteri’ne veya Notepad++’a tıkla.
- Mac - Spotlight’a tıkla, textedit yaz ve sonuçların en üstünde TextEdit’e çift tıkla.
2 HTML için belge türünü belirle. <!DOCTYPE html> yaz ve ↵ Enter’a bas, ardından <html> yaz ve yine ↵ Enter’a bas. Son olarak <head> yaz ve ↵ Enter’a bas. Belgenin başı aşağıdaki gibi olmalı: [1] <!DOCTYPE html> <html> <head>
3 Web sayfan için bir sekme başlığı ekle. Bu, sayfayı açtığın zaman tarayıcı sekmesinde görünecek olan başlıktır ("Facebook" gibi). <title> yaz ve web sayfanın sekme başlığını gir, ardından da </title> yaz. Sonrasında kendi satırına </head> şeklindeki kapatma "Head" etiketini ekle. Başlık bölümü şöyle görünmeli: <title>Benim Web Sayfam</title> </head>
4 Sayfanın body metninin başlangıcını belirt. Kapalı olan "Head" etiketini altına <body> yaz. Bu, sen "Body" etiketini kapatana kadar belgenin metninin geri kalanının web sayfası metni olarak algılanmasını sağlar. Kodun aşağıdaki gibi olmalı: <body>
5 Bir sayfa başlığı oluştur. Sayfa başlığın web sitenin en üstünde görünecek olan başlıktır. Bir başlık oluşturmak için <h1> yaz, başlığını ekle ve etiketi </h1> ile kapat. Örnek: <h1>Sayfama Hoş Geldin!</h1>
6 Devam ettikçe fazladan başlıklar ekle. <h1></h1> ve <h6></h6> etiketlerini kullanarak altı farklı başlık oluşturabilirsin. Örneğin; arka arkaya farklı boyutlarda başlıklar oluşturmak için aşağıdaki kodu yazabilirsin: <h1>Sayfama Hoş Geldin!</h1> <h2>Benim adım Bora.</h2> <h3>Umarım burayı beğenirsin.</h3>
7 Bir paragraf yarat. Paragraf etiketleri, ayrık metin öbekleri oluşturmak için kullanılır. Bir paragrafın içine metin yerleştirmek için type in <p> yazıp metnini yaz, ardından etiketi kapatmak için </p> yaz: <p>Bu benim paragrafım.</p>
- Tek bir başlık altında bir paragraf dizisi oluşturmak için tek seferde birden fazla paragraf satırı ekleyebilirsin.
8 Metin rengini değiştir. Tüm metinlerin rengini, metni <font color="color">...</font> etiketleriyle çevreleyerek ve tercih ettiğin rengi "color" alanına yazdığından (tırnak işaretleriyle birlikte) emin olarak değiştirebilirsin. Örneğin; bir paragrafın rengini mavi yapmak için aşağıdakini yazarsın: [2] X Kaynağı araştır <p><font color="blue">Balinalar muhteşem yaratıklardır.</font></p>
Note: the
<font> etiketi artık kullanılmıyor. Onun yerine <span style="color: (your color)">...</span>
bunu kullanmalısın.
- Bu etiket grubuyla tüm metinleri (başlıklar gibi) farklı bir renge dönüştürebilirsin.
- HTML, şaşırtıcı derecede fazla renk desteklemekte; yani farklı renk isimleri denemekten çekinme.
9 Metni kalın, yana eğik veya altı çizgili olarak biçimlendir. Kalın metin, yana eğik metin ve altı çizili metin sırasıyla <b></b>, <i></i> ve <u></u> etiketleriyle oluşturulabilir. Alt simge (Kareköklerden önceki sayılar gibi şeyler için kullanılır) ve üst simge (sayıların karesi gibi şeyler için kullanılır) metinleri de oluşturabilirsin: [3] <b>Kalın metin</b> <i>Yana eğik metin</i> <u>Altı çizili metin</u> <sub>Alt simge metni </sub> <sup>Üst simge metni</sup>
10 Sayfana bir resim ekle. Mevcut bir resmi web sayfana eklemek için <img src="URL"> etiketlerini kullanabilirsin. Örneğin; resmin URL’i "http://www.mypicture.com/lake" ise aşağıdakini yazarsın: <img src="http://www.mypicture.com/lake">
11 Başka bir sayfaya bağlantı ver. <a href="link">link text</a> etiket grubunu kullanarak başka bir web sitesine bağlantı verebilirsin ki buradaki link, bağlantı vermek istediğin web sitesinin URL’idir. link text ise bağlantı olarak görev yapacak olan metindir: [4] <a href="https://www.facebook.com">Bu, Facebook'un web sitesine bağlantıdır.</a>.
12 Web sayfasının etiketlerini kapat. HTML’deki çoğu etikette olduğu gibi (bazı HTML etiketlerinin kapatma etiketi yoktur), belgenin en üstünde bulunan <body> ve <html> etiketlerini belgenin en altına aşağıdaki kodu yazarak kapatman gerekir: </body> </html>
13 Web sayfanı incele. Gerekirse <body></body> etiketleri arasında herhangi bir yere daha fazla paragraf, başlık ve metin ekleyebilirsin. Tamamlanmış bir web sayfasını şöyle görünür: <!DOCTYPE html> <html> <head> <title>wikiHow Hayran Sayfası</title> </head> <body> <h1>Sayfama Hoş Geldin!</h1> <p>Bu bir wikiHow hayran sayfasıdır. Rahatına bak!</p> <h2>Önemli Tarihler</h2> <p><i>15 Ocak 2019</i> - wikiHow’ın Doğum Günü</p> <h2>Bağlantılar</h2> <p>İşte wikiHow’a bir bağlantı: <a href="http://www.wikihow.com.tr">https://www.wikihow.com.tr</a></p> </body> </html>
14 Son dakika değişiklikleri yap. Kodunda hata görürsen, devam etmeden önce bunları düzelt. HTML’in beklentilerini doğru şekilde yansıttığından emin olduktan sonra bir sonraki kısma geçebilirsin. Reklam

Kısım 2 Kısım 2 / 2:

Web Sayfanı Kaydetmek ve Açmak

Makaleyi İndir

1 Mac kullanıyorsan belgeni yalın metne dönüştür. Ekranın en üstündeki Biçim menü öğesine tıkla, ardından açılır menüde Yalın Metin Yap’a tıkla.
Bu adım Windows’ta gerekli değildir; uygulanması da mümkün değildir.
2 "Kaydet" menüsünü aç. Web sayfanı yazmak için yeni bir metin belgesi oluşturduğuna göre kaydetmek için Ctrl+S tuşlarına (Windows) veya ⌘ Command+S tuşlarına (Mac) basabilirsin.
- Dosya’ya, ardından da açılan menüde Farklı Kaydet’e de tıklayabilirsin. Bu hem Windows hem de Mac bilgisayarlarda çalışır.
3 HTML belgen için bir isim gir. Belgene vermek istediğin ismi "Dosya adı" (Windows) veya "Ad" (Mac) metin kutusuna yaz.
4 Belgenin dosya türünü değiştir. Belgeyi bir metin dosyasından bir HTML dosyasına dönüştürmen gerekir.
- Windows - Kaydetme biçimi adlı açılır menüye tıkla, ardından Tüm Dosyalara tıkla ve dosya adının sonuna .html yaz.
- Mac – Dosya adının sonundaki .txt’yi .html ile değiştir.
5 Click Kaydet’e tıkla. Pencerenin el atındadır. Böylece bir HTML dosyası oluşturulur.
- Genelde HTML dosyaları varsayılan web tarayıcında açılır.
6 Metin düzenleyicini kapat. Bu noktada, web sayfanı görüntülemek için HTML dosyanı tarayıcında açmaya hazırsındır.
7 HTML belgesini tarayıcında aç. Bunu yapmak için çoğu durumda HTML belgesine çift tıklayabilirsin. Belgeye çift tıklayınca hata oluşuyorsa aşağıdakini uygula:
- Windows – Belgeye sağ tıkla, Birlikte Aç’ı seç ve tercih ettiğin tarayıcıya tıkla.
- Mac – Belgeye bir kez tıkla, Dosya’ya tıkla, Birlikte Aç’ı seç ve tercih ettiğin tarayıcıya tıkla.
8 Gerekirse HTML belgesini düzenle. HTML sayfanda bir hata fark edebilirsin. Bunu değiştirmek için HTML belgesinin metnini düzenleyebilirsin:
- Windows’ta belgeye sağ tıklayabilirsin ve açılan menüde de Düzenle’ye tıklayabilirsin (bilgisayarında Notepad++ yüklüyse burada onun yerine Notepad++ ile Düzenle yazar).
- Mac’te, seçmek için belgeye tıkladıktan sonra Dosya’ya tıklayıp Birlikte Aç’ı seçmek ve TextEdit’e tıklamak istersin. Belgeyi TextEdit’in içine de sürükleyebilirsin.
Reklam

İpuçları

Sayfanda bir görseli ortaya almak istiyorsan resmin img etiketi içindeki adından sonra <class="center"> yazabilirsin (<img src="URL" class="center"> gibi).
Web sitene, <marquee></marquee> etiketini kullanarak yana kaydırmalı metin ekleyebilirsin; ama bazı tarayıcıların bu etiketi tanımayabileceğini unutma.
Çoğu kişi kodlarını yazmak ve derlemek için Notepad++ kullanır.
Etiketler her zaman, açık hâldeki eşlerinin tersi olacak şekilde kapatılmalıdır. Örneğin; <etiket1><etiket2>, </etiket2></etiket1> şeklinde kapatılmalıdır.

Reklam

Uyarılar

Kendi görsellerini, web sayfana görsel yüklemeyi düşünüyorsan Imgur veya benzeri bir platformda barındırmak en iyisidir. Başkalarının resimlerini paylaşmak telif hakkı ihlâliyle sonuçlanabilir.

Reklam

Bununla İlgili wikiHow'lar

Grand Theft Auto (GTA) V'te Kız Arkadaş Nasıl Bulunur?

Herhangi Bir Sitedeki Video Nasıl Ücretsiz İndirilir?

Deep Web'e Nasıl Erişilir?

Instagram Gönderileri Belli Takipçilerden Nasıl Gizlenir?

Bilgisayar Televizyona HDMI ile Nasıl Bağlanır?

Tarama Geçmişi Nasıl Görüntülenir?

Google ile Nasıl İletişime Geçilir?

Sim'lerinin İhtiyaçları Nasıl Doldurulur?

Gmail Nasıl Hack'lenir?

Minecraft'te Atlar Nasıl Çiftleştirilir?

HDMI Televizyona Nasıl Bağlanır?

WhatsApp'te Durumunu Kimin Görüntülediği Nasıl Anlaşılır?

Facebook'a Nasıl Giriş Yapılır?

AirPod Pil Durumu Nasıl Kontrol Edilir? Reklam

Referanslar

↑ https://www.w3schools.com/
↑ https://www.w3schools.com/tags/att_font_color.asp
↑ https://www.w3schools.com/html/html_formatting.asp
↑ https://www.w3schools.com/html/html_links.asp

Bu wikiHow makalesi hakkında

Ortak yazarlar : wikiHow Kadrosu wikiHow Yazarı Bu makale editörler ve araştırmacılardan oluşan, makalenin doğruluğu ile kapsamlılığını onaylayan, eğitimli bir ekip tarafından ortaklaşa yazılmıştır. wikiHow’ın İçerik Yönetim Ekibi, yüksek kalite standartlarımızın sağladığından emin olmak için, editör ekibimizden gelen her çalışmayı dikkatli bir şekilde denetler. Bu makale 32.914 defa görüntülenmiştir. Kategoriler: Bilgisayar ve Elektronik Cihazlar Diğer dillerde İngilizce Portekizce İspanyolca Fransızca Almanca Felemenkçe Rusça Çince Endonezce Tayca Korece Arapça Vietnamca Hintçe Farsça İtalyanca Japonca