Hemen Notepad'i açın ve başlayalım...

<HTML>
 </HTML>

Terimlerin İngilizcesini söylemek zorundayım zira edineceğiniz bütün yardımcı programlarda İngilizce olacak. Yukarıda Kırmızı ile yazılmış şeylere "TAG" yani "etiket" derler. İlki açılış tag idir, ikincisi kapanış tag i. Kapanış tag i yapmak için açılş tag ine / eklediniz mi yeterlidir. Tag lerin hepsinin olmamakla beraber birçoğunun kapanış tag i vardır.
Tag leri Tarayıcınızla konuşmak gibi değerlendirin, daha doğrusu birşeyler yapmasını tarif ediyorsunuz. Şu anda tarayıcıya bunun 'HTML dökümanının başlangıcı olduğunu' söylediniz (<HTML>) ve bununda 'HTML dökümanının sonu' olduğunu söylediniz. (</HTML>). Şimdi içine birşeyler dolduralım.

Her HTML dökümanı bir çift HEAD tag i ister.

<HTML>
 <HEAD>
 </HEAD>
</HTML>

HEAD Taglerinin bizi ilgilendiren tarafı şimdilik sadece TITLE tagleridir.

<HTML>
<HEAD>
 <TITLE></TITLE>
</HEAD>
</HTML>

Ve sayfanın geri kalanı ise BODY ( Gövde )tagleri arasında bulunur. Yani şu anda izlediğiniz sayfa bu tagler arasındadır.

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
 <BODY>
 </BODY>
</HTML>

birşey daha, dökümanınıza TITLE ile BODY tagleri arasına girecek bir şeyler ilave edelim.

<HTML>
<HEAD>
<TITLE>Benim ilk web denemem!</TITLE>
</HEAD>
<BODY>
 Merhaba ilkturk.net!
</BODY>
</HTML>

Şimdi save yapın, fakat text dökümanı değil, html dökümanı olarak. index.html olarak yeni bir klasörün içinde save yapın. Eğer bu biraz kafayı karıştırdı ise şöyle yapın... Notepadde Dosyayı tıklayın sonra Farklı Kaydet.
Çıkan diyalog kutusunda -> tıklayarak yeni bir klasör açın, istediğiniz adı verin. Sonra çift tıklayıp açın
Dosya Adı: diyen yere   index.html   yazın Farklı kaydet: tıklayın. Ama dikkat edin all files(*.*) yada Bütün dosyalar  desin.
Enter'a basın ve bitti evet bitti.!

Bir sonraki basamak sayfanıza güzel birşeyler koymak olacak.

Bir sonraki bölüme geçmeden iki önemli nokta

BİR: bu yaptığınız bir iskelet HTML dökümanı idi. Şu anda bu okuduğunuz sayfa dahil bütün fiyakalı web sayfaları bu esas tagleri bulundurmak zorundadır.

İKİ: Döküman <TITLE>Benim ilk web denemem!</TITLE> etiketleri arasında yazılı olanlar en tepede tarayıcı penceresinin sol üst köşesinde, lacivert çubuğun üzerinde çıkar.

 

Karışıklığa sebep vermemek için <BODY> taglerinin içini yazacağım. Bundan sonra <HTML>, <HEAD> & <TITLE> taglerini artık yazmayacağım ama siz mutlaka yazın. (ben kısaltmış olmak için yazmıyorum-belirteyim).

<BODY>
</BODY>

Güzel bir şey yazın.

<BODY>
 Güzel bir şey
</BODY>

Güzel bir şey


Dökümanda herhangi bir şey değiştirdiniz mi mutlaka "Kayıt" ile saklatın, "Yenile" yi tıklayın ve değişikliği hemen gözlemleyinki ne olduğunu anlayabilesiniz

Sanırım ilk öğrenmemeiz gereken background - fon - renginin nasıl değiştiği.

<BODY BGCOLOR="#FFFF00">
Güzel bir şey
</BODY>

Güzel bir şey

FFFF00 sarı renginin HEX kodudur.

Dilerseniz arkaplanı image - resim - de yerleştirebilirsiniz.
DİKKAT : image -resim- sizin HTML dosyanızla (sayfanızla) aynı folder -klasör- de olmalı. Yoksa resimleriniz çıkmaz. Resimleri göremezseniz endişelenmeyin, mutlaka aynı klasörde değildir veya GIF ve JPG dosyalarınızı Türkçe harfler kullanarak isimlendirmiş olabilirsiniz.
Kodun yazılışı ise aşağıdaki gibidir:

<BODY BACKGROUND="fon.gif">
Güzel bir şey
</BODY>

Güzel bir şey

Arkaplan image ı burada

İmage in görünebilmesi için aynı HTML dosyanızla aynı klasörde olması gerek. Bunun en kolay yolu , image ın üzerine sağ tıklayıp daha önceki derste yaptığınız sayfa bilgisayarın hangi bölümünde ise hemen onun yanına Resmi Farklı Kaydet yapın

Eski düz beyaz ekrana gidelim tekrar.

<BODY BGCOLOR="#FFFFFF">
Güzel bir şey
</BODY>

Güzel bir şey

İstersek yazıları böyle Kalın yapabiliriz.

<BODY BGCOLOR="#FFFFFF">
Güzel bir <B>şey</B>
</BODY>

Güzel bir şey

Biz aslında browsere diyoruz ki<B> görünce harfleri kalın yapmağa başla </B> görüncede durdur.

Aynı kural italikler içinde geçerlidir....

<BODY BGCOLOR="#FFFFFF">
Güzel <I>bir</I> <B>şey</B>
</BODY>

Güzel bir şey

vede.. altçizgi.

<BODY BGCOLOR="#FFFFFF">
 <U>güzel</U> <I>bir</I> <B>şey</B>
</BODY>

Güzel bir şey

Beyaz ekrana tekrar dönelim.

<BODY BGCOLOR="#FFFFFF">
Güzel bir şey
</BODY>

Güzel bir şey

İstersek tagleri birlikte kullanabiliriz.

<BODY BGCOLOR="#FFFFFF">
Güzel bir <I><B>şey</B></I>
</BODY>

Güzel bir <Uşey

Bu nested - yani içiçe geçmiş - taglere örnektir. İlerde etiketleri birlikte kullandığınız zaman aşağıdaki şekilde yapın yoksa browserin kafasını karıştırırsınız.

   <THIS><THAT></THIS></THAT>    Karışık yani HATALI
   <THIS><THAT></THAT></THIS>    Nested DOĞRUSU BÖYLE

Elbette font size too font ebatlarıda değişir... Nasıl mı? - Çok kolay.

Önce <FONT> taglerini ilave edin...

<BODY BGCOLOR="#FFFFFF">
Güzel bir<FONT>şey</FONT>
</BODY>

Sonra SIZE ebat özelliğini belirtin.

<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT SIZE=6>şey</FONT>
</BODY>

Güzel bir şey

Fontlar 7 ebatta gelir:

minik

küçük

normal

büyücek

büyük

gerçekten büyük

1

2

3

4

5

6

 

NOYA!

7

Şimdi iki şeyi tartışalım. <TAG> browsere bir şeyi yapmasını söyler ve ATTRIBUTE ise <TAG> içine girer ve browsere nasıl yapacağını söyler.
İkinci nokta ise defaultlar yani varsayılanlar. Eğer hiçbirşey belirtilmemişse browser varsayılan değerleri atar. Mesela font ölçülerinde varsayılan değer 3 tür. bir şey belirtmezseniz browser 3 varsayarak karakterleri yazar.

Her browserin değişik varsayılan font ayarları vardır. Eğer PCnizi fazla kurcalamadı iseniz varsayılan ayarları " Times New Roman 12pt ve siyah renk tir". Ama ARIAL and COMIC SANS gibi değişik fontlarda vardır.

<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT FACE="ARIAL">şey</FONT>
</BODY>

Güzel bir şey

Tabii fontların gözükmesi için PCnize yüklü olması gerekir. Tekrarlayayım eğer sayfanıza bakan kimse, sizin belirttiğiniz fontlar bilgisayarına yüklü değilse, sadece kendi bilgisayarının varsayılan fontunu görür. Onun için fontlarınızla biraz dikkatli olun. Arial ve Comic Sans MS Windows ile gelen yaygın fontlardandır. Aynı şekilde Impact! da. Yapmanız gereken, işi garantiye almak için birden fazla font belirtmeniz. Bunlardan birini yapın.. <FONT FACE="ARIAL, HELVETICA, LUCIDA SANS">Hidee Ho</FONT>.
Olay şu: Sayfa yüklenirken browser ARIAL arar. Bulursa kullanır, bulamadı ozaman HELVETICA yı arar. Bulursa kullanır olmadı LUCIDA SANSı gider bakar. Onuda bulamazsa çaresiz varsayılan fontu kullanır.

Evvet, eğlenceye geri dönelim..
İsterseniz font rengini değiştirebilirsiniz.

<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT COLOR="#FF0000">şey</FONT>
</BODY>

Güzel bir şey

İstersek birden fazla özelliği <TAG> içine yerleştirebiliriz...

<BODY BGCOLOR="#FFFFFF">
Güzel bir <FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">şey</FONT>
</BODY>

Güzel birşey

Elbette bu kadar değil!

<BODY BGCOLOR="#FFFFFF">
Güzel bir <U><I><B><FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">şey</FONT></B></I></U>
</BODY>

Güzel birşey

Tekrar belirteyim, birden fazla tag nested olmalı.

<TAG3><TAG2><TAG1>Hooha!</TAG1></TAG2></TAG3>

Hangisinin önce olduğu mühim değil. Bir şeyi kırmızı ve kalın yapmak için sıra farketmez. İstediğiniz sırada yapabilirsiniz.

<TAG2><TAG1><TAG3>Hooha!</TAG3></TAG1></TAG2>

Kendinizi ve browserin kafasını karıştırmak için en kestirme yol, etiketlerin sırasını karıştırmaktır. The fastest way to confuse the browser, not to mention yourself is to overlap the tags...

<TAG3><TAG2><TAG1>Hooha!</TAG3></TAG1></TAG2>

Son olarak: Browserin text rengi, link rengi, aktif link rengi ve ziyaret edilmiş link rengi ve ekran fon rengi için varsayılan değerleri vardır. Şöyleki:

Text siyahtır
 Linkler mavi
 Actif link kırmızı
 Ziyaret edilmiş link mor

Eğer ihtiyacınız olursa bunları değiştirebilirsiniz (ihtiyacınız olursa dedim!) Bütün dünya linkleri mavi görmeğe alışmıştır. Lütfen fazla değişiklik yapıp kafaları karıştırmayın. Bütün döküman için varsayılanları <BODY> etiketinin içinde değiştirebilirsiniz.

<BODY BGCOLOR="#00000" TEXT="#FFFF00" LINK="#FF0000" VLINK="#800000" ALINK="#008000">
Güzel bir şey
</BODY>

Güzel bir şey

Şimdi linkleri öğrenmeden neden suyu bulandırıyorsun diyebilirsiniz!! Haklısınız ama yakında linkleri yapmasını nasılsa öğreneceksiniz. Hiç değilse şimdiden renkleri değiştirmesini öğrendiniz.     Şimdi görüyorsunuz fon siyah ve text sarı.
    Linkler şimdi kırmızı
    Ziyaret edilmiş linkle bordo
    ve aktif linkler ise yeşil.

Dersi kapatmadan, bir şeye dikkatinizi çekmek isterim. Eğer bir sayfanın HTML kodunu merak ediyorsanız, görmek için sayfanın üzerinde sağ tıklayıp, Kaynağı Görüntüleyi tıklarsanız açılan Notepad penceresinden HTML kodunu görürsünüz. Ama sağ tıklamaya kimi arkadaşlar çok mühim keşiflerinide saklamışlarsada zamanı gelişnce sayfayı sağ tıklamaya kapatmanında pek çözüm olmadığını öğrenirsiniz.  

Sanırım artık browserin (tarayıcı program) nasıl çalıştığı hakkında biraz bilgi edinme zamanı geldi.
Önce bir örnek..

<BODY BGCOLOR="#FFFFFF">
Güzel bir şey
bir demet çiçek gibi!
</BODY>

Güzel bir şey bir demet çiçek gibi!

<BODY BGCOLOR="#FFFFFF">
 Hey!
Burada
neler
oluyor??

</BODY>

Hey! Burada neler oluyor??

Browser eğer formatı söylemezseniz tanımaz. Siz aksini söylemedikçe, karakterleri ardarda sıralar. Yeni bir satır başlamak istiyorsanız, satırbaşı yapmalısınız.

<BODY BGCOLOR="#FFFFFF">
 Hey!
<BR> Burada
<BR> neler
<BR> oluyor??
<BR> </BODY>

Hey!
Burada
neler
oluyor??


<BR> sadece satırbaşı anlamına gelir. <BR> benzer bir ikinci komut ise, <P>. Buda yeni bir paragrafın başlangıcını belirtir. Bir satır atlayıp, yeni bir satırdan satırbaşı yaparak paragrafı başlatır.

<BODY BGCOLOR="#FFFFFF">
Hey!
 <P>Burada
<P>neler
<P>oluyor??
</BODY>

Hey!

Burada

neler

oluyor??


Bu satırbaşlatan etiketler hakkında bir not:
Bunları bir defadan fazla kullanamazsınız. Yani bir başka deyişle <P><P><P> şeklinde yazarak bir kaç tane boş satır elde edemezsiniz. Genelde tek bir tane boş satır bırakırlar. Az sonra size bir kaç tane boş satırı nasıl elde edeceğinizi anlatacağım.

Önce buraya bakınız...

<BODY BGCOLOR="#FFFFFF">
 Gerçekten        güzel        bir şey.
</BODY>

Gerçekten güzel bir şey.

Tarayıcı birden fazla boşluğu tanımaz. Gerçekten saçma görünen bir şey ama, böyle olması en uygun hali. Bu size dökümanın görünümünün tüm kontrolunu vermekte.

Browsere "boşluk" geldiğini anlatan küçücük bir kod vardır yani, -> &nbsp; den bahsediyorum.

Şimdi bunu bir deneyin bakalım...

<BODY BGCOLOR="#FFFFFF">
Gerçekten&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
güzel&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
bir şey.
</BODY>

Gerçekten        güzel        bir şey.

& özel bir karakterin başladığını, ; ise bittiğini belirtir; arada kalan harfler ise, özel karakteri tanımlarlar. Bu özel karakterlerden bir kısmı aşağıdadır. Dikkat: bunlar hep küçük harfle yazılmalıdır.

  • &nbsp; ( boşluk)
  • &lt; (< küçüktür işareti)
  • &gt; (> büyüktür işareti)
  • &amp; (& ampersand işareti)
  • &quot; (" çift tırnak)
  • &shy; (­ soft hyphen)

Bunları herzaman kullanmanız gerekmez, bazen gerçek işareti yazmak tarayıcı programı şaşırtabilir. Bu işaretlerin nezaman karıştıracağını nasıl anlarız? diye sorarsanız; Bunun tam olarak bir kuralı yoktur. Biraz alıştırma ve web sayfanızda sapıtmış şekilde duran karakterleri görünce kullanmaya başlarsınız.

Bu arada hatalarınız üzerine düşüncelerim: Bir kısım insanlar hataların, hata yapmanın kötü olacağını düşünerek, hata yapmamak için yeni olan hiç bir şeyi denemezler. Elbette aynı hatayı tekrar tekrar yapmak biraz aptallığın yada nazikçe dikkatsizliğin belirtisi olsa da, öğrenmeniz sırasında her şeyi berbat etmekten korkmayınız. Sonuçta hatalarınızdan da öğreneceksiniz.
Eğer hiç bir şeyi berbat etmiyorsanız, hiç bir şey öğrenmiyorsunuz, dolayısı ile, büyük bir ihtimalle hiç bir şey yapmıyorsunuz demektir. Biliyorsunuz, her şeyi berbat etmek, öğrenmenin adeta bir yan ürünüdür.

Bu kadar gevezelik yeter artık.

Şimdi sizleri sıkmaya başlamadan bir iki şeyin üzerinden çabucak gidiverelim. Ne diyorduk?
Browser, eğer satırbaşı yapmasını söylemezseniz, yazdıklarınızı düzgün bir metin gibi yazmaya devam eder. Bütün boşlukları da 1 boşluk değerine düşürerek gösterecektir. Eğer arada daha fazla boşluk isterseniz, (&nbsp;) boşluk kodu olarak kullanmanız gerekmektedir. Bahsetmediğim bir nokta:
Eğer, Return (yada Enter) tuşuna basarsanız, browser onu da bir boşluk olarak kabul edecektir..(gerçekten bir boşluk yoksa.)

Hemen şu örneği inceleyin:

<BODY BGCOLOR="#FFFFFF">
Gerçekten<BR>güzel<BR>bir şey<BR>
bir demet<BR>çiçek<BR>gibi!
</BODY>

Gerçekten
güzel
bir şey
bir demet
çiçek
gibi!

Önemli Not:
Hemen Yukarıda gördüğünüz <BR> yani "Line Break", browsere satırbaşı yapmasını söyleyen HTML etiketidir.

Umarım gayet açık seçik olarak demek istediğimi anlatmışımdır...

Bir sonraki anlamı kendinden menkul bir etiket

<BODY BGCOLOR="#FFFFFF">
 <CENTER>Gerçekten güzel bir şey</CENTER>
</BODY>

Gerçekten güzel bir şey

Gördüğünüz gibi ister bir kelime, isterse de tüm sayfanız olsun, <CENTER> etiketinin arasında ne kalırsa, ortalanır. Bitti...

Neredeyse bir kaçtane boş satır yapmayı anlatmasını unutuyordum. Çok kolay, istediğiniz boş satır sayısı kadar, boşluk işaret + satırbaşı etiketi koyunuz.

<BODY BGCOLOR="#FFFFFF">
Gerçekten güzel<BR>
 &nbsp;<BR>
&nbsp;<BR>
&nbsp;<BR>
&nbsp;<BR>
&nbsp;<BR>
bir şeyyyy..
</BODY>

Gerçekten güzel
 
 
 
 
 
bir şeyyyy..

Artık resimlerimizi websayfamıza yerleştirmenin zamanı gelmiş bulunuyor. Şimdi bu resimi kullanacağız, sağ tıklayarak resim klasörüne kopyalayın

Chef

Bir resmi belirtmek için <IMG> (image) etiketini kullanırız.

<BODY BGCOLOR="#FFFFFF">
 <IMG>
</BODY>

Aynı zaman da kaynağını ( src = source ) ve ölçülerini ( size ) belirtiriz.

<BODY BGCOLOR="#FFFFFF">
<IMG SRC="chef.gif" WIDTH=130 HEIGHT=101>
</BODY>

Bir şeyi belirtmeden olmaz. Kaynak yani SRC resmin hangi resim olduğunu belirtirken, aynı zamanda nerede olduğunuda bildirir. Yukardaki SRC, "chef.gif", browserin "chef.gif" adındaki resmi HTML ile aynı directory den yüklemesini belirtiyor (yani resim dosyası ile HTML dosyanız aynı klasörün içinde bulunuyor.)
Aşağıda şemalarla anlatmaya çalıştım (ilk baktığınızda anlamazsanız, gidin kendinize bir kahve yapın, yada mevsim meyvelerinden atıştırın, uykunuz açılsın, tekrar okuyun. Bunların da faydası olmazsa, üzerinde resim olan herhangi bir web sayfasını sağ tıklayıp, kaynağını görüntüleyin, bakın nasıl yapmışlar. yine çözemediyseniz, üzülmeyin, bana da ilk 1-2 sefer böyle olmuştu, bakın şimdi size ders bile veriyorum :-))), gerçekten, anlamadığınız şeyleri hiç dert edinmeyin, nasılsa bir gün öğreniyorsunuz.)

SRC="chef.gif" resmin onu çağıran HTML dökümanı ile aynı klasörde olduğu anlamına gelir.

SRC="images/chef.gif", resmin, onu çağıran HTML dökümanından bir seviye aşağıda başka bir klasörde olduğunu belirtir. Bu daha da ileri seviyelere gidebilir.

SRC="../chef.gif", resmin, onu çağıran HTML dökümanından bir seviye yukarda olduğunu belirtir. (bir itiraf-moraliniz düzelsin diye- bu satırda yazdıklarımı, sayfayı tercüme ettiğim şu ana kadar ben bile bilmiyordum.

SRC="../../chef.gif" resmin, onu çağıran HTML dökümanından iki seviye yukarda olduğunu belirtir

SRC="../images/chef.gif"resmin, onu çağıran HTML dökümanından bir seviye yukarda ve images klasöründe olduğunu belirtir

Diyorum ki:

Siz kafanızı fazla karıştırmayın, web alanınızı da saçma bir hale getirmemek için, bütün resimlerinizi resimler diye bir klasörde toplayın sonrada aşağıdaki formatta bir etiketleme yapın. Hepimizin selameti açısından en uygunu budur. Zaten biz amatörlere bukadarı gerçekten yeterli, hem sonra kim görecek ki directorynizi?

<IMG SRC="resimler/resim_adi.gif" WIDTH=130 HEIGHT=101>


Bu arada bir değişik yoluda resimlerin kaynağının komple bir URL olması. Örneğin, http://www.korfez.net/images/banners/banner_7.gif

 

Bir başka IMG özelliği olan ALT tan da bahsetmeden geçemeyiz....

<IMG SRC="chef.gif" WIDTH=130 HEIGHT=101 ALT="Chef">

ALT resimin yerine kullanılan bir açıklama yazısının bulunmasıdır. Kullanıcının tarayıcı programının resim yükleme özelliği sayfaların hızlı yüklenmesini sağlamak için kapatılmış, yada sadece metin gösteren bir browser kullanıyor olabilir. Bu gibi durumlarda ALT özelliği önemli olabilir.

Gelelim resimlerin SIZE yani ölçülerrine.

Bunu bir deneyin bakalım...

<BODY BGCOLOR="#FFFFFF">
<IMG SRC="chef.gif">
</BODY>

Gördüğünüz gibi, browser bütün işi kendisi yapıyor, tahminen resmi ölçülendirdi ve görüntüledi. O zaman ölçüyle işimiz ne? Detaylara girmezseniz sayfanız daha çabuk yüklenir.

Güzel tarafı nerede? Şuna bir bakın...

<BODY BGCOLOR="#FFFFFF">
<IMG SRC="chef.gif" WIDTH=300 HEIGHT=101>
</BODY>

<BODY BGCOLOR="#FFFFFF">
<IMG SRC="chef.gif" WIDTH=40 HEIGHT=200>
</BODY>

Dileğidiniz ölçüleri yazabilirsiniz, ve esas ölçülerin önüne geçersiniz. Şimdi şu kırmızı noktaya bakın -> <-. 1x1 ölçüsünde bir kare. Bakın onunla neler yapabiliyorum...

<BODY BGCOLOR="#FFFFFF">
<IMG SRC="red_dot.gif" WIDTH=510 HEIGHT=1><P>
<IMG SRC="red_dot.gif" WIDTH=510 HEIGHT=2><P>
<IMG SRC="red_dot.gif" WIDTH=510 HEIGHT=5><P>
 <CENTER><IMG SRC="red_dot.gif" WIDTH=2 HEIGHT=200></CENTER>
</BODY>

Nasıl ama?

 

Birazda Link vermesi (yada köprü de derler) öğrenelim.

Gerçekten çok basit. Örneğin Korfez.net'e bağlanmak için, şunu deneyin...

<BODY BGCOLOR="#FFFFFF">
 Korfeze gidin!
</BODY>

Korfeze gidin!

 

Sonra bir çift anchor etiketi ekleyin.

<BODY BGCOLOR="#FFFFFF">
Korfeze <A> gidin!</A>
</BODY>

Korfeze gidin!

 

Sonra URL'sini ekleyin ve tamam!.. URL (Universal Resource Locator) demektir. URL esasında basit anlamda adres demektir.

<BODY BGCOLOR="#FFFFFF">
Go to <A HREF="http://www.korfez.net/">korfez.net!</A>
</BODY>

Korfeze gidin!

 

Email linki de aynı şekilde çalışır. Sadece sayfa adresi yerine Email adresi kullanırız.

<BODY BGCOLOR="#FFFFFF">
Bana <A HREF="mailto:kemal@webdersleri.com">E-Mail</A> yollayın!..
</BODY>

Bana E-Mail yollayın!..


 

SSS: E-mail mesajının Konu kısmını önceden nasıl doldurabiliriz?
Cevap: Çok kolay, işte aynen böyle:

<A HREF="mailto:kemal@webdersleri.com?subject:bir soru sormak istiyorum!">

...bu şekilde emailinizin konusunu önceden belirlemiş olurunuz, size emaillerinizi okumadan önce yada okuduktan sonra sınıflandırma kolaylığı sağlar.

 

 

SSS: Linklerin altındaki çizgiden nasıl kurtulabilirim?
Cevap: Teknik olarak HTML ile yapamazsınız, fakat Style Sheets kullanarak bunu başarmanız mümkün. Aşağıdaki kodu HTML dökümanınızın <HEAD> </HEAD> etiketleri arasına yerleştirin, sonsuza kadar çizgilerden kurtulun..

<style type="text/css"><!--
a:link, a:visited, a:active {text-decoration: none}
--></style>

 

<HR
 

   

SSS: O çirkin mavi çerçeveden nasıl kurtulabilirim?
Cevap: Basit IMG etiketine BORDER=0 ekleyiniz!...

 

<BODY BGCOLOR="#FFFFFF">
Korfeze <A HREF="http://www.korfez.com/"><IMG SRC="chef.gif" WIDTH=130 HEIGHT=101 BORDER=0></A>
</BODY>

Korfeze

Linkler hakkında bir önemli konu daha... Başkalarının sayfalarına sormadan link verebilirsiniz, zaten webi web yapan da bu değil mi? Bizi nasıl buldunuz sanıyorsunuz? Bu arada hazır link vermesini öğrenmişken, bize de link verirseniz memnun oluruz. Hangi adres mi? Kolay,

<A HREF="http://www.noyabilgisayar.net">En Güzel Web Dersleri</A>
 En Güzel Web Dersleri

Büyük bir merak ve hevesle link derlemeye başlayabilirsiniz, ama sizden ricam, link vereceğiniz siteleri önce bir inceleyin. Çünkü rasgele link verirseniz, yada herkesin bildiği Yahoo, Altavista yada bizden Superonline, Turk.net gibi sitelere verirseniz kimseye çok fazla bir faydanız olmaz. Ama surf yaparken rasladığınız bir çok güzel site vardır, bence onları iyice inceledikten sonra linklerinizin arasına katınız.

Sayfanıza resimler koyarken, unutmatın, sayfanın yüklenme hızı epeyi düşecektir. Resmin kilobyte büyüklüğünü düşürmek için, ölçülerini düşürmek, hatta renk sayısını düşürmek gerekir. Örneğin;

Dimensions 310 x 304
Renk sayısı- 238
Büyüklük - 69 Kb

Dimensions 207 x 203
Renk sayısı- 238
Büyüklük - 34 Kb

Dimensions 207 x 203
Renk sayısı- 48
Büyüklük - 19 Kb

Gördüğünüz gibi, ilk resim, daha büyük, güzel ve kaliteli, fakat şöyle düşünün... resimlerinizi yüklemek, sonsuza kadar sürecekse, ziyaretçileriniz uçup gidecekler ve büyük olasılıkla hiçbir şeyi görmemiş olacaklar, (buna dikkat, sadece resimleri değil, hiçbir şeyi)
Siz bu web sayfalarını insanlar görsün diye yapmamışmıydınız?

Bir diğer opsiyon, eğer birçok resim göstermek istiyorsanız thumbnail görüntülerini sağlayabilirsiniz. Böylece sayfanın yüklenmesi kısa zaman alabileceği gibi, ziyaretçiler de gerçekten ilgi duydukları resimlerin yüklenmesini zaten bekleyecekleri için, hiç bir yere de gitmezler. Thumbnail resimleri tıklayanlar da daha büyük resmin olduğu sayfaya giderler.


Daha büyük resmi görmek için thumbnaili tıklayınız.

İlk yapacağınız şey, resim editörünüzü çalıştırıp (image editör), resimlerinizin daha küçük versiyonlarınızı yapacaksınız. Bu aynı zamanda resmin renk derinliğini de düşürecektir. Resimlerin küçük versiyonunu yapma işlemi çok önemli. Bazı kimseler thumbnail resimler yapma gayretiyle resmin <IMG> etiketindeki ebatlarını küçültüyorlar, bu da herşeyi iç içe sokmaktan başka bir işe yaramıyor. Bütün yapmanız gereken sadece daha küçük bir kopya yapmak, hepsi bu.

Haydi bir tane yapalım, Küçük ve büyük resimleri çalıştığınız klasörün içine koyunuz.

<IMG> etiketinizle başlayınız

<BODY BGCOLOR="#FFFFFF">
 <IMG SRC="car1-sm.gif" WIDTH=90 HEIGHT=62>
</BODY>

 

<A> etiketlerini ilave ediniz.

<BODY BGCOLOR="#FFFFFF">
 <A><IMG SRC="car1-sm.gif" WIDTH=90 HEIGHT=90></A>
</BODY>

 

URL'yi de eklediniz mi, tamamdır!

<BODY BGCOLOR="#FFFFFF">
<A HREF="car1.jpg"><IMG SRC="car1-sm.gif" WIDTH=90 HEIGHT=62></A>
</BODY>

 

Bu arada, isterseniz o mavi çerçeveden kurtulmak için aşağıdaki gibi BORDER=0 şeklinde etiketin içine yazmayı unutmayın.

<BODY BGCOLOR="#FFFFFF">
<A HREF="car1.jpg"><IMG SRC="car1-sm.gif" WIDTH=90 HEIGHT=62 BORDER=0></A>
</BODY>

 

Bir başka link verme şekli ise, bir sayfanın tamamı yerine, yalnızca bir kısmına link vermek. Burayı tıklarsanız, gayet hoş biçimde URL'den ilk bahsetmeye başladığımız kısma gidersiniz. Örnek vermesi zor olduğundan size dilim döndüğünce anlatmaya çalışacağım.

İlk önce insanları yollamak istediğiniz kısımla işe başlayalım. O bölümün ilk cümlesinin ilk kelimesini bulun, ve <A> etiketlerinin içine alınız.

<A>Sonra</A> URL'sini ekleyin ve tamam!

İkinci etapta bir isim (NAME) verin.

<A NAME="yukari">Sonra</A> URL'sini ekleyin ve tamam!

Yaptığınız iş o noktayı işaretlemek oldu. Artık oraya birini yönlendirebilirsiniz.

Şimdi ise gönderen bölümün linkini hazırlayalım.

<A>Burayı</A> tıklarsanız, gayet hoş biçimde

Şimdi de yönlendireceğimiz dökümanı ekleyelim...

<A HREF="ders_4.html">Burayı</A> tıklarsanız, gayet hoş biçimde...

En son olarak ise anchor NAMEi aşağıdaki gibi bağlayın...

<A HREF="lesson04.html#yukari">Burayı</A> tıklarsanız, gayet hoş biçimde...

Tamamı bu kadar; gördüğünüz gibi yüksek matematik bilgisi filan gerektirmiyor değil mi??

Gerçekten buraya kadar epeyi şey öğrendik. Şöööyle bir hafızanızı yoklarsanız, text ve font manipülasyonu, resimler, linkler. İşin temel prensiplerinden bahsedersek daha söylenecek çok şey var (TABLE-FORM-FRAME-CSS dersleride yolda.) Ama siz bu birkaç sayfadan sonra hiç değilse eline yüzüne bakılabilir web sayfaları yapabilirsiniz. Biraz da TABLE ve CSS derslerini okudunuzmu göze hoş gözüken sayfalar yapma devriniz başlar. Bence eğer bu işi amatör seviyede devam ettirmek isterseniz hiç FRAME'lere bulaşmayın. Zaten kimsede mecbur kalmadıkça kullanmanzıı tavsiye etmez (sayfa yüklenme hızı FRAME'li sayfalarda epeyi düşmektedir.

Artık sıra ekran çözünürlüğü (Screen Resolution) konusuna geldi. Hani bir takım sayfalarda en iyi 800x600 yada 1024x768 çözünürlükte izlenir derler ya, o konu işte. Ben şahsen 800x600 ölçüsünü severim, zaten istatistiklerde en popüler çözünürlüğün 800x600 olduğunu gösteriyor. Bunun bu işle ilgisi nedir? diye sorarsanız, cevabı:
Çok önemli olduğudur. Çünkü sayfanızın insanlara nasıl göründüğünü ilgilendirmektedir. Aşağıda bir sayfanın her üç çözünürlükte görünümünü vermektedir. Sanırım farkı biraz değerlendirirsiniz.

640×480

800×600

1024×768

Sayfanızı tüm çözünürlüklerde kontrol etmek çok iyi bir fikirdir. Çünkü saatler süren çalışmalar ve yerleştirmeler sonunda websitenizi Upload edersiniz ve 10-15 gün sonra diyelim 17 inç ekranda 1024×768 çözünürlükte çalışan arkadaşınızın bilgisayarından düzgün görüntülenmeyebelir.

Bundan dolayı, yalnız diğer çözünürlüklerde değil, başka ekran büyüklüklerinde de kontrol edin; 14-15-17-19 inç ekran, Notebook, WebTV filan, aklınıza gelen herşey.

Şimdi biraz da, kullanabileceğiniz formatlama araçlarından anlatalım. Birincisi <BLOCKQUOTE> 'dur. Bir çok browserlerde marjinlerinizi içeriye çeker (Tam doğru terimi bulamadım, sanırım yaklaşık olarak anlatabildim.) Şimdi hemen yukarda ki paragrafa uygulayalım ve bir web sayfasında olsa nasıl olurdu, hemen aşağıda izleyin.

<BODY BGCOLOR="#FFFFFF">
 <BLOCKQUOTE>
Ben şahsen 800x600 ölçüsünü severim, zaten istatistiklerde en popüler çözünürlüğün 800x600 olduğunu gösteriyor. Bunun bu işle ilgisi nedir? diye sorarsanız, cevabı:
Çok önemli olduğudur. Çünkü sayfanızın insanlara nasıl göründüğünü ilgilendirmektedir. Aşağıda bir sayfanın her üç çözünürlükte görünümünü vermektedir. Sanırım farkı biraz değerlendirirsiniz.
 </BLOCKQUOTE>
</BODY>

 

Ben şahsen 800x600 ölçüsünü severim, zaten istatistiklerde en popüler çözünürlüğün 800x600 olduğunu gösteriyor. Bunun bu işle ilgisi nedir? diye sorarsanız, cevabı:
Çok önemli olduğudur. Çünkü sayfanızın insanlara nasıl göründüğünü ilgilendirmektedir. Aşağıda bir sayfanın her üç çözünürlükte görünümünü vermektedir. Sanırım farkı biraz değerlendirirsiniz.

 

Bir başka kullanışlı araç, LIST özelliğidir. ORDERED list'ler ve UNORDERED list'ler vardır.

Bu ordered list örneğidir

1.       Büyük bir şey

2.       Küçük bir şey

3.       Kısa bir şey

4.       Uzun bir şey

 

Bu da unordered list örneği

  • Kırmızı
  • Mavi
  • Eski
  • Yeni

Önce bir taneUNORDERED list yapalım. Gerçekten çok basittir.

Şööyle başlayın

<BODY BGCOLOR="#FFFFFF">
 Karnemi alınca istediklerim!.
</BODY>

Karnemi alınca istediklerim!.


Not- teknik olarak henüz listeyi yapmaya başlamadık, bu sadece başlık.

Unordered list etiketlerini ekleyin

<BODY BGCOLOR="#FFFFFF">
Karnemi alınca istediklerim!.
 <UL>
 </UL>
</BODY>

Karnemi alınca istediklerim!.

 

Liste maddesi ekleyin.

<BODY BGCOLOR="#FFFFFF">
Karnemi alınca istediklerim!.
<UL>
 <LI>kırmızı bir bisiklet
</UL>
</BODY>

Karnemi alınca istediklerim!.

  • kırmızı bir bisiklet

 

Bir kaç tane daha ekleyin...

<BODY BGCOLOR="#FFFFFF">
Karnemi alınca istediklerim!.
<UL>
<LI>kırmızı bir bisiklet
 <LI>bir sürat teknesi
 <LI>bir PC
 <LI>bir TV
 <LI>bir de Melanie Griffith
</UL>
</BODY>

Karnemi alınca istediklerim!.

  • kırmızı bir bisiklet
  • bir sürat teknesi
  • bir PC
  • bir TV
  • bir de Melanie Griffith


İşte Liste dediğin de böyle olmaz mı?!

Pekiii ordered list'i nasıl yapacağım? Kolay! <UL> etiketini <OL> olarak değiştirin.

<BODY BGCOLOR="#FFFFFF">
Karnemi alınca istediklerim!.
 <OL>
<LI>kırmızı bir bisiklet
<LI>bir sürat teknesi
<LI>bir PC
<LI>bir TV
<LI>bir de Melanie Griffith
 </OL>
</BODY>

Karnemi alınca istediklerim!.

1.       kırmızı bir bisiklet

2.       bir sürat teknesi

3.       bir PC

4.       bir TV

5.       bir de Melanie Griffith

 

Başka bir liste tipi ise definition list'tir.

Rüştü Rençber

Fenerbahçe'nin kalecisi olup, aynı zamanda Milli takımında kalesini korumaktadır. Arasıra aptalca goller yeme huyu ortaya çıksa da, 2001 yılında diğer yıllara göre daha az saçmaladığından, Fener sonunda şampiyon oldu.

Taffarel

Galatasaray'ın son bir kaç sezondur file bekçiliğini yapan Taffarel, aynı zamanda Brezilya Milli takımının da kalecisidir. Türkiye'yi çok seven Taffarel bu sene memleketine dönecekmiş.

Hadi başlayalım...

<BODY BGCOLOR="#FFFFFF">
 <DL>
 </DL>
</BODY>

Sonra definition başlığını atınız...

<BODY BGCOLOR="#FFFFFF">
<DL>
 <DT>Rüştü Rençber
</DL>
</BODY>

Rüştü Rençber

 

Definition maddesini yazınız.

<BODY BGCOLOR="#FFFFFF">
<DL>
<DT>Rüştü Rençber
<DD>Fenerbahçe'nin kalecisi olup, aynı zamanda Milli takımında kalesini korumaktadır. Arasıra aptalca goller yeme huyu ortaya çıksa da, 2001 yılında diğer yıllara göre daha az saçmaladığından, Fener sonunda şampiyon oldu.
</DL>
</BODY>

Rüştü Rençber

Fenerbahçe'nin kalecisi olup, aynı zamanda Milli takımında kalesini korumaktadır. Arasıra aptalca goller yeme huyu ortaya çıksada, 2001 yılında diğer yıllara göre daha az saçmaladığından, Fener sonunda şampiyon oldu.

 

Rötuş olarak, başlığı kalınlaştırıp, altına da Taffarel'i yerleştirdik mi listemiz biter.

<BODY BGCOLOR="#FFFFFF">
<DL>
<DT><B>Rüştü Rençber </B>
<DD>Fenerbahçe'nin kalecisi olup, aynı zamanda Milli takımında kalesini korumaktadır. Arasıra aptalca goller yeme huyu ortaya çıksa da, 2001 yılında diğer yıllara göre daha az saçmaladığından, Fener sonunda şampiyon oldu.
</DL>
</BODY>
<DL>
<DT><B>Taffarel </B>
<DD>Galatasaray'ın son bir kaç sezondur file bekçiliğini yapan Taffarel, aynı zamanda Brezilya Milli takımının da kalecisidir. Türkiye'yi çok seven Taffarel bu sene memleketine dönecekmiş.
</DL>
</BODY>

Rüştü Rençber

Fenerbahçe'nin kalecisi olup, aynı zamanda Milli takımında kalesini korumaktadır. Arasıra aptalca goller yeme huyu ortaya çıksa da, 2001 yılında diğer yıllara göre daha az saçmaladığından, Fener sonunda şampiyon oldu.

Taffarel

Galatasaray'ın son bir kaç sezondur file bekçiliğini yapan Taffarel, aynı zamanda Brezilya Milli takımının da kalecisidir. Türkiye'yi çok seven Taffarel bu sene memleketine dönecekmiş.

 

Gelelim çok sık kullandığımız Horizontal Rule (yani Ufki Hat-eski Türkçe) yani düz çizgi. Bunu gerçekten çok sık kullanırız.

<BODY BGCOLOR="#FFFFFF">
 <HR>
</BODY>

 

 

Birkaç tane opsiyonumuz vardır.

<BODY BGCOLOR="#FFFFFF">
<HR WIDTH=20%>
<HR WIDTH=50%>
<HR WIDTH=100%>
<HR WIDTH=20>
<HR WIDTH=50>
<HR WIDTH=100>
</BODY>

 

 

 

Bunun anlatımı kendinden menkul..

<BODY BGCOLOR="#FFFFFF">
<HR WIDTH=60% ALIGN=LEFT>
<HR WIDTH=60% ALIGN=RIGHT>
<HR WIDTH=60% ALIGN=CENTER>
</BODY>

 

 

Aynı zamanda kalınlığı da kontrol edebilirsiniz...

<BODY BGCOLOR="#FFFFFF">
<HR WIDTH=60% SIZE=1>
<HR WIDTH=60% SIZE=3>
<HR WIDTH=60% SIZE=8>
<HR WIDTH=60% SIZE=15>
</BODY>

 

 

İçi dolu, tek bir çizgi de yapabilirsiniz

<BODY BGCOLOR="#FFFFFF">
<HR WIDTH=60% SIZE=1 NOSHADE>
<HR WIDTH=60% SIZE=3 NOSHADE>
<HR WIDTH=60% SIZE=8 NOSHADE>
<HR WIDTH=60% SIZE=15 NOSHADE>
</BODY>

 

 

Hatırlarsınız, geçmişte bir yerde, browserin formatlamayı anlamadığını, sadece metni peşpeşe yazdığını söylemiştim, aynen bu şekilde...

<BODY BGCOLOR="#FFFFFF">

                 \|/ 
                 (@ @)
     +----oOO----(_)-----------+
     |       HTML DERSLERİ     |
     |          herkese        |
     |          lazım          |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo

</BODY>


\|/ (@ @) +----oOO----(_)-----------+ | HTML DERSLERİ | | herkese | | lazım | +-----------------oOO-----+ |__|__| || || ooO Ooo

 

Eveet, <PRE> (preformat) etiketleriyle, bunu engelleyip, metnin yazdığımız şekilde görünmesini sağlarız.

<BODY BGCOLOR="#FFFFFF">
 <PRE>

                 \|/ 
                (@ @)
     +----oOO----(_)-----------+
     |       HTML DERSLERİ     |
     |          herkese        |
     |          lazım          |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo

</PRE>
</BODY>

 

                 \|/ 
                (@ @)
     +----oOO----(_)-----------+
     |       HTML DERSLERİ     |
     |          herkese        |
     |          lazım          |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo


* Dikkat, monospaced font kullanılmıştır.


SSS :kardeşim, bunlar çocuk işi, bizim böyle soytarılıklara ayıracak vaktimiz yok (çocuklar, alınmayın, ama 20 yaşın üstündeki herkes böyle söyler.)

Cevap: Biraz hayal gücünüzü kullanın bakalım, hadi, söylemezsem duramam, <PRE></PRE> etiketlerini kullanarak bir de şiir yazmayı deneyin bakalım, yada şöyle diyelim, önce bir iki kıt'a Orhan Veli'den yazın, neye benziyor, sonra da her şeyi yeniden <PRE></PRE> etiketlerini kullanarak yazın.

En son yorum etiketini tartışacağız.

<BODY BGCOLOR="#FFFFFF">
 <!--Bu bir yorumdur-->
Bu değildir<P>
Yorumlarınızı dökümanın herhangi bir yerine koyabilirsiniz ve browser de içindeki hiçbirşeyi değerlendirmesine almaz. Gizli mesajlar koyabilirsiniz <!--Selam abicim!--> kendinize notlar olabilir, <!--Akşam ekmek al--> yada önemlisi, sayfanızın kaynak koduna bakan birine yardımcı olabilecek bir mesaj olabilir .<!--Bu sayfadan araklama yapanınnn&%Ç£#$!-->
</BODY>

Bu değildir

Yorumlarınızı dökümanın herhangi bir yerine koyabilirsiniz ve browser de içindeki hiçbirşeyi değerlendirmesine almaz. Gizli mesajlar koyabilirsiniz kendinize notlar olabilir, yada önemlisi, sayfanızın kaynak koduna bakan birine yardımcı olabilecek bir mesaj olabilir .


Herşeyin açıkça anlaşılması için, yorum <!-- ile başlamalı -->ile bitmeli
Yorumun için başka HTML etiketleri koysanız bile, browser onları dikkate almaz. Browseriniz taaa ki --> işaretini görene kadar herşeyi atlar.

İster inanın, ister inanmayın ama bitti.

İletişim İçin

0212 238 99 32

Uzaktan Yardım

Onparmak İstatistikleri

BİLGİSAYAR
İŞLETMENLİĞİ KURSU
 Salı-Prşmb / 20:00-22:00
 10.04.2012'da başlıyor

BİLGİSAYARLI
MUHASEBE KURSU

C.tesi-Pzr / 17:00 - 20:00
 28.04.2012'da başlıyor

WEB TASARIM KURSU

C.tesi-Pzr / 16:00-18:00
 18.02.2012'da başlıyor

DONANIM KURSU

P.tesi-Çrşm / 20:00-22:00
 19.03.2012'da başlıyor

ONPARMAK KURSU

C.tesi-Pzr / 14:00-18:00
 28.01.2012'da başlıyor

Diğer Gruplarımızın Başlama Tarihleri için Lütfen İletişim Kurun...

Aktif Zyartçi

 2
Bugün47
Ayrıntı

Bilgisayar Kursu, Muhasebe Kursu, Bilgisayarlı muhasebe Kursu, Donanım Kursu, Web Tasarım Kursu, on parmak klavye kursu, bilgisayar kursları, bilgisayar ve muhasebe kursu, on parmak kursu, 10 parmak klavye kursu, okmeydanı bilgisayar kursu, beyoğlu bilgisayar kursu, istanbul bilgisayar kursu, istanbulun en iyi bilgisayar kursu, bilgisayar tamircisi, bilgisayar servisi, okmeydanı bilgisayar tamircisi, okmeydanı bilgisayar servisi,  bilgisayar sertifikası, bilgisayar işletmenliği sertifikası, meb onaylı bilgisayar sertifikası, muhasebe sertifikası, meb onaylı sertifika, web tasarım, güvenlik kamerası, alarm sistemleri, kamera ve güvenlik sistemleri,  Nokta yayılım bilgisayar kursu, noya bilgisayar kursu


Hakkımızda ki düşüncelerinizi bizimle paylaşmak ister misiniz?                                    
 

Adınız, Soyadınız:                E-posta Adresiniz:
Mesajınız:

Online Destek

neslihan      ( 13.02.2012 - 22:05:50 )
bilgisayar işletmenliği kursumu tamamladım,sınava girdim çıktım herseyden memnun kaldım Tuğba hocama çok teşekkür ederim.Herkese tavsiye ediyorum.bilgisayar kullanmayı sıfırdan baslayıp her yastan insana eğitim durumu ne olursa olsun öğretebiliyorlar.


ozan ışık      ( 14.01.2012 - 01:02:15 )
Buradan bakım onarım kursu kursu aldım uşaktan katıldım çok ama çok memnun kaldım herşey çok ama çok güzel her konuda çok yardımcı oluyorlar sonuna kadar güvenebileceginiz bir kurum nevzat hoca çok iyi ve çok başarılı eşide çok iyi bir insan çok yardımcı oluyorlar herkeze bu kurumu sonuna kadar tavsiye ediyorum


Mehmet Gündoğdu      ( 10.12.2011 - 15:38:41 )
ben bu kurumda bilgisayarlı muhasebe derslerine katıldım çok memnun oldum, teşekkür ediyorum.


beyza      ( 10.11.2011 - 18:56:19 )
bize bunu verdiğiniz için çok teşekkür ederim


Hatice Yıldırım      ( 25.09.2011 - 17:53:51 )
bilgisayarlı muhasebe kursuna katıldım çok memnunun, buradan bütün yetkili ve sorumlulara teşekkürlerimi iletmek istiyorum...


Merve Soytürk      ( 25.09.2011 - 16:33:15 )
Ben bu kursta bilgisayar ve on parmak derslerine katıldım çok memnun kaldım, Web Tasarım kursunada katılmayı düşünüyordum, herkese tavsiye ederim...


Sayfa: 1

 

İlgili Kelimeler

Bilgisayar Kursu, Muhasebe Kursu, Bilgisayarlı muhasebe Kursu, Donanım Kursu, Web Tasarım Kursu, on parmak klavye kursu, bilgisayar kursları, bilgisayar ve muhasebe kursu, on parmak kursu, 10 parmak klavye kursu, okmeydanı bilgisayar kursu, beyoğlu bilgisayar kursu, istanbul bilgisayar kursu, istanbulun en iyi bilgisayar kursu, bilgisayar tamircisi, bilgisayar servisi, okmeydanı bilgisayar tamircisi, okmeydanı bilgisayar servisi,  bilgisayar sertifikası, bilgisayar işletmenliği sertifikası, meb onaylı bilgisayar sertifikası, muhasebe sertifikası, meb onaylı sertifika, web tasarım, güvenlik kamerası, alarm sistemleri, kamera ve güvenlik sistemleri,  Nokta yayılım bilgisayar kursu, noya bilgisayar kursu