Bilmeniz gereken web tasarım tanımları ve terimleri

• 2023-02-05 00:01:13
• admin

Web tasarımı bir süredir ortalıkta dolaşıyor ve karmaşık, jargonla dolu bir dil geliştirmek için hiç vakit kaybetmedi. Web tasarım dünyasına en ufak bir adım attığınız anda “Hangi CMS'yi kullanmak istiyorsunuz?”, “Ekranın üstünde mi yoksa ekranın altında mı?”, “Sabit mi istiyorsunuz?” düzeni?”, “Hangi web barındırma hizmetini kullanmak istiyorsunuz?” ve tüm bunların ne anlama geldiğini merak ediyorsun. Tüm temel web tasarımı tanımlarını ve terimlerini anlamaya çalışmanın, özellikle de tamamen yeniyse, oldukça bunaltıcı olabileceğini biliyoruz.

Web tasarımı, kod yazan web geliştiricilerinden, arayüzler üzerinde çalışan UI ve UX tasarımcılarına, sitenizin görünümü ve verdiği hisle ilgilenen web tasarımcılarına kadar geniş bir çalışma alanını kapsar. Web tasarımıyla uğraşan birçok insan var .

Web tasarımındaki birkaç kısaltmanın ve jargon kelimesinin ne anlama geldiğini öğrenmek, tasarımcınız ve geliştiricinizle çalışmayı çok daha kolay hale getirebilir ve ayrıca kendi web sitenizin gerçekte nasıl çalıştığını anlamanıza yardımcı olabilir. İster yardım alıyor olun, ister kendiniz yapın, web tasarımı ve geliştirmede en sık kullanılan ve en sık karıştırılan terimleri bilmek işinize yarayabilir:

- Web tasarım tanımları

- Ön uç web sitesi anatomisi

- Arka uç web sitesi anatomisi

- Teknik web ve internet terimleri

- Web geliştirme terminolojisi

Web tasarımı tanımları —

Ulaşılabilirlik
Erişilebilirlik, günümüzde web tasarımında büyük bir sorundur. Temel olarak, web sitenizin işitme veya görme bozukluğu olan herkes dahil olmak üzere insanlar için ne kadar erişilebilir olduğu anlamına gelir. Web sitenizi oluşturmadan önce ve oluştururken bunu aklınızda bulundurmanız önemlidir. Nereden başlayacağınızdan emin değilseniz web tasarımınızı erişilebilir kılmak için bu altı adıma göz atın .

Ekranın alt kısmı (ve ekranın üst kısmı)
Ekranın altı ve ekranın üstü, kökenleri gazetelerde olan iki terimdir . "Katlama", gazetenin katlandığı yerdir. Üstte ve altta, bilgilerin katlamanın üst yarısında mı yoksa alt yarısında mı görüneceğini açıklayın. Web sayfaları için "kıvrım" genellikle kaydırmaya başlamanız gereken nokta olarak tanımlanır, ancak prensip aynıdır - ekranın üst kısmındaki bilgilere (ATF), ekranın alt kısmına (BTF) göre daha erişilebilir ve görünürdür.

Elastik (düzen)
Elastik düzen, öğeler arasındaki ilişkileri ve sayfadaki konumlarını özel olarak tasarlanmış mesafeler ve boyutlar yerine yüzdeler olarak tanımlayan bir web sayfası tasarımı yaklaşımıdır. Bu, web sayfalarının hem yazı tipi boyutu ve aralığı açısından ziyaretçilerinizin belirlediği tercihler için hem de sayfanın bir akıllı telefon veya tablette görüntülenecek şekilde optimize edilmesi söz konusu olduğunda daha uyarlanabilir olduğu anlamına gelir.

Günümüzde esnek düzenler, duyarlı tasarım yaklaşımlarının önemli bir parçasıdır, ancak duyarlı tasarım fikri ortaya çıkmadan önce, elastik düzenler, web sitelerini uyarlanabilir hale getirmenin basit bir yolunu sağlıyordu.

Eski
Ex, bir yazı tipinde küçük "x" harfini standart ölçü olarak kullanan bir ölçü birimidir.

Sabit genişlik (düzen)
Sabit genişlik düzeni, bir tasarımcının bir web sayfasının ne kadar büyük olduğunu ve içinde öğelerin tam olarak nerede görüneceğini belirleyeceği bir web sayfaları tasarlama yöntemidir. Bu, tasarımcılara bir web sayfasının tasarımı üzerinde elastik bir düzene göre çok daha fazla kontrol sağlar, ancak sayfaları farklı ekran boyutlarına daha az uyarlanabilir hale getirir.

Onaltılık
"Onaltılık" sayılar olarak da bilinen onaltılık, 16 tabanlı bir sayı sistemidir, yani renkleri tanımlamak için 16 sembol kullanırlar. Onaltılık sayılar, 0'dan 9'a kadar olan sayıları ve A'dan F'ye kadar olan harfleri kullanır. Her renk, üç çift onaltılık sayı ile tanımlanır. İlk sayı veya harf çifti kırmızı tonla, ikinci çift yeşil tonla ve üçüncü çift mavi tonla ilgilidir.

Sonsuz kaydırma
Sonsuz kaydırma, siz kaydırmaya devam ettikçe yeni içeriğin yüklenmesidir. Bu, "sonsuz", hiç bitmeyen bir kaydırma oluşturur. Bunun bazı popüler örnekleri Facebook zaman çizelgeleri, Pinterest veya Twitter beslemeleridir.

Paralaks kaydırma
Bu kaydırma yöntemi, site tasarımında bir derinlik hissi yaratır. Kullanıcı kaydırdıkça, web sitesindeki öğeler kullanıcı kaydırdıkça farklı mesafelerde ve farklı hızlarda hareket ediyor gibi görünür. Bu, düz bir web sitesinde derinlik ve mesafe yanılsaması yaratır.

Çözünürlük
Çözünürlük, bir ekranda görüntülenen piksel sayısıdır. Resimlerin boyutunu belirlemek için web tasarımında kullanılan standart yöntemdir. Bir görüntünün kalitesi genellikle inç başına piksel olarak tanımlanır ve daha yüksek sayıda piksel daha yüksek kaliteli bir görüntüyle sonuçlanır.

Duyarlı / mobil uyumlu / mobil uyumlu
2020 itibariyle web trafiğinin yarısından fazlası akıllı telefonlarda gerçekleşiyor. Bu, bir web sitesinin masaüstünde olduğu kadar mobilde de en iyi şekilde görünmesinin daha önemli hale geldiği anlamına gelir. Web sitelerini duyarlı / mobil uyumlu / mobil cihazlar için optimize edilmiş hale getirmek, görüntülendikleri cihaza veya ekrana uyum sağlayacak bir web sitesi tasarlamak ve geliştirmek anlamına gelir.

Duyarlı / mobil uyumlu / mobil uyumlu
2020 itibariyle web trafiğinin yarısından fazlası akıllı telefonlarda gerçekleşiyor. Bu, bir web sitesinin masaüstünde olduğu kadar mobilde de en iyi şekilde görünmesinin daha önemli hale geldiği anlamına gelir. Web sitelerini duyarlı / mobil uyumlu / mobil cihazlar için optimize edilmiş hale getirmek, görüntülendikleri cihaza veya ekrana uyum sağlayacak bir web sitesi tasarlamak ve geliştirmek anlamına gelir.

UX (kullanıcı araştırması) / UI (kullanıcı arayüzü)
UX ve UI tasarımı, kullanıcı için deneyimi geliştiren bir çalışmadır. Birlikte nasıl çalıştıklarını bilmek için UX ve UI'nin farklılıklarını bilmek önemlidir .

UX, kullanıcı araştırması, baştan sona kullanıcının web sitesiyle etkileşiminin tüm yönlerini içerir. Amaç, bir kullanıcı ile web sitesi arasındaki etkileşimin kalitesini artırmaktır.

UI, kullanıcı arabirimi, bir web sitesinin düğmeler, simgeler, tipografi gibi görsel ve etkileşimli öğelerine odaklanır. Amaç, web sitesinin görünümünü ve işlevini iyileştirmektir.

Ön uç web sitesi anatomisi

Kırıntı
Web sayfaları, kullanıcılara bir web sayfasında nasıl gezindiklerini ve ana sayfaya nasıl geri dönüleceğini gösterdiğinde, bu genellikle bir içerik haritası aracılığıyla yapılır. Bu genellikle Ana Sayfa > Kategori > Yıl > Ay > Gönderi gibi bir dizi iç içe kategori olarak gösterilir.

Favicon
Favicon, tarayıcınızın sekme çubuğunda görüntülenen küçük bir simgedir. Genellikle 16×16 pikseldir (gerçekten çok küçüktür) ve .ico, .gif veya.png görüntüsü olarak kaydedilirler. Doğru boyutta olduğu ve doğru biçimde kaydedildiği sürece, beğendiğiniz hemen hemen her görüntüyü favicon olarak kullanabilirsiniz.

Odak noktası
Bir web sayfasındaki odak noktası, sayfanın gözünüzün çekildiği kısmıdır. Tasarımcılar gerçekten izleyicinin dikkatini çeken bir odak noktası tasarlamak için çok zaman harcayacaklar ve ardından sayfadaki en önemli şeyi odak noktasına yerleştirecekler. Bu, mümkün olan en fazla kişi tarafından görülmesini sağlar.

Başlangıç ​​aşaması
Bunlar, insanların sitenizi ilk ziyaret ettiklerinde görecekleri resim, metin, sayfalar gibi unsurlardır. Esasen, insanların bir web sitesinde etkileşimde bulunacakları ve etkileşimde bulunacakları şeydir.

Hamburger simgesi
Bir hamburger simgesi, daha yeni programlarda yaygın olarak bulunan menü simgesini ifade eder. Üç yatay çubuğa (dolayısıyla "hamburger") sahiptir ve geleneksel gezinme menüsünü tek bir simgenin arkasına gizler.

Açılış sayfası
Bu, sitenize gelen ziyaretçilerin göreceği ilk sayfadır. Pek çok web sitesinde, bir ziyaretçiden bir şeyler almak için özel bir açılış sayfası kullanılır (örneğin, e-posta adresini paylaşmak veya bir ürün için özelleştirilmiş bir sayfa). Açılış sayfanız, web sitenizdeki en önemli sayfalardan biridir ve onu optimize etmek için çok zaman harcamanız gerekir .

Navigasyon
Gezinme, web sayfanızın öğeleri arasında geçiş yapmak için kullanılan sistemdir ve herhangi bir web sayfasının en önemli öğelerinden biridir. Bu nedenle , web sitesinde gezinmenin temel ilkelerini bilmek önemlidir . Gezinmenin en net örneği, çoğu web sayfasında görünen menülerdir. Ancak sayfaların nasıl düzenlendiğine ve aralarındaki bağlantılara da çok dikkat edin. Bunlar ayrıca bir web sayfasında gezinmeyi ziyaretçiler için çok daha kolay hale getirebilir.

Arka uç web sitesi anatomisi
 

Arka uç
Bu, sisteminizin web sitenizi etkili bir şekilde çalıştıran, ancak ziyaretçilerden gizlenen kısmıdır. Kullanılabilir birçok farklı arka uç vardır, ancak hepsi genellikle aynı şeyleri içerir; uygulamalar, bilgi yapısı ve CMS'niz.

İYS
İçerik Yönetim Sistemi—bu, sitenizin içeriğini çalıştırmak, kullanıcı eklemek, yorumları yönetmek ve potansiyel olarak çok daha fazlasını yapmak için kullanılan bir arka uç araçtır. Bir web sitesi oluşturmak için daha önce WordPress kullandıysanız, bir CMS kullandınız. CMS, web sitesinin üzerinde çalıştığı ham kodun çoğunu gizlediği için web sayfası tasarlamayı ve oluşturmayı çok daha kolaylaştırır.

E-ticaret
E-ticaret, "elektronik ticaret" anlamına gelir. "e-posta"nın "elektronik posta" anlamına gelmesi gibi. Web sitenize genellikle ürün açıklamalarını, alım satımı ve ayrıca müşteri verilerini işleyecek bir e-ticaret mağazası ekleyeceksiniz.

HTTP / HTTPS
Bu, tarayıcılar, sunucular ve web uygulamaları arasındaki veri alışverişini yöneten sistemdir. Verilerin nasıl paketlenmesi ve gönderilmesi gerektiğini tanımlar.

HTTPS, SSL (Güvenli Yuva Katmanı) üzerinden bağlantı kurabilen bir HTTP uzantısıdır. Bu, çevrimiçi veri alışverişi yapmanın çok daha güvenli bir yoludur. Birçok modern web tarayıcısı, bir web sitesi HTTPS yerine standart HTTP kullanıyorsa sizi uyarır.

Bir web sitesi sahibi olarak, HTTPS kullanmak için gerekli olan SSL sertifikalarını çeşitli sağlayıcılardan satın alabilirsiniz. Eklendikten sonra bu, sitenizi daha güvenli hale getirecek ve müşterilerinizle güven oluşturacaktır.

Eklenti
Ek güvenlik işlevselliği sağlamak için temel sitenizin üzerinde oturan küçük bir yazılım parçası. Eklentiler, en popüler CMS platformlarında mevcuttur ve blog gönderilerini otomatikleştirmekten müşteri adaylarını yönetmeye kadar çok çeşitli işlevler için kullanılabilir.

Şablon
Şablonlar, web tasarımında, belgeler ve resimler için kullanıldıkları gibi, birçok farklı sayfada tasarım tutarlılığı sağlamak için kullanılır. Çoğu CMS platformu, web siteniz için sayfalarınızı ve tasarımınızı bunlar arasında tutarlı tutmanıza yardımcı olacak bir dizi şablon sağlar.

Teknik web ve internet terimleri
 

Bağlantı metni
Bağlantı metni, köprü içeren bir ifade veya birkaç kelimedir. Bunun gibi: Bağlantı Metni Açıklaması . Doğru bağlantı metnini kullanmak, sayfanızın arama motoru sıralamalarında ne kadar iyi olduğu konusunda büyük bir fark yaratabilir.

Geri bağlantı
Bunlar, diğer web sitelerinden web sitenize verilen bağlantılardır. Örneğin, başka bir site okuyucularını bir kaynağa yönlendirmek için sizinkine bağlantı verdiğinde, bir geri bağlantı aldınız. Arama sıralamanızı iyileştirmek söz konusu olduğunda geri bağlantılar çok önemlidir, çünkü güvenilir sitelerden birkaç geri bağlantı sitenizin görünürlüğünü artıracaktır.

Bant genişliği
Bant genişliği, birçok farklı bağlamda kullanılan bir terimdir, ancak esasen belirli bir süre boyunca gönderilen veya alınan veri miktarı anlamına gelir. Örneğin, genellikle kilobit/saniye (kbs) cinsinden ifade edildiği yerlerde internet hızınızı tanımlamak için kullanılabilir. Ancak bazen, web barındırma paketinizin bir parçası olarak ayda ne kadar veri kullanabileceğinizi açıklamak için kullanılır.

Önbellek
Önbellek, bir web tarayıcısı tarafından kaydedilen bir veri koleksiyonudur. Bu, bir kullanıcının siteyi bir sonraki ziyaretinde sayfanın yerel bellekten yüklendiği için daha hızlı yükleneceği anlamına gelir.

DNS
DNS, “Etki Alanı Adı Hizmeti” anlamına gelir. Bu, web tarayıcınızın web sayfalarının bulunduğu yeri aradığı sistemdir. 99designs.com yazdığınızda , tarayıcınız bu insan dostu adresi bilgisayar dostu bir adrese (yani sayılardan oluşan) dönüştüren bir "DNS tablosuna" bakacaktır. DNS sistemi, dünyadaki tüm web sayfalarının nerede olduğunu takip eder, böylece tarayıcınız onları bulabilir.

İhtisas
Bu, web sitenizin adıdır. Birçok firmadan domain satın alabilirsiniz. En fazla 63 karakter uzunluğunda olabilirler. Örneğin, 99designs.com alan adımızdır.

FTP
FTP, "dosya aktarım protokolü" anlamına gelir ve dosyaları ve verileri yerel depolama alanından (örneğin, bilgisayarınızda) web sunucunuza aktarmak için kullanılan bir sistemdir. FTP'yi kullanmak için FTP istemcisi adı verilen küçük bir yazılım indirmeniz gerekir.

Kalıcı bağlantı
Sitenizin yapısını nasıl değiştirirseniz değiştirin, her zaman belirli bir blog yazısına veya sayfasına işaret edecek bir adres belirtmenize olanak tanıyan kalıcı bir bağlantı. Bu, sitenize gelen trafiği artırmak için blog gönderileri kullanıyorsanız çok kullanışlıdır çünkü sitenizi yeniden tasarlamaya veya alan adınızı değiştirmeye karar verirseniz düzinelerce (veya yüzlerce) bağlantıyı manuel olarak değiştirmeniz gerekmez.

URL
Belirli bir sayfanın veya başka bir kaynağın nerede bulunabileceğini belirten bir adres.

Ağ sağlayıcısı
Bir web barındırma, web sitenizin depolandığı sunucuları çalıştıran bir şirkettir. Web barındırma nedir makalemizde açıkladığımız gibi , web barındırma hizmetleri sundukları hizmet düzeyinde büyük farklılıklar gösterebilir. İyi bir web barındırıcısı, sitenizin %99,9 oranında erişilebilir olacağından emin olabilir ve ayrıca sitenizi güvenli ve etkili tutmanız için araçlar sağlar.

Web sunucusu
Bir web sunucusu, web sayfanızın gerçekte depolandığı bilgisayardır. Kendi sunucularınızı çalıştırmanız da mümkün olsa da, muhtemelen web barındırıcınıza ait bir sunucu kurulumunda bulunur.

Web geliştirme terminolojisi
 

CSS
CSS, Basamaklı Stil Sayfaları anlamına gelir ve HTML'nin yanı sıra bu sayfalar herhangi bir web sayfasının en temel parçasıdır. On yıl önce, bir web sayfasında başlıkların ne kadar büyük olduğu veya resimlerin kenarlıklarının olup olmadığı gibi bir şey için kullanılan biçimlendirme, HTML kodunun kendisinde tanımlanıyordu. Bu, biçimlendirmeyi değiştirmenin, bir sayfanın her öğesini gözden geçirme ve kodu değiştirme gibi zahmetli bir süreç olduğu anlamına geliyordu.

CSS ile işler çok daha kolay. Bir sayfanın stili, başlıkların nasıl göründüğünü, resimlerin nasıl görüntülendiğini ve diğer birçok öğeyi tanımlayan bir (veya daha fazla) CSS dosyasında bulunur. Bunlar bir tarayıcıya bir web sitesinin nasıl oluşturulacağını söyler. Bu şekilde, tüm web sitelerinin biçimi, yalnızca tek bir kod parçası değiştirilerek ayarlanabilir.

DHTML
DHTML, Dinamik Köprü Metni İşaretleme Dili anlamına gelir. Bu, bir dizi web tasarım dilini (HTML, JavaScript ve CSS) web geliştirme için tek bir süper dilde birleştiren bir dil için kullanılan bir terimdir. Bu genellikle modern bir web geliştiricisinin sizin için bir web sitesi oluşturmak için kullanacağı şeydir.

Doküman türü
HTML'de bir belge türü, bir web sayfası tarafından ne tür HTML'nin ve hangi sürümün kullanıldığının açıklamasıdır. Bir sayfanın bütünlüğünü kontrol etmek için tarayıcılar tarafından kullanılır ve yanlışsa güvenlik hataları verebilir.

EM
Em, bir sayfada kullanılan "ana" yazı tipine göre yazı tipinin boyutunu tanımlamak için kullanılır. 1Em, bir yazı tipinin (veya bazen başka öğelerin) üst öğesiyle aynı boyutta olduğu anlamına gelir; 2em, boyutunun iki katı olduğu anlamına gelir vb.

Gömülü stil
CSS (yukarıya bakın) bir kerede tüm sayfaların formatını tanımlamak için kullanılabilse de, bazen sadece bir sayfada bir stili değiştirmeniz gerekir. Bu, gömülü bir stilin kullanıldığı zamandır. Gömülü stil, bir web sayfasının başlığına yazılan ve web sitenizin tamamı yerine yalnızca o sayfadaki öğeleri etkileyen bir CSS kodu parçasıdır.

Yazı tipi ailesi / stili / ağırlığı
Farklı tarayıcılar her zaman tam olarak aynı yazı tiplerini paylaşmadığından, web tasarımcıları ve geliştiricileri genellikle belirli yazı tipleriyle çalışmazlar. Bu nedenle, bir CSS belgesinde, kullanılacak yazı tipinin bir yazı tipi ailesi olarak tanımlandığını göreceksiniz; bu, belirli bir yazı tipi yerine kullanılabilecek bir grup yazı tipidir. Bu tanımın yanı sıra, CSS belgesi ayrıca yazı stilini (italik, altı çizili vb.) ve ağırlığı (kalın, hafif vb.) tanımlayacaktır.

HTML
Köprü Metni Biçimlendirme Dili—bu, internetin temelidir. Tüm web sayfaları, en azından bir dereceye kadar, yazılması mümkün olduğunca kolay olacak şekilde geliştirilen HTML'de yazılmıştır. Çok tatmin edici olabilir, aslında HTML kodlama eğitimlerini çevrimiçi olarak bulabilirsiniz—birkaç saat içinde neler başarabileceğinize şaşıracaksınız!

Metaveri
MetaData, web sayfalarının başlığında bulunan verilerdir. Bu veriler tarayıcınız tarafından kullanılabilir ancak görüntülemekte olduğunuz web sayfasının bir parçası olarak gösterilmez; bunlara erişmek için kaynak koduna bakmanız gerekir.

Açık kaynak
Açık kaynak yazılımın bakımı kullanıcılar tarafından yapılır ve kullanımı ve değiştirilmesi ücretsizdir. Bu, belirli bir şirketin sahip olduğu ve bakımının yapıldığı tescilli yazılımla çelişir. Çoğu web geliştiricisi, en azından bazen, açık kaynaklı yazılım kullanır, çünkü bu yalnızca daha ucuz olmakla kalmaz, aynı zamanda daha güvenli de olabilir. Günümüzde çoğu web geliştiricisi, açık kaynak dillerinde kodlanmış kapsayıcıları kullanarak güvenlik ihlallerini en aza indirecektir.

Sahneleme
Bir web sitesini hazırlamak, sitenin canlı sürümünü kullanıma sunmadan önce neredeyse son bir kopyasını oluşturma ve ardından bunu test etme sürecidir. Çoğu web geliştiricisi, her şeyin doğru çalışıp çalışmadığını kontrol etmek için bir web sitesini yayınlanmadan önce "hazırlar". Ve çoğu zaman, bir web sitesindeki büyük değişiklikler canlı site yerine hazırlık sitesinde gerçekleşir.

Geçerli
Web tasarımında geçerli web sayfaları, hata içermeyen sayfalardır. Uygulamada bu, web geliştirme standartlarını belirleyen topluluk olan W3C tarafından yayınlanan HTML belirtimlerinde belirtilen standartlara uyan web sayfaları anlamına gelir.

Xml
XML, Genişletilebilir İşaretleme Dili anlamına gelir. XML, web tasarımının temel bir parçasıdır çünkü bir dilin öğelerini diğerine çeviren bir "meta dil" görevi görür. Bu, web sayfalarının, her biri XML aracılığıyla iletişim kuran birçok farklı dil kullanılarak oluşturulabileceği anlamına gelir.

Son bir söz
—

Elbette, kendi başınıza veya yardım alarak bir web sitesi tasarlamaya başlamak için tüm bu web tasarımı tanımlarını ve terimlerini bilmek gerekli değildir. Sonuç olarak, web tasarımı bir öğrenme sürecidir ve en iyi tasarımlar, siz yeni şeyler öğrendikçe sürekli olarak geliştirilen yinelemeli sanat eserleridir.

Bununla birlikte, özellikle ilk başladığınızda, web tasarımının bazen karmaşık dünyası hakkında bir rehberinizin olması çok yararlı olabilir. Profesyonel web tasarımcılarımız, web tasarımının heyecan verici dünyasına başlamanıza yardımcı olabilir.