Web Tasarımında Genel Kavramlar

WEB Tasarımı ve Programlama 06 Aralık 2018 - 23:40 272 KEZ OKUNDU 0 YORUM YAPILDI

Web Tasarımında Genel Kavramlar
Sayfayı Paylaş...
  •  
  • 11
  • 5
  • 5
  •  

Web Tasarımında Genel Kavramlar

1. İNTERNET

İnternet, dünya üzerindeki bilgisayarları birbirine bağlayan büyük bir iletişim ağıdır. İnternet gün geçtikçe büyümekte ve teknolojisi hızla gelişmektedir. İnternetin gelişmesiyle beraber pek çok alandaki bilgilere insanlar daha kolay, ucuz, hızlı ve güvenli bir şekilde erişebilmektedirler.

internet nedir

2. IP ADRESİ (INTERNET PROTOCOL)

IP (Internet Protocol), bilgisayarların iletişim kurmasını sağlayan standart bir protokoldür. IP adresi, cihazın hangi servis sağlayıcısını veya ağı kullandığını ve nereden bağlandığı hakkında bilgiler içerir. IP adresi, her bilgisayarın sahip olduğu benzersiz bir numaradır. IP adresi sayesinde bilgisayarlar birbirini bulmakta ve iletişim kurabilmektedir. IP numarası versiyon 4’e göre her biri noktayla ayrılan ve 0 ile 255 arasındaki rakamlardan oluşmuş 4 adet numara setidir.

Örneğin: 192.168.128.181 şeklindeki bir IP adresi toplamda 32 bittir. (4x8bit)

IP numarası versiyon 6’ya göre 128 bitlik bir değerden oluşur. 16’lık sisteme göre ifade edilen bu değerde iletişim kuran bilgisayara ait birçok bilgi de kodlanır. Web sitelerinin yayınlandığı sunucular da IP adreslerine sahiptirler. Yani her Web sitesinin de bir IP adresi vardır.

3. ALAN ADI (DOMAIN NAME)

İnternete sürekli bağlı olan her bilgisayarın bir IP numarası vardır (192.168.121.15 gibi). Bu numaraları akılda tutmak ve herhangi bir anda yazmak zor olduğundan, alan adı (domain name) isimlendirme sistemi oluşturulmuştur. Herhangi bir WEB sitesine bağlanmak için karmaşık IP numaralarını akılda tutmak yerine, hatırlanması ve yazılması kolay alan adları kullanılmaktadır. Örneğin; 212.174.189.120 IP numarasını yazmak yerine www.meb.gov.tr yazmak daha kolaydır. Kısaca alan adı (domain name) IP numaralarına isim verilmesine denir.

domain nedir

4. ALAN ADI SUNUCULARI (DOMAIN NAME SERVER)

Hangi ip’nin hangi alan adına karşılık geldiği bilgisi, alan adı sunucularında (DNS) kayıtlıdır. Bir bilgisayar web adresini yazdığında önce bu istek DNS sunucuya gider ve bu adresin hangi IP adresine karşılık geldiği öğrenilir. Sonra bu IP adresine istekte bulunulur ve bu isteğe sunucu bilgisayar yanıt verir. Gelen yanıta göre sonuç ekranımızda gösterilir.

DNS nedir

Alan Adlarındaki Kısaltmalar

Alan adlarındaki sitenin hangi gruba ya da hangi ülkeye ait olduğunu gösteren bazı kısaltmalar vardır.

Örnek: www.meb.gov.tr

  • meb –> Alan adı
  • gov  –> Devlet kuruluşu
  • tr     –> Türkiye

Alan adlarındaki diğer kısaltmalar :

  • gov : Hükümet kuruluşları
  • edu : Eğitim kurumları (üniversiteler)
  • org : Ticari olmayan, kâr amacı gütmeyen kuruluşlar
  • com : Ticari kuruluşlar
  • mil : Askeri kuruluşlar
  • net : Servis sunucuları (Internet Servis Sağlayıcı gibi )
  • ac : Akademik kuruluşlar (bazı ülkelerde edu yerine kullanılmaktadır)
  • int : Uluslararası organizasyonlar, kuruluşlar
  • info : Bilgi servis sunan siteler
  • k12 : Eğitim kurumları (liseler)

Ülke Kodları

  • tr: Türkiye
  • de: Almanya
  • ch: Isviçre
  • se: İsveç
  • uk: Ingiltere
  • jp: Japonya
  • it: İtalya
  • ru: Rusya
  • nl: Hollanda
  • fi: Finlandiya

5. WEB TARAYICISI (BROWSER)

Web Tarayıcısı (Browser), internet sayfalarını görüntülememizi sağlayan programlara denir. Web tarayıcısı, adres çubuğuna yazdığımız adresteki sayfaları bize görüntüler. Web tarayıcılarına, kodlarla hazırlanan web sayfalarını çözümleyip görüntüleyen bir çeşit dönüştürücü de diyebiliriz. En çok kullanılan web tarayıcıları şunlardır:

  • Internet Explorer
  • Mozilla Firefox
  • Google Chrome
  • Opera
  • Safari

tarayıcılar (browsers)

Web, istemci-sunucu (client-server) sistemine dayalı olarak çalışır. Sizin WEB tarayıcı yazılımınız istemci, uzaktaki sizin erişmek istediğiniz bilgileri saklayan bilgisayar ise sunucudur.

Örneğin; İnternet Explorer ile meb sitesini ziyaret etmek istediğinizde adres çubuğuna www.meb.gov.tr yazarak bir istekte bulunuyoruz. Bu isteğe karşılık meb sunucuları bize yanıt veriyor. Burada İnternet Explorer istemci (client), yanıt veren meb bilgisayarları ise sunucu (server) olmaktadır.

Web Tarayıcılarının Çalışması

  • Sunucu, istekte bulunan istemci bilgisayara yanıt olarak web sayfasının HTML kodlarını gönderir.
  • Bu kodları alan tarayıcı programımız bunları yorumlar ve web sayfamızı ekranda anlaşılır bir şekilde görüntüler.
  • HTML kodları; sayfadaki resim, tablo, yazı ve diğer nesnelerin nerede nasıl görüntüleneceği bilgisini içermektedir.
  • Kısaca HTML kodları istemci tarafında web tarayıcısı tarafından çalıştırılır.

6. URL (UNIFORM RESOURCE LOCATOR)

URL, “Uniform Resource Locator” (Özgün Kaynak Adresi) kelimelerinin baş harflerinden oluşan bir kısaltmadır. İnternetteki her sayfanın, resimlerin ve diğer nesnelerin birer adresleri vardır. Bu adreslere URL denilmektedir. Her URL benzersizdir ve ilgili sayfa, resim ya da nesneye ulaşmak için kullanılır. Örneğin http://www.bilisimizle.com/sitemap.xml bilişim izle sitesine ait site haritası sayfasının URL’sidir. Bu URL üç bölümden oluşur:

  • Protokol (http://)
  • Alan adı (bilişimizle.com)
  • Dosya yolu (sitemap.xml)

url nedir

7. ARAMA MOTORLARI

Arama motoru, WEB sitelerini dolaşarak içeriklerini inceleyen ve bu içerikleri sizin arama yapabilmeniz için uygun şekilde saklayan (indeksleyen) programlara verilen isimdir. Arama motorları genellikle çok büyük bir veri tabanına sahiptir. Belli bir konuda araştırma yaptırabilmek için tüm yapmanız gereken anahtar bir kelime ya da sözcüğü girmek ve ara düğmesine basmaktır. Daha sonra aradığınız sonuçların aşağıda listelendiğini göreceksiniz.

arama motorları

Arama Motorlarının Çalışması

Arama motorları iki türdür.

Dizinler: İnsanlar tarafından kontrol edilen arama motorlarıdır. Güvenilir olarak görüldüklerinden birçok insan bu arama motorlarını ziyaret eder.

Crawler’lar: Bu tip arama motorları siteleri otomatik olarak ziyaret eder ve hemen hemen tüm sayfaları hafızalarına alır. Bunun için de bir çeşit robot kullanır.

arama motoru nasıl çalışır

8. HTML (HYPER TEXT MARKUP LANGUAGE)

HTML (Hyper Text Markup Language, Hareketli Metin İşaretleme Dili), WEB sayfalarının hazırlanmasında kullanılan dildir. Web sayfalarının kaynak koduna baktığımız HTML kodlarını görebiliriz. HTML kodları, sayfada bulunan resim, flash, yazı ve diğer nesnelerin nerede nasıl görüntüleneceğini belirtir.

9. HTTP (HYPER TEXT TRANSPORT PROTOCOL)

HTTP (Hyper Text Transport Protocol), Web sayfalarının istemci bilgisayarlara gönderilmesinde kullanılan bir protokoldür.

url nedir

10. WEB SİTESİ

Web Sitesi, birden fazla Web sayfasının bir araya getirilmesiyle oluşturulan bir yapıdır. Çoğunlukla bir Web sitesi iç içe sayfalarla donatılmıştır. Sitenin giriş sayfası bir indeks niteliğindedir. Bu indeks sayfasındaki linkler kullanılarak diğer sayfalara ya da diğer sitelere geçiş mümkündür.

11. WEB TASARIMI

Web tasarımında amaç ziyaretçilere amaca yönelik bilgileri düzenli bir şekilde sunabilmektir. Bu sayede kullanıcıların tekrar siteyi ziyaret etmelerini sağlayarak belleklerinde kısa da olsa yer tutabilmektir. Bu açıdan başarıya ulaşabilmek için web sitelerinin düzenli şematik yapılarda planlanması, içeriğin küçük bölümler halinde genel olarak anlatıldıktan sonra ayrıntılara yer verilmesinin yanında görsel olarak da gözü yormayacak şekilde tutarlı olarak tasarlanması da gerekmektedir.

Kısa, şekilsel ve organize belgeler kullanıcıları sayfaya daha fazla çeker. Çünkü: 

  • Çok az web kullanıcısı, ekranda uzun belgeleri okuyarak zaman kaybeder. Çoğu kullanıcılar uzun belgeleri sabit disklerine kaydederler veya kâğıttan okumak amacıyla yazıcıya bastırırlar.
  • Belgeleri bölümlere ayırmak, onları web bağlantıları ile birbirine bağlamak açısından yararlıdır. Fakat belgeler gereğinden fazla bölümlere ayrılmamalıdır. Bölümlerin web üzerinde 1 – 3 sayfa kadar olmaları mantıklıdır. Sadece küçük bir paragraf içeren bağlantılar çoğu koşullarda çirkin görünecektir.
  • Bilgilerin sunumunda ve organize edilmesinde hazırlanan belirli bir format, yani tutarlılık da ziyaretçileri tekrar çekebilmek için önemlidir.
  • Sayfanızda ilk olarak öncelikli bilgileri sunarsanız, en önemliden veya en genel başlıklardan daha ilgili veya daha ayrıntılı bilgilere doğru bir hiyerarşik düzen kurabilirsiniz.
  • Web’ de hiyerarşik organizasyonlar gereklidir.  Çünkü çoğu ana sayfa ve bağlantı şemaları hiyerarşik bir düzene sahiptirler. Aşağıdaki sayfada da görüldüğü gibi ana sayfayı alt sayfalar izler. Amaç kullanıcıya doğal gelen menü ve sayfa hiyerarşisi oluşturabilmektir.

anasayfa hiyerarşisi

İyi dengelenmiş hiyerarşik bir ağaç yapısı oluşturmada amaç, okuyucunun sayfa yapısını kolay idrak edebilmesini  ve  sayfalar arasında kaybolmamasını sağlamaktır. Eğer menülerimiz 4 – 5 bağlantıdan az bağlantı içeriyorsa değerlerini kaybederler.

Web sayfalarının düzenli ve tutarlı bir sistemle hazırlanmasındaki amaç, hedef kitlenin kısa sürede sayfa düzenine adapte olarak aradıkları bilgiye kolayca erişmelerini sağlamaktır.

12. WEB SAYFASI HAZIRLANIRKEN DİKKAT EDİLECEK HUSUSLAR

  • Web sayfasının isminde ve web sayfalarında yer alan herhangi bir resim ya da animasyonlar kaydedilirken asla Türkçe özel karakterler (ü, Ü, ğ, Ğ, ı, İ, ş, Ş, ö, Ö, ç, Ç,?,\) kullanılmaz.
  • Sabit diskinizde öncelikle WEB sayfanıza ait dokümanları kaydedeceğiniz bir dizin ve bu dizin içerisinde resimleri ya da animasyonlarınızı kaydedeceğiniz bir alt dizin oluşturunuz.
  • WEB sitenizi yaptığınızda, mutlaka ana sayfanızı index.html  olarak adlandırınız. WEB sunucularının birçoğu için varsayılan ana sayfa index.html’dir. Bazı sunucular da varsayılan  sayfanın default.html olarak adlandırılmasını ister.

Görsel Tasarım

Ekrana bakan 12 bin kişi üzerinde yapılan incelemelere göre bir izleyici, WEB sayfasında önce büyük şekil kitlesini ve renkleri görmekte, ön plandaki unsurlarla arka plandaki unsurlar arasındaki kontrastın farkına varmaktadır. İzleyici ancak daha sonra, varsa grafik unsurların verdiği bilgiyi almakta, üçüncü olarak da okumaya başlamaktadır.

Bu belirleme, bize, WEB sayfasının bütünü itibariyle mükemmel bir grafik dengesine sahip olması gerektiğini gösteriyor. Salt metinden ibaret gri bir sayfa itici ve sıkıcı iken, büyük ve geniş grafikler, büyük ve kara lekeler halindeki harfler özellikle içerik arayan daha rafine izleyiciye “içi boş” izlenimini verecektir. Grafik sanatçı, bu noktada sayfanın beklenen müşterisinin varsayılan ilgi odağını, grafikle metni dengeleyerek bulmak zorundadır.

Yazıyı soldan sağa doğru okumaya alışmış toplumlarda, görsel dikkatin ekranda da soldan sağa doğru gitmesi doğaldır. Bu nedenle WEB sayfalarında da ekranın üst yarısı, görsel odak noktası olmalıdır. Bu alanın mümkün olduğu kadar yumuşak,  pastel renklerle doldurulması; sert, aşırı yoğun çarpıcı renklerden kaçınılması gerekir.

Metinleri daha belirgin hale getirecek noktalar, kutular, yatay ve dikey çizgiler, çoğu zaman görsel bütünlük sağlamak yerine sayfanın tümüne yama hissi verir. Bütün görsel tasarımlarda olduğu gibi, WEB sayfası tasarımında da tutarlılık şarttır.

Bir WEB alanının başından sonuna tutarlı bir şekilde izlenen grafik uygulama, sonunda izleyicide WEB alanının sahibi kurum hakkında bir yorum uyandırır. Bu nedenle sırf süsleme amacıyla, sayfaların orasına burasına çizgi ya da fotoğraf unsurları konulmamalıdır. Ana sayfa izleyicinin bizim WEB alanımıza daldığı noktadır. Bu nedenle sayfada bir davet unsuru olması şarttır. Bu sayfanın az ve öz unsur içermesi de giderek yaygın bir tarz olmaya başladı.

web tasarım dizayn

WEB Tasarımında Temel İlkeler Konu Anlatımı için Tıklayınız…

web tasarımında temel ilkeler




BU KONULAR DA İLGİNİZİ ÇEKEBİLİR

HTML Etiketler 5

Bağlantı (Köprü - Link) Oluşturma

HTML Etiketler 4

Metin Düzenleme Etiketleri

HTML Etiketler 3

Listeleme Etiketleri

HTML Etiketler 2

Web Sayfasının Genel Yapısı

BU MAKALEYE YORUM YAP