HTML

Grafik ve web tasarım temelleri ve uygulamaları final sınavında sorulabilecek bazı sorular şunlardır: 1. HTML Yapısı: Bir HTML belgesinin temel yapısını açıklayın. 2. CSS Stil: Bir sayfanın arka plan rengini değiştirmek için kullanılan CSS kuralını yazın. 3. JavaScript Fonksiyon: JavaScript’te bir fonksiyon tanımlamak için kullanılan temel sözdizimini yazın. 4. Responsive Tasarım: Responsive tasarım nedir ve neden önemlidir? 5. Kullanıcı Deneyimi (UX): Kullanıcı dostu bir web sitesi tasarlamak için hangi UI/UX prensiplerini uygulamalısınız? 6. Proje Yönetimi: Web tasarım sürecinde ihtiyaç analizi, planlama ve test aşamaları nelerdir? Bu sorular, genel web tasarım bilgilerini ve pratik becerileri test etmek amacıyla sorulabilir.

Mailto ile form göndermek için aşağıdaki adımları izlemek gerekmektedir: 1. HTML Form Oluşturma: Formun action alanına `mailto:` protokolünü ve e-posta adresini yazmak yeterlidir. 2. Ek Parametreler: Formun subject, body, cc ve bcc gibi alanlarını önceden doldurmak için `?` ve `&` sembollerini kullanarak ek parametreler eklenebilir. 3. Form Gönderimi: Kullanıcı formu doldurduğunda, `mailto` bağlantısı tıklanarak varsayılan e-posta uygulaması açılır ve form verileri otomatik olarak gönderilir. Alternatif olarak, Google Formlar gibi çevrimiçi form oluşturma araçları kullanılarak da form verileri e-posta ile gönderilebilir.

Resim dosyasını bir sayfaya eklemek için farklı yöntemler kullanılabilir: 1. WordPress: Resmin yüklenmesi ve sayfaya eklenmesi için "Ortam" bölümünden faydalanılır. - Yönetim paneline giriş yapın. - Sol menüden "Yazılar"a tıklayın. - Resmi eklemek istediğiniz yazının başlığına tıklayın. - Resmi eklemek istediğiniz yere tıklayıp sol üstte "+" işaretini kullanın. - "Görsel" veya "Galeri" ögesine tıklayın ve "Ortam Kütüphanesi"ni kullanarak resmi ekleyin. 2. HTML: `<img>` etiketi ile resim eklenir. - Kullanım şekli: `<img src="resim yolu" alt="resme alternatif yazı">`. - `src` ile resmin yolunu belirtmek gerekir, resim html sayfamızla aynı klasör içinde de olabilir ya da internet üzerinden de olabilir. 3. Google Dokümanlar: Dokümana resim eklemek için "Ekle" menüsünden "Resim" seçeneği kullanılır. - Bilgisayarınızdan bir resmi yükleyebilir veya stok resimler, Google görselleri gibi seçenekleri kullanabilirsiniz. 4. SharePoint: "Resim" web bölümü eklenerek sayfaya resim eklenebilir. - Sayfanın sağ üst kısmındaki "Düzenle"ye tıklayın. - Araç kutusunda "Resim" seçeneğini seçin veya sürükleyip bırakın.

HTML'de `step` niteliği, giriş elemanlarının değer değişiminin inceliğini kontrol etmek için kullanılır. Bu nitelik, sayı, tarih, saat veya aralık türü olan giriş elemanları için geçerlidir. `step` niteliğinin değeri, herhangi bir pozitif ondalık sayı veya `any` anahtarı olabilir; bu, belirli bir adım değeri olmadan herhangi bir değerin mümkün olduğu anlamına gelir.

Altı çizili metin oluşturmak için `<u>` etiketi kullanılır.

WordPress tema, HTML olarak görünüyor çünkü WordPress temaları, HTML ve CSS kullanılarak oluşturulur.

Blogger'da "Sonraki Kayıt" yazısını eklemek için aşağıdaki adımları izleyin: 1. Şablonu genişletin: Şablon düzenleyicisinde "Widget Şablonlarını Genişlet" seçeneğine tıklayın. 2. "newerpage" ifadesini arayın. 3. Bulduğunuz yeri değiştirmek istediğiniz ibare ile değiştirin. Örneğin, "Sonraki Kayıt" yazısını "Bir Sonraki Yazı" olarak değiştirmek isterseniz, ilgili kodu bulup yerine bunu yazabilirsiniz. Ayrıca, kayıt şablonu kullanarak da "Sonraki Kayıt" yazısı ekleyebilirsiniz. Bunun için: 1. Yazı yazma alanında bir cümle veya paragraf oluşturun. 2. Sol üst köşedeki "Oluştur/HTML" kısmından HTML sayfasına ulaşıp hazırladığınız imzanın HTML kodlarını kopyalayın. 3. Ayarlar menüsünden "Yayınlar, Yorumlar ve Paylaşım" sekmelerine tıklayarak kayıt şablonu bölümüne yapıştırın.

HTML5 web sayfalarının yapısını ve içeriğini tanımlamak için kullanılan en yeni ve gelişmiş HTML sürümüdür. İşe yarar yönleri şunlardır: 1. Multimedya Desteği: Video ve ses dosyalarını yerel olarak oynatabilir, bu da dışa bağımlı eklentileri ortadan kaldırır. 2. Semantik Etiketler: Sayfa yapısını daha anlamlı hale getiren etiketler sunar, bu da arama motorlarının sayfaları daha iyi anlamasını sağlar. 3. Web Uygulamaları için Destek: Modern web uygulamaları için web soketleri, yerel depolama ve offline çalışma gibi özellikler sunar. 4. Mobil Uyumluluk: Responsive tasarımlar için gerekli araçları sağlar, mobil cihazlarda web sayfalarının düzgün görüntülenmesini sağlar. 5. Form Geliştirmeleri: Formların daha işlevsel ve kullanıcı dostu olmasını sağlar, yeni form türleri ve istemci tarafı doğrulama işlemleri sunar. HTML5, web tasarımının her yönünü geliştirerek daha hızlı, güvenli ve etkili web siteleri oluşturulmasına olanak tanır.

PDF programında HTML'yi açmak için aşağıdaki yöntemler kullanılabilir: 1. Smallpdf Kullanarak: PDF dosyasını önce Word'e dönüştürün, ardından Microsoft Word'de "Dosya" menüsünden "Save as Web Page (.htm)" seçeneğini kullanarak HTML olarak kaydedin. 2. Calibre Kullanarak: PDF dosyasını Calibre ile HTML'ye dönüştürün, dönüştürme işlemi tamamlandıktan sonra HTML dosyasını WinRAR veya 7-Zip gibi bir programla çıkarılan klasörden alın. 3. LibreOffice Kullanarak: PDF dosyasını LibreOffice'te açın, "Dosya" menüsünden "Export" seçeneğini kullanarak XHTML (.html; .xhtml) formatında kaydedin. 4. HTML Gömme: Bir PDF dosyasını doğrudan HTML sayfasına gömmek için `<object>` veya `<iframe>` etiketlerini kullanabilirsiniz.

Index sayfasına resim eklemek için HTML'de `<img>` etiketi kullanılır. Kullanım şekli: ```html <img src="resim_yolu" alt="resme_alternatif_yazı"> ``` Burada: - src özelliği, resmin dosya yolunu belirtir. - alt özelliği, resmin yüklenemediği durumlarda gösterilecek alternatif metni ekler ve SEO için önemlidir. Örnek: ```html <img src="1.jpg" alt="resme alternatif yazı"> ```.

Webde öğeleri yan yana getirmek için iki ana yöntem bulunmaktadır: HTML kodları ve WordPress eklentileri. 1. HTML Kodları: CSS kullanarak div elemanlarını yan yana sıralamak mümkündür. 2. WordPress Eklentileri: - Blok Düzenleyici: WordPress'in Gutenberg blok düzenleyicisinde, görüntüleri yan yana görüntülemek için "Galeri" bloğu kullanılabilir. - Eklenti Kullanımı: Envira Gallery gibi bir eklenti de karmaşık galeriler oluşturmak için kullanılabilir.

HTML mail hazırlamak için aşağıdaki adımları izlemek gerekmektedir: 1. Tasarım Genişliği: Mailin genişliği 650 pikselden fazla olmamalıdır. 2. İçerik: Mail sadece resimlerden oluşmamalı, text-metin de içermelidir. 3. HTML Kodlama: Mailin HTML kodlamasında stiller `table` ve `td` gibi alanlar içerisinde yazılmalı, dışarıdan CSS dosya çağrılmamalıdır. 4. JavaScript ve ActiveX: Mailde JavaScript ve ActiveX kodları kullanılmamalıdır. 5. Meta Tags: HTML koduna `meta` etiketleri eklenmeli, örneğin: `<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">`. 6. Resimlerin Kullanımı: Kullanılan resim dosyaları kendi sunucunuza atılıp web ortamında kullanılmalı, resimlerin toplam boyutu 150-200 kb arasında olmalıdır. 7. Test Etme: Mailin farklı e-posta istemcilerinde nasıl göründüğünü test etmek önemlidir. Ayrıca, HTML mail oluşturma araçları kullanarak kodlamaya gerek kalmadan da profesyonel görünümlü mailler tasarlanabilir.

Veri girişi için farklı modüller kullanılabilir, bunlardan bazıları şunlardır: 1. Python'da `input()` fonksiyonu: Klavyeden veri girmek için kullanılır. 2. Microsoft Access: Veritabanı uygulamaları oluşturmak ve veri girişi yapmak için kullanılan bir programdır. 3. HTML formları: Web sitelerinde form doldurarak veri kaydı yapmak için kullanılır.

Okul web sitesinde video oynatma için HTML5 video etiketi kullanılabilir. Örnek kod: ```html <video width="500px" height="400px" controls> <source src="https://media.geeksforgeeks.org/wp-content/uploads/20231020155223/Full-Stack-Development-_-LIVE-Classes-_-GeeksforGeeks.mp4" type="video/mp4"> </video> ``` Bu kodda: - width ve height attributes'leri videonun boyutlarını belirler. - controls attribute'si, oynatma, duraklatma ve ses ayarları gibi kontrolleri ekler. - source etiketi, video dosyasının URL'sini ve formatını belirtir (type="video/mp4" çoğu tarayıcıda uyumluluk sağlar). Ayrıca, videoları iframe etiketi veya object element'i kullanarak da gömmek mümkündür.

İkonları HTML'ye çevirmek için birkaç yöntem bulunmaktadır: 1. Image Tag Kullanımı: En basit yöntem, <img> tag'ini kullanarak ikon görüntüsünü eklemektir. 2. SVG Kullanımı: Scalable Vector Graphics (SVG), yüksek kaliteli ve ölçeklenebilir ikonlar için tercih edilir. 3. Icon Font Kullanımı: Font Awesome gibi icon font kütüphaneleri, CSS ile stilize edilebilen simgeler sunar.

HTML'ye özel karakter eklemek için iki ana yöntem vardır: HTML varlıkları ve entity kodları. HTML varlıkları kullanarak özel karakter eklemek için: 1. Blok düzenleyicide yeni veya mevcut bir WordPress gönderisi açın. 2. Özel karakter için HTML varlık kodunu (örneğin, ticari marka sembolü için `&trade;`) bloğa yazın. 3. Değişiklikleri kaydetmek için "Güncelle" veya "Yayınla" düğmesine tıklayın. Entity kodları kullanarak özel karakter eklemek için: 1. HTML sayfanızın temel yapısını oluşturun: `<!DOCTYPE html>`, `<html>`, `<head>`, `<title>`, `<meta charset="UTF-8">`, `<body>`. 2. Body etiketi içinde, görüntülemek istediğiniz özel karakterin entity kodunu ekleyin (örneğin, telif hakkı sembolü için `&copy;`). 3. Sayfayı bir web tarayıcısında açarak kodların karşılık gelen sembollere dönüştüğünü kontrol edin.

HEX renk kodu, renklerin kodlara dökülmüş hali olarak tanımlanan altı basamaklı bir sayı ve harf kombinasyonudur. Bu kodlar, HTML ve CSS gibi programlama dillerinde belirli bir rengi tanımlamak için kullanılır.

Meta etiketler, HTML kodları arasında `<head>` etiketi içinde yer alır. İşaretleme örnekleri: 1. Meta Title (Başlık): Sayfanın başlığını belirler. 2. Meta Description (Açıklama): Sayfanın kısa bir açıklamasını içerir. 3. Meta Keywords (Anahtar Kelimeler): Sayfanın anahtar kelimelerini tanımlar (artık arama motorları tarafından pek dikkate alınmaz). Diğer meta etiketler arasında meta charset, meta viewport ve meta robots gibi etiketler de bulunur.

Yorum girişi farklı bağlamlarda farklı şekillerde yapılabilir: 1. Sunum Girişinde: İyi bir sunum girişi için şu yöntemler önerilir: - Dikkat çekici bir açılış cümlesi kullanmak. - Kısa bir hikaye anlatmak. - Bir soru sormak. - Giriş bölümünde sunumun yapısını tanıtmak. 2. HTML Yorum Girişi: HTML'de yorum girişi için `<!--` ve `-->` etiketleri kullanılır. Örneğin: `<!-- Bu bir yorumdur -->`.

HTML'de kahverengi rengi #A52A2A kodu ile yazılır.