Top

ileri Tag

  • All
  • Dijital medya
  • Dijital reklam
  • Dijital strateji
  • Eğitim
  • Growth hacking
  • Haber
  • İnceleme
  • Kişisel
  • Kurumsal
  • Markalar
  • Medya
  • Rehber
  • Teknoloji

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com‘dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools’a ait paylaşacak olduğum online editörü kullanabilirsiniz.


HTML, Web Sunucuları

Ürettiğiniz web sitesini tüm dünyaya duyurmak ve 7/24 sunmak için web sunucu üzerinde depolamanız gerekmektedir.

Bu durum 3 tip maliyet doğurur;

Donanım maliyeti;

Gerçek bir web sitesi için; birtakım güçlü sunucu donanımı alma ihtiyacı doğurur. Düşük fiyatlı bir bilgisayarın bunu yapabileceğini düşünmeyin. Çünkü 24 saat ve devamlı yüksek bağlantıda çalışması gereklidir.

Yazılım maliyeti;

İstemcilerin yani sıradan bilgisayar kullanıcılarının sahip olması gereken lisansların (programların herbir tanesinin lisansı olur.) da kat be kat üzerinde tutar sunucuların(server’ların) yazılımlarının lisansı. Sunucu lisansları aynı zamanda kullanıcı limitine de sahip olabilir. Buna dikkat etmeniz gereklidir.

Emek maliyeti;

Düşük emek harcanacağını sanmayın. Kendi donanım ve yazılımınızı kurarsınız, bug’lar ile virüsler ile uğraşırsınız ve server’ı daima herşeyin olabileceği bir ortamda açık, çalışır tutmak zorundasınızdır.

İnternet servis sağlayıcı kullanmak

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com‘dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools’a ait paylaşacak olduğum online editörü kullanabilirsiniz.


URL’lere dair bilgiler

Açık hali Uniform Resource Locators’tır. Bir Web Adresinin diğer bir adıdır. Bir url sözcük bütününden oluşur. Tıpkı “nefarkederki.com” gibi. Ve aslında “nefarkederki.com”‘un ardında bir ip adresi mevcuttur. IP internet protokolüdür. 4 basamaklı ve her bir basamak 255 haneye sahip olabilir. Siz aslında tarayıcıya nefarkederki.com adlı url’yi girdiğinizde tarayıcı nefarkederki.com’a ait ip adresini çevirmektedir. İsimleri hatırlamak daha kolaydır. Bu yüzden onları kullanırız.

Siz bir bağlantıya tıkladığınızda bir HTML sayfasındayken, altı <a> etiketiyle çizilmiş bir adrese ulaşılır World Wide Web üzerinde.

Bir Uniform Resource Locator ise world wide web üzerindeki bir belge ya da veriyi adreslemek için kullanılır.

Bir web adresi “http://www.nefarkederki.com/images/logo.gif” gibi bir söz dizimi kuralı kullanır.

Şema olarak;

scheme://host.domain:port/path/filename   ‘dır.

Açıklaması;

  • scheme – Internet Servisinin tipini tanımlar ve genel olarak http’dir.
  • host – Domain host’unu(alan sahipliği yani) tanımlar. Temel olarak http için www’dur.
  • domain – Internet alan adını tanımlar tıpkı nefarkederki.com gibi.
  • :port – Host’a ait Port numarasını tanımlar. Http için port 80’dir varsayılan olarak.
  • path – Sunucudaki bir yolu tanımlar. Eğer ifade edilmediyse, web siteniz hosting paketinizdeki disk alanının root’u dur yani kök dizinidir.
  • filename – Dökümanın veya kaynağın ismini tanımlar.

Genel URL Şeması;

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com'dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools'a ait paylaşacak olduğum online editörü kullanabilirsiniz. HTML, Özel karakterler / Entities, URL ve...

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com‘dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools’a ait paylaşacak olduğum online editörü kullanabilirsiniz.


HTML, Head Elementi

Tüm head elementi için bir taşıyıcıdır. <head> elementi içeriğinde; stil dosyası bağı, scriptler, meta bilgisi desteği ve daha fazlasını taşır.

HTML, Title Elementi

<title> etiketi dökümanın başlığını ifade eder.

HTML ve XHTML belgelerinde gereklidir. Title elementi;

  • Tarayıcının araç çubuğunda bir başlık gösterir,
  • Favorilere eklendiğinde sayfa başlığı sağlar,
  • Arama motorlarında sayfa için başlık görüntüler.

Misal;

<html>
<head>
<title>Title of the document</title>
</head>

HTML, Base Elementi

<base> etiketi bir sayfa üzerindeki tüm bağlantılar için bir varsayılan adres veya bir varsayılan hedef ifade eder.

Misal;

<head>
<base href=”http://www.w3schools.com/images/” />
<base target=”_blank” />
</head>

HTML, Link Elementi

<link> etiketi bir döküman ile bir harici kaynak arasındaki ilişkiyi tanımlar. En çok stil dosyasını bağlamak için kullanılır.

<head>
<link rel=”stylesheet” type=”text/css” href=”mystyle.css” />
</head>

HTML, Style Elementi

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com‘dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools’a ait paylaşacak olduğum online editörü kullanabilirsiniz.


Sitenizin iyi görünmesi için layout çok önemlidir. Sayfanızın düzenini çok iyi ayarlamalısınız.

Website Düzeni/ Layout ‘u

Çoğu web sitesi içeriklerini gazete ve dergilerdeki gibi çoklu sütunlara ayırarak yerleştirir.

Bu sütunlar ise ya <table> etiketi ile ya da <div> etiketi ile ayrılır. Bir miktar CSS kullanımı da renkli sayfa görünümü, sayfa konumlandırma, element yerleşimi, arkaplan resimi gibi sayfaya canlılık katar.

HTML’de Layout – Table Kullanımı

En basit şablon oluşturma yolu <table> etiketleri ile mümkündür. Aşağıdaki örnekte 3 satır ve 2 sütuna sahip bir düzen göreceksiniz tablolar ile; -birinci ve son satırın yaslanması ve sütunlar colspan özelliğini kullanmıştır-

Misal;

<html>
<body>

<table width=”500″ border=”0″>
<tr>
<td colspan=”2″ style=”background-color:#FFA500;”>
<h1>Main Title of Web Page</h1>
</td>
</tr>

<tr valign=”top”>
<td style=”background-color:#FFD700;width:100px;text-align:top;”>
<b>Menu</b><br />
HTML<br />
CSS<br />
JavaScript
</td>
<td style=”background-color:#EEEEEE;height:200px;width:400px;text-align:top;”>
Content goes here</td>
</tr>

<tr>
<td colspan=”2″ style=”background-color:#FFA500;text-align:center;”>
Copyright © 2011 W3Schools.com</td>
</tr>
</table>

</body>
</html>

Örneğin kaynağı; Buradadır.

Not; HTML tablolarıyla güzel şablonlar oluşturabilmek mümkün olduğu halde; tablolar sunulacak veriler için dizayn edilmiştir, tasarım için değil.

HTML’de Layout – Div Elementi kullanarak yani tablosuz kullanım

Hacking Interface başlıklı kitabın sloganı "Bilişimin Yeraltı Dünyasından. Merak Etmiyor musun?". Elimdeki 2. baskısı. Tasarım ve kalitesi KodLab Yayınları'ndan. Fiyatı 25 TL gözüküyor ama aşağıdaki linkten aldığınızda daha ucuz. Kitap 258 sayfa ve Bir Hacker'ın(x-Master) gözüyle, saldırı senaryoları, sistem açıkları ve korunma yöntemleri anlatılmakta. Yazar Hamza...