Scott Jehl - Responsible Responsive Design (Atbildīgs Reaģējošs Tīmekļa lapas dizains) Jānis Rubļevskis (koko) / 17.02.2015. 11:04 / #Grāmatas / 9 komentāri

Pirms nedaudz vairāk kā divām nedēļām Cube blogā tika publicēts raksts par to, ar ko būtu jāsāk, veidojot responsīvu tīmekļa lapu? Tā kā uzņēmums, kurā strādāju un attīstos arī nodarbojas ar līdzīgām lietām, tad iekšienē sākās diezgan spraigas diskusijas. Pirmais jautājums jau bija tas, kāpēc tāds raksts? Tas tak visiem web deviem ir sen zināma lieta, ja vien neizstrādā superlētu sūdu. Arī ielinkotais raksts ir piecus gadus vecs. Laikam jau uzņēmuma vadībai vajadzēja palaist sen uztaisīto bloga sadaļu, bet tas nenozīmē, ka raksts nespieda mums izvērst diezgan plašu diskusiju. Pat vairāk - mēs paņēmām pāris nedaudz svaigākas grāmatas ar padziļinātu un atsvaidzinātu pieejas apskatu. Tā nu man rokās nonāca šī pagājušajā gadā izdotā grāmata par to, kā tad reaģējošu (jā - tā sauc responsīvu) dizainu izstrādāt atbildīgi.

Sākšu ar to, ka sūds jautājums - tas nav uzbrauciens Cube, jo raksts ir labs, nekas tur nav sadirsts un fundamentālās lietas ir palikušas fundamentālas arī šodien, tikai mūsdienās vairs nevajadzētu lietot terminu mobile first, jo patiesībā ierīču ir tik daudz, ka jārunā par small screen first vai big screen first. Ja godīgi, tad arī tas ir tikai tehnikas un pieredzes jautājums - ja programmētājs un dizaineris nejēdz kopā izdomāt dizainu, kuru var implementēt gan no vienas, gan otras pieejas, tad vajag abiem pamācīties un uzkrāt nedaudz vairāk pieredzes. Tas ir vienkārši max-sizewidth vai min-sizewidth media query jautājums. Joprojām izmantoju vispirms lielo ekrānu, jo: pirmkārt, ja devaiss nejēdz media queries, tad man labpatīkas domāt, ka tas ir lielais ekrāns un labāk es rādu smukāku versiju nekā izstiepju pa 1900px platumu mobilo dizainu. Pēdējā laikā gan domāju pieeju mainīt, jo tendence rāda, ka mazo ekrānu paliek arvien vairāk.

Tagad pieķeršos grāmatas ķidāšanai. Sākšu ar to, ka sākums jāizlasa gan dizaineriem, gan frontend koderiem, taču man un manam kolēģim bija tāda neliela déjà vu sajūta, jo mēs to (varbūd ar dažām atšķirībām) aprakstīto pieeju pielietojam jau sen. Tas iegājies tā tīri organiski. Reaģējošs dizains mūsdienās nav sasists pa izmēriem, kurus reprezentē kāda no plašāk izmantotajām ierīcēm, bet to skaldam atkarībā no satura. Tieši tāpēc vispirms izdomā, ko grib parādīt, tad izdomā kā katra detaļa strādās attiecībā pret dažādiem ekrānu izmēriem un tad tikai iedala kādus dizaina izmaiņu punktus.

Nākamās divas nodaļas ir vairāk frontend programmētājiem un izstrādātājiem. Lielākoties visu jau zināju, bet bija arī šis tas interesants pieminēts no JavaScript API puses, kas ir diezgan svaigs, bet es vēl nebiju sācis izmantot, piemēram, jaunajos browseros testēt media kverijus, nevis mēģināt noteikt pašam viewporta izmēru.

Visi piedāvājumi tiek gan loģiski aprakstīti, gan arī papildināti ar piemēriem. Interesantākais ir sekojošs:

• kā ielādēt assetus un kuras pieejas tam ir piemērotākās dažādos gadījumos;
• kā izvairīties no liekiem blokējošiem pieprasījumiem;
• kā samazināt ielādējamās informācijas daudzumu gan stilam, gan skriptiem, gan attēliem;
• kā apstrādāt DOM koku, ja ir situācijas, kad dažādiem ekrānu izmēriem blokus jānoliek dažādās vietās;
• kā optimizēt attēlu ielādi, rēķinoties, ka daudziem ekrāniem ir stipri vairāk par 72 DPI (dots per inch);
• kā izmantot svg grafikas, lai attēls vienmēr būtu skaidrs;
• un daudz kas vēl interesants.

Interesantākais ir tas, ka netiek nodalīti slikti browseri vai labi browseri. Tiek uzskatāmi parādīts iespējamais labākais variants un tas, kā var ļoti efektīvi parūpēties, lai pārlūkprogrammai, kas nejēdz visu izdarīt ar jaunajiem līdzekļiem, saturs joprojām rādītos un būtu saprotams. Te gan jāparāda ar līku pirkstu uz Latvijas klientiem - runa bieži vien ir par satura atrādīšanu, bet "megafīču" apgriešanu. Bieži vien esmu saskāries, ka smuku transition vajag panākt arī uz IE 7... Tad nu jāraksta papildus skripti, jo latvietis nesaprot, ka viens un tas pats dažādos browseros varētu rādīties dažādi.

Uzskatu, ka konkrētajā brīdī web lapu un web aplikāciju izstrādātājiem (sevišķi, ja tās ir apjomīgas) šo grāmatu vajadzētu izlasīt un pat dažas vietas izprintēt un ierāmēt. Tomēr, lai arī lielākoties visu uzrakstīto zināju, jāatzīst, ka neesmu nemaz tik balts kā pašam gribētos, jo bieži esmu slinks vai vajadzības spiests neizdarīt dažas lietas tāpēc, lai ātrāk nodotu projektu un ķertos pie nākamā, piemēram, bieži vien neuztraucos par attēlu izmēriem, reizēm produkcijā skriptus neminimzēju, reizēm maziem ekrāniem pasmagus blokus tikai paslēpju, nevis ielādēju tikai vajadzības gadījumā. Es sevi mierinu ar to, ka labi, ka zinu - gan jau svarīgākam projektam pielietošu!

Es vērtēju šo grāmatu ar 9 kokoiem no 10 un iesaku palasīt arī tiem, kam pieredzes ir vairāk par mani - atkārtošana - zināšanu māte!

Komentāri:

Nu pasāpini mani - tu jau gribi:

* Visi lauki (izņemot tavu lapu) aizpildāmi obligāti!
E-pasts publiski netiks parādīts.
Zinot vairākumu, komentāros tagi netiek atrādīti kā tagi. Linki automātiski pārveidosies par spiežamiem (cerams).
Bloga īpašnieks patur tiesības ļaunus komentārus dzēst vai pārveidot cilvēkiem patīkamākā formā, bet tajā pašā laikā neatbild par komentāru saturu.