Trīs tīmekļa dizaina slāņi

Visās vietnēs ir apvienota struktūra, stils un uzvedība

Satura rādītājsIzvērst

• Kāpēc atdalīt slāņus
• HTML: Struktūras slānis
• CSS: stilu slānis
• JavaScript: uzvedības slānis

Cilvēki, kas strādā web dizains nozare salīdzina priekšgala vietņu izstrādi ar trīs kāju ķeblīti. Šīs trīs daļas — trīs tīmekļa izstrādes slāņi — ietver vietnes struktūru, stilu un darbību.

Kāpēc jums vajadzētu atdalīt slāņus?

Kad veidojat tīmekļa lapu, tās struktūrai jābūt novirzītai uz jūsu HTML, vizuālos stilus CSS un izturēšanās pret skriptiem. Dažas no slāņu atdalīšanas priekšrocībām ir:

Kopīgie resursi: Rakstot ārēju CSS vai JavaScript failu, šo failu var izmantot jebkura vietnes lapa. Ja jums ir jāveic izmaiņas šajā failā, iespējams, uz atjaunināt dažus tipogrāfijas stilus tīmekļa vietnē katra lapa, kurā tiek izmantota šī stila lapa, tiks mainīta. Nav nepieciešams rediģēt katru vietnes lapu atsevišķi, kas varētu būt nogurdinošs pasākums lielai vietnei. Ātrākas lejupielādes: Kad klients pirmo reizi ir lejupielādējis skriptu vai stila lapu, tīmekļa pārlūkprogramma to saglabā kešatmiņā. Tā kā šie koplietotie resursi tagad ir ietverti pārlūkprogrammas kešatmiņa , citas lapas, kas tiek pieprasītas pārlūkprogrammā, tiek ielādētas ātrāk, kas uzlabo kopējo lapas ātrumu un veiktspēju. Vairāku cilvēku komandas: Ja vietnē vienlaikus strādā vairāk nekā viena persona, izmantojiet versiju kontroles sistēmas, kas ļauj reģistrēt un izņemt failus, lai nodrošinātu, ka visi strādā ar jaunākās versijas . Šo procesu ir daudz grūtāk veikt, ja stili un uzvedība ir savstarpēji saistīti ar struktūras dokumentiem. ŠIS: Vietne, kurā ir skaidri nodalīts stils un struktūra, visticamāk, darbosies labāk meklētājprogrammās, jo tās var efektīvāk pārmeklēt šo saturu un izprast lapu, neiegrimstot vizuālā stila un uzvedības informācijā. Pieejamība: Ārējās stila lapas un skriptu faili ir vieglāk pieejami cilvēkiem un pārlūkprogrammām. Programmatūra, piemēram, ekrāna lasītāji, var vieglāk apstrādāt saturu no struktūras slāņa, neizmantojot stilus, kurus tie tik un tā nevar izmantot. Atgriezeniskā saderība: Vietne, kas izstrādāta ar atsevišķiem izstrādes slāņiem, visticamāk, būs saderīga ar atpakaļejošu datumu, jo pārlūkprogrammas un ierīces, kurās nevar izmantot noteiktus CSS stilus vai kurām ir atspējota JavaScript, joprojām var skatīt HTML. Pēc tam varat pakāpeniski uzlabot savu vietni, izmantojot funkcijas pārlūkprogrammām, kas tos atbalsta.

HTML: Struktūras slānis

Tīmekļa lapas struktūra vai satura slānis ir pamatā HTML šīs lapas kods. Tāpat kā mājas karkass rada spēcīgu pamatu, uz kura tiek būvēta pārējā māja, stabils HTML pamats rada platformu, uz kuras var izveidot vietni.

Struktūras slānis ir vieta, kur glabājat visu saturu, ko jūsu klienti vēlas lasīt vai apskatīt. HTML struktūra var sastāvēt no teksta un attēliem, un tā ietver hipersaites ko apmeklētāji izmantos, lai pārvietotos pa vietni. Šī informācija ir kodēta atbilstoši standartiemHTML5un var ietvert tekstu, attēlus un multividi (video, audio utt.).

Katrs vietnes satura aspekts ir jāattēlo struktūras slānī. Šī atdalīšana ļauj klientiem, kuriem ir izslēgts JavaScript vai kuri nevar skatīt CSS, piekļūt visai vietnei, ja ne visai tās funkcionalitātei.

CSS: stilu slānis

Šis slānis nosaka, kā strukturēts HTML dokuments izskatīsies vietnes apmeklētājiem, un to nosaka CSS (Kaskādes stila lapas). Šajos failos ir ietverti stilistiski norādījumi par to, kā dokuments ir jāparāda tīmekļa pārlūkprogrammā. Stila slānis parasti ietver mediju vaicājumi kas maina vietnes attēlojumu, pamatojoties uz ekrāna izmērs un ierīce .

Visiem vietnes vizuālajiem stiliem ir jāatrodas ārējā stilu lapā. Varat izmantot vairākas stila lapas, taču katram CSS failam ir nepieciešams HTTP pieprasījums, lai to ienestu, kas ietekmē vietnes veiktspēju .

JavaScript: uzvedības slānis

Uzvedības slānis padara vietni interaktīvu, ļaujot lapai reaģēt uz lietotāja darbībām vai mainīties, pamatojoties uz nosacījumu kopumu. JavaScript ir visizplatītākā uzvedības slāņa valoda, taču CGI un PHP tiek izmantoti arī ļoti bieži.

Kad izstrādātāji atsaucas uz uzvedības slāni, lielākā daļa no tiem nozīmē slāni, kas tiek aktivizēts tieši tīmekļa pārlūkprogrammā. Izmantojiet šo slāni, lai tieši mijiedarbotos ar dokumenta objekta modeli. Notiek derīga HTML rakstīšana satura slānī ir svarīga DOM mijiedarbībai uzvedības slānī. Veidojot uzvedības slāni, ir jāizmanto ārējie skriptu faili, tāpat kā CSS, lai optimizētu ātrumu un veiktspēju.