Bu Ders FrontPage ile Anlatilmistir!
Ilk olarak web tasarimin temeli olan html yi ögrenmemiz gerekiyor. Cogu kisi bilsede bilmeyenler vardir diye düsnüyorum...
Herseye sifirdan basliyacagiz ki hic bilmeyenler bile ögrensin , hem yazılı hem resimli anlatacagim iyi anlasabilmesi icin...
Ilk Olarak HTML ´nin Yapisini Inceleyelim
Ilk olarak head kodlarinin arasina koyabilecegimiz bazi kodlara bakalim.
Koyabilecegimiz bir cok kod var. Ancak ben size bazilarini örnek olarak gösterecegim...
Temel Meta Tag’lar
Meta Tag Nedir?
Meta taglar (meta etiketler), arama motorlarina web sayfalari hakkinda bilgi vermek icin kullanilir.
Sayfanın basligi, tanimi, hangi bilgileri icerdigi, hangi anahtar kelimeleri icerdiği ve benzeri bilgiler meta taglar ile belirtilir.
Arama motorlarinin örümcekleri web sayfalarini kategorilere ayirarak kaydetmek icin ziyaret ettiginde, bilgi toplamak icin önce meta taglara bakar.
Eger web sayfasina meta tag eklenmisse, örümcekler sayfa hakkinda bilgileri daha kolay toplayiıp, sayfayi daha kisa sürede ilgili kategoriye ekleyebilir.
Böylece ilgili kategoride arama yapildiginda, kaydedilen sayfalar arama sonuclarında yer alir.
Title Meta Tag
<title>Sitemizin İsmi</title
Bu kodu yazdigimiz zaman (sitemizin ismi yazan yeri kendimize göre degistiriyoruz) internet tarayicisinin en üstteki yazisi ve arama motorlarinda sitemizin basligi olarak görülür.
Description Meta Tag
<meta name="description" content="Sayfamizin Tanimi">
Bu tag, sitemizi tanimlamak icin kullanilir. Description Tag ile sayfa icerigi 2-3 cümle ile kisa ve öz bir sekilde aciklanir. Arama motorlarindaki sayfa icerigi bu tag ile belirtilir.
Keywords Meta Tag
<meta name="keywords" content="meta tag,meta taglar,meta etiketler,meta tag oluşturma">
Bu tag sitemiz ile alakali olan anahtar kelimeleri yazacagimiz tagdir. Sitemizin icerigi hakkinda ipucu verecek kelimeler buraya yazilir.
Buraya cok fazla kelime yazmak yerine, az sayıda ama sitemizi en iyi sekilde ifade edebilecek kelimeleri giriyoruz.
Buraya yazacagimiz kelimelerin sayfa icerisinde gecmis olmasina dikkat edelim.
Robots Meta Tag
meta name="robots" content="index,follow">
Bu tag, sitemize giren arama motoru robotlarinin ne yapmasi gerektigi belirler. İndex ve follow komutlari botlara sayfayi kaydetmelerini ve diger sayfalara olan baglantilari takip etmelerini söylüyor.
Bu tagi gören robotlar sayfayi kaydedecek ve baska sayfalara link verilmisse oraya gidecektir.
Evet arkadaslar, web sitelerimiz icin en önemli
meta taglari tanimis ve ögrenmis olduk. Artik kendi sayfalarimiz icin meta taglar olusturabiliriz.
Bunun icin asagidaki anlatmis oldugum meta taglarg kullanabilirsiniz.
<title>Sayfa Basligi</title>
<meta name="description" content="Sayfa Tanim">
<meta name="keywords" content="Anahtar Kelimeler">
<meta name="robots" content="index, follow">
Meta Tagları Siteye Nasil Ekleyecegiz
<html>
<head>
Meta Taglari buraya ekleyecegiz.
</head>
</html>
Link , Img Icin Kodlar
Simdiki konumuz tablolar. Umarim iyi bir anlatim olmustur. Tablolarla ilgili temel bilgileri anlattim.
_______________________________________________________________
Html de deginmedigimiz bazi noktalar var. cok önemliseyler degil ama bilmeyenler icin iyi olur. Ben bir kac tanesini burada anlaticam. Gerisinide siz bulursunuz artık
.
Marquee
Ben her kodu göstermedim. Daha hangi yöne kaymasini belirliye bilecegin kodlar gibi kodlar var. Ancak bunlari size Birakiyorum
Liste
Ul, Li
Bunlara daha alt basliklarda eklenebilir..
Ol, Li
Bunun Ul den farki madde işaretlerini kendiniz belirliyebilmenizdir.
Dl
Bu kodda da gördügünüz gibi basliklar yada icerik girintili oluyor
Ben size temel html bilgilerini verdim. Artik bunlari harmanlayip güzel seyler ortaya cıkarmak size kalmıs.
Artık sanıyorumki html bitti. Aklıma geldikce arada html ile ilgili pratik bigiler verecegim yine.
WebTasarim Dersimize Gecebiliriz Artik )
Artik HTML konusunda bilmemiz gereken temel kodları ögrendigimizi düsünüyorum.
Bir web sitesi yaratmanın zamanı geldi Bu dersimizde şimdiye kadar anlatmıs oldugum tüm bilgileri toplayarak HTML bir web sitesi olusturacagız. Hazırsak baslayalım...
Ilk olarak
meta tag’lardan baslayalim.
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">
<meta name="description" content="Buraya Sayfamizin Tanimini Yapacagiz.">
<meta name="keywords" content="Buraya sitemiz ile ilgili anahtar kelimeleri yazacagiz.">
<meta name="robots" content="index,follow">
<title>Sayfamizin Ismi</title>
Bu kodlari sayfamizin
<head> </head> taglari arasina ekleyelim.
________________________________________
Simdi
<body> </body> taglarina gecelim. Bu iki etiketin arasına icerigimiz eklenecek. Normal Görünüm’e gecelim ve
yukarada menude
Table butonuna tiklayip asagidaki resimde gosterdigim yere tikliyorsunuz.
___________________________________________
Daha sonra asagidaki ayarlari uygulayalim
_____________________________________________
Ortaya böyle bir görüntü cikacaktir.
Sayfada herhangi bir yere sag tiklayalim ve
Page Properties girelim. Buradan
Formatting gecelim ve arka plana resim koyacaksak Arka Plan secenegini secelim ben
Colors sectim siz resimde secebilirisinz
Background picture secip.
________________________________________
Simdi tablonun ilk hücresine logo, onun altina menü, onun altina icerik ve son olarak bilgiler icin kullanacagimiz bölümü yerlestirecegiz.
Logomuzu sürükleyerek yada yukaridaki images butonundan secerek ilk hücreye koyalim Logomuzun genisligi, hücremizin genisligine esit olsun.
Simdi logomuzun altindaki hücreye gecelim. Burada menümüz bulunacak. Bu hücrenin icinde herhangi bir yere sag tiklayip
Split Cells secenegini secelim. Ayarlar resimdeki gibi olsun.
________________________________________
Simdi hücre 5 bölüme ayrildi, siz isterseniz bunu daha fazla bölüm de ayirabilirsiniz.
________________________________________
Her bir bölüme menümüz icin kullanacagimiz buton resimlerimizi ekleyelim.
ekledigimizde boyle olacak menumuz
______________________________________
Simdi bu butonlara link verecegiz. Buton icin kullanacagimiz resmi secip sag tikliyoruz ve
Hyperlink secenegini seciyoruz.
______________________________________
Karşımıza aya tablosu çıkacaktır.
Burada sayfamizin bulundugu klasörün icinde, yönlenmesini istedigimiz
sayfayi var ise bulup seciyoruz Yok ise asagida
Adress yazan bolume linki yazip Tamam butonuna basiyoruz.
Simdi bu islemleri tüm butonlar icin uyguluyoruz. Yalniz her seferinde o butonun yönlenmesini istedigimiz sayfayi seciyoruz yada link veriyoruz.
________________________________________
İcerik bölümüne gecelim. Buraya sayfamizda yayinlamak istedigimiz resimleri, yazilari vs. ekleyebiliriz ama ben buraya flatcast radyo koymayi gostecegim.
benim yaptiklarimin aynisi yaptiysaniz asagida
Code yazan yere girip linklerin bitisinde boyle
<td colspan="6" height="620"<body> yazar o kod bitisine radyo kodumuzu yapistiriyoruz.
__________________________________________
Son olarak Imzamizi atiyoruz yada bilgilerimizi yaziyoruz.
bunuda yapmis oldumuz resimi surukleyip koyabiliriz yada yukardaki menude gosterdigim picture butonu ile de ypabiliriz.
Onizleme : http://erbil.bplaced.net/turuncu
Dersimiz Bitti 
Alıntı sahibi ""beyaz_gülümm""
merhaba arkadaşlar ben yeni bir site actım buraya radyo ekledim. hersey yolunda fakat söyle bir sorun var. eklemis oldugum linkler yani dj girisi olsun diger kısımlar olsun bunlara tıkladıgım zaamn ayrı bir sayfada acılmıyor yine o sayfa icerisinde acılıyor. bu konuda yardım ederseniz sevinirim. :blink2: merhaba arkadaşlar ben yeni bir site actım buraya radyo ekledim. hersey yolunda fakat söyle bir sorun var. eklemis oldugum linkler yani dj girisi olsun diger kısımlar olsun bunlara tıkladıgım zaamn ayrı bir sayfada acılmıyor yine o sayfa icerisinde acılıyor. bu konuda yardım ederseniz sevinirim.
