Ben Veysel Kaan ALBOSTAN. Lisans Eğitimini programlama üzerine tamamladıktan sonra Gazi Üniversitesi Adli Bilişim bölümünde yüksek lisansımı yaptım. Yaklaşık 15 senedir programlamanın içerisindeyim. Kendini programlama alanında geliştirmek isteyenlere online olarak destek vermekteyim.
HTML5’in web tasarım alanına girmesiyle beraber artık tasarım yapmak hem daha kolaylaştı hem de görsel olarak programcıya ve kullanıcıya bir çok fayda sağladı. Bir çok basit editörün bile HTML kodlayabileceği bu alanda sizler de kolayca tasarım yapabileceksiniz.
HTML5 sayesinde web siteleri hazırlayabilir web sayfaları için güzel tasarımlar yapabilirsiniz. HTML olarak kullanılan editörler siz programcıların işini kolaylaştırarak yardımcı kod tamamlama sistemi ile hatasız kod yazabilme imkanı veriyor.
Peki HTML5 Bilgi Paketi içerisinde neler var biraz bahsetmek istiyorum. Web Tasarımı ve web programlama hakkında kısaca bilgi verdikten sonra web sitesi yapmak için gereken hazırlıklar anlatıldı. Domain, Hosting gibi kavramların neler olduğunu, web tasarımında dikkat edilmesi gereken özellikler neler bunlar hakkında bilgi verildi. Metin düzenleme işlemleri, tablo işlemleri, listeleme işlemleri ve form işlemleri anlatıldıktan sonra CSS hakkında bilgi verildi. Sitelerin duyarlılık kavramından da bahsedildikten sonra bilgi paketi tamamlandı.
Videolar 10-15 dakika aralığında sizlerin sıkılmadan izleyebileceği bir şekilde hazırlandı. Akıcı bir dil kullandım. Anlatımları örneklerle pekiştirdim. Hiç programlama bilgisi olmayan birisi bile bu videolar sayesinde programlama yeteneğine sahip olacak. Hadi o zaman başlayalım.
Aktiviteler
Sorbil üzerinden HTML öğrenmenizi kolaylaştıracak ve eğitim deneyiminizi iyileştirecek, yapabileceğiniz aktiviteler:
1. Temel HTML Yapısı: Bir HTML belgesinin temel yapısını oluşturarak başlık, paragraf ve altı çizili metin gibi temel etiketleri kullanma.
2. Bağlantılar ve Linkler: Farklı sayfalara yönlendiren bağlantılar oluşturma ve resimleri tıklandığında başka bir sayfaya yönlendiren linkler yapma.
3. Sırasız ve Sıralı Listeler: HTML'de sırasız ve sıralı listeler oluşturma (ul, ol) ve bu listeleri iç içe kullanma.
4. Form ve Input Elementleri: Kullanıcıdan bilgi almak için HTML formu oluşturma ve farklı input tipleri (metin kutusu, şifre, radyo düğmeleri vb.) kullanma.
5. Tablolar ve Tablo Başlıkları: Tablolar oluşturma ve başlık sütunları ekleyerek içerikleri tabloda düzenleme.
6. Resim ve Video Ekleme: HTML belgesine resim ve video ekleyerek medya içerikleri görüntüleme.
7. Biçimlendirme ve CSS: Temel CSS stil özellikleri kullanarak metinleri ve paragrafları biçimlendirme (renk, font, boyut vb.).
8. Gömülü Ses ve Video: HTML5'in ses ve video etiketlerini kullanarak ses ve video içeriklerini sayfaya yerleştirme.
9. HTML Meta Etiketleri: Sayfa başlığı, meta açıklaması ve karakter seti gibi önemli meta etiketlerini kullanma.
10. HTML Semantic Elementler: HTML5'in semantic elementlerini (header, footer, article, section vb.) kullanarak sayfaları yapılandırma ve düzenleme.
Egzersizler (Zorunlu değildir)
Eğitimden alacağınız verimi arttırmak için, size opsiyonel egzersizler hazırladık. Uluslararası sertifikanızı almanız için bu egzersizleri tamamlamanız şart değildir, bu egzersizler sizin eğitim deneyiminizi iyileştirmek için oluşturulmuştur, belirttiğimiz gibi egzersizleri tamamlamanız zorunlu değildir. Bu eğitim için farklı egzersizler isterseniz, info@sorbil.org adresine e-mail atmanız yeterlidir. Ekibimiz size farklı egzersizler iletecektir.
1: HTML nedir?
A) Hypertext Markup Language
B) Hyperlink Text Manipulation Language
C) Hyper Tool for Manipulating Links
D) Home Tool Markup Language
2: HTML belgesi başlangıç etiketi nedir?
A) <html>
B) <body>
C) <head>
D) <title>
3: HTML belgesi içinde başlık etiketi kullanmak için hangi etiket kullanılır?
A) <h1>
B) <heading>
C) <title>
D) <header>
4: Bir bağlantı oluşturmak için hangi etiket kullanılır?
A) <url>
B) <link>
C) <a>
D) <href>
5: Resim eklemek için hangi etiket kullanılır?
A) <img>
B) <picture>
C) <image>
D) <photo>
6: Sırasız bir liste oluşturmak için hangi etiket kullanılır?
A) <ol>
B) <li>
C) <ul>
D) <list>
7: HTML form elemanları içinde kullanılan bir metin kutusu oluşturmak için hangi etiket kullanılır?
A) <input type="checkbox">
B) <input type="radio">
C) <input type="text">
D) <input type="button">
8: Bir tablo oluşturmak için hangi etiket kullanılır?
A) <table>
B) <tr>
C) <td>
D) <tab>
9: CSS'in tamamıyla açılımı nedir?
A) Computer Style Sheets
B) Cascading Style Sheets
C) Creative Style Sheets
D) Colorful Style Sheets
10: Bir HTML belgesine CSS stil dosyası eklemek için hangi etiket kullanılır?
A) <css>
B) <style>
C) <script>
D) <link>
Cevaplar:
1. A) Hypertext Markup Language
2. A) <html>
3. A) <h1>
4. C) <a>
5. A) <img>
6. C) <ul>
7. C) <input type="text">
8. A) <table>
9. B) Cascading Style Sheets
10. D) <link>