.png)
Giriş
Merhabalar değerli okurlar bu yazımızda sizlere wep tasarım ve bir sayfa oluşturmadan önce edinmeniz gereken bilgilerden bahsedeceğiz. Tabiyki bir site görselden ibaret değildir. Arkada çalışan kodlar vardır, bu kodları yazmak içinde programlama diline ihtiyacınız vardır yani sadete gelecek olursak Html (Hyper text markup language) işaretleme dilinede değinmiş olacağız.Temel İlkeler.
⦁ İçerik
Baştan başlamak gerekirse tasarlığacağınız ve kodlayacağınız sitenin içeriğini bilmemiz çok önemlidir. Sitenin içeriğini bilmemiz bizim web sitemizi tasarlarken kolaylık sağlayacak en büyük etkenlerdendir.⦁ Tasarım
Web sitemizin içeriklerini yayınlayacağımız sitenin tasarımı gerçekten oturup düşünüp plan yapmanız gereken bir kısımdır. Renkler logonun nerede duracağı vb. şeylerin düşünüldüğü bu kısım en önemli noktalardan birisidir. Tasarım yaparken önce boş bir A4 kağıdına aklınızdaki siteyi tasarlamanız önerilir. Sonrasında bir grafik programının yardımıyla site görsellerini oluşturmak veya direk kodları yazıp bir site ortaya çıkarmak yararınıza olur. Sorun şu ki tasarım kısmı epey meşakatlidir sebebi ise hitab edeceğiniz kiteleye göre bir tasarım oluşturmak ve renkleri doğru kullanabilmek önemlidir.⦁ İşlevsellik
İşlevsellik aslında şu anlama geliyor, yapcağımız sitenin anasayfasından oluşturduğmuz içeriklerin nerdeyse hepsine ulaşabiliyor olmamız işlevselliğin güzel kullanılması oluyor. Bunuda Menü ve katakorilere ayırarak kolayca yapabiliriz. İşlevselliğin önemi şu yaptığımız içeriklerin örnek vermek gerekirse bir blog sitesinin makalleri veya içeriklerine ulaşmak için ya arama motorları yada bir kullanıcının sitemizi ziyaret etmesi sonucu olan bir şey olması gerekir bu durumda 1.durum herzaman olmayacğına göre içeriklerimizin site içerisinde kolayca ulaşılabilir olması gerekir.⦁ Kullanılabilirlik
Dostlar web sitemiz sonucta sizin benim gibi insanların kullancağını unutmayın. Önce bir kendinize sorun ben bu siteyi kolayca kullanbilirmiyim yani bu hazırlayacağınız site hızlımı içerikler görseller güzel ölçeklenmişmi gibi , sonrasında bahsettiğimiz menüyü (katagoriyi) kullanıcın kolay bulabileceği bir yere koymanız kullanılabilirliği artırır, en başa veya banner-logo (Üst) kısmının üstüne veya altına koymanız yeterli olacaktır, detaylı düşünürsek sitenin en alt kısmınada koyulabilir. Wep sitemizin içeriği fazla ve menülerin yeterli gelmediğini düşündüğünüzde bir site içi arama kısmı koyabilirsiniz.Html Giriş
⦁ Neden Html
Html (Hyper text markup language) web sayfalarını ve ufak index dediğimiz sayfaları oluşturmak için kullanılan bir işaretleme dilidir. Web yazılımcıları tasarımcıları genellikle başta html öğrenirler, nedeni ise html bir sürü işleve girer ve diğer bazı diller html'den yardım alınarak yazılabilirler. Html tarihi çıkışı falan veya eski sürümler yeni sürümler bunlardan bahsetmiyeceğiz. Yani bizim tavsiyemiz her zaman başlangıçta Html ile "hello word" (Ne demek istediğimi birazdan anlayacaksınız) demeniz.⦁ Başlangıç ve Basit Kodlar
Bundan sonraki yazılarımızda biraz daha fazla görsel kullanarak ilerliyeceğiz, nedeni ise sizlere daha iyi bir aktarım yapabilmem. Html kullanabilmek şöyle bir şey yazabilmek ve çalıştıra bilmek için programa ihtiyaç duymassınız, direk başlayıp kodlaya bilirsiniz.Bizde aynen böyle yaparak bir Not Defteri açıp yazmaya başlayacağız. Bunun için bir editör de kullanabilirsiniz.
Arama bölümünden Not defteri yazıpta bulabilirsiniz.
Bir şekilde ulaştık diyelim, sonrasında boş sayfaya yazmaya başlıyoruz.
Html - Head - Title - Body
Ana tag (Etiket)'lerimize ulaştık ve bundan sonrasında bir sayfa oluştura bileceğiz. Detaylı bir etiket açıklaması yapmayacığım ama detay bulabileceğiniz bir yer biliyorum. Ben daha çok şu anda başlangıç olarak ilerliyorum ve neyle karşılacağımızı göstermek istiyorum. Direk olarak etiketleri vermiş olsam bile şunları iyi kavramanız gerkmekte etiketler <> büyüktür ve küçüktür işaretleri arasına yazılır. Kodların tamamı ise html etiketi içine yazılır. Yazılan her etiket kapatılmalıdır.
Diğer etiketlerden başka bir zaman bahsedeceğimiz için ana etiklerin ne işe yaradığına bakalım. Basitece head kafa bölümü , body vucut veya içerik kısmıdır. Şimdi bir ufak bir sayfa yapalım.
Resimde Gözüken kodları kendi not defterimize yazalım. Sonrasında burası önemli
Ctrl+shift+s veya farklı kaydet diyoruz.
Kaydedeceğimiz yeri seçtikten sonra Yeni Metin Belgesi.txt yazan kısmı deneme. html olarak değiştirmemiz gerekmekte
Bu işlemi yaptıktan sonra kaydediyoruz ve kaydettiğimiz yerde dosyamız ya taraycı şeklinde yada belge şeklinde çıkar. Bu işlem sonucunda yapmamız gereken şey
Birlikte aç deyip > başka bir uygulama sec dememimiz gerekiyor ve tarayıcımızı veya kodlarımızı düzenlemek için editörümüzü (Notdefteri) bu şekilde açabiliriz.
Biz burdan yazdığımız kodları görmek için tarayıcıda açıyoruz.
Evet dostlar gördüğünüz gibi yazdığımız kodları bu şekilde görüntüleyebiliriz.
Bugün Web tasarımın ve web tasarımın ilkelerini gördük umarım işinize yarar, yorumlarınızı ve desteklerinizi bekliyoruz.