Share
Twitter Bootstrap är en utmärkt uppsättning noggrant utformade användargränssnitt, layouter och javascriptverktyg, som är fritt tillgängliga att använda i ditt nästa webbdesignprojekt. Denna videoserie syftar till att presentera dig för Bootstrap; tar dig hela vägen från att ladda ner resurserna, för att bygga en komplett Bootstrap-baserad webbplats.
När Mark Otto (@mdo) och Jacob Thornton (@fat) släppte Twitter Bootstrap till världen i augusti 2011, förklarade deras tillkännagivande vad dess värde skulle vara: att ge utvecklare av framsidan möjlighet att starta projekt effektivt och effektivt.
Bootstrap-stilarket ger ett enkelt implementerat 960-nät för effektiv layout, såväl som professionellt utformade stilar för typografi, navigering, tabeller, blanketter, knappar och mer. För att ta hand om dagliga JavaScript-beröringar, erbjuder Bootstrap en välbyggd uppsättning jQuery-plugins för rullgardinsmenyer, flikar, modalboxar, verktygstips, varningsmeddelanden och mer.
Tillsammans tillhandahåller dessa gränssnittselement alla finesser av en standardkompatibel, användarvänlig, professionellt inbyggd HTML5-webbplats, precis utanför lådan. Som @mdo sätta den i originalposten:
Bootstrap är ett mycket enkelt sätt att främja snabba, rena och mycket användbara applikationer ... ger en ren och enhetlig lösning på de vanligaste, vardagliga gränssnittsuppgifterna som utvecklare kommer över.
Och ändå kommer ingen av det i vägen för ytterligare anpassning. Återigen, med orden @mdo, medan Twitter Bootstrap "är väldigt omfattande," är det ändå "tillräckligt flexibelt för att fungera för många unika designbehov." Således,
Du kan använda Bootstrap för att kasta samman snabba prototyper eller styra utförandet av mer sofistikerade mönster och större tekniska ansträngningar.
De liberala licensvillkoren, enligt Apache 2.0-licensen, ger en hel del kreativ frihet. Så länge du ger de bra på Twitter kvitto för deras arbete, är du fri att ta, tweak och anpassa allt till ditt hjärta innehåll, vänd sedan och lansera den resulterande webbplatsen för dig själv eller för en klient, gratis eller för vinst. (För vidare läsning, kolla in denna diskussionsgänga, där folk på Twitter har förklarat hur man stannar i överensstämmelse med licensen medan du anpassar koden.)
Med tanke på det uppenbara värdet av det som erbjuds och de liberala licensvillkoren är det inte konstigt så många utvecklare har börjat dra full nytta av det. Tumblr-webbplatsen, "Built with Bootstrap", har dokumenterat ett antal Bootstrap-byggda webbplatser, inklusive:
I alla dessa exempel noterar du ett rent nät och ett gränssnitt som betyder professionalism. Du kommer också att notera en hel del variation i detaljerna. Och du kan bli drabbad av det faktum att utvecklare på respekterade kläder som Code Academy och MSNBC har valt att bygga med Bootstrap.
Om du är något som jag, blir du väldigt frestad att checka ut det själv - och du borde!
Faktum är att jag har checkat ut det nyligen. Låt mig visa dig runt.
I de två korta videoklippen nedan presenterar jag dig på Twitter Bootstraps hemmabas, går igenom nedladdning av koden, varefter vi kommer att knäcka den öppna och börja organisera saker för att förbereda vår egen Bootstrap-byggda webbplats.
Alternativt kan du ladda ner videoklippet eller prenumerera på Webdesigntuts + skärmdump via iTunes!
Alternativt kan du ladda ner videoklippet eller prenumerera på Webdesigntuts + skärmdump via iTunes!
Vi gör följande, men inte exakt i denna ordning:
I framtida handledning kommer jag att gå igenom Bootstraps huvudfunktioner, och jag hjälper dig att använda Bootstrap för att skapa ditt eget lagringsutrymme för Bootstrap-fragment. Därigenom lär vi oss om Bootstrap, får erfarenhet av att använda den och anpassa den och förbereda oss för att arbeta med ännu större effektivitet på våra framtida Bootstrap-byggda projekt.
Accentsconagua