Selepas kekeliruan pelik dalam video terakhir mengenai tajuk mana yang sebenarnya kita lakukan, kali ini kita benar-benar akan melaksanakan tajuk utama untuk halaman Tawaran! Yang ini dilakukan oleh Meg Hunt.
Seperti semua tajuk, kami meluangkan masa untuk melihat fail asalnya dan mencari tahu cara terbaik untuk duduk di halaman. Kami mencuba beberapa pilihan, tetapi akhirnya memutuskan untuk meletakkannya di dalam kotak terkawal adalah yang terbaik (berbanding dengan tajuk seperti Demo header di mana header mencair menjadi sempadan di sekitar kandungan.
Semasa mengeksportnya, kami bermain dengan banyak format grafik yang berbeza. Gaya khas ini, menarik, kira-kira sama dalam kualiti dan ukuran fail antara PNG dan JPG.webp. Kami mengeluarkannya pada lebar 2000px, yang seharusnya kelihatan bagus di mana-mana skrin. Kami juga mencapai kira-kira 150k, yang besar tetapi untuk grafik wira seperti ini, adalah sasaran yang baik.
Kami mula mendapatkan templat untuk urutan urutan, termasuk melihat bagaimana urus niaga setiap bidang tersuai yang dirawak sebelum dihasilkan. Kami akan menghabiskan lebih banyak masa untuk markup ini dan semua itu kemudian, tetapi kerana kami berada di templat ini untuk menyiapkan tajuk, kami juga dapat membersihkannya.
Kami melihat beberapa kemungkinan untuk meletakkan grafik tajuk khusus ke halaman. Gambar latar belakang paling masuk akal, kerana kita menggunakan semantik
untuk penggantian tajuk dan gambar. Menggunakannya background-size, kami periksa cover, tetapi itu boleh menyebabkan pemotongan. Kami memeriksa mengandungi, tetapi itu membenarkan ruang di luar. 100%melakukan silap mata, tetapi kita perlu membuat kotak gaya nisbah aspek untuk menjadikannya berfungsi dengan baik. Itu mudah walaupun, kita hanya membuat ketinggian 0 dan menggunakan peratusan bahagian atas untuk membuatnya berfungsi (kotak empuk).
Ini adalah tajuk utama ketujuh yang telah kami lakukan dan setiap satu daripadanya dilakukan dengan cara yang berbeza. Reka bentuk laman web, eh? Apa perjalanan.