[Tutorial HTML]Elemente speciale meta, embed, marquee

Locked
User avatar
Cosminn.
Membru
Membru
Posts: 643
Joined: 8 years ago
Location: Bucureşti
Has thanked: 0
Been thanked: 0
Zodiac:
Age: 25
Status: Offline

8 years ago

Nume Tutorial:Elemente speciale meta, embed, marquee
Descriere:Elemente speciale meta, embed, marquee
Download:Nu necesita
Autor:Anonim
Sursa (Link-ul oficial):
tutorialeonline
Propria parere:Util.
Tutorialul:
Codul HTML conţine şi anumite elemente speciale, unele folosite pentru optimizarea paginii în vederea unei cât mai bune indexări în motoarele de căutare sau altele pentru adăugarea de aplicaţii audio şi video ori alte elemente în pagină.

1. Elemente pentru optimizarea indexării paginii

Aceste elemente de optimizare se adaugă în secţiunea HEAD a documentului HTML.
Cel mai important este tag-ul <title></title>
Alte elemente importante pentru motoarele de căutare sunt cele META, (numite şi "meta tag-uri"), acestea au 2 atribute: name (care determină tipul meta tag-ului) şi content (care determină conţinutul meta tag-ului).
În continuare sunt prezentate exemple de meta tag-uri care sunt indicate să fie adăugate în fiecare pagină HTML:

Code: Select all

<meta content="text/html; charset=UTF-8" http-equiv=Content-Type>
[/b]

indică browserului că este un fişier HTML
charset stabileşte tipul de caractere (în general se foloseşte ISO-8859-1 sau UTF-8), dar există şi altele.
<meta name="description" content="O fraza care descrie pe scurt continutul paginii">

în cazul unei căutări după cuvinte-cheie, motorul de căutare ne dă o listă de pagini; pentru fiecare pagină (site) din listă apare titlul ei (dat cu marcajul TITLE) urmat de o frază (cea de la name="description" content="o fraza care descrie ..."); dacă nu avem în marcajul META acea frază, motorul va indexa după prima frază din pagină; tot ea va fi dată la o eventuală căutare.
textul adăugat cu acest tag pentru descriere are prioritate înaintea frazelor din conţinut. (folosiţi maxim 40, 50 caractere).
<meta name="keywords" content="lista, de cuvinte, separate, prin, virgula">

motoarele de căutare ţin cont de cuvintele din meta "keywords" în momentul indexării site-ului şi se folosesc de ele atunci când sunt afişate rezultate de căutări. (folosiţi maxim 15-20 cuvinte).

Code: Select all

<meta name="author" content="numele dvs., e-mail, etc">
[/b]

acesta nu este neapărat necesar, dar nu strică să-l folosiţi. Arată autorul documentului.
Recomandare: Cuvintele din tag-ul <title> ... </title> este bine să se regăsească şi în meta tag-urile "keywords", "description" cât şi în titlurile din conţinutul paginii.
Un alt meta tag care este câteodată necesar, dar nu are legătură cu motoarele de căutare, este "Refresh", acesta are următoarea formă:

Code: Select all

<meta http-equiv="Refresh" content="4;url=http://www.nume_site/pagina">
[/b]
acesta determină browser-ul să încarce o nouă pagină, cea care este adăugată la url-ul din acest tag (aici http://www.nume_site/pagina), după un anumit număr de secunde (aici 4). Practic, face un redirect.
2. Adăugarea de sunet la o pagină HTML

Pentru a adăuga sunet într-o pagină web, puteţi folosi elementele <embed> sau <bgsound>:

<bgsound></bgsound> - introduce un background (fundal) audio în pagină, are următoarele atribute:
src - Defineşte locaţia fişierului audio folosit (midi .au sau wav)
loop - defineşte de câte ori se va repeta sunetul
delay - defineşte timpul dintre repetări
title - Textul care va descrie sunetul.
Exemplu:

Code: Select all

<bgsound src="sunet.midi" loop="3" title="titlul melodiei" delay="5">
<embed></embed> - afişează o consolă pentru sunet, are următoarele atribute: 
src - Defineşte locaţia fişierului audio folosit (midi .au sau wav)
controls - oferă posibilitatea alegerii mai multor controale care includ: console, console mici, butoane de play şi altele
autostart - când este TRUE sunetul începe în timp ce sunetul este descărcat de browser
hidden - când este TRUE va ascunde controalele, standard este FALSE
loop - defineşte de câte ori se va repeta sunetul
volume - setează volumul sunetului (sonorul)
height - înălţimea în pixeli a consolei
width - lungimea în pixeli a consolei.
[/b]
Exemplu:

Code: Select all

<embed src="sunet.midi" width="145"height="60" autostart="truie" volume"100" controls="console" hidden="false">
[/b]

- Tag-ul "<embed>" poate fi folosit şi pentru afişarea de imagini video, care au extensiile ".movs", ".mpeg" sau ".avi", recomandat este ".movs". Se adaugă similar ca şi sunetul, la "src" scrieţi calea către fişierul video. Diferenţa e că nu trebuie folosit atributul "hidden" iar pentru "width" şi "height" dimensiunile nu trebuie să fie mai mici decât dimensiunile în care este salvat fişierul video.
- Totuşi, afişarea de imagini video necesită mai mult timp deoarece fişierele video au dimensiuni destul de mari.
- "<embed>" se foloseşte şi pentru adăugarea de imagini flash (cu extensia ".swf"), pentru aceasta este încadrat în alt element, <object> </object>
- Iată un exemplu de cod prin care puteţi adăuga imagini flash în pagina web:

Code: Select all

<object width="580" height="400">
<param name="movie" value="fisier.swf">
<embed src="fisier.swf" width="580" height="400">
</embed>
</object>
[/b]
Unde "width"şi "height" sunt dimensiunile cadrului în care este afişată imaginea flash, iar la atributele "value" şi "src" se scrie calea către fişierul ".swf" (trebuie scrisă aceeaşi cale la ambele atribute).
- Afişarea în pagină a elementelor cu EMBED necesită folosirea unui plug-in, care de cele mai multe ori, dacă acesta nu este deja instalat, este cerută automat încărcarea lui de către browser.

3. Elemente de animaţie text

HTML are un tag special, <marquee> </marquee>, prin care puteţi crea un efect de mişcare a unui text (sau imagine) care este încadrat de acest element.
Are următoarele atribute:

loop - defineşte de câte ori se va mişca textul
height - înălţimea în pixeli a zonei în care se mişcă textul
width - lungimea în pixeli a zonei în care se mişcă textul
bgcolor - culoarea zonei în care se mişcă textul
direction - direcţia de mişcare (left, right, up, down) - (stânga, dreapta, sus, jos)
behavior - defineşte cum se va mişca textul (scroll, slide, alternate)
scrolldelay - setează numărul, în milisecunde, între refresh-uri de mişcare.
Exemplu de mişcare pe orizontală

Code: Select all

<marquee behavior="alternate" bgcolor="#00ffff" direction="right">Marquee text</marquee>
[/b]

În pagină va arăta aşa:

Marquee text

Iată un alt exemplu unde mişcarea se face pe verticală:

Code: Select all

<marquee behavior="alternate" bgcolor="#00ffff" direction="up" width="100" height="100">Marquee text</marquee>
[/b]

În pagină va arăta aşa:

Marquee text

- În loc de text poate fi folosit şi o imagine, înlocuind textul (aici "Marquee text") cu tagul "<img> pentru imagine.
Image
Locked

Return to “HTML”