Video Screencast 2025, Februari
Kami memiliki delapan tab navigasi tingkat atas, tetapi Beranda adalah satu-satunya yang "berfungsi". Supaya kami memiliki beberapa halaman untuk dikerjakan, kami menghentikan beberapa halaman untuk "
Sejauh yang saya ingat, saya menggunakan Google Code Prettify untuk menerapkan penyorotan sintaks pada blok kode pada CSS-Tricks. Anda tahu, di mana di baris seperti "
Kami baru saja menginstal Prism.js dan membuatnya berfungsi. Dalam screencast ini kami menemukan tema yang disebut Tema Besok dan memasukkan warna ke dalam sintaks "
Kami telah melakukan sedikit pekerjaan pada header, tetapi kami akan menggali lebih dalam tentang yang ada di screencast ini. Header adalah aspek yang sangat penting dari situs mana pun. Selesai dengan baik, "
Sekarang kita memiliki area posting blog untuk dikerjakan, kita benar-benar bisa masuk ke tipografi posting blog. Bisa dibilang tipografi paling penting di situs karena "
Saya pikir sangat menyenangkan memiliki file individual (.scss) yang digunakan untuk sebagian besar tipografi di situs. Normalisasi memiliki tipografi yang cukup banyak "
Typecast (dalam versi beta pada saat pembuatan film ini) adalah aplikasi web yang sangat rapi untuk bermain dengan tipografi web. Ini memberi Anda antarmuka yang bagus untuk bermain-main "
Melanjutkan konsep "Don't Overthink It Grids", kami mendapatkan talang di grid hanya dengan menggunakan beberapa padding sederhana. Kami menyimpan nomor padding "
Sebelum kita melakukan beberapa pekerjaan tipografi, saya pikir kita akan memperbaiki hal yang mengganggu di mana gambar-gambar itu keluar dari area artikel dan grid. Menggunakan "
Sekarang kita menjalankan domain lokal khusus, kita dapat menggunakan PHP. "P" di MAMP adalah untuk "PHP" =). Menggunakan PHP artinya kita bisa menggunakan include. Misalnya: "
Kita bisa menulis Sass @mixins kita sendiri untuk membantu hal-hal CSS3 (seperti gradien), tetapi ada kerangka Sass yang sudah ada yang disebut Kompas yang "
Desain situs sedang dibentuk menjadi sangat mirip kisi. Modul kami akan disusun dengan sangat rapi ke dalam kisi. Tapi bukankah grid itu rumit dan aneh? Dan mungkin kita "
Dalam screencast super cepat ini, kami menggunakan MAMP untuk menyiapkan URL yang dapat kami gunakan untuk pengembangan lokal. Ini berguna karena beberapa alasan: Kami dapat menautkan ke "
Kami memperkenalkan konsep kueri @media di CSS. Banyak hal yang menggunakan Sass pada proyek ini memungkinkan kita lakukan adalah tetap KERING (jangan ulangi diri Anda sendiri). Kita telah melakukannya"
Kita mulai dengan mengubah sedikit jenis logo, tapi kemudian menambahkan ikon ke navigasi utama. Saat kami merancang navigasi di Photoshop (Video "
Kami menyiapkan Kit baru di Typekit untuk v10. Untuk pencitraan merek, kami akan menggunakan Proxima Nova Soft untuk saat ini dan beberapa font lain yang mirip dengan font HF&J di "
Sejauh ini situs web yang sebenarnya sama sekali tidak terlihat seperti desain Photoshop kami. Dalam screencast ini kami menggali untuk melakukan hal itu, mulai dari atas dengan "
Kami menggunakan beberapa trik pemosisian untuk menyejajarkan tepi kiri logo dan area konten utama, sementara header masih menyentuh tepi kiri "
Menghapus CSS agen pengguna (default) dari sebagian besar elemen biasanya merupakan ide yang bagus. Ini telah lama dilakukan oleh penyetelan ulang "universal" atau hal-hal seperti Eric "
Sambil melihat mockup Photoshop kami, kami menulis mulai menulis HTML untuk menggambarkan apa yang kami lihat. Kami tentu saja menggunakan HTML5 setiap kali itu membuat "
Kami mulai memasukkan teks ke dalam navigasi utama, hanya untuk melihat bagaimana teks itu akan pas, mengerjakan ukuran, warna, dll. Beberapa teks cukup pas "
Kami jelas tidak "selesai" di Photoshop selamanya untuk desain ini, tetapi kami memiliki cukup pekerjaan untuk mulai membuat desain ini di browser. Setelah"
Kami mulai merancang navigasi tingkat atas (utama) situs. Kami memulai dengan layar ukuran desktop (dengan lebar yang memang boleh saja) tetapi kami "
Kami menambahkan beberapa lapisan ekstra di bawah kotak header / branding utama untuk memberikan tampilan "tumpukan kertas". Bukan metafora besar atau apa pun, itu hanya menambahkan beberapa visual "
Seluruh situs akan didasarkan pada "modul". Setiap hal kecil akan secara harfiah berada di dalam kotak (baik secara visual maupun dalam kode, pada akhirnya). Kita"
Ini adalah rekaman audio panggilan Skype antara Erin Kissane dan saya sendiri. Erin menulis buku tentang strategi konten jadi saya beruntung mendapatkan bantuannya dan "
Mendesain di browser itu keren dan semuanya, tetapi memulai di Photoshop membuat saya tetap kreatif saat saya paling membutuhkannya: saat menghadapi kanvas kosong. "
Selamat datang! Ini akan menjadi perjalanan yang menyenangkan, dan seperti semua perjalanan, yang ini dimulai dengan satu langkah. Langkah pertama kita adalah menginventarisasi sedikit "
Desain ulang ini bukanlah desain ulang hanya untuk mendesain ulang. Saya ingin meningkatkan situs dengan segala cara yang memungkinkan Anda dapat meningkatkan situs. Salah satu "
Kami sudah membicarakan tentang mengoptimalkan SVG dengan tangan. Membuat pilihan secara manual tentang detail dan hal-hal apa yang dapat digabungkan atau dihilangkan. Di dalam"