Dijital Ürün Geliştirme

Bu derste ne öğreneceğiz?

Bu derste, dijital ürünlerin nasıl geliştirileceğini öğreneceğiz. HTML, CSS ve temel web tasarımı hakkında bilgi sahibi olacağız. Ayrıca, basit bir web sayfası oluşturmayı deneyimleyeceğiz.

Temel kavramlar

Dijital ürün geliştirme sürecinde bazı temel kavramlar bulunmaktadır:

• HTML (HyperText Markup Language): Web sayfalarının yapısını oluşturan işaretleme dilidir.
• CSS (Cascading Style Sheets): Web sayfalarının görünümünü ve stilini belirleyen bir dildir.
• Web Tarayıcısı: HTML ve CSS kodlarını yorumlayarak kullanıcıya görsel olarak sunan yazılımdır.

Ayrıntılı anlatım

Dijital ürün geliştirme süreci, genellikle aşağıdaki adımları içerir:

1. Planlama: Hedef kitlenizi belirleyin ve ürününüzün amacını tanımlayın.
2. Tasarım: Ürününüzün görsel tasarımını oluşturun. Bu aşamada wireframe (taslak) kullanabilirsiniz.
3. Geliştirme: HTML ve CSS kullanarak web sayfanızı oluşturun.
4. Test: Ürününüzü farklı cihazlarda ve tarayıcılarda test edin.
5. Yayınlama: Web sayfanızı bir sunucuya yükleyerek erişilebilir hale getirin.

Çözümlü örnekler

Şimdi basit bir HTML sayfası oluşturalım. Aşağıdaki kodu bir metin editörüne yapıştırarak kaydedin ve .html uzantısıyla kaydedin:

<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <title>Benim İlk Web Sayfam</title>
</head>
<body>
    <h1>Merhaba Dünya!</h1>
    <p>Bu benim ilk web sayfam.</p>
</body>
</html>

Bu kodu kaydettikten sonra tarayıcınızda açtığınızda "Merhaba Dünya!" yazısını göreceksiniz.

Sık yapılan hatalar

Dijital ürün geliştirme sürecinde sıkça karşılaşılan hatalar şunlardır:

• HTML etiketlerinin yanlış kapatılması.
• CSS dosyalarının doğru bağlanmaması.
• Web sayfasının mobil uyumlu olmaması.

Uygulama

Şimdi kendi web sayfanızı oluşturma zamanı! Aşağıdaki adımları takip edin:

1. Bir metin editörü açın (örneğin Notepad veya Visual Studio Code).
2. Yukarıdaki örnekteki HTML kodunu kopyalayın ve yapıştırın.
3. Sayfanıza bir başlık ve birkaç paragraf ekleyin.
4. Sayfanızı .html uzantısıyla kaydedin ve tarayıcınızda açın.

Mini test

Aşağıdaki soruları yanıtlayarak öğrendiklerinizi pekiştirebilirsiniz:

1. HTML nedir?
2. CSS ne işe yarar?
3. Bir web sayfası oluşturmak için hangi dilleri kullanırız?
4. Web sayfasının mobil uyumlu olması neden önemlidir?
5. Bir web sayfasını test etmenin önemi nedir?

Cevap anahtarı

1. Web sayfalarının yapısını oluşturan işaretleme dilidir.
2. Web sayfalarının görünümünü ve stilini belirler.
3. HTML ve CSS kullanırız.
4. Farklı cihazlarda düzgün görünmesi için önemlidir.
5. Hataları bulup düzeltmek için gereklidir.

Özet

Bu derste dijital ürün geliştirme sürecini öğrendik. HTML ve CSS'in temel kavramlarını inceledik ve basit bir web sayfası oluşturduk. Unutmayın, dijital ürün geliştirme sürekli bir öğrenme sürecidir.