Share
Deși realizarea unui site complet bazat pe Flash nu este o idee bună pentru o varietate de motive, asta nu înseamnă că nu trebuie să utilizați Flash deloc. Îmi place să mă gândesc la Flash ca pe un condiment. Punerea unor mirodenii aici și acolo ar putea îmbunătăți gustul site-ului dvs., făcându-l mai plăcut și mai interactiv pentru vizitatorii dvs. Desigur, după cum știm cu toții, punerea prea multor mirodenii în vasul nostru poate aduce probleme. Deci, Flash ar trebui folosit cu moderatie. Să vedem cum se poate face acest lucru.
Scopul fiecărui site web este un conținut pe care oamenii îl pot citi și se bucură și care este, de asemenea, înțeles de motoarele de căutare și de roboți. Deci, unele Flash sunt aproape întotdeauna bine. Dar prea multă Flash este mai puțin utilă pentru motoarele de căutare, față de HTML. Mediile Flash pot fi incluse oriunde într-o temă WordPress: în antet, într-un post sau într-o pagină, într-o bară laterală sau în subsol. Depinde în totalitate de dvs. și de preferințele și nevoile dvs. personale. Lucrul cu adevărat important nu este locul în care o veți folosi mai degrabă decât modul în care îl veți folosi. Și acesta este scopul acestui tutorial. Pentru a vă arăta diferite modalități de încorporare a suporturilor Flash în site-urile web alimentate cu WordPress și cum să efectuați corect aceste metode. Să începem cu cea mai esențială, care este o bază pentru ceilalți.
SWFObject este o bibliotecă JavaScript care oferă două metode optimizate pentru a încorpora fișiere SWF în pagini web - o abordare bazată pe marcare și o metodă care se bazează pe JavaScript. Utilizează JavaScript neobișnuit pentru a detecta Flash Player și pentru a evita conținutul SWF defect și este proiectat pentru a face ca fișierele SWF să fie cât mai ușor de încorporat. Acesta acceptă utilizarea conținutului alternativ pentru a afișa conținut persoanelor care navighează pe web fără pluginuri, pentru a ajuta motoarele de căutare să indexeze conținutul dvs. sau pentru a îndrepta vizitatorii către pagina de descărcare a Flash Player. Toate acestea sunt alimentate de un mic fișier JavaScript.
SWFObject este cea mai populară și mai eficientă metodă de încorporare Flash disponibilă astăzi. Este utilizat pe scară largă de către site-uri web de înaltă calitate, cum ar fi YouTube, Microsoft Windows și Skype.
Deoarece trebuie să dai seama ce marcaj și cod JavaScript să folosești poate fi un loc de muncă plictisitor, SWFObject îți oferă un generator suplimentar SWFObject pentru a face acest lucru pentru tine. Puteți găsi cele mai recente versiuni ale SWFObject și SWFObject Generator pe Google Code. Descărcați SWFObject și versiunea HTML a generatorului SWFObject. Principala diferență între versiunile HTML și AIR este aceea că ultima are funcționalitate copy-to-clipboard și poate salva pagina HTML pe hard disk.
Când extrageți conținutul swfobject_2_2.zip veți primi un dosar numit SWFObject care conține următoarele fișiere:
De asemenea, puteți descărca fișierul SWF pe care îl vom folosi pe tot parcursul tutorialului la Free Flash Animations. Redenumiți-o nosmoke.swf pe scurt.
O.K. Totul este gata. Sa trecem peste.
Acum trebuie să încărcați toate fișierele necesare pe serverul dvs. Acestea sunt swfobject.js, expressInstall.swf și nosmoke.swf. Plasați-le în interiorul dosarului tematic activ. În acest caz, acesta este douazeci unsprezece temă. Dacă aveți mulți .swf fișiere pe care le puteți pune în interiorul unui subdosar.
Pentru a crea și introduce codul necesar în WordPress urmați acești pași:
Accentsconagua
în secțiunea corp a codului. Totul de la la este selectat. Copiați-l.
- În bara laterală a tabloului de bord WordPress, dați clic pe săgeata din partea dreaptă a Aspectului. Apoi, faceți clic pe Editor.
- În partea dreaptă a ecranului, aveți acum o listă cu toate șabloanele care sunt în directorul rădăcină al dosarului tematic. Faceți clic pe titlul dorit .php (în acest caz footer.php). Aceasta îl încarcă în Editorul de teme.
- Lipiți codul pe care l-ați copiat de la generatorul de cod în fișierul șablon corespunzător. În acest exemplu chiar deasupra
- Pentru conținutul capului, selectați și copiați următoarele:
- Înapoi în WordPress, deschideți-vă header.php dând clic pe Aspect> Editor> header.php. Lipiți textul selectat în secțiunea cap de deasupra
Generatorul de coduri creează codul pentru dvs. pe baza alegerilor pe care le faceți. Acesta generează codul în structura de bază a unei pagini HTML. Codul generat este compatibil cu standardele web și sprijină încorporarea conținutului alternativ. Elementele JavaScript din este creată o etichetă care menține obiectul și informația / metoda obiect imbricat care delimitează ce .swf trebuie să se joace, lățimea și înălțimea acestuia și ce conținut alternativ trebuie să fie afișat dacă versiunea Flash Player corespunzătoare nu este găsită. Rețineți că codarea specială este utilizată pentru a răspunde nevoilor Internet Explorer, de exemplu: Acum nosmoke.swf animația va apărea pe fiecare pagină de sub subsol. Desigur, acesta este un exemplu fals, dar îl folosesc pentru scopuri de prezentare numai pentru că se poate face mai repede și mai ușor. Evident, va trebui să adăugați niște reguli de stil pentru a avea un aspect mai bun. Veți vedea cât de curând.
Pasul 4 Explicarea configurației SWFObject
Învățare statică vs. dinamică
Publicarea statică folosește marcarea pentru a încorpora atât conținutul SWF, cât și conținutul alternativ și utilizează JavaScript neobișnuit pentru a rezolva o serie de probleme care nu pot fi rezolvate numai cu marcare. Aceasta promovează autorizarea efectivă a marcajelor care respectă standardele și va atrage, în consecință, în special dezvoltatorii de standarde web. Acest mecanism de încorporare a conținutului Flash nu se bazează pe un limbaj de scripting, astfel încât conținutul dvs. Flash poate ajunge la un public semnificativ mai mare. Dacă aveți instalat pluginul Flash, dar aveți JavaScript dezactivat sau utilizați un browser care nu acceptă JavaScript, veți putea totuși să vedeți conținutul dvs. Flash.
Publicarea dinamică utilizează marcarea pentru a defini numai conținutul alternativ și utilizează JavaScript discret pentru a înlocui acest lucru cu SWF dacă este instalată versiunea minimă Flash Player și este disponibil un suport suficient pentru JavaScript. Publicarea dinamică este mai puțin verbală decât publicarea statică și se integrează foarte bine cu aplicațiile scripted. Dacă aveți instalat un plug-in Flash, dar ați dezactivat JavaScript sau dacă utilizați un browser care nu acceptă JavaScript, veți vedea conținutul alternativ în locul conținutului încorporat Flash.
Trebuie să decideți care este soluția cea mai bună pentru dvs., în funcție de obiectivele și nevoile dvs..
Utilizarea programului Adobe Express Install
Adobe Express Install este un mecanism integrat în Flash Player, care vă permite să descărcați direct cea mai recentă versiune a plug-in-ului Flash fără a fi nevoie să navigați pe site-ul Adobe. Express Install este o caracteristică opțională pentru autorii web și afișează o casetă de dialog standardizată pentru descărcare atunci când un vizitator a instalat deja Flash Player 6.0.65 sau o versiune ulterioară pe platforme Win sau Mac, dar este necesară o versiune ulterioară cu plug-in. Express Install utilizează o fereastră de confirmare pop-up și, prin urmare, este o caracteristică opțională care poate fi activată de autorii web. Dacă faceți clic pe Da, Express Install va deschide o casetă de dialog pentru descărcare cu cererea de a închide toate ferestrele browserului. După instalarea Flash Player, acesta va redeschide fereastra browserului dvs. și vă va redirecționa către pagina unde a fost inițiată instalarea Express. Dacă faceți clic pe Nu, SWFObject va reveni la conținutul alternativ.
Puteți activa Express Install, bifând caseta de selectare Adobe Express Install și ajustând calea către expressInstall.swf fișier, dacă este necesar. Pentru a testa dacă funcționează această funcție și pentru a vedea în acțiune, faceți acest mic truc - schimbați versiunea Flash necesară la ceva mai mare decât cea mai recentă versiune Flash Player (de exemplu, 14.0.0). Și veți obține acest rezultat:
Mesajul vă spune că conținutul necesită Adobe Flash Player 11.1, deoarece aceasta este de fapt cea mai recentă versiune a pluginului (în momentul de față), iar versiunea 14.0 nu există încă.
Pasul 5 Explicarea SWFObject explicată
În generatorul SWFObject puteți găsi o mulțime de atribute suplimentare și parametri disponibili pentru dvs. Ele sunt ascunse în mod implicit. Deci, pentru a obține acces la ele, faceți clic pe "mai mult" în partea de jos a zonei de definiție SWF. După aceea, ar trebui să vedeți următoarele:
În funcție de alegerile făcute aici, conținutul dvs. Flash se va comporta și va arăta diferit. Pentru o descriere a ceea ce face un anumit atribut sau parametru, plasați cursorul peste numele acestuia.
Atributul nume este util atunci când trebuie să faceți referire la filmul dvs. Flash utilizând limbajul de scripting. După cum am spus mai devreme, ar putea fi necesar să adăugați un stil suplimentar conținutului Flash. Pentru aceasta, adăugați o valoare pentru atributul de clasă, cum ar fi "flashmovie". Această clasă va fi adăugată la elementul tag al obiectului din codul dvs. generat. Deci, acum trebuie doar să adăugați următoarea regulă de stil în foaia de stil temă:
object.flashmovie // codul dvs. css aici
Pasul 6 Folosind Generatorul Online SWF Embed
Există o altă modalitate ușoară de a obține codul de detectare necesar - utilizând un generator online. Un bun poate fi găsit la embed-swf.org. Este bazat pe SWFObject HTML și JavaScript Generator. Pentru a procesa urmați acești pași:
- Deschideți Configuratorul. Interfața este împărțită în cinci file.
- Introduceți parametrii doriți în fiecare filă
- Faceți clic pe fila Export. Aici puteți alege un șablon de export. Dacă doriți să utilizați propriul șablon HTML, alegeți Particularizat. Pentru a afla cum să creați una, verificați documentația.
- Faceți clic pe Afișați cod HTML. Codul HTML apare. Faceți clic pe Descărcare pentru a salva fișierul pe hard disk.
Dacă aveți nevoie, puteți oricând să restabiliți setările implicite făcând clic pe link-ul din colțul din stânga sus. De asemenea, aveți opțiunea de a exporta / importa setările salvate pentru reutilizare ușoară.
Nu trebuie să vă faceți griji cu privire la swfobject.js fişier. Trebuie doar să lăsați opțiunea implicită pentru subiectul SWFO care va folosi swfobject.js fișier găzduit de Google.
Pasul 7 Utilizarea tehnologiei Kimili Flash Embed
Potrivit site-ului său, Kimili Flash Embed este:
... un plugin pentru sisteme de blogging populare open source, care vă permite să plasați cu ușurință filme Flash pe site-ul dvs. Construit pe baza codului JavaScript SWFObject, este compatibil cu standardele, este prietenos cu motoarele de căutare, extrem de flexibil și plin de funcții, precum și ușor de utilizat.
Instalarea pluginului este ușoară:
- În tabloul de bord, extindeți meniul Pluginuri și faceți clic pe Adăugați noi
- În bara de căutare tip "flash embed"
- Când vedeți Kimili Flash Embed, faceți clic pe Instalare
- După instalare, accesați Pluginurile și activați-o sau faceți clic pe Activare acum
Acum, pentru a adăuga conținut flash în postările sau paginile dvs., faceți următoarele:
- Creați un nou post / pagină sau deschideți unul deja existent
- Comutați la vizualizarea HTML
- Acum, pentru a adăuga o animație Flash, utilizați următorul cod scurt, înlocuind parametrii de cale, y și x cu calea, înălțimea și lățimea respectivă a swf-ului:
[kml_flashembed film = "/ cale / spre / your / movie.swf" /]
- Parametrul filmului este singurul necesar - înălțimea și lățimea sunt opționale. Deși este cel mai eficient pentru a vă mări .swf în timpul exportului, parametrii de înălțime și lățime vor fi redimensionați a .swf fişier. Dacă faceți acest lucru, asigurați-vă că păstrați numerele în proporție de scară pentru a evita denaturarea.
Kimili Flash Embed Tag Generator este o versiune modificată a SWFObject 2 HTML și JavaScript Generator și este integrată strâns în WordPress, ceea ce face foarte ușor pentru a construi tag-uri KFE cu formatul corect.
Adăugarea flashului prin generatorul de etichete KFE:
- Pentru a lansa Generatorul de etichete, o interfață asemănătoare expertului care vă va ajuta să creați eticheta KFE necesară, faceți clic pe butonul cu pictograma Flash Player. (trebuie să comutați la modul Visual pentru ao vedea)
- O fereastră asemănătoare cu generatorul SWFObject va apărea
- Tot ce trebuie să faceți este să introduceți parametrii necesari și apoi faceți clic pe Generați
Puteți seta setările implicite în meniul Admin. Alegeți Setări> încorporați în modul Kimili Flash.
Opțiunile de aici sunt aproape la fel, cu excepția celor pentru JavaScript în partea de jos. Puteți schimba prima opțiune la "Nu", dacă aveți deja swfobject.js fiind menționată în altă parte a codului dvs. Dacă alegeți să utilizați tehnologia Kimili Flash Embed pentru a crea o referință la swfobject.js prin bifarea "Da", veți avea două opțiuni de unde să faceți referire la fișierul - Google Ajax Library sau Internal. Dați clic pe "Ce este asta?" pentru a vedea care sunt diferențele. Când sunteți gata, faceți clic pe Opțiuni actualizare.
Pasul 8 Furnizarea de conținut alternativ
În aceste zile, principalii furnizori de motoare de căutare, cum ar fi Google și Yahoo! pot indexa conținutul textual și link-urile din interiorul fișierelor SWF în timp ce navighează prin stările unei aplicații, ca și cum ar fi vizitatori reali. Deci, de ce mai trebuie să utilizați conținut alternativ pentru a ajuta motoarele de căutare să indexeze conținutul dvs.? Aceasta este din câteva motive.
- În primul rând, nu toate motoarele de căutare sunt capabile să indice conținutul Flash.
- În al doilea rând, deoarece un fișier SWF este, de obicei, plin de conținut multimedia, va exista în continuare mult conținut care va rămâne invizibil pentru motoarele de căutare. Totuși, trebuie să utilizați conținut alternativ pentru a afișa materiale descriptive persoanelor care au suport tehnic mai puțin și pentru a ajuta vizitatorii să găsească pagina de descărcare a Flash Player.
- În fine, este posibil ca motoarele de căutare să indexeze conținutul Flash și conținutul alternativ. Deși, din punctul de vedere al autorului web, conținutul duplicat este considerat o bună practică deoarece vă permite să creați conținut web accesibil celui mai larg public vizat posibil, furnizorilor de motoare de căutare oferă câteva provocări dificile, cum ar fi cum pentru a decide care rezultate să fie afișate în listele motoarelor de căutare. Când creați conținut prietenos pentru motoarele de căutare, trebuie să păstrați întotdeauna în minte această dualitate. Asigurați-vă că conținutul dvs. HTML este o reflectare adevărată a conținutului dvs. Flash și permiteți unui motor de căutare să decidă ce conținut poate fi cel mai bine afișat ca rezultat al căutării.
De exemplu, puteți face următoarele pentru a crea un conținut alternativ mai bun:
- Utilizați exact aceeași copie și link-uri ca în conținutul dvs. Flash
- Adăugați imagini și descrieri textuale în conținutul Flash
- Adăugați o copie pentru a explica unde poate fi descărcat Flash Player
- Adăugați stilul CSS și poziționați codul HTML pentru a păstra identitatea vizuală a paginii web.
În mod implicit, SWFObject 2 Generator publică următorul conținut alternativ:
Acest lucru are ca rezultat un buton "Get Adobe Flash Player" pentru a îndrepta vizitatorii către locul unde pot descărca pluginul. Pentru a testa acest lucru, trebuie să dezactivați pluginul Flash Player. În Firefox, accesați Add-ons> Plugins. Găsiți Shockwave Flash și faceți clic pe butonul "Dezactivați". Acum, când reîncărcați pagina, ar trebui să vedeți următoarele:
Puteți înlocui codul implicit cu acesta:
Acum, dacă vizitatorii navighează pe pagina fără pluginuri Flash, vor vedea o imagine în loc de animație reală:
Motoarele de căutare și vizitatorii care navighează pe web într-un browser de text sau cu imagini dezactivate vor vedea conținutul ca în această captură de ecran:
Dacă aveți un banner cu mai multe stări, puteți captura o imagine pentru fiecare dintre acestea și apoi introduceți aceste imagini ca conținut alternativ. Poate arata astfel:
Pentru o animație sau conținut video puteți utiliza același principiu. Puteți captura mai multe imagini cheie și le puteți folosi pentru a descrie conținutul animației / videoclipului. Iată schema de bază:
Descrierea cadrului 1- Descrierea cadrului 2
- Descrierea cadrului 3
Persoanele fără pluginul Flash vor vedea o secvență de imagini cu descrieri, iar persoanele care navighează pe web într-un browser text sau cu imagini dezactivate vor vedea un set de descrieri numerotate.
Un alt mod de a face acest lucru este de a include o imagine miniatură video plus o descriere textuală a filmului.
De asemenea, puteți adăuga câteva linii de copiere conținutului dvs. alternativ, explicând faptul că experiența dorită a utilizatorilor interacțioși sau audiovizuale necesită cea mai recentă versiune a Flash Player, cu un link către pagina de descărcare.
De asemenea, este posibil să doriți să creați reguli de stil suplimentare pentru a vă asigura că identitatea vizuală sau aspectul unei pagini web rămân intacte. Gândiți-vă doar la conținut alternativ ca pe o oportunitate de a comunica cu publicul țintă, deși este posibil să nu aibă suport tehnic specific.
Concluzie
Asta e. Acum, tu știi cum să încorți conținutul Flash în site-ul dvs. WordPress alimentat cu ușurință și în mod corespunzător. Conținutul poate fi orice - animație, aplicație, film, joc și tot ceea ce doriți și aveți nevoie. Cu puțină imaginație puteți face site-ul dvs. foarte cool, pe de o parte, și încă util, pe de altă parte.
Descrierea cadrului 1