Lynda.com Kujundage veebi HTML-taustavideo

• Aprill 25, 2024

Taustavideo on suurepärane viis oma toote turustamiseks ja sellel Lynda.com videokoolitusel pealkirjaga Kujundage veeb: HTML-i taustvideo koos Chris Conversega saate teada, kuidas oma veebisaidile automaatse esituse taustvideot lisada. Samuti saate teada, kuidas kasutada CSS-i muude kujunduselementide paigutamiseks taustavideole. Ja treeningfailid on tasuta isegi tavalise liikmelisuse korral.

Converse algab paljaste luudega html-failiga ja ehitab peamise div-konteineri kujunduselementide jaoks: teksti sildiriba, logo svg ja video. Ta tutvustab, kuidas kasutada videomärgendis automaatse esituse funktsiooni ja kuidas seadistada kahte kõige tavalisemat tüüpi videot .mp4 ja .ogg.

Järgmisena liigub Converse video CSS-failidele ja CSS-ile, et stiilida ja paigutada video ja tsentreeritud logo pilt. Ta liigub edasi, et teha sama sildi tekstiga. Eriti meeldis mulle tema tehnika piiridega töötamiseks.

Seejärel arutab Converse, kuidas muuta see paigutus reageeritavaks, kasutades meediumipäringuid keskmise ja väikese ekraani ning CSS-i jaoks. Ta jällegi seab ta stiilid video, logo ja sildi jaoks. Samuti demonstreerib ta, kuidas seada asenduspilt väikestele ekraanidele, mis ei saa videot esitada, ja videot varjata.

Liikudes keerukamate probleemide juurde, demonstreerib Converse, kuidas kasutada JavaScripti, et lisada mobiilseadmete funktsioonide (nt puuteüritused) kuvari jaoks keerukam kontroll. Ta tutvustab kolmanda osapoole veebisaiti Modernizr, mis loob CSS-klassid, mida saab JavaScripti kaudu lehele lisada, lähtudes praeguse seadme omadustest. Ta näitab, kuidas koodi genereerida, seda oma veebisaidi koodile alla laadida ja lisada.

Viimases õppetunnis demonstreerib Converse, kuidas kodeerida paigutuse asukoht ja muud stiilid nii, et video kataks kogu brauseriakna.

See kursus oli HTML-i ja CSS-i kohta, mida kasutati veebi- ja mobiilseadmete taustavideo kujundamiseks ja paigutamiseks. Lootsin siiski, et autor arutab videofaili kiireks allalaadimiseks hostimise ja optimeerimise võimalusi. Samuti oleks tore teada, kuidas lisada taustvideole interaktiivseid kujunduselemente, mitte lihtsalt staatilisi elemente.

Chris Converse on omandanud kraadi graafilise disaini alal Rochesteri Tehnikainstituudis ning 22-aastane kogemus disaini ja tehnoloogia alal.

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

Avalikustamine: mulle ei makstud selle artikli eest rahalist hüvitist. Minu kogemuste põhjal on arvamused täiesti minu oma.

Video Juhiseid: Honest Reviews: Should I Subscribe to Lynda.com | Online Continuing Education for Creatives (Aprill 2024).