Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir eğitmen tarafından sunulan web sitesi tasarım eğitimidir. Eğitmen, Dreamweaver programında CSS şablonu oluşturma sürecini adım adım göstermektedir.
- Video, web sitesi tasarımının temel aşamalarını kapsamaktadır. Önce kağıt üzerinde web sitesi eskizi çizilerek kapsayıcı kutu, menü kutusu, içerik kutusu ve reklam kutusu gibi temel bölümler belirlenir. Ardından Dreamweaver'da bu şablonun nasıl oluşturulacağı, div etiketlerinin nasıl ekleneceği ve CSS kurallarının nasıl tanımlanacağı gösterilir. Eğitmen, reset dosyasının önemi, div boyutlarının ayarlanması ve float özelliğinin kullanımı gibi teknik detayları da açıklamaktadır.
- 00:01Web Sitesi Tasarımının Hazırlığı
- Web sitesi tasarımı yapmadan önce kağıt üzerine eskiz çizilir.
- Tüm sitelerde kapsayıcı bir div kutusu bulunur ve bu kutunun içine menü, reklam ve içerik kutuları yerleştirilir.
- Tasarım için yatay menü kutusu, içerik kutusu, reklam alanı ve sağda alt menülerin yer aldığı kutu gibi altı farklı kutu kullanılır.
- 01:53Dreamweaver'da Site Oluşturma
- Tasarım Dreamweaver'da yapılır ve önce sistem tanımlanır.
- Yeni site oluşturulurken CSS şablon adı verilir ve dosya farklı kaydedilir.
- Tasarım modunda 980 piksel genişlik belirlenir.
- 02:57HTML Yapısı Oluşturma
- Mizanpajdan bölüm etiketi eklenerek kapsayıcı kutusu oluşturulur.
- Kapsayıcı içine üst menü, içerik kapsayıcı, sol içerik ve reklam kutusu gibi div'ler eklenir.
- Reklam kutusunun içine üç adet aynı boyutlu reklam kutusu (class olarak tanımlanır) eklenir.
- 08:37CSS Stil Tanımlamaları
- Reset dosyası CSS klasörüne eklenir ve stil sayfası oluşturulur.
- Kapsayıcı için 980 piksel yükseklik, otomatik genişlik, padding ve margin right/left auto değerleri verilerek ekranın ortasına yerleştirilir.
- Üst menü, içerik kapsayıcı ve reklam kutusu için benzer stil tanımlamaları yapılır, içerik kutusunun float left özelliği verilerek yan yana yerleştirilir.