Share
Recent, am oferit adepților noștri din Twitter ocazia de a cere tot ce vroiau în legătură cu ghidurile de stil Front End. Iată cele mai bune întrebări și (bineînțeles) răspunsurile!
@anna_debenham @wdtuts Care este diferența dintre un ghid de stil și o bibliotecă de modele? (Atât în teorie, cât și în practică).
- Jack Appleby (@jackappleby) 12 mai 2014
Există o mulțime de interpretări, dar așa văd: Ghidurile de stil sunt un termen general pentru o serie de posibilități; ghiduri de stil editorial care discută tonul vocii, ghiduri de stil de design care explorează tipografia și culorile care pot fi folosite pe site și chiar și ghidurile de stil de cod pentru a menține coerența atunci când mai mulți oameni adaugă la codul de bază.
O bibliotecă de modele este un tip de ghid stil care este aproape de un cadru complet. Bibliotecile de modele sunt rezultate excelente pentru dezvoltatori - ele conțin toate fragmentele de cod pentru modulele găsite pe site. Acesta poate fi pus împreună ca un manual de instrucțiuni pentru menținerea stilurilor unui site și a codului frontal.
În cuvintele lui Dave Rupert: "Obiectivele responsabile ar trebui să arate ca și cum ar fi sistemele de tip Twitter Bootstrap pe deplin funcționale personalizate pentru nevoile clienților dvs.". Aceasta este o descriere destul de bună a ceea ce cred că este o bibliotecă de modele.
@anna_debenham Cât de devreme începeți să creați ghidul de stil într-un proiect de reproiectare? @wdtuts
- Matt Quirk (@MattQuirk) 12 mai 2014
Chiar de la început. E prima piesă de dezvoltare pe care o fac. Fiecare site are elemente comune cum ar fi paragrafe, linkuri, titluri, liste, formulare ... și având un fișier pre-pregătit cu toate aceste piese de markup este într-adevăr util să colaborăm la începutul proiectului cu designeri.
Un loc bun pentru a începe este cu Paul Lloyd's Barebones, deoarece acesta conține toate HTML-urile prime care pot fi folosite pe un site. Este ușor să construiți această fundație cu fiecare bucată de funcționalitate care se adaugă.
@anna_debenham @wdtuts Cum gestionați procesul de creare / întreținere a SG-urilor împreună cu livrările hi-fi: model libs, comps
- James Nettik (@jnettik) 12 mai 2014
În proiectele anterioare la care am lucrat, designerul a folosit TypeCast pentru a-și construi stilurile, astfel încât să poată încerca tipografia de bază în browser și să testeze că arată bine pe diferite dispozitive, înainte de a se angaja într-un anumit design. Acest lucru a funcționat foarte bine pentru amândoi, pentru că a ajutat la identificarea problemelor cu lucruri cum ar fi ferestrele web cu aspect subțire sau problemele legate de contrastul color pe ecranele cu dimensiuni reduse la începutul anului.
Unii designeri, cum ar fi Dan Mall, construiesc bibliotecile de elemente în software-ul grafic în timpul procesului de proiectare. Prin ruperea designului în module, convertirea acestuia într-un ghid de stil este cu adevărat simplă. Jon Aizlewood a folosit această abordare în timpul reproiectării Codului pentru America și a însemnat că aș putea începe să construiesc componente și idei de prototipuri, în timp ce restul designului era încă în desfășurare.
Luat de la http://codeforamerica.clearleft.com/@anna_debenham @wdtuts Orice sfaturi despre comunicarea / aprobarea clientului? Cum obțineți clienții la bord cu ceva ce nu pot fi vizualizați pe deplin?
- James Nettik (@jnettik) 12 mai 2014
@anna_debenham @wdtuts Cum prezentați / implicați / familiarizați clienții cu ghidul de stil? (Mai ales cei fără cunoștințe web)
- natalie (@talkanatalka) 12 mai 2014
(Am grupat aceste două întrebări împreună pentru că sunt foarte asemănătoare.)
Aceasta va depinde foarte mult de client. Am descoperit că ghizii de stil sunt foarte ușor de vândut la echipele de web in-house deoarece, dacă mențin un site de împrăștiere, rescriind în mod constant același cod și se ocupă de o foaie de stil supermassive, vor vedea imediat că au avantajul de a avea unul.
Clienții care nu se ocupă în mod direct cu designul sau codul de zi cu zi, probabil că nu vor înțelege beneficiile obținerii unui (nu este, în mod normal, ceva ce ar fi prezentat CEO-ului), dar construiesc unul indiferent că știu că ajută și, sperăm, va ajuta pe oricine trebuie să adauge un cod la site-ul un an mai târziu. Este drăguț să o puteți transfera următorului dezvoltator la sfârșitul unui proiect. Se simte ca maniere bune.
@anna_debenham @wdtuts Cum să promovezi folosirea ghidurilor de stil în organizațiile care nu le folosesc pentru lipsa culturii / termene limitate?
- Daniel Fosco (@notdanielfosco) 12 mai 2014
Eu explic că, deși ghidurile de stil iau puțin timp pentru a-și dezvolta și întreține, economisesc timp pe termen lung. Poate că sunt mai conștient de acest lucru ca contractor, dar este nevoie de destul timp pentru a mă familiariza cu un nou proiect și pentru a nu avea toate informațiile de care am nevoie.
Cu un site care are o bibliotecă de modele preexistente, pot adăuga o nouă bucată de funcționalitate site-ului mult mai repede decât dacă ar fi trebuit să fac furaje în jurul site-ului de vânătoare pentru stiluri similare sau recrearea ceva ce nimeni nu știe că există deja.
Având un ghid de stil boilerplate pe care pot construi, de asemenea, economisește o mulțime de timp, deci producerea unui proiect nu necesită mult efort suplimentar. Asigurați-vă că oamenii susțin că este o muncă grea.
@anna_debenham Îmi place să știu ce credeți despre aceste generatoare automate de ghidare de stil am auzit despre recent ... @wdtuts
- Westley Knight (@westleyknight) 12 mai 2014
Există câteva generatoare de ghiduri de stil, Welch Canavan a scris o listă a acestora aici: http://welchcanavan.com/styleguide-roundup/
Câteva altele care nu au fost menționate includ Stylify Me și Frontify, deci ar trebui să le verificați și pe acestea. Îmi place foarte mult sunetul KSS (Knyle Style Sheets), deoarece generează un ghid de stil de viață din comentariile din CSS.
Generatoarele de ghiduri de stil pot fi utile în unele cazuri, dar unul dintre avantajele construirii unui ghid de stil pe care îl dezvoltă un site este că te forțează să te gândești mai atent la codul tău - fiecare model este ca un bloc lego, vă în modul corect de gândire dacă aveți de gând pentru o abordare mai orientat obiect.
Unde cred că generatoarele sunt utile este dacă intri într-un proiect pentru un site care a fost deja proiectat, ești într-un termen limită și cauți care sunt culorile și stilurile diferite ale titlurilor. Este util dacă doriți să obțineți o listă cu coduri hexagonale.
Tipul lui Nicole Sullivan este bun și pentru această situație. Este un plugin de browser care numără toate fonturile de pe o pagină și le comandă după culoare și dimensiune.
@anna_debenham @wdtuts Cum comunicați în mod eficient atât designerilor, cât și celor din back-end în ghidul de stil BEYOND afișează codul? MULTUMESC
- Joseph James (@joeaugie) 12 mai 2014
Când vă construiți ghidul de stil, puneți-vă în pantofi unui antreprenor sau unui nou angajat care a fost rugat să adauge o nouă secțiune site-ului. Ce informații vor avea nevoie?
Dacă adăugați informații pentru diferite roluri, devine un loc centralizat pentru ca oamenii să meargă și să găsească ceea ce au nevoie. Acest lucru este ceva GOV.UK au avut succes la realizarea cu Service Design Manual.
@anna_debenham @wdtuts Care sunt câteva modalități bune de a utiliza ghiduri de stiluri în dezvoltarea de design, precum și o referință odată ce site-ul intră live?
- Marc Drummond (@MarcDrummond) 12 mai 2014
@anna_debenham @wdtuts În special provocarea de a păstra ghidul de stil relevante și exacte dacă designul evoluează odată ce este live.
- Marc Drummond (@MarcDrummond) 12 mai 2014
Prototype cod și desenează cu el, și se referă la el în fața altor persoane cât mai mult posibil. Când creați noi funcționalități pentru site, construiți-l mai întâi în ghidul de stil, astfel încât, dacă dezvoltați în acest sens, înainte de a impinge modificările, acesta nu va fi depășit. Procedând astfel, puteți verifica și faptul că alte stiluri nu intră în conflict cu cele noi.
Versiunea controlează ghidul dvs. de stil. Faceți-o open source, dacă este posibil: oamenii sunt mai susceptibili să o țină la curent dacă se află în aer liber.
Ian Feather a scris recent despre modul în care Lonely Planet își menține ghidul de stil cu un API. Acest lucru nu va fi potrivit pentru fiecare proiect, dar văd cât de util ar fi acest lucru pentru un site mare care este în continuă dezvoltare. Se simte ca o tehnică bună de a urmări.
Sper că am reușit să răspund la câteva dintre întrebările dvs. despre ghizii stilului din față! Dacă aveți alții, nu ezitați să le întrebați în secțiunea de comentarii.
Accentsconagua