aspect mixt și un cod compact în xhtml, marcaje mixte - pentru și împotriva
markup mixt - argumente pro și contra ...
CSS Studiu de marcare (Cascading Style Sheets) frica, sau incapacitatea de a utiliza în anumite proiecte nu ar trebui să devină un obstacol în calea utilizării Web-standarde. Combinând un aspect tabular cu CSS și XHTML accesibile structurale. puteți obține un bun web-pagini care funcționează în toate browserele.
standardul CSS este încă în faza de dezvoltare, unele browsere încă doar de învățare să se ocupe de CSS 1 si CSS 2, așa că pentru unele dintre proiectele pe care le are sens să utilizeze simplu XHTML -Table pentru amplasarea principalelor elemente ale site-ului. Cu toate acestea, nu trebuie confundat cu un aspect de marcare fără sens tabular și site-uri cu aspect mixt și mai multe componente non-structurale sunt destul de diferit de codul de prost complicat folosit în cele mai multe site-uri și în ziua de azi.
Am menționat într-un articol anterior în această serie (structură și Metastructura în XHTML), că unele dintre componentele site-uri de interfață cu aspect mixt nu poate fi structurată. Dar acest lucru nu înseamnă că restul de cod astfel de site-uri nu ar trebui să fie structural. Tot la fel, următorul paragraf se marchează ca paragrafe, liste - ca liste și așa mai departe. element structural sau nu - în orice caz, este necesar să se utilizeze un cod clar, compact și CSS.
Erori uzuale de markup mixt ...
Să ne uităm la un design tipic aspect de masă a site-ului cu un meniu de navigare, își schimbă aspectul în funcție de locația utilizatorului pe site.
Când utilizați link-uri hipertext, susținătorii vechilor metode vor folosi etichetele de fonturi pentru a controla aspectul (dimensiune. Font. Culoare) și atributele învechite pentru aliniere, stabilirea frontierelor și culoarea de fond a celulei de tabel care conține elementul de meniu.
Designerii moderni se va întoarce la ea la CSS. Cu toate acestea, atunci când sunt utilizate în mod incorect, rezultatele pot fi chiar mai rău.
Chiar dacă imaginile GIF sunt utilizate pentru elementele de meniu. un designer este de natură să încerce să evidențieze într-un fel meniu în comparație cu alte elemente ale site-ului. De exemplu, utilizați un chenar negru subțire la meniu, în timp ce celelalte elemente ale site-ului face fără limite.
Astăzi, designerii pot combina codul rău de la CSS potolește. pentru a obține același efect. Cu toate acestea, această metodă nu este mai bun decât cel precedent.
Klassisty: boala codul ...
Cum putem distinge o celulă de masă, servind un element de meniu din celelalte celule pe pagină? Sau face link-uri in interiorul acestor celule diferă de la toate paginile cu alte link-uri?
Desigur, nu cu etichete de înregistrare învechite și atribute cum ar fi bgcolor. așa cum s-ar putea ghici.
Noi nu folosim cod de genul:
CONTACTE
Dar noi, de asemenea, nu vrem să fiecare element care necesită un tratament special, clasa apropriat. care apare destul de des:
Eu numesc acest stil de marcare klassistskim. Pe aceste site-uri, fiecare etichetă are propria clasă. Utilizarea excesivă a clasei elementului crește în mod inutil dimensiunea codului fiecărei pagini. Apariția acestei tehnici are rădăcinile în momentul în care browser-abia sprijinit CSS. și reflectă o cunoaștere foarte superficială a designerului în CSS.
Divisty - concurenți populare klassitov ...
Luckiest klassistam poate merge uneori neobservate chiar și în acest cod:
<р class="text">Este o modalitate de a crea site-uri web rău.
<р class="text">Coada trebuie să folosească toate aceste clase.
<р class="text">designeri buni încearcă să evite acest lucru.
bun venit pagina pentru participanți!
Acest cod nu are nici măcar aluzie la structura - doar zeci de bytes de cod inutile. Du-te la acest site folosind Pocket PC sau un browser de text, și niciodată nu s-ar ghici modul în care elementele sunt legate între ele.
Într-adevăr, în conformitate cu acest cod, ele nu au legătură între ele. Divisty transforma structura intr-un „gunoi“ complet.
Klassictov divictov și poate fi comparat cu note inutile, care joacă un muzician amator școală, sau lipsite de sens cuvinte-paraziți, care sunt utilizate în vorbirea modernă. Ea buruieni într-o structură logică grădină frumoasă.
Eliminați toate clasele de la codul lor, precum și dimensiunea paginilor dvs. va fi redus la jumătate. Fără div veți obține un cod de structură curată, logică, care funcționează bine în text și browsere grafice. Urmand aceste reguli, puteți crea o mai consistentă și competentă pe pagina de Web.
Cu elementul div nu este nimic greșit ...
Unii dintre voi, probabil, am crezut că a fost inconsistente. Într-un articol am scrie că utilizați div nu este necesar, dar într-un alt articol (div, id-ul, și alți asistenți) se utilizează div. Cum să înțeleagă acest lucru?
De fapt, n-am spus că pentru a utiliza div - rea. Div tag-ul este o parte acceptabilă a codului destinat pentru dispunerea elementelor de pe site.
Dar este necesar să nu se utilizeze div numai atunci când le înlocuiți prea des, alte elemente mai relevante. Asta este, dacă ați creat un paragraf, apoi lăsați-l să fie un paragraf și este etichetat în mod corespunzător, mai degrabă decât element text div class.
Cel mai mare titlu de pe pagina ar trebui să fie etichetat
. și nu .
Vezi diferenta? Desigur, da.
De ce div?
Mulți designeri folosesc tag-ul de div nou în contextul structurii pentru a înlocui orice elemente - de la punctul la antet.
Cele mai multe dintre ele au dobândit obiceiul de a găsi că browsere, cum ar fi Mozilla FireFox, inserați un spațiu gol inutil, distrugând structura în jurul elementelor structurale, cum ar fi
. Cu toate acestea de marcare care utilizează elementele div non-structurale. totul este bine.
Încercarea de a menține cele mai mici nuanțe de marcare, mulți designeri sunt atât de entuziaști care insista asupra utilizării elementelor nestructurale ale div în loc de elementele obișnuite ale unui paragraf, antet, și așa mai departe. Prețul unei astfel de metode este foarte mare.
Și era necesar să se scrie în CSS. doar două linii și problema spațiului gol inutile ar putea fi rezolvată:
h1 # 123;
margine-top # 58; 0px;
-Margine inferioară # 58; 0px;
# 125;
Un alt exemplu de utilizare a div este o situație în care proiectantul este infectat „de masă - este rău, CSS - bun“ virus și înlocuiește cu entuziasm „cu asternut“ cod 100 div imbricate.
Astfel, este imposibil de a obține rezultate pozitive, dar în loc de editare doar dificil de documente.
Vezi diferenta? Desigur, da.
De ce div?
Mulți designeri folosesc tag-ul de div nou în contextul structurii pentru a înlocui orice elemente - de la punctul la antet.
Cele mai multe dintre ele au dobândit obiceiul de a găsi că browsere, cum ar fi Mozilla FireFox, inserați un spațiu gol inutil, distrugând structura în jurul elementelor structurale, cum ar fi
. Cu toate acestea de marcare care utilizează elementele div non-structurale. totul este bine.
Încercarea de a menține cele mai mici nuanțe de marcare, mulți designeri sunt atât de entuziaști care insista asupra utilizării elementelor nestructurale ale div în loc de elementele obișnuite ale unui paragraf, antet, și așa mai departe. Prețul unei astfel de metode este foarte mare.
Și era necesar să se scrie în CSS. doar două linii și problema spațiului gol inutile ar putea fi rezolvată:
h1 # 123;
margine-top # 58; 0px;
-Margine inferioară # 58; 0px;
# 125;
Un alt exemplu de utilizare a div este o situație în care proiectantul este infectat „de masă - este rău, CSS - bun“ virus și înlocuiește cu entuziasm „cu asternut“ cod 100 div imbricate.
Astfel, este imposibil de a obține rezultate pozitive, dar în loc de editare doar dificil de documente.