Það er ekkert leyndarmál að margir trúi móttækilegur vefur er framtíðin. Að búa til móttækilegan vef þýðir að það er hægt að laga sig að mörgum mismunandi vöfrum og stærðum sem eru tiltækar. Ef ég vil ganga úr skugga um að vefsvæðið mitt sem ég hef búið til á skjáborðinu mínu sést á spjaldtölvu með minnihlaupi og aðdráttarafl, mun ég hafa áhuga á að búa til móttækilegt vefsvæði.

Ein ástæðan fyrir móttækilegum vefsvæðum hefur orðið vinsæll vegna þess að það er bara skynsamlegt. Það er ódýrara en að búa til eina eða fleiri auka vefsvæði fyrir farsíma og töflur. Það tryggir einnig að það sé í samræmi við skoðun á milli tækjanna og skjáborðsins. Það er ekki gaman að þurfa að auka stærð gluggans eða fletta lárétt til að sjá heilan vef.

Þó að búa til viðkvæmar vefur hönnun er að verða auðveldara, það eru nokkrar leiðir til að fá það að fara enn hraðar. Þökk sé sumum CSS og HTML, getum við kóðað það rétt inn á vefsvæði okkar. Aðrir þættir þurfa meira vinnu. Hvort heldur sem er, höfum við komið upp lista til að hjálpa þér að setja móttækilega síðuna þína saman með lágmarki læti og hámarks árangri.

jQuery tappi

Samsæta

Isotope er jQuery tappi sem segist búa til töfrandi útlit sem ekki er hægt að búa til af CSS og HTML. Það hefur getu til að endurraða þætti innan í ílát svo þau passa inn í það eins og það breytist. Þú getur líka notað Isotope til að sía og flokka hluti eftir flokkum og svo.

Breakpoints.js

Brotpunktur var gerður með verktaki og hönnuðum í huga. Það er tappi sem gerir þér kleift að búa til brautargildi fyrir mismunandi stærðir vafrans. Þegar vafrinn þinn er breytt í einni af þessum stærðum, þá geta þættirnir passað inn í skjáinn.

FitText.js

Þetta er ein af uppáhalds jQuery tappunum mínum vegna þess að það er fyrir leturgerðir. Allt of oft í móttækilegri vefhönnun tekur fólk ekki tillit til þess að fyrirsagnirnar eigi að vera móttækilegar í stað þess að klára í ákveðinn rými. FitText gerir þér kleift að gera það bara, en mundu bara nota það fyrir fyrirsagnir!

Svar.js

Ef þú vilt hugmyndina um Breakpoint.js en vilt meiri customization, Svarið er svarið. Það er mjög gott fyrir þá sem þekkja jQuery betur en CSS og HTML og þurfa að búa til móttækilegar vefsíður. Þú notar bendilinn þinn, en það er svo mikið meira aðlagast, svo sem stærð tækis, pixla rations og getu til að hlaða mismunandi heimildum fyrir mismunandi stærðir.

TinyNav.js

TinyNav er léttur jQuery tappi sem gerir þér kleift að breyta hvaða valmyndaratriði sem eru með listum til að breyta í valmyndina þegar vafrinn er breytt. Þú getur tilgreint stærðirnar og hvaða valmyndir breytast. Það er ekki það breið í aðgerð, en það er mjög árangursríkt fyrir það sem það gerir.

Vinsælar rammar og kerfi

Móttækilegt netkerfi

Þetta kerfi segist ekki vera boilerplate eða ramma, heldur bara kerfi til að gera hönnun móttækileg. Það virðist vera einn af sveigjanlegri sjálfur þar sem það takmarkar þig ekki við ákveðna stærð eða ákveðna netstærð. Þeir nota mismunandi CSS flokkum sem geta flot og búið til eigin dálka.

Golden Grid System

The GGS er líka kerfi, og ekki 'ramma'. Þeir eins og að vísa til sjálfs sín sem upphafsstaður eða leiðbeinandi fyrir þá sem óska ​​að nota ákveðinn magn af grids í vefhönnun þeirra. Þú ert með 18 kolum á skjánum, en 16 til að nota í hönnun þinni. Þú gerir upp eigin breidd og gutters til að nota og fara í raun frá því.

1140 Grid System

Stundum voru mörg hönnuðir að nota vefhönnun sem var 960 px breiður. Þá varð það lítið og þeir fóru upp. Nú eru mörg hönnun þróuð með 1140px breidd. Þetta 1140 Grid System gerir þér kleift að búa til 12 dálka til að nota í breiður vefhönnun.

Twitter Bootstrap

Stígvél er ein vinsælasta ramma í boði. Það er 12 rist ramma sem hefur gert sig nothæft yfir vafra (þ.mt Internet Explorer 7) og hægt að nota svarandi í handfesta tæki. Það kemur með ýmsum stílhlutum, leturfræði og JavaScript til að nota og skapa sléttar, leiðandi vefsíður.

SimpleGrid

SimpleGrid tekur hugmyndina um rist og einfaldar það. Með flestum ristkerfi og rammaþáttum hefur þú þessa óþekkta flokka og óþekkta dálka. Einfalt rist hefur flokka sem tilgreina hvaða dálka eru fyrst, miðja og síðasta. Að auki getur þú bætt við mismunandi "rifa" í dálkana til að gera það virðast eins og það eru fleiri dálkar. Það er mjög einfalt og einfalt ramma.

Önnur móttækileg tæki

Móttækilegur Web Design Sketch Sheets

Mjög eins og hönnuður eða verktaki, útskýrir þú líklega hönnunina þína áður en þú ferð í raun um að gera þær. Vonandi gerir þú það. Ef ekki, kannski ættir þú að byrja með því að nota þessar RWD skissu blöð. Þeir koma með mismunandi tæki og skrifborðstærðir á þeim þannig að þú getur skipulagt allt út.

Móttækilegur Hönnun Höfundur

Ef þú vilt hugmyndina um skissa á pappír, en vilt hafa alla dönsuna þína saman, gætir þú hugsað þér að fá móttækilegan hönnunarsögubók. Það kemur með 50 síðum, spíral bundin með ýmsum skjástærðum á hverri síðu. Öll net og stærðfræði eru nú þegar búnir til fyrir þig, svo þetta er frábært tól fyrir byrjendur og sérfræðinga í móttækilegri hönnun.

Stílflísar

Þetta er gott lítið úrræði fyrir vefhönnuðir hvort sem þeir eru að leita að einhverjum fyrir móttækilegri hönnun eða ekki. Það er PSD sem gerir þér kleift að fá kjarna vefsíðu með því að bæta við fyrirsögnum (letrifræði), lógó, litum og öðrum þáttum. Ástæðan fyrir því að þetta virkar fyrir móttækilegu vefhönnun er vegna þess að það felur ekki í sér neina vídd, bara stafræna hugmynd án takmarkana.

Móttækilegur Reiknivél

Það er tonn af stærðfræði sem taka þátt í að búa til pixla fullkomna móttækileg hönnun. Það er nauðsynlegt að stærðfræði þín sé rétt, eins og heilbrigður, vegna þess að þú verður að takast á við mismunandi hundraðshluta, breidd og stærð vafra. Til að hjálpa, hér er reiknivél sem gefur þér rétta stærðfræði og CSS til að fara með það.

Niðurstaða

Það er mikilvægt að við tökum eftir hvað svarandi vefur er að gera. Margir viðskiptavinir vilja vilja hafa síður sínar tiltækar á ýmsum tækjum og það er bara hagkvæmara að búa til móttækilegar síður. Að auki hjálpa flestum rammaum þínum og öðrum úrræðum til móttækilegrar hönnunar virkilega að rækta skipulögð og hágæða staðlaða vefsíður.

Hverjar eru uppáhalds leiðin þín til að hefja móttækileg hönnun? Höfum við misst auðlind sem þú treystir á? Láttu okkur vita í athugasemdunum.