Bootstrap - ինչ է դա: Twitter Bootstrap - վեբ կայքի ձևավորում և մշակում

Բովանդակություն:

Bootstrap - ինչ է դա: Twitter Bootstrap - վեբ կայքի ձևավորում և մշակում
Bootstrap - ինչ է դա: Twitter Bootstrap - վեբ կայքի ձևավորում և մշակում
Anonim

Նրանք, ովքեր գոնե մի քիչ աշխատում են վեբ դիզայնի ոլորտի հետ և ծանոթ են կայքերի ստեղծման և նախագծման գործընթացին, գիտեն, թե վերջին շրջանում որքան հեռու են հասել ձեր բովանդակությունը վիզուալացնելու հնարավորությունները: CSS-ի, JavaScript-ի և Flash-ի տեխնոլոգիաների շնորհիվ՝ համակցված, ցանկացած կայք կարող է վերածվել իսկական գլուխգործոցի, ժամանակակից արվեստի ստեղծագործության։ Եվ, իհարկե, շատ դիզայներներ դա անում են, և մեծ թվով ընկերություններ մեծահոգաբար պատվիրում են անհավանական գրաֆիկայով պորտալների մշակումը: Ավելին, էջի «wow-էֆեկտին» կարելի է հասնել ոչ միայն տարբեր էֆեկտների, այլև պարզ, բայց գեղեցիկ անցումների, ինֆոգրաֆիկայի, հղումների և այլնի միջոցով։

bootstrap ինչ է դա
bootstrap ինչ է դա

Ճիշտ է, յուրաքանչյուր դիզայներ և դասավորության դիզայներ գիտի, որ ցանկացած ռեսուրս մշակելիս ժամանակ խնայելու համար պետք է ունենալ որոշակի բազա, կաղապար, որի հիման վրա կարող ես ստեղծել վերջնական «գլուխգործոցը»։ Հենց դրա համար է ստեղծվել Bootstrap-ը. այսօր այն օգնում է խնայել ժամանակը և հեշտացնել գործերը հազարավոր վեբ դիզայներների համար:

Bootstrap - ի՞նչ է դա:

Այսպիսով, ապրանքի նկարագրությունը պետք է սկսվի նրա ընդհանուր բնութագրերից։ Հետևաբար, մենք նշում ենք, որ Bootstrap-ը հարթակ է, որն արտահայտված է հավաքածուովկայքի օրիգինալ ձևանմուշներ: Յուրաքանչյուրը ներառում է գրաֆիկա, CSS և, իհարկե, HTML:

twitter bootstrap
twitter bootstrap

Ամբողջ հավաքածուն գալիս է մեկ արխիվում, որը կարելի է անվճար ներբեռնել հարթակի պաշտոնական էջից։ Այսպիսով, յուրաքանչյուր ոք, ով ցանկանում է զարգացնել իր կայքը, կարող է օգտագործել այս հավաքածուն, և նա կարիք չի ունենա յուրաքանչյուր էջ գրել զրոյից՝ կատարելով հիմնական գործողություններ՝ նշելով կայքը, բաժանելով այն բլոկների, ընտրելով հիմնական պատկերակների գրաֆիկա և այլն: Միևնույն ժամանակ, Twitter Bootstrap-ի յուրաքանչյուր հավաքածու բավականին անհատական է: Ի տարբերություն այն կաղապարների, որոնց մենք սովոր ենք, դրա մեջ ոչ մի ավելորդ բան չկա, որը պետք է հեռացվի կամ փոխարինվի։ Դիզայները կկարողանա ստեղծել իր միտքը անմիջապես Bootstrap-ի հիման վրա։

Ինչպե՞ս սկսել կայք կառուցել:

Այսպիսով, մենք արդեն ծանոթացել ենք բուն հարթակին, այժմ եկեք անցնենք այն հարցին, թե ինչպես սկսել զարգացնել ձեր յուրահատուկ կայքը։ Սկսելու համար, իհարկե, պետք է ներբեռնել արխիվը Twitter Bootstrap կաղապարով։ Այն շատ քիչ տեղ է զբաղեցնում, և այն կարող եք ստանալ GetBootstrap էջում: Այնտեղ կարող եք նաև ընտրել կայքի համար անհրաժեշտ բլոկների տեղադրումը: Օրինակ՝ կան էջեր՝ վայրէջք էջի տեսքով՝ մեկ նկարով, սահիկով, մի քանի վերնագրերով, նախադրված էֆեկտներով և այլն։ Պարզապես պետք է ընտրություն կատարել և ներբեռնել այն արխիվը, որը հարմար է Bootstrap-ի հիման վրա ստեղծված ձեր կայքի համար։ Ինչ է այս հավաքածուն, դուք կտեսնեք անմիջապես ներբեռնելուց հետո:

bootstrap մենյու
bootstrap մենյու

Թեմայի հարմարեցում

Յուրաքանչյուր թեմա իրեն ներկայացնում է, ինչպես ցանկացած կայք,HTML, CSS և գրաֆիկական ֆայլերի մի շարք: Պլատֆորմի մշակողները ձգտել են դիզայնի նորմերը հասցնել նույն չափանիշներին՝ միաժամանակ առավելագույն հնարավորություն տալով հարմարեցնել ձեր թեման։ Ուստի ձեր կայքը եզակի դարձնելու համար ձեզ հարկավոր է հասկանալ հարթակի կառուցվածքը, դրա վրա գտնվող կայքի ճարտարապետությունը և ինչպես է գրված յուրաքանչյուր կաղապարի կոդը։ Դուք պետք է դա անեք մեկ անգամ, որից հետո ավելի հեշտ կլինի ստեղծել ձեր նախագծերը Bootstrap-ի միջոցով: CSS-ը և գրաֆիկան նույնն են բոլոր թեմաներում: Սա այս մոտեցման առավելությունն է:

Մեզ հետաքրքրում է միայն թեմայի անվանումով CSS ֆայլը (այն տեղադրված է «css» թղթապանակում, բացի դրանից դուք կգտնեք հարթակի հիմնական կարգավորումների ևս երկու ֆայլ, դուք. կարող է նրանց հանգիստ թողնել); ինչպես նաև «index.html», որը գլխավոր էջի նշագծումն է։ Դուք պետք է սկսեք սրանից և այլ հատուկ հավելումներից՝ սլայդերների տեսքով, Javascript-ի որոշ էֆեկտներ արդեն որոշվելու են որոշակի կայք ստեղծելու ձեր առաջադրանքով: Օրինակ, ստանդարտ Bootstrap ձևանմուշում ցանկը կարող է ձևավորվել մռայլ մոխրագույնով: Ձեր կայքի համար, իհարկե, կփոխեք այնպես, որ այն կատարվի ճիշտ գույնով և բոլոր ցանկալի էֆեկտներով։ Սա հենց անհատականացումն է, բայց քանի որ կա Bootstrap, կարիք չկա զրոյից մենյու ստեղծել, ինչը խնայում է ժամանակը:

bootstrap css
bootstrap css

Հնարավորություններ դիզայներների համար

Փաստորեն, հիմա այն հնարավորությունների մասին, որոնք տալիս է Bootstrap հարթակը։ Որո՞նք են այդ հեռանկարները՝ աշխատել նման արխիվների հետ։ Թվում է, թե ինչու են նրանք այդքան ուշագրավ:

Poիրականում Twitter-ից մշակողների հարթակում նման բան չկա: Գաղափարը չափազանց պարզ է, ինչպես և դրա իրականացումը: Բայց հիմա դիզայները պարտադիր չէ, որ զրոյից ստեղծի կայքի էջ, այնուհետև դրան ցանկալի տեսք տա։ Ոչ, այժմ մասնագետը կարող է սկսել անմիջապես կեղևից, կայքի ձևավորումից՝ առանց շեղվելու այնպիսի հիմնական բաներով, ինչպիսին է հիմնական նշումը: Սա ժամանակի արդյունավետ և արդյունավետ օգտագործման օրինակ չէ՞։

Բացի այդ, Bootstrap-ի ևս մեկ առավելություն չի նշվել. այն միջոց է օգնելու մարդկանց, ովքեր չունեն բարձր մակարդակի CSS նշագրման հմտություններ՝ ստեղծելու իրենց պրոֆեսիոնալ դիզայնը, քանի որ բոլոր գործիքները, որոնք կարող է դասավորության դիզայները: կարիքն արդեն առկա է խնդրո առարկա ձևանմուշներում: Մարդը, ով գիտի վեբ կայքեր կառուցելու մասին, կարող է շատ ավելին: Եվ սա արդեն իսկապես նշանակալի պլյուս է Bootstrap-ի օգտին:

Այժմ նախագիծը մշակման փուլում է, չնայած այն հանգամանքին, որ այն գործարկվել է դեռևս 2011 թվականին, և այդ ժամանակվանից հազարավոր մարդիկ սկսել են աշխատել դրա վրա: Հուսանք, որ մշակողները կշարունակեն հեշտացնել վեբ դիզայնը և օգնել մարդկանց ստեղծել նոր, անձնական և օգտակար բան աշխարհի համար:

Խորհուրդ ենք տալիս: