Trafiku i internetit i konsumuar nga pajisjet elektronike po rritet fjalë për fjalë çdo ditë. Përdoruesit modernë kanë nevojë për burime me ndërfaqen më të përshtatshme për ta. Po kështu, faqosja adaptive bën të mundur plotësimin e kësaj nevoje, pasi ju lejon të ndryshoni automatikisht faqet e internetit në karakteristikat e pajisjeve celulare.
Ç'është kjo
Struktura e përgjegjshme, e njohur gjithashtu si e përshtatshme për celularin, përfshin kryerjen e veprimeve të caktuara që synojnë zhvillimin e faqeve të internetit që mund të përshtaten me rezolucione të ndryshme të ekranit.
Disa vite më parë, njerëzit në terren duhej të krijonin versione të shumta të faqeve në internet në mënyrë që një burim të mund të shfaqej siç duhet në pajisjet 'ktrnhjyys[' me karakteristika të ndryshme dritaresh. Kështu kanë punuar dizajnerët e faqosjes deri në vitin 2010. Më pas, ideja se si të bësh një faqe të përshtatshme ndryshoi në mënyrë dramatike. Më pas, për të kryer këtë funksion, u përdor një gjuhë e veçantë programimi - JavaScript.
Si ta bëni një faqe interneti të përgjegjshme në të gjitha ekranetpajisje celulare sot? Tani paraqitja kryhet duke përdorur tabela CCS3, si dhe një gjuhë të veçantë HTML5.
Pse keni nevojë për një faqe interneti të përgjegjshme
- Mund të hyni në ueb duke përdorur pajisje me rezolucione të ndryshme të ekranit. Sot, njerëzit përdorin shumë pajisje të ndryshme si për nevoja shtëpiake ashtu edhe për përdorimin e internetit. Natyrisht, e njëjta faqe duhet të shfaqet me cilësi të lartë dhe të duket mirë në pajisje me dimensione dhe rezolucione të ndryshme të ekranit. Përdoruesit nuk duhet të ndihen të pakëndshëm kur punojnë me një vegël të veçantë.
- Rritja e trafikut në internet, popullariteti i aplikacioneve dhe pajisjeve celulare. Kërkesa aktuale për pajisje elektronike me të cilat mund të hyni në rrjet është mjaft e arsyeshme dhe vështirë se dikush do të argumentojë me këtë fakt. Një popullaritet i tillë thjesht nuk mund të injorohet, pasi këta përdorues ndoshta përfaqësojnë pjesën e luanit të të gjithë audiencës suaj. Pra, nëse dëshironi të mbani të njëjtë numrin e vizitorëve në burimin tuaj ose ta rrisni atë, atëherë duhet t'i kushtoni vëmendje nevojave dhe interesave të tyre. Me fjalë të tjera, ju duhet të bëni më të mirën për ta bërë përvojën tuaj të faqes sa më të përshtatshme, përndryshe klientët tuaj thjesht mund të shkojnë te konkurrentët tuaj.
Informacion urgjence. Nëse specializimi juaj është ofrimi i lajmeve dhe informacioneve të tjera të fundit, atëherë sigurisht, përdoruesit mund t'i duhet urgjentisht dheai mund të mos ketë asgjë tjetër përveç një telefoni në dorë në atë moment. Kështu që detyra juaj është të siguroheni që ai të marrë informacionin e nevojshëm sa më shpejt që të jetë e mundur
Krahasimi i paraqitjes së përgjegjshme dhe aplikacionit celular
Të gjitha llojet e programeve dhe faqeve që përdorin versionet celulare për pajisjet e tyre përkatëse janë gjithashtu një lëvizje e mirë, por ato kanë një sërë disavantazhesh.
- Një aplikacion celular duhet domosdoshmërisht të korrespondojë me llojin e sistemit operativ. Dhe për këtë ju duhet të shpenzoni jo vetëm kohë, por edhe para.
- Programi duhet të shkarkohet. Për të përdorur aplikacionin, natyrisht, ai duhet të instalohet. Sigurisht, përdoruesi mund ta bëjë këtë, por vetëm me kusht që t'i duhet shpesh. Nëse ai nuk ka një nevojë të tillë, atëherë ka shumë të ngjarë që ai do ta refuzojë këtë ndërmarrje. Si rezultat, ju do të humbni një pjesë të konsiderueshme të audiencës tuaj.
Pse duhet të hiqni dorë nga aplikacionet
- Shpërndarja e trafikut. Përdorimi i aplikacionit nuk tregon nivelin e frekuentimit të burimit. Me fjalë të tjera, trafiku i programit dhe i faqes nuk përmblidhet, gjë që çon në një ulje të treguesit që ju intereson.
- Integrimi i materialeve burimore. Nëse keni blerë një aplikacion, atëherë do t'ju duhet të shpenzoni para shtesë për të sinkronizuar të gjitha materialet, ose, duke plotësuar faqen, të transferoni gjithashtu përmbajtjen në program. Si rezultat, ju përsëri humbisni paratë dhe kohën tuaj.
Si të bëhemi adaptuesdizajni i faqes së internetit
Hapi i parë është të hartoni të gjithë punën. Në këtë proces, projektuesi duhet të përcjellë me shkathtësi thelbin dhe idetë kryesore duke përdorur një ekran relativisht të vogël dhe vetëm një kolonë menuje.
Nëse është e nevojshme, blloqet e informacionit reduktohen, mbeten vetëm elementët më domethënës. Një udhëzues fillestar zakonisht përfshin:
- celular i pari - dizajnim për pajisje elektronike;
- imazhe fleksibël - përdorni imazhe fleksibël;
- paraqitje e bazuar në rrjet - përdor paraqitje fleksibël të bazuar në rrjet;
- pyetje mediatike - përpunimi i pyetjeve mediatike.
Si ta bëni një faqe interneti të përgjegjshme? Për ta bërë këtë, mund të përdorni disa lloje paraqitjesh.
- Gumë. Ky lloj është i lehtë për t'u zbatuar, rrallë shkakton vështirësi edhe për fillestarët. Blloqet kryesore të burimit janë të ngjeshur derisa të përshtaten me madhësinë e ekraneve celularë. Nëse ngjeshja nuk është e mundur, atëherë ato vendosen në formë shiriti.
- Lëviz blloqe. Kjo teknikë funksionon në mënyrë të përsosur për burimet me kolona të shumta. Vendosja e blloqeve shtesë ndryshon sipas dimensioneve të ekranit. Nëse ekrani tkurret, shiritat anësor lëvizin në fund.
- Ndrysho paraqitjet. Kjo është një teknikë mjaft kohë, e cila përfshin përdorimin e një plan urbanistik të krijuar posaçërisht për çdo rezolutë të ekranit. Kjo metodë e lehtëson shumë studimin e sitit, por kompleksiteti i punës e bën atë të pa pretenduar.
- Paraqitja elementare. Metodologjia, e patëmetëi përshtatshëm për burime të thjeshta. Dizajneri thjesht shkallëzon fotografitë dhe tipografinë. Edhe pse kjo metodë nuk mund të quhet e kërkuar për shkak të mungesës së fleksibilitetit.
- Panelet. Kjo teknikë vjen nga aplikacionet celulare, në të cilat një meny ndihmëse mund të shfaqet në çdo pozicion të ekranit. Tani kjo metodë nuk është gjithashtu shumë e popullarizuar, pasi navigimi celular në faqe nuk është gjithmonë i qartë për përdoruesit.
Asnjë nga paraqitjet e përshkruara nuk mund të quhet universale. Si ta bëni një faqe interneti responsive? Para së gjithash, ju duhet të zgjidhni një plan urbanistik të përshtatshëm, në varësi të projektit. Ai duhet të përputhet plotësisht me aftësitë e burimit dhe të plotësojë të gjitha nevojat.
Si të krijoni një plan urbanistik të përgjegjshëm
Sot, CSS3 dhe HTML5 përdoren për këtë. Teknologjia e parë është një gjeneratë e avancuar e tabelave kaskadë. Me ndihmën e tij, zhvillohen rregulla sipas të cilave detajet e faqes do të shfaqen në ekranin e përdoruesit.
Me ndihmën e CSS3, mund të vendosni disa parametra: përqindjen e hapësirës së zënë dhe dimensionet e elementit në një rezolucion të caktuar. Me këtë teknologji, projektuesit mund të krijojnë klasa të ndryshme që përputhen me karakteristika të caktuara.
HTML5 përdoret për të treguar vendndodhjen e detajeve të caktuara, me fjalë të tjera, për të shënuar faqen. Klasat e gjeneruara CSS3 janë të specifikuara në etiketat HTML në mënyrë që objektet e përdorura të mund të modifikohen në varësi të rezolucionit.
Pra, si të bëni një dizajn të përgjegjshëm të faqes në internet me html? Ju duhet të filloni duke zhvilluar një pamje të thjeshtë qëpastaj shtrihu.
Kjo krijon një guaskë të përpunimit të imazhit.
Si ta bëni një faqe interneti të përgjegjshme me CSS? Cakto parametrat e mëposhtëm:
div {
gjerësia: 100%;
}
div img {
gjerësia: 100%;
lartësia: automatik;
}
Pastaj, sipas gjerësisë së div, vendosni gjerësinë e imazhit img.
Kështu që ju merrni një imazh që do të zërë të gjithë hapësirën e ekranit me çdo rezolucion.
Personalizo artikujt individual
Titulli i faqes. Vendosni disa elementë në kokë:
logo -
butoni i fshehjes së menysë -
menuja kryesore -
kërkim në faqe -
- Blloko me përmbajtje teksti. Përdor elementin për të mbyllur artikullin.
- Kollona anësore. Përdorni për të gjetur listën e kategorive, klikoni në listën e postimeve dhe postimet më të fundit.
- Si të krijoni një menu përshtatëse për një faqe interneti? Shtoni një element në shënim. Ky kod ndryshon lartësinë e menysë, duke e përshtatur përmbajtjen në dimensionet e kërkuara.
Krijimi i një minigalerie
Duke ditur se si të krijoni një faqe interneti të përgjegjshme html dhe css, mund ta mbushni burimin tuaj me përmbajtje të dobishme dhe interesante të përshtatshme për çdo vegël, për shembull, një mini-galeri.
Për të shtuar disa fotografi në HTML, përdorni elementët e mëposhtëm:
Dhe në mënyrë që çdo imazh të ndërveprojë me rezolucione të ndryshme dhe të ndryshojë madhësinë e tij, përdorni CSS3:
div.image_gallery {
marzhi: 0 automatik;
gjerësia: 1000px;
min-gjerësia: 500px;
}
img {
gjerësia maksimale: 48%;
mbushje: 1%; / mbushje e lehtë për imazhet /
}
Kjo është e gjitha, minigaleria juaj është gati. Tani ju e dini se si ta bëni faqen tuaj të përgjegjshme për pajisje të ndryshme.
Si të kontrolloni cilësinë e punës
- Google Chrome. Pasi të jeni në shfletues, shtypni F12. Pas kësaj, do të hapet një panel - klikoni në ikonën e vegël që ju intereson, për shembull, një tabletë ose smartphone. Dhe nga menyja tjetër, zgjidhni rezolucionin e kërkuar.
- Deviceponsive. Një program me të cilin mund të kontrolloni paraqitjen adaptive duke ngarkuar faqen përmes një IFrame. Aty do të shihni një listë të pajisjeve me rezolucione të ndryshme.
- Aresponsivedesign.is. Ky është një burim argëtimi. Së pari, faqja ngarkohet në dritaret IFrame dhe më pas transferohet në ekranet e Apple. Kjo e bën shumë të përshtatshëm marrjen e pamjeve nga ekranet.
