Less Framework 4 I called Less Framework "a CSS grid system for designing adaptive websites". It was basically a fixed-width grid that adapted to a couple of then popular screen widths by shedding some of its columns. It also had matching typographic presets to go with it, built with a modular scale based on the golden ratio. The resources it was originally published with are still available on GitHub. Contrary to how most CSS frameworks work, Less Framework simply provided a set of code comments and visual templates, instead of having predefined classes to control the layout with. /* Default Layout: 992px. Less Framework was popular in the early days of responsive design. Eventually, I moved on from fixed-width grid systems and worked on a fully fluid-width one, in the form of Golden Grid System. Less Framework's popularity was helped by the following contributions and the lovely people behind them (dead links crossed off):
Neutron Drive, un editor de código online que se integra con Google Drive Neutron Drive es un útil editor de código online que se vale de Google Drive para ofrecer diferentes funcionalidades de almacenamiento, velocidad, copias automáticas, estabilidad y sincronización para trabajar en cualquier proyecto de código incluso desde múltiples equipos. Ya como editor cuenta con temas, una cómoda interfaz por pestañas, un explorador de archivos para navegador dentro de los ficheros en Google Drive, un cajón de búsqueda potenciado, guardado automático, revisión de versiones para volver a un estado anterior y un gato como logo. Se puede instalar como una Chrome Web App y viene con el siempre eficiente coloreado de sintaxis que responde al lenguaje utilizado (clic derecho sobre el nombre de la pestaña en uso y luego en Editor Mode para desplegarlos): C, C++, Java, JavaScript, Perl, Ruby, PHP, Python, CSS, HTML, R, Latex y otros 45 más entre los que se incluye escritura en texto plano. Enlaces: Página oficial | Neutron Drive en la Chrome Web Store
Skeleton: Beautiful Boilerplate for Responsive, Mobile-Friendly Development What Is It? Skeleton is a small collection of CSS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone. Skeleton is built on three core principles: Responsive Grid Down To Mobile Skeleton has a familiar, lightweight 960 grid as its base, but elegantly scales down to downsized browser windows, tablets, mobile phones (in landscape and portrait). Fast to Start Skeleton is a tool for rapid development. Style Agnostic Skeleton is not a UI framework. The Grid Skeleton's base grid is a variation of the 960 grid system. One Eleven Two Ten Three Nine Four Eight Five Seven Six Code Example Typography The typography of Skeleton is designed to create a strong hierarchy with basic styles. Heading <h3> Heading <h4> Heading <h5> Heading <h6> This is a blockquote style example. Buttons Buttons are intended for action and thus should have appropriate weight. Click Me For Action Forms Support for Skeleton Examples & Extensions Downloads (A la 960.gs PSD template)
Top 10 Front-End Development Frameworks (Editor’s note: purely for reasons of length and readability, this article is the first of two parts. This one focuses on the Bootstrap family, more will be profiled in the second part.) As the Web matures and the range of mobile devices we use to access it rapidly grows, our jobs as web designers and developers get considerably more complicated. A decade ago things were much simpler. Then, it was almost certain that most of our users were visiting our sites while sitting at their desk, looking at a large monitor. 960 pixels was more or less considered as a good width for a web page. Soon, more people will be accessing the Web on their mobile and alternate devices than on a desktop computer. One of the primary strategies we use when we deal with unknown viewport size is the so-called responsive web design. This is where front-end development frameworks come into play. In brief, if you are serious in today’s web development then using frameworks is a must and not an option. 1. 2. 3. 4.
6 Great Responsive Frameworks for 2014 | Gridgum Responsive websites also allow the website to smoothly scale to a wide range of different sized devices without the need for an additional mobile/device specific site and these responsive frameworks help speed up the process. So lets get started with our list, please note this is not in order of popularity or favouritism. 1. Gumby is a responsive CSS framework that’s built with Compass and SASS. 2. Foundation is a lightweight front-end framework from ZURB, this framework enables the user to create complicated layouts without the need to create a large number of custom elements. 3. Skeleton is a small responsive framework designed for the rapid development of websites of any size. 4. The Responsive Grid System claims not to be a framework, or a boilerplate, but a ‘quick, easy & flexible way to create a responsive website’. 5. 6. And last and not least, Bootstrap.
Will HTML5 Kill the Native App? Mobile Computing | Feature Will HTML5 Kill the Native App? As schools calculate the best way to serve students via mobile apps, cost and performance are part of the equation. Does HTML5 offer a solution or is it just another variable? For colleges and universities today, the question is no longer whether to develop a campus app or not. That horse left the barn in 2012, and BYOD is now galloping freely. HTML5 is the dark horse. Whether this souped-up version of HTML will have enough bells and whistles to supplant native apps is the big question, but schools will probably base their decisions on three factors: performance goals, development costs, and maintenance expenses. The Costs Developing applications for multiple platforms is expensive, primarily because it takes developers a lot of time to create two or three versions of a single app.
The Psychology of Color in Marketing and Branding The psychology of color as it relates to persuasion is one of the most interesting — and most controversial — aspects of marketing. At Help Scout we believe the problem has always been depth of analysis. Color theory is a topic of complexity and nuance, but color psychology in marketing and branding is typically represented in splashy infographics that rarely go beyond See ‘n Say levels of coverage. These surface-level discussions leave us unequipped to make smart decisions about how to use the color spectrum to convey the right message with our marketing and branding. But why is such a potentially colorful conversation so unwaveringly shallow? What is color psychology? Color psychology is the study of how colors affect perceptions and behaviors. It’s an important field of study to consider when creating marketing assets, building a new business, or rebranding an existing one. The problem with the psychology of color in marketing and branding Try for free Why does this matter?
Web UI Frameworks Worth a Try We have been used to the fact that every second site looks like Twitter. That's because of their awesome Bootstrap UI framework. We've seen CSS frameworks before, but all of them were narrow enough to solve one problem at a time. Usually this meant a grid layout and resetting CSS. Twitter Bootstrap not only provides you with flexible responsive grids but adds many useful components. From another point of view, a site built with Bootstrap loses it's individuality. But how to make site look more unique? Let's try something different then. Foundation Foundation is the most advanced responsive front-end framework in the world. Fuel UX Extends Twitter Bootstrap with additional lightweight JavaScript controls. HTML KickStart Ultra–Lean HTML5, CSS, & JS Building Blocks for Rapid Website Production MetroUI Metro UI CSS allows to create a Web site in the style of Windows 8 quickly and without distractions on routine tasks. Groundwork Say hello to responsive design made easy. AlloyUI Kendo UI Ignite UI