quarta-feira, 19 de dezembro de 2012

Tools to create a WebSite with Responsive Design to Desktops and Mobile Devices

Blog Post: Tools to create Responsive WebDesign

The design of WebSites is again having a clear evolution from the Web2.0, with the increased of access to web sites being made through smartphones and tablets (mobile devices), the designers must redesign the layout of the web sites for these may adapt to the small and vertical mobile devices.

Programmers and designers are committed to creating tools that allow the owner of a website to have a page that offers its users a better experience when browsing their domain.

I present a list of the best tools that currently can be found on the Web, so you can create a website with features ideal for your website so it can be responsive automatically when viewed on a desktop computer or on a mobile device, to always offer the user the best comfort when browsing the website.


Grid & Frameworks
Columnal http://www.columnal.com/
Skeleton http://www.getskeleton.com/
LessFramework 4 http://lessframework.com/
Semantic Grid System http://semantic.gs/
Golden Grid System http://goldengridsystem.com/
320 and Up http://stuffandnonsense.co.uk/projects/320andup/
Inuit.Css http://csswizardry.com/inuitcss/
Gridless http://thatcoolguy.github.com/gridless-boilerplate/
1140 CSS Grid http://cssgrid.net/
1KB CSS Grid http://www.1kbgrid.com/
Bootstrap http://twitter.github.com/bootstrap/index.html
Fluid Grid Calculator http://csswizardry.com/fluid-grids/
Fluid Grids http://fluidgrids.com/
Flurid http://kflorence.github.com/flurid/
Grid Set http://gridsetapp.com/
Gridpak http://gridpak.com/
SimpleGrid http://simplegrid.info/
Susy http://susy.oddbird.net/
Tiny Fluid Grid http://www.tinyfluidgrid.com/
Variable Grid System http://grids.heroku.com/

Sketch Sheets & Wireframe
Responsive Web Design SketchSheets http://jeremypalford.com/arch-journal/responsive-web-design-sketch-sheets
Responsive Wireframes http://www.thismanslife.co.uk/projects/lab/responsivewireframes/
StyleTiles http://styletil.es/

JavaScript & JQuery Plugins
Adapt.js http://adapt.960.gs/
Isotope http://isotope.metafizzy.co/index.html
Masonry http://masonry.desandro.com/
Respond.js https://github.com/scottjehl/Respond
TinyNav.js http://tinynav.viljamis.com/
Wookmark JQuery Plugin http://www.wookmark.com/jquery-plugin

Testing & preview
ProtoFluid http://protofluid.com/
Responsive.Is http://responsive.is/
Responsivepx.Com http://responsivepx.com/
Responsive Web Design Testing Tool http://mattkersley.com/responsive/
ReView.js http://responsiveviewport.com/
Screenfly http://quirktools.com/screenfly/
Screenqueri.Es http://screenqueri.es/
The Responsinator http://www.responsinator.com/

Sliders
Blueberry http://marktyrrell.com/labs/blueberry/
Elastislide http://tympanus.net/codrops/2011/09/12/elastislide-responsive-carousel/
Responsive CSS3 slider http://responsive-slides.viljamis.com/
ResponsiveSlides.Js http://responsive-slides.viljamis.com/

Others
Adaptive Images http://adaptive-images.com/
FitText.js http://fittextjs.com/
FitVid.Js http://fitvidsjs.com/
Retina Images http://retina-images.complexcompulsions.com/
Seamless Responsive Photo Grid http://css-tricks.com/seamless-responsive-photo-grid/
SlabText http://www.frequency-decoder.com/demo/slabText/
Zurb – Responsive Tablets http://www.zurb.com/playground/responsive-tables
Categorizr http://www.brettjankord.com/2012/01/16/categorizr-a-modern-device-detection-script/
The Responsive Calculator http://rwdcalc.com/

Sem comentários:

Enviar um comentário