Web Tasarım

Site tasarımı yaparken bazen iç içe geçmiş birçok kategori bulunabilir, böyle durumlarda açılır menü kullanmak kullanıcıların aradığını daha rahat bulmalarını sağlar. Bu dersimizde sadece html ve css kullanarak dikey bir açılır menü yapacağız. Her ne kadar yeterli html ve css bilginiz olsa da, açılır menüler çok fazla kullanılmadığı için bir …

Title etiketi web sayfasının başlığını belirten bir html etiketidir ve Seo açısından çok önemli bir kriterdir. Arama motorlarında arama yapıldığında ortaya çıkan sonuçlardan (SERP) ziyaretçiler istediklerine tıklayarak sitelere ulaşırlar. Bu nedenle arama motorları için başlık etiketi SERP’i etkileyen en önemli faktördür. Bu yazımda title etiketinin en doğru şekilde nasıl belirlenmesi …

Css derslerimize kaldığımız yerden devam ediyoruz, bu dersimizde CSS ile Text ve Font özelliklerini anlatmaya çalışacağım. Öncelikle bu derste sıklıkla css seçicileri kullanacağımızı belirtmek isterim. Eğer bu konuyla ilgili yeterli bilgi sahibi değilseniz …. Konulu derse göz atmanızı tavsiye ederim. CSS ile Font ve Text Özellikleri Burada tüm text ve …

Css eğitim serisinin ilk dersinde css nedir, niçin css kullanmalıyız, yazım kuralları ve kodları nereye yazacağız konularına değinmiştik. Bu dersimizde ise css seçicileri (selectors) ve seçicilerin gruplanması konularına değineceğim. Öncelikle bir css kodunun neye benzediğini kısaca hatırlayalım. Yukarıda ki resimde de görüldüğü üzere h1 ile belirtilen kısım css seçicisidir. Seçici …

CSS, kısaca web sayfalarında kullanılan html elementlerinin ekranda nasıl görüneceğini tanımlamak için kullanılan stil kodlarıdır. İngilizce Cascading Style Sheet kelimelerinin baş harflerinden bu kelime ortaya çıkmıştır. Günümüzdeki web sayfalarının bu denli geniş bir tasarım yelpazesine sahip olmasın da CSS’in payı büyüktür. Niçin CSS Kullanmalıyız? CSS tasarımcıya büyük ölçekte zaman kazandırır. …

Html derslerimizin altıncısı olan form oluşturma işlemleri ile devam ediyoruz. Eğer önceki dersleri takip etmek istiyorsanız html dersleri linkinden faydalanabilirsiniz. Formlar kullanıcının web sitesiyle etkileşime girmesi açısından önemlidir. Etkileşime girmek derken site içerisinde arama yapma, yazılara yorum ekleme, kullanıcı girişi yapma, resim veya dosya ekleme gibi işlemlere diyoruz. Formlar olmasaydı sayfalar sadece …

Html derslerimizin beşincisi olarak listeleme etiketlerini düşündüm. Listeleme etiketleri derken kelime işlemci programlarında aşina olduğunuz sıralı liste ve madde işaretli listeler htmlde de sıklıkla kullanılır. Bu etiketler verilerin düzgün şekilde gösterilmesinin yanında her türlü menünün (yatay,dikey ve açılır menü) yapısında da temel taş olarak yer alırlar. <ol>, <ul> ve <li> …

Günümüzde bir çok web sitesinin anasayfasında rastladığımız, yeni eklenen içeriklerin hızlı ve dikkat çekici şekilde görüntülenmesini sağlayan slider yapımını anlatacağım. Sliderimızı oluşturmak için bir adet html sayfamız, slideri görselleştirmek için css dosyamız ve etkileşimi sağlamak içinse javascript dosyasına ihtiyacımız olacak. Bu dosyaları oluşturduğunuzu varsayarak direk kodlara geçiyorum. index.html dosyası içindeki head kısmında …

Html derslerine uzun bir aradan sonra kaldığım yerden devam etmek istiyorum. Bugün html ile tablo oluşturmak için gerekli etiketlerden bahsedeceğim. Tablolar web sayfalarında verilerin düzenli şekilde gösterilmesi için kullanılırlar. Lafı fazla uzatmadan bir tablo oluşturmak için gerekli olan temel etiketlere göz atalım. Table etiketi: Bir tablo oluşturmak için gerekli kodların …

Html derslerimizin üçüncüsü sayfalarımız arasında gezinti yapmak için kullandığımız, aslında web sitelerinin temelini oluşturan bağlantı oluşturma etiketi. Web sayfaları yalnızca tek bir sayfadan oluşmaz. anasayfa, ürünler, kategoriler, iletişim gibi bölümlerin her biri farklı bir web sayfasıdır. Birinden diğerine geçiş yapmak içinse bunlar arasında bağlantı oluşturmak gerekir. Aşağıdaki resimde görüleceği üzere …