Numara: Ad: Soyad:
Aşağıdaki puanlama kritelerine uygun olarak yapılacak.png tasarımının HTML ve CSS kodlarını yazınız.
| PUANLAMA KRİTERLERİ | ||
| Zemin ve Genel Düzenleme | 15 | |
| Sayfanın genel içerik bölümünün 1200px genişliğinde olmasını sağlayın | ||
| Üst kısmın zemin renginin tasarımdaki gibi yapın | ||
| Orta kısmın zemin rengini tasarımdaki gibi geçişli yapın | ||
| Alt kısmın zemin renginin tasarımdaki gibi yapın | ||
| İçeriklerin sayfanın ortasında gelmesini sağlayın | ||
| Üst kısımdaki turuncu şeridi oluşturunuz | ||
| Alt kısımdaki turuncu şeridi oluşturunuz | ||
| Üst Bölüm | 30 | |
| Yazılım logosunun sayfanın sol üst kısımda yaklaşık 40px boşluklu olmasını sağlayın | ||
| Yazılım logosuna tıklayınca index.html sayfasına gitmesini sağlayın. | ||
| Menüyü liste etiketleri kullanarak oluşturun | ||
| Menüyü yatay olarak oluşturun | ||
| Her menü öğresi arasında eşit boşluk bırakın | ||
| Her menü öğesine tıklandığında ilgili sayfaya link verin(sayfanın olması şart değil) | ||
| Fare menü öğeleri üzerinde gezdiğinde web sekmesindeki gibi arkası turuncu olmasını sağlayın(hover) | ||
| Web sekmesinin seçili olasını sağlayın(aktif sekme olarak ayarlansın) | ||
| Orta Bölüm | 25 | |
| Sol bölümün içerik genişliğini 750px olarak ayarlayın | ||
| Sol bölümdeki içeriğin dışında 20px şeffaf alanı oluşturun | ||
| Başlık yazısı arkasına baslik-bg resmini uygulayın | ||
| Takvim, tarih ve yazar alanlarını tasarımdaki gibi oluşturun | ||
| İçerikteki resmin tasarımdaki gibi sayfaya yerleştrin | ||
| İçerikteki yazıyı tasarımdaki gibi (yazı ile resim arasıda boşluk olacak şekilde) yerleştirin | ||
| İki içerik arasında 30px boşluk bırakınız | ||
| Sol panel ile sağ panel arasındaki boşluğu oluşturunuz. | ||
| Sağ paneli 400px genişliğinde oluşturunuz | ||
| Sağ paneldeki yazı ile çerçeve arasındaki 30px boşluğu oluşturunuz. | ||
| Panel başlığı yanındaki gri alanı oluşturunuz | ||
| Panel başlı altındaki 2px yüksekliğindeki gri alanı oluşturunuz. | ||
| Panel içindeki arama formunu oluşturunuz. | ||
| İkinci paneli oluşturunuz | ||
| İkinci paneldeki video resmini oluşturunuz | ||
| Alt Bölüm | 30 | |
| Formun arkasındaki gri alanı oluşturunuz | ||
| Form nesneleri ile gri alan kenarları arasındaki boşluğu oluşturunuz | ||
| Form başlıkları ile form nesnelerini şekildeki gibi oluşturunuz | ||
| Formu gönder butonunu oluşturunuz | ||
| Formu gönder butonuna tıklandığında kayit.html sayfasını post yöntemi ile gitmesini sağlayınız | ||
| Sosyal medya sembollerini link olacak şekilde tasarımdaki gibi tasarlayınız. | ||
| Sosyal medya sembolleri arasında eşit şekilde boşluk bırakınız | ||
| Harita resmini tasarımdaki gibi ekleyiniz. | ||
YOK
Bu tasarımın HTML+CSS ile dreamweaver da yapılmış dosyaları lazım elinizde varsa verir misiniz ?