Setelah kebingungan aneh di video terakhir tentang tajuk mana yang sebenarnya kami lakukan, kali ini kami benar-benar akan menerapkan tajuk khusus untuk laman Transaksi! Yang ini dilakukan oleh Meg Hunt.
Seperti semua tajuk, kami meluangkan waktu untuk melihat file asli dan mencari tahu cara terbaik untuk menempatkannya di halaman. Kami mencoba beberapa opsi, tetapi pada akhirnya memutuskan meletakkannya di kotak terbatas adalah yang terbaik (berlawanan dengan sesuatu seperti tajuk Demo di mana tajuk melebur menjadi batas di sekitar konten.
Saat mengekspornya, kami bermain dengan banyak format grafik yang berbeda. Menariknya, gaya khusus ini hampir sama dalam kualitas dan ukuran file antara PNG dan JPG.webp. Kami mengeluarkannya dengan lebar 2000px, yang akan terlihat bagus di layar mana pun. Kami juga mencapai sekitar 150k, yang besar tetapi untuk grafik pahlawan seperti ini, adalah target yang OK.
Kami mulai mendapatkan template untuk transaksi secara berurutan, termasuk melihat bagaimana penawaran masing-masing bidang khusus yang diacak sebelum dikeluarkan. Kami akan menghabiskan lebih banyak waktu untuk markup ini dan semua itu nanti, tetapi karena kami berada di template ini menyiapkan semuanya untuk tajuk, kami mungkin juga membersihkannya.
Kami melihat beberapa kemungkinan berbeda untuk meletakkan grafik header kustom ke halaman. Gambar latar belakang paling masuk akal, karena kita menggunakan semantik
untuk penggantian judul dan gambar. Menggunakan background-size
, kami memeriksa cover
, tetapi itu dapat menyebabkan pemutusan hubungan kerja. Kami memeriksa berisi, tetapi itu memungkinkan ruang di luar. 100%
melakukan trik, tapi kita perlu membuat kotak gaya rasio aspek agar berfungsi dengan baik. Itu mudah, kami hanya membuat tinggi 0 dan menggunakan persentase bantalan atas untuk membuatnya berfungsi (kotak empuk).
Ini adalah tajuk khusus ketujuh yang telah kami lakukan dan semuanya dilakukan secara berbeda. Desain web, ya? Perjalanan yang luar biasa.