Lynda.com Merancang Video Latar Belakang HTML Web

• Mungkin 9, 2024

Video latar belakang adalah cara terbaik untuk memasarkan produk anda dan dalam kursus latihan video Lynda.com yang bertajuk Reka Bentuk Web: Video Latar Belakang HTML dengan Chris Converse anda akan belajar bagaimana untuk menambah video latar belakang autoplay ke halaman web anda. Anda juga akan belajar cara menggunakan CSS untuk meletakkan elemen reka bentuk lain di atas video latar belakang. Dan fail latihan adalah percuma walaupun keahlian Standard.

Converse bermula dengan fail html tulang terdedah dan membina kontena utama untuk elemen reka bentuk: tagline teks, logo svg dan video. Dia menunjukkan bagaimana cara menggunakan autoplay dalam tag video dan bagaimana untuk menetapkan dua jenis video, .mp4 dan .ogg yang paling biasa.

Seterusnya, Converse bergerak ke fail CSS dan CSS untuk gaya dan meletakkan video dan imej logo berpusat. Dia bergerak untuk melakukan perkara yang sama untuk teks tagline. Saya sangat menyukai tekniknya untuk bekerja dengan sempadan.

Pertandingan kemudian membincangkan cara membuat susun atur ini responsif menggunakan pertanyaan media untuk skrin sederhana dan kecil dan CSS. Sekali lagi, dia menetapkan gaya untuk video, logo dan tagline. Dia juga menunjukkan bagaimana untuk menetapkan imej pengganti untuk skrin kecil yang tidak dapat memainkan video dan menyembunyikan video.

Beralih kepada isu yang lebih rumit, Converse menunjukkan bagaimana menggunakan JavaScript untuk menambah kawalan yang lebih kompleks ke atas paparan untuk ciri-ciri peranti mudah alih, seperti peristiwa sentuh. Beliau memperkenalkan laman web pihak ketiga yang dipanggil Modernizr yang akan menjana kelas CSS yang boleh ditambah ke halaman melalui JavaScript berdasarkan ciri-ciri peranti semasa. Dia menunjukkan cara untuk menghasilkan kod itu, muat turun dan tambahkannya ke kod halaman web anda.

Dalam pelajaran terakhir, Converse menunjukkan bagaimana untuk mengodkan kedudukan dan gaya lain untuk susun atur agar video itu meliputi keseluruhan tetingkap penyemak imbas.

Kursus ini adalah tentang HTML dan CSS yang digunakan untuk gaya dan meletakkan video latar belakang untuk peranti web dan mudah alih. Walau bagaimanapun, saya berharap pengarang akan membincangkan pilihan untuk hosting dan mengoptimumkan fail video untuk dimuat turun dengan cepat. Selain itu, lebih baik untuk mengetahui bagaimana untuk menambah elemen reka bentuk interaktif di atas video latar belakang dan bukan hanya elemen statik.

Chris Converse mempunyai ijazah dalam reka bentuk grafik dari Institut Teknologi Rochester dan 22 tahun pengalaman dalam reka bentuk dan teknologi.

//www.lynda.com/HTML-tutorials/Design-Web-HTML-Background-Video/373560-2.html

Pendedahan: Saya tidak diberi pampasan kewangan untuk artikel ini. Pendapat saya sendiri berdasarkan pengalaman saya.

Arahan Video: Cara Membuat Website dengan Dreamweaver dan Photoshop part 10 - Membuat Banner dan Halaman Utama (Mungkin 2024).