despre HTML si alti demoni
Hmm, am fost rugat (insistent chiar 
) sa scriu un articol despre HTML si minunile sale. Si uite ca ma conformez.
Trebuie de la inceput sa ma scuz in fata celor care stiu mai bine decat mine despre ce e vorba, daca omit cumva ceva, si fata de cei care stiu mai putin in caz ca nu ma exprim suficient de simplu.
Daca tot terminai introducerea (ah, asta fu introducerea?) sa intram in paine, adica sa explic intai ce e aia HTML.
Aci poate ar trebui sa incep cu o lectie de istorie, despre aparitia in secolul trecut (ce cool suna) a nevoii de formatare a materialelor stiintifice dupa anumite reguli stricte, universale, usor de folosit, nevoie care si-a gasit concretizarea la institutul CERN din elvetia. In fine, si-au pus ei capetele la contributie si au conceput sistemul asta de reprezentare a documentelor complexe, pe nume HTML.
Stiu ca majoritatea ar fi bagat mana in foc ca dezvoltarea conceptului a fost americana, dar spre surpriza lor ( si a mea, de altfel), europenii au scos-o din palarie.
Ce inseamna HTML, mai concret, ca literele astea patru au un iz puternic de vrajitorie, cel putin chimie organica, sau chestii asemanatoare.
HT vine de la HyperText, adica un text mai special, care contine poze, si altele, dar in principiu text cu elemente vizuale diverse, initial erau doar imagini, ca deh, oamenii scriau articole, youtube nu se inventase inca.
M vine de la Mark-up, adica marcare, si o sa explic putin mai incolo ce inseamna asta
L vine de la Language, adica limbaj.
Pe scurt, limbaj de marcare a (hiper)textului. Majoritatea sunteti familiarizati cu procesoarele de text, gen Wordpad, Microsoft Office Word, Notepad, etc.
Cu exceptia ultimului, toate celelalte ofera posibilitatea de a scrie texte complicate ca forma, cu diverse fonturi, ba chiar pot fi introduse si imagini.
Deja am luat-o rau pe aratura, si adminul ar putea sa-mi zica pur si simplu, ca ultima data, ca deraiez de la subiect, si sa revin la subiect.
Dar de data asta nu pot altfel, trebuie sa o iau de la inceputuri, si pentru oameni fara nici un fel de background in informatica.
Pentru o informare mai completa, care merge mai departe de scopul articolului de fata, recomand pagina wikipedia corespunzatoare.
Revenind la documente, trebuie sa existe o forma de stocare a lor in memoria unui calculator (Harddisk comes to mind). Si forma asta sa fie simpla,
nu cum salva MS Word documentele pana in 2007. Anume o forma usor de inteles pentru calculator si pentru cel care urmeaza sa scrie.
Ce trebuia sa faca aceasta scriere? Sa codeze pentru fiecare bucata de text modalitatea in care va fi afisata.
Adica sa delimiteze fiecare parte a textului care se prezinta intr-un mod diferit de cele de langa ea, si sa specifice totodata in ce mod e ea diferita.
Modalitatea aleasa de cei care au dezvoltat “limbajul” HTML a fost de a cuprinde textul corespunzator intre niste tag-uri, adica etichete.
In speta se punea la inceputul textului eticheta de inceput, eventual cu diversi parametri, si la sfarsit se punea alt tag, de sfarsit de delimitare.
De exemplu <b> specifica faptul ca textul care urmeaza va fi afisat bold, <i> pentru italic, <u> pentru underline .
Sfarsitul textului respectiv se marcheaza prin tag-ul pereche </b> etc.
Evident ca lucrurile nu se puteau opri aici, si numarul de tag-uri este mai mare, in jur de 22 initial. O lista completa a tagurilor prezente in forma actuala a
limbajului HTML poate fi gasita pe pagina urmatoare (as fi putut sa directionez pe pagina oficiala de specificatii RFC, da am zis sa nu fac o aroganta chiar asa de mare ).
Acum nu am pretentia sa fac o prezentare completa a limbajului. Am vrut doar sa exemplific putin modalitatea de reprezentare.
Pentru cine are chef de mai multe detalii, poate urma link-urile, si de acolo mai sunt si alte ramificatii.
Ce e suficient de stiut: sunt foarte multe editoare specifice, WYSIWYG (what you see is what you get) pentru pagini web, deci nu e necesar sa stii HTML ca sa faci o pagina web. In principiu .
Ce ne facem insa cand vrem sa scriem un articolas in WordPress, sau un comentariu in care sa subliniem o anumita sintagma, sau vrem sa introducem o poza care ni se pare ca s-ar potrivi,
sau pur si simplu vrem sa introducem un clip de pe youtube/trilulilu/etc. ? De partea asta o sa ma ocup in cele ce urmeaza.
O sa ma adresez in mod concret celor trei probleme mentionate mai sus, anume formatarea (simpla a) textului, introducerea de imagini si introducerea de clipuri multimedia.
Daca vi se pare ca mai sunt si alte chestiuni care trebuiesc discutate, astept comentarii (malitioase eventual ). Dar sa le luam pe rand:
1. formatarea textului – aici deja sunt chestiunile pe care le discutasem mai sus, adica bold, italic si underline, si daca vreti stilul
ala simpatec, pe care il foloseste adminul cosmitza de regula, folositi tagul de inceput <del> si tag-ul de sfarsit </del>.
2. pentru introducerea de imagini, fie ca e vorba de emoticoane, sau de poze, se foloseste urmatoarea sintaxa (ups, inca o aroganta ):
< img src=”http://www.flickr.com/photos/123456.jpg” />. Chestiunea merge numai daca vreti sa introduceti poze prezente pe alte site-uri, cum fac eu, daca vreti sa
introduceti poze personale, de pe discul local (computerul propriu si personal), recomandarea e sa folositi editorul Visual incorporat in wordpress .
De fapt toate indicatiile astea sunt mai mult valabile pentru editarea de comentarii, unde nu dispuneti in prima instanta de editor avansat.
In caz ca vreti sa va incadrati cu poza intre anumite dimensiuni de afisare, (cum a fost cazul mai ieri ) trebuie adaugati niste parametri la tag-ul img.
Anume: < img src=”http://www.flickr.com/photos/123456.jpg” width=”400″ height=”300″ />. De exemplu, valorile insa pot sa difere, pot sa lipseasca oricare
din ele, pot fi exprimate procentual, adica nu prin valori ci prin “50%”. Recomandarea mea e sa lucrati doar cu width, si sa vedeti cam care ar fi latimea disponibila pentru comentariu.
La un articol obisnuit latimea e de 700, dar la comentarii scade sub 500, asa ca recomandabil ar fi o latime de maxim 300 cand puneti o poza in comentarii. Daca inaltimea (height) nu e
specificata se calculeaza proportional cu latimea specificata. Asta daca nu vreti sa o calculati voi .
3. pentru introducerea de clipuri de pe youtube, e putin mai mult de munca, aparent, dar de fapt munca o face youtube pentru voi. In partea dreapta a clipului din pagina youtube apar doua casete de text, cu
urmatoarele doua texte: URL si Embed. Primul reprezinta adresa efectiva la care se poate vedea clip-ul, si foloseste numai daca vreti sa dati link la clip, fara sa poata fi vizualizat in comentariu/articol.
Partea cu Embed e folositoare daca vreti sa apara efectiv clip-ul in articol, fara sa mai fie nevoie sa intrati pe pagina youtube. Ati vazut cum arata cand am mai pus eu sau altii cate un clip. Cand introduceti clip-ul
in articol, nu trebuie modificat nimic la parametri, pentru ca latimea e de 700, cum v-am zis, si are loc, dar daca vreti sa apara in comentarii, o sa trebuiasca sa modificati atat inaltimea cat si latimea obiectului.
Cum faceti asta la modul cel mai simplu? V-as putea recomanda regula de 3 simpla (damn, alta aroganta ), dar mai simplu e sa impartiti ambele dimensiuni la 2. Si gata. Va fi putin mai mic clipul, dar e posibil sa fie totusi vizibil.
Recomandarea mea ar fi totusi ca in comentarii sa puneti doar link. Ceea ce ne aduce la urmatoarea rubrica:
4. Cum introducem un link (pe asta l-am uitat mai devreme cand am facut enumerarea, si e destul de important): exista doua modalitati, una e sa-l scriem pur si simplu, si va fi considerat ca atare, dar va aparea atat ca text cat si ca link, si nu e foarte frumos,
mai ales daca e lung. Asa ca ajungem la a doua modalitate. Si la HTML, din nou 
) . Scriem asa:
< a href=”http://screenshooters.eu”> Site-ul screenshooters </a> si apare asa Site-ul screenshooters.
Uff, complicat, stiu, da sa vezi ce complicat e sa scrii despre asta ) . Astept comentarii si aprecieri, dar mai ales deprecieri si arogante
acum vazui cat de mult am scris
NOW TAKE THIS!!
July 26th, 2009 at 1:37 PM
gatii, mancai, sunt multumita, asa ca intru pe blog inc-o data, si ce-mi vad ochii? suprise
acum ma apuc de el sa-l citesc, introducerea imi placu 
mersi muuuuucho, mucho, mucho! vai, dar cata textul
July 26th, 2009 at 2:03 PM
de la mine nu vor sosi arogante, cred ca se stia deja, ca nu sunt in masura
) inca dinainte chiar de a mi-o spune el insusi, si ma intrebam de ce (acum inteleg, si mie mi se intampla sa vad treaba asta cu dialogurile si monologurile aidoma, ajunsesem chiar sa concep ideea de a scrie odata impreuna un post, interactiv: unul da o tema, si ceilalti scriu comentarii, si la un moment dat se ofera cineva sa puna cap la cap intr-un post ideile adunate) … din acest motiv l-am provocat sa scrie (recunosc) si zic ca eu (ca ala de aude niste chestii pentru prima data!) ca n-a facut-o rau deloc, dimpotriva.
)… partea cu istoria… zic eu ca face totul incadrarea intr-un context 
asa se scrie stiintific, dom’le (ceapa, deh 
)
asa ca va dura o vreme pana le voi digera, ca deh, am deocamdata cam alta buba care ma zoreste
prima impresia: uliu, cata ceapa trebuie sa fi mancat aia de-a inventat toate vrajitoriile astea! a2a impresie: tu oare ai mancat la fel de multa ceapa ca si ei, sau mai multa chiar, de-ai reusit si sa-i intelegi pe ei, si sa scrii povestea asta asa?
a3a impresie e una mai veche: observasem eu ca antispamului ii place mai degraba sa scrie comentarii decat articoloaie sau -colase (dupa caz
a4a impresie: textul asta chiar are roten Faden! (adica fir rosu, hihi, ce dragut ca asta se traduce chiar pastrand si culoarea
a5a impresie: acu cateva seri mi-a zis barbatu-meu ceva de genu’: “ma Gandalush (si-a bagat el ochii pe-aci, si asa a inteles el ca ma cheama pe mine, hihi, si era tare mandru de realizarea asta a lui) tu nu mai scrii diploma (la lucrarea mea finala se referea) si te faci scrii pe blog! (asta asa vorbeste romaneste)” apoi imi zice (asta in limba lui) ca lui i-ar conveni, ca eu, neavand o diploma n-o sa pot lucra, si o sa stau numa’ acasa, si el n-o sa mai fie nevoit sa preia si el sarcini casnice… de ce va zic acum toate astea? pai daca m-as apuca sa diger cum se cuvine toate informatiile de aici si de pe linkurile alaturate cred ca chiar n-as mai apuca sa-mi scriu si lucrarea aia
impresia a6a: o intrebare mai degraba: ai scris cumva cum pot pune si eu link dintr-ala cu trimitere printr-un cuvant din text, asa cum ai facut-o tu? ca eu nici asta nu stiu
inchei cu un alt multumesc, ca tre sa plec
July 26th, 2009 at 2:07 PM
a, inca ceva: sa-mi mai zica mie careva c-as scrie despre lucruri complicate
July 26th, 2009 at 2:08 PM
he he he
am scris cum poti pune link de la cuvant, si e in ultima parte. ala cu Site-ul screenshooters
mai ai timp sa citesti/recitesti
July 26th, 2009 at 11:33 PM
cum ma, nici un comentariu la minunatie de post? cred ca-i din cauza odihnei duminicale… vezi ca de fapt n-aveai de ce sa te temi atat?
dar sa fii sigur ca maine cu forte proapete voi reciti si sper sa am timp sa si experimentez un pic
aaa, recunosc ca asa, catre final, mi-a murit de tot concentratia, ca ma cam grabeam sa-ti scriu comentarii si apoi sa plec
July 26th, 2009 at 11:35 PM
cred ca toti care au incercat sa citeasca s-au plictisit dupa 20 de randuri, si au renuntat sa mai comenteze… sau au adormit
)
) )
sau sunt subminat…. and i will have my revenge (in seattle
July 27th, 2009 at 10:14 AM
Bre…mi-ai luat ditai piatra de pe inima.Stiu cu ce se mananca HTMLu’ dar ma opresc aici.Sa nu crezi ca ma apuc sa-l folosesc atat timp cat am editor visual.
Eu am alta nelamurie ( tema bre! )…ce mama dracu’ e alata F T P? Ca dasteptii astia de “ailalti admini” imi impuie capul cu el( eu cred ca ma ia la misto ). “Ce ba, nu stii sa umbli in F T P?”…sau “Ba, fa chestia aia in F T P” (aici eu nu stiu nici ce e “chestia” si nici ce e F T P…bine, la “chestie” am o vaga banuiala ).
Si in final vine si reprosu’…De ce ai scris bre Elvetia fara majuscula? Ca e una dintre tarile mele preferate…
PS: Ma si daca tot te apuci de explictaii, spune-ne si ce e http-ul ala care ma tot streseaza pe mine =))
July 27th, 2009 at 11:01 AM
Newsted: recunosc stilul lu’ Valoare: “fa chestia aia in aici_pui_ce_vrei_tu… ” si-apoi, prin bunatatea lui caracteristica, incearca si o explicatie d-aia d-a lui… din care nu pricepi nimic,reactie care pe el in face irascibil.
Io nu fac asa… asa ca nu mai zi “ailalti”…
July 27th, 2009 at 11:10 AM
adica ce bah io nu stie sa explice? ca n-am inteles /:)
July 27th, 2009 at 11:17 AM
Nu ba
July 27th, 2009 at 11:24 AM
=))
July 27th, 2009 at 11:26 AM
e bine atuni ma mai linisti o leaca #:-S
July 27th, 2009 at 12:20 PM
@Newsted
n-am nimic cu tarisoara in particular 
)
, si apoi o sa-ti ceara un user+parola, daca e protejat, si apoi lucrezi ca in windows explorer, sau total comander, sau al program de lucrat cu fisiere 
deci am scris elvetia cu litera mica pentru ca am o problema cu majusculele
HTTP=hypertext transfer protocol (cred ca se subintelege ce vrea sa zica
FTP=file transfer protocol
E vorba de doua protocoale de comunicare, un fel de salut secret, stii, ca in filmele de cartier, din alea cu prinsu mainii intr-un anumit fel, apoi hi5, si asa mai departe, si terminand cu gadilatul degetelor
lasand gluma la o parte, tu nu vezi efectiv ce se comunica in protocoalele astea. ce tre’ sa stii tu e ca HTTP e pentru pagini web – browser, iar FTP e pentru transfer de fisiere de la o locatie la alta.
cum se face? pai exista aplicatii care sunt dedicate transferului FTP, dar poti sa faci asa ceva si in internet explorer sau mozilla. in principiu te conectezi la un server, care are o adresa ca oricare alta, doar ca incepe cu FTP
hepi nau?
July 27th, 2009 at 12:50 PM
@antispam
Ma…priceput.Da’ tot nu le folosesc.Raman la desenele mele pe asfalt.
July 27th, 2009 at 1:01 PM
bine fashi (bine gasesti)
August 9th, 2009 at 1:05 PM
[...] si cu un plan in cap (inca eram de parera c-as avea): stiam eu ca ramasesem datoare sa invat o lectie , caci cineva anume isi daduse multa silinta sa explice anumite lucrusoare, asa, ca pentru… [...]