AUZEF Web Tasarımı Çıkmış Sorular

Web Tasarımı dersi; internetin ve web'in temel yapısını, HTML etiketlerini, CSS ile biçimlendirmeyi, JavaScript temellerini ve web sitesi geliştirme sürecini kapsar. Sınavda protokoller, etiket parametreleri, tablo, form ve tasarım ilkeleri sık sorulur.

İnternet, protokoller ve sunucular

• İnternet, dünya çapında birbirine bağlı ağların bütünüdür; sözcük 'interconnected network' ifadesinin kısaltmasıdır.
• TCP/IP veriyi paketlere ayırır, doğru adrese iletir ve hata denetimi yapar.
• DNS, alan adını IP adresiyle ilişkilendirir; kök sunucular alan adının hangi IP adresinde olduğunu bildirir.
• Barındırma (hosting), site dosyalarının sürekli bağlı sunucularda saklanması hizmetidir.
• Dosya aktarımı bağlantıları ftp: ile başlar.
• HTTP istek yöntemleri Get, Post, Head ve Options'tır; Header yöntem değildir.

HTTP durum kodları ve GET/POST

• 1xx bilgi, 2xx başarı, 3xx yönlendirme, 4xx istemci hatası, 5xx sunucu hatası anlamına gelir.
• 'Uyum' adlı bir durum kodu grubu yoktur.
• GET'te form verileri adres çubuğunda görünür ve uzunluğu sınırlıdır.
• POST verileri arka planda iletir; gizli bilgiler için uygundur.
• Adreste ?username=...&pas=... görülüyorsa yöntem GETtir.

Web geliştirme süreci, ekip ve araçlar

• Aşama sırası: hedef belirleme, tasarım, geliştirme, test, yayın-bakım-güncelleme.
• Proje mimarı müşteri, sektör ve hedef kitleye bakarak genel kurguyu belirler.
• Test uzmanı işlevleri ve güvenliği yayından önce denetler.
• Photoshop, Illustrator, FreeHand, Corel Draw ve SWiSH Max tasarım programlarıdır.
• MySQL veri tabanıdır, tasarım yazılımı sayılmaz.
• Güncel tarayıcılar Chrome, Firefox, Safari, Opera'dır; NeXTStep işletim sistemidir.
• HTML sürümleri 1.0, 2.0, 3.2, 4.01 ve 5'tir; HTML 1.5 yoktur.

Web tasarım ilkeleri ve SEO

• İşlevsellik: sayfalar arası kopukluk olmamalı, içeriğe en kısa yoldan ulaşılmalıdır.
• İçerik: sade, özgün, göz yormayan ve kullanıcıyı yormayan metinler hazırlanmalıdır.
• Arama motoru optimizasyonu (SEO) sitenin arama sonuçlarındaki görünürlüğünü artırır.
• Grafiksel kullanıcı arayüzü pencere, simge, düğme ve panellerin tümüdür.
• Hipermetin bağlantılarla başka kaynaklara geçiş sağlar ve zengin içerik taşır.

HTML temel yapısı ve etiketler

• DOCTYPE bildirimi dosyanın en başına konur.
• head teknik bilgi içerir; görünen her öğe body içine yazılır.
• title sekmedeki sayfa başlığını verir; meta charset Türkçe karakterleri düzgün gösterir.
• Meta etiketi http-equiv='refresh' ile sayfayı otomatik yeniler; content süreyi saniye olarak belirler.
• img etiketi kapatma gerektirmez; görsel yolu src ile verilir.
• u altı çizili metin, ul sırasız liste, ol sıralı liste, li liste maddesidir.
• Başlık hizalaması align parametresiyle yapılır.
• a etiketinde target='_blank' bağlantıyı yeni sekmede açar.

Tablo, form ve çerçeveler

• caption tablo başlığı, tfoot alt bilgi bölümüdür; thead üst, tbody veri satırlarıdır.
• Satır birleştirmede td rowspan, sütun birleştirmede td colspan kullanılır.
• Hücre içeriğini sağa yaslamak için td align='right' yazılır.
• Birden fazla seçim için onay kutucuğu (checkbox), tek seçim için radyo düğmesi kullanılır.
• Formlar giriş, üyelik, iletişim ve veri girişi içindir; veri özetleme işi değildir.
• Çerçeveler sayfayı bağımsız bölümlere ayırır; frameborder 0 kenarlığı kaldırır, 1 gösterir.

CSS

• Harici stil dosyası link etiketi ile bağlanır: rel='stylesheet' ve href kullanılır.
• Evrensel seçici * ile, id seçici # ile yazılır; nokta sınıf seçicisidir.
• Padding içerik ile kenarlık arasındaki iç boşluk, margin dış boşluktur.
• box-sizing: border-box kenarlık ve iç boşluğu verilen genişliğe dahil eder.
• position: fixed elemanı pencerede sabit tutar.
• @media sorguları ekrana duyarlı tasarım sağlar.

JavaScript

• Değişebilen değerler let ile, sabit kalacak değerler const ile tanımlanır.
• Veri tipleri arasında String, Number, BigInt, Boolean vardır; Loop veri tipi değildir.
• slice() metinden istenen kısmı alır; toExponential() sayıyı üstel gösterimli dizeye çevirir.
• Dizi indeksi 0'dan başlar; yedinci eleman dizi1[6] ile alınır.
• Geçerli DOM olayları onload, onunload, onclick, onchange'dir; onmouseon yoktur.
• Düğmeye onclick bağlanıp getElementById ile öğenin src değeri değiştirilebilir.

Hipermetin

Bağlantılarla başka kaynaklara geçiş sağlayan ve çoklu ortam içeriği taşıyabilen metin yapısıdır.

TCP/IP

Verinin paketlenmesini, adrese ulaşmasını ve hata denetimini düzenleyen temel protokol takımıdır.

DNS

Alan adlarını IP adresleriyle eşleştiren sistemdir.

Hosting

Site dosyalarının sunucuda saklanması ve erişilebilir tutulması hizmetidir.

SEO

Sitenin arama motorlarında üst sıralarda çıkması için yapılan çalışmalardır.

GUI

Kullanıcının pencere, simge ve düğmelerle etkileştiği grafiksel arayüzdür.

Proje mimarı

Müşteri ve sektör bilgisine göre sitenin genel kurgusunu belirleyen ekip üyesidir.

Padding

CSS kutu modelinde içerik ile kenarlık arasındaki boşluktur.

Evrensel seçici

Tüm öğeleri hedefleyen ve * ile yazılan CSS seçicisidir.

rowspan / colspan

Tablo hücresini sırasıyla birden çok satıra veya sütuna yayan özelliklerdir.

const

Değeri sonradan değiştirilemeyen JavaScript değişkenini tanımlar.

• ul sırasız, ol sıralı listedir; ul ile u (altı çizili) etiketi karıştırılmamalı.
• rowspan satırları, colspan sütunları birleştirir.
• GET veriyi adreste gösterir, POST göstermez.
• 3xx yönlendirmedir; 'uyum' diye bir grup yoktur.
• Soru 'değildir' diyorsa uydurma şıklara bakılmalı: HTML 1.5, tlink, onmouseon, TexMLP, Loop, Header, NeXTStep, MySQL.