Automatiser Grid Design Process med GridGuide
Det første store trinnet i et hvilket som helst webdesign er å plukke et rutenett. Dette definerer vanligvis den maksimale bredden på siden sammen med hvor mange interne kolonner og takrenner som skal brukes til å dele oppsettet.
Du kan prøve å bygge din egen, men det beste verktøyet for denne jobben er GridGuide. Det er en helt gratis webapp som automatiserer nettverksgenerering for alle nettsteder uansett størrelse.
Bare sett inn ønsket maksimal bredde etterfulgt av antall kolonner du vil ha. Vanligvis bør disse to tallene deles, så det er en god ide å unngå primtal. Her er noen vanlige maks bredder for nettsteder:
- 1100 px med 12 kolonner
- 1200px med 8/12 kolonner
- 1240 px med 8/12 kolonner
- 1440px innen 8/10/12 kolonner
- 1600px ved 8/10/12 kolonner
Det er absolutt ikke noe feil svar her. Du kan velg hvilken som helst bredde og så lenge den er jevnt delbar med antall kolonner så er du god til å gå.
GridGuide er en snill webapp så det automatisk oppdateres når du skriver inn en verdi i inntastingsfeltet. Så som du justerer tallene øverst vil du legge merke til Forhåndsvisning av rutenettet endres automatisk.
Jeg pleide å stole på Photoshop for denne jobben, og det kjørte meg bra. Ærlig å lage et rutenett er en av de mest frustrerende trinnene når du designer et nytt nettsted, og å få tallene pixel-perfekt kan være irriterende.
Men GridGuide er helt automatisert, og det gir deg mange forskjellige rutenettalternativer basert på forskjellige kolonnestørrelser og rennbredder.
Du kan til og med last ned et fullstendig PNG-bilde av rutenettet du velger å importere til Photoshop. Dette vil spare mye tid slik at du ikke re-oppretter grids med formverktøy fra grunnen av.
Og hvis du liker en bestemt rutenett, kan du generere en delkobling til bokmerke for senere eller dele med andre på nettet.
For et verktøy som er helt gratis og så lett å bruke, må dette være min beste anbefaling for hver enkelt webdesigner. Hvis du sliter med grids og hater å designe din egen, så er GridGuide en må-ha ressurs i verktøykassen din..
