Web Tasarımı Ünite -3

Giriş

Web tasarımı, kullanıcıların internet üzerinde etkileşimde bulunduğu dijital dünyaların yaratılmasını sağlar. Web tasarımının temel prensipleri ve işaretleme dilleri, kullanıcı dostu ve estetik açıdan çekici web sitelerinin oluşturulmasında kritik öneme sahiptir. Bu makalede, web tasarımının temel ilkeleri, HTML gibi işaretleme dilleri ve bu dillerin web tasarımındaki rolü ele alınacaktır.

İşaretleme Dilleri

İşaretleme dilleri, web sayfalarının yapısını ve içeriğini tanımlamak için kullanılan özel dilleridir. HTML (Hypertext Markup Language) ve XML (Extensible Markup Language), işaretleme dillerinin en yaygın örneklerindendir. HTML, web sayfalarının iskeletini oluştururken, XML veri depolama ve taşımada kullanılır.

HTML ve Versiyonları

HTML, web sayfalarının yapı taşlarını oluşturur. Metinler, görseller, bağlantılar ve diğer öğeler HTML kullanılarak tanımlanır. HTML’in çeşitli versiyonları vardır: HTML 1.0, HTML 2.0, HTML 3.2, HTML 4.01 ve HTML 5.0 gibi. Her yeni versiyon, daha fazla özellik ve işlevsellik ekleyerek web tasarımcılarının daha zengin kullanıcı deneyimleri yaratmalarını sağlar.

HTML Editörleri

HTML editörleri, web tasarımcılarının kod yazmasını ve düzenlemesini kolaylaştıran araçlardır. Popüler HTML editörleri arasında Notepad++, Atom, Sublime Text ve CoffeeCup bulunmaktadır. Bu editörler, kod renklendirme, otomatik tamamlama ve hata ayıklama gibi özelliklerle tasarım sürecini daha verimli hale getirir.

Meta Etiketleri ve Kullanımı

Meta etiketleri, bir web sayfasının hakkında bilgi sağlamak için kullanılır. Bu etiketler, sayfa yazarını, anahtar kelimeleri, kullanılan karakter setini ve daha fazlasını belirtebilir.

etiketi, tarayıcılara ve arama motorlarına sayfa hakkında bilgi vermek için yaygın olarak kullanılır.

HTML’de Renk ve Arka Plan Ayarları

HTML, web sayfalarının renklerini ve arka planlarını ayarlamak için çeşitli parametreler sunar. Örneğin,

etiketi, sayfanın arka plan rengini belirtir. Bu tür ayarlar, web sayfasının görsel çekiciliğini artırmada önemli bir rol oynar.

Karakter Seti ve Dil Uyumu

Web sayfalarında kullanılan karakter seti ve dil uyumu, kullanıcıların içeriği doğru şekilde görmesini sağlar.

etiketi, sayfanın UTF-8 karakter setini kullanacağını belirterek, Türkçe gibi özel karakterlerin doğru görüntülenmesini sağlar.

HTML’de Boşluk ve Satır Ayarları

HTML’de boşluk ve satır ayarları, sayfanın düzenini ve okunabilirliğini artırmak için kullanılır.   kodu, metinler arasında boşluk oluşturur. Bu tür kodlar, web sayfasının düzenini optimize etmek için sıkça kullanılır.

Sonuç

Web tasarımı, internet kullanıcılarına en iyi deneyimi sunmak için önemli bir araçtır. İşaretleme dilleri ve HTML’in çeşitli özellikleri, web sayfalarının işlevselliğini ve estetiğini geliştirmede kritik rol oynar. Bu temel ilkeler ve araçlar, web tasarımcılarının daha etkili ve çekici web siteleri oluşturmasını sağlar.

1- Aşağıdakilerden hangisi işaretleme dilleri arasında değildir?

A) HTML
B) XML
C) PHP
D) LaTeX
E) SGML

Cevap: C) PHP

Açıklama: HTML, XML, LaTeX ve SGML işaretleme dilleri iken, PHP bir sunucu taraflı betik dilidir ve işaretleme dili olarak kullanılmaz.

2- Bir web sayfasının kaynak kodlarını görüntülemek için klavyeden hangi tuş/tuşlara basılması gerekmektedir?

A) F5
B) F12
C) F10
D) F8
E) Ctrl+Enter

Cevap: B) F12

Açıklama: F12 tuşu, birçok web tarayıcıda geliştirici araçlarını açarak web sayfasının kaynak kodlarını görüntülemenizi sağlar.

3- Aşağıdakilerden hangisi HTML versiyonlarından biri değildir?

A) HTML 3.2
B) HTML 4.01
C) HTML 5.0
D) HTML 3.5
E) HTML 1.0

Cevap: D) HTML 3.5

Açıklama: HTML 3.5 diye bir sürüm yoktur. HTML sürümleri arasında HTML 3.2, HTML 4.01 ve HTML 5.0 bulunmaktadır.

4- Aşağıdakilerden hangisi HTML editörüdür?

A) Notepad++
B) Atom
C) Sublime Text
D) CoffeCup
E) Hepsi

Cevap: E) Hepsi

Açıklama: Notepad++, Atom, Sublime Text ve CoffeCup, HTML kodlama için kullanılan popüler editörlerdir.

5- Bir web sayfası ile ilgili yazar, anahtar kelimeler, karakter seti gibi bilgilerin belirtilmesi için kullanılan etiket aşağıdakilerden hangisidir?

A) <body>
B) <meta>
C) <img>
D) <head>
E) <link>

Cevap: B) <meta>

Açıklama: <meta> etiketi, web sayfası hakkında meta verileri tanımlamak için kullanılır.

6-

<body bgcolor=”#FF0059”> etiketini incelediğinizde buna göre aşağıdakilerden hangisi bir parametre değeridir?

A) bgcolor
B) #FF0059
C) body
D) <>
E) =

Cevap: B) #FF0059

Açıklama: #FF0059, bgcolor parametresinin değeridir ve sayfa arka plan rengini belirtir.

7- Aşağıdakilerden hangisi bir web sayfasının arka planını belirlememizi sağlayan parametredir?

A) bgcolor
B) vlink
C) alink
D) text
E) line

Cevap: A) bgcolor

Açıklama: bgcolor parametresi, web sayfasının arka plan rengini belirlemek için kullanılır.

8-

<meta charset=”utf-8”> kod satırı aşağıdakilerden hangisi için kullanılır?

A) utf-8 sayfasına bağlantı tanımlamak için
B) sayfa arka plan rengini belirlemek için
C) metin boyutunu belirlemek için
D) Türkçe karakter uyumsuzluğunu çözmek için
E) paragraf oluşturmak için

Cevap: D) Türkçe karakter uyumsuzluğunu çözmek için

Açıklama: <meta charset=”utf-8”> etiketi, sayfa karakter setini belirtir ve Türkçe gibi özel karakterlerin doğru görüntülenmesini sağlar.

9- HTML kodu ne için kullanılır?

A) Tırnak işareti için
B) Satır başı oluşturmak için
C) Alt satıra geçmek için
D) Yeni paragraf oluşturmak için
E) Boşluk oluşturmak için

Cevap: E) Boşluk oluşturmak için

Açıklama:   HTML kodu, web sayfasında boşluk oluşturmak için kullanılır.

10- Aşağıdakilerden hangisi web tarayıcının okuduğu dosyanın tipini anlayabilmesi için kullanılır?

A) <!DOCTYPE HTML>
B) <meta charset=”utf-8”>
C) <body bgcolor=”FF5200”>
D) <head>
E) <br/>

Cevap: A) <!DOCTYPE HTML>

Açıklama: <!DOCTYPE HTML> bildirimi, tarayıcıya belgenin HTML5 standardında olduğunu belirtir.