May 2013
5 posts
1 tag
Design inspiration on Dribbble →
1 tag
1 tag
links of the week #109
Getting Foundation and IE8 to Play Nice How To Bring Great Type Into Focus Line Clampin’ Making accessible icon buttons Responsive News — Images Responsive Retina-Ready Menu The flag object
1 tag
links of the week #108
1Password keyboard shortcuts Association du contenu au profil de son auteur Automatic Figure Numbering with CSS Counters Briefs Bringing your brand online Draft Supply enquire.js Fixed Background Scrolling Layout free mockups to present your logo work Gallery CSS Ghostlab Google Structured Data Testing Tool How to Present Designs idiomatic.js Intern: A next-generation JavaScript testing stack...
April 2013
7 posts
1 tag
links of the week #107
BugHub Build a Responsive Pricing Table with Neat Hover States CSS3 Transitions: Thank God We Have A Specification! DraftCode Everything you need to understand to start with AngularJS Fullscreen Layout with Page Transitions Government Service Design Manual Gravity Forms Huboard jQuery Builder laravel-4 | Fideloper Launch Services Woes Logo Inspiration Majestic SEO Open Site Explorer Pupil...
1 tag
links of the week #106
Background Slideshow Bonnes pratiques Symfony2 CamanJS Composer primer feju/things-status-board Fifty Shades of BEM GistBox Heck Yes Markdown Laracasts.com Never Say WordPress When Selling a Web Design Project Package Managers: An Introductory Guide For The Uninitiated Front-End Developer Phosphor: Easy Animation for the Web Pickadate.js Preventing the Performance Hit from Custom Fonts Responsive...
1 tag
links of the week #105
7 Responsive Design Tips to Revamp Your Workflow Avoiding Dragons: A Practical Guide to Drag ’n’ Drop Breaking Development: 20MB Responsive Websites Breaking Development: Mobile First Responsive Design Bureau Define - Responsive Draft. Write Better. Google Analytics Panel for Status Board Hack Your Maps helium-css How to Create a Facade in Laravel 4 HTTP: The Protocol Every Web Developer Must...
2 tags
Basecamp for Status Board
I wanted to show the most recent events from my Basecamp project on the iPad app Status Board from Panic.
This widget shows the most recent activity on your Basecamp project(s)
You can find the PHP program necessary for this widget on this github page.
Install the program on a PHP 5.3 server, and change the necessary configuration parameters in the index.php file.
You can see your Account...
2 tags
Mite for Status Board
I wanted to show some time tracking reports from Mite on the iPad app Status Board from Panic.
My status board shows the number of hours spend on each project by week for the current month OR by day for the current week.
You can find the PHP program necessary for these charts on this github page.
Install the program on a PHP 5.3 server, add a graph to your Status Board and add the correct...
2 tags
Integrating Things with Panic's Status Board
Update : a new DIY widget for your tasks
I wanted to show my urgent tasks from Things on the iPad app Status Board from Panic.
warning : you will have to change the files to make this work on your system !
My status board shows the list of tasks that are due today or within 3 days. The first column is the name of the project or area and the second column shows the title of the...
1 tag
links of the week #104
8 Guidelines and 1 Rule for Responsive Images Alfred 2 Workflow List alfred-github-workflow An Event Apart: The Mobile Content Mandate Body Border, Rounded Inside Complex Symfony2 Examples: Users, Menus, CMS Features Cross browser compatible HTML5 videos CSS Masking devbox Draggabilly Easier Testing With Mockery Getting to Know GitHub Pages: Static Project Pages, Fast harvesthq/chosen Helios How...
March 2013
6 posts
1 tag
links of the week #103
“Fixing” Slow Wake for MacBook Pro w/ Retina Display #122: The State of Favicons 10 harsh truths about corporate websites Alfred-Beanstalk Breaking the 1000 ms Time to Glass Mobile Barrier Cache-Control: no-transform Checking if an element is visible on-screen using jQuery designing for his-res displays Ditching the Shoehorn: Designing Type that Works on ePubs, Mobi and the Web...
1 tag
links of the week #102
“Fixing” Slow Wake for MacBook Pro w/ Retina Display 10 bonnes pratiques JavaScript Browser compatibility — viewports Chart.js Discover DevTools Fieldset, legend, border-radius and box-shadow gnarula/sublime-laravelgenerator How to Create a Retro Website Design in Adobe Illustrator Kippt On Responsive Layout and Grids Resources for designers Rock Hammer, a curated, responsive project...
1 tag
links of the week #101
A Guide To WordPress Theme Options akuzemchak/laracon-todo-api Alfred 2: Rewritten From The Ground Up, Workflows, Themes, and More Antwort Cross-Browser Inline-Block Css-only Alternative to the Select Element Designing A Better Mobile Checkout Process dialog Half of mobile search conversions happen in one hour How to lose weight (in the browser) How to shrinkwrap and center elements horizontally...
1 tag
links of the week #100
_clearfix-me.scss A Web Designer’s Site Launch Checklist Adapting To The Ink: Tips And Tricks For Print Style Sheets Building A Better Responsive Website | Smashing Mobile Codebase Craft Creating Wireframes And Prototypes With InDesign Cutting the mustard DigitalOcean DoneDone donuts Element Collages Examining Responsive Navigation: Off Canvas Patterns Extending Semantics & Accessibility...
2 tags
Designing in the browser and in Photoshop with...
The process of designing web pages changes a lot when you make responsive web sites. Making Photoshop comps for different screen sizes is very time-consuming and does not make much sense.
I tend to rely on style tiles to develop a visual identity for a new website, while sketches and wireframes help me define the structure and hierarchy of a webpage. I use Photoshop to experiment a bit with...
1 tag
links of the week #99
10 Heuristics for User Interface Design A closer look at my Sass structure adactio/Pattern-Primer · GitHub Animenu - a responsive dropdown navigation made with SASS Browserhacks Crazy Egg – Visualize where your visitors click css transforms · tutorials · WPD · WebPlatform.org Data Monday: Impact of Responsive Designs DeepTissue.js - A Touch Abstraction Library Designing with context Elastic...
February 2013
8 posts
1 tag
links of the week #98
A time traveller’s guide to Git A Web Designer’s SEO Checklist Am I Responsive? An Event Apart: Responsive and Responsible An Event Apart: The Mobile Content Mandate Anima — CSS animations with a soul aziz/tmTheme-Editor Better Testing in Laravel BugKick Case Study: The Evolution Of The BEM Methodology CSS - Text Eye-Friendly for Mac OS X FF Subsetter Koken More on apples (mobile...
1 tag
2 tags
Responsive web design and the spacer gif
While building my new responsive website, I found a use for one of the most vilified techniques of web design history : the spacer gif.
Performance is a fundamental component of the user experience. When using images on a responsive web site, one should provide the right image for each user : smaller images for smaller screen sizes, big images for retina screens, etc.
This is quite...
1 tag
links of the week #97
A masterclass in CSS animations A new micro clearfix hack adrianmacneil/omnipay ahume/selector-queries Barebones Bones Bourbon Neat Build a Responsive, Single Page Portfolio with Sass and Compass Building a realtime team dashboard app with node.js and Backbone.js Camp CodeKit Kickoff Cool Kitten: A parallax scrolling responsive framework CriticMarkup CSS selectors - mobile Editorially Ember.js -...
1 tag
1 tag
links of the week #96
A CSS media query that captures almost all high DPI aware devices. Analytics for content rich sites Animated page entry with CSS3 Browser-based responsive development tool Design Process In The Responsive Age Developing Backbone.js Applications Espresso-Markdown-theme-for-Sublime filamentgroup/AppendAround Future-Ready Content Groundwork CSS hint.css - A tooltip library in CSS How to open a file...
2 tags
Create an accessible toggle menu for mobile...
This article will show you how to make a simple but accessible toggle menu for your mobile website.
You can see a demo page by clicking here.
Our page will have a navigation menu at the top of the page that will be hidden by default. A menu button will show the menu items when clicked. If the visitor has javascript disabled, the menu button will scroll the page to a copy of the navigation...
1 tag
links of the week #95
Approaches To WordPress Theme Development cartalyst/sentry modern.ie One line browser notepad Optimizing Content for Search Engines and Users Our First Node.js App: Backbone on the Client and Server Preprocessors Selector Step by step from jQuery to Backbone The future of web fonts Toolbar.js type combinations. Épingler l’icône du site sur l’interface Modern UI de Windows 8
January 2013
5 posts
1 tag
links of the week #94
About App Icons activeCollab Datepicker for Bootstrap Effectively Planning UX Design Projects Egghead IO Examining Responsive Navigation Patterns Examining Responsive Navigation: Footer Patterns Examining Responsive Navigation: Toggle Patterns Fashionably flexible responsive web design freshtilledsoil/gridOverlay Front-end performance for web designers and front-end developers Kunstmaan Bundles...
1 tag
links of the week #93
A Beginner’s Guide to HTML & CSS Advanced HTML & CSS Akamai’s Mobitest Breeze: Private email lists for small groups Build Websites. Tame the Wild. Statamic Convert Plain-text Documents to PDF, Docx, and ePub with Docverter Gitfred HTML5 Drag and Drop Avatar Changer with Resizing and Cropping Justnotes - a simple, beautiful and powerful notes app. Medalink/laravel-blade Mime...
1 tag
Fix mime type problem when uploading docx files...
If you upload Office 2007 files with Symfony 1.4, they will be converted to zip files because the mime type is not recognized.
I found a suggested solution online, but this fix results in problems with the classic excel file format on my system.
I fixed the problem by extending the sfValidatorFile class and changing the getMimeType method.
Create a new msValidatorFile.class.php file in your...
1 tag
links of the week #92
Build Your First Admin Bundle for Laravel
Clearfix: the new way to do it!
Creating development environments with Vagrant and Puppet
dexy
Do People Actually Shop on Phones? The Answer Is Decidedly Yes
Elusive icons, an icons font designed for use with Bootstrap
Flexible Foundations
Geocoder
How Do You Structure JavaScript? The Module Pattern Edition
IE-friendly mobile-first CSS with Sass...
1 tag
links of the week #91
All you need to know about CSS Transitions
Deluxe CSS Dropdowns and Flyouts
FoldingText — Scripts
How to Create Retina-Caliber Favicons
Pingdom Tools : loadtime
PlaceIt by Breezi
wireframe.cc
December 2012
5 posts
1 tag
links of the week #90
A List Of All Countries In Many Languages And Formats
Bourbon Sass Mixins Library
Essential Tools for SEO
Gemicon
Inky
Mixing & matching PHP components with composer
Progressive jpegs: a new best practice
Public service announcement: time to update your CSS3
Simple SVG sparklines
1 tag
links of the week #89
7 Awesome Emmet HTML Time-Saving Tips
BugHerd
CSS Baseline: The Good, The Bad And The Ugly
CSS Sliding Panels
Dive into Flexbox
Express - node.js web application framework
File Upload Support on Mobile
How to Setup Laravel 4
node.js
Parallaxin’
PHP Mobile Detect
Sencha
SEO Article Revisited: What The Heck Is SEO? A Rebuttal
Sequence.js
SoundManager 2: JavaScript Sound For The...
1 tag
links of the week #88
24 ways: A Harder-Working Class
24 ways: Design Systems
24 ways: Redesigning the Media Query
alertifyjs
Building grid systems with inuit.css
Change the default save location from iCloud to On My Mac
Cross Browser Inline-Block
CSS Animations with only one keyframe
FooTable: a jQuery Plugin for Responsive Data Tables
Fullscreen Pageflip Layout
HTML_CodeSniffer
I asked people what was...
1 tag
links of the week #87
24 ways: Colour Accessibility
24 ways: Flashless Animation
An Ajax-Include Pattern for Modular Content
BEM: Methodology of Effective Site Development
Better Forms for Mobile Users
Calendario: A Flexible Calendar Plugin
Contract Killer
Decouple Your CSS From HTML With Reusable Modules
Designing Contracts for the XXI Century
Desk.com
Doctrine 1 – Three ways to get a record’s attributes
...
1 tag
links of the week #86
24 ways: HTML5 Video Bumpers
All You Need to Know About the HTML5 Data Attribute
Better understanding your client’s business
Character Codes
composer-sublime
Create Emails for Any Device: Introducing Responsive Email Templates by ZURB
Cross Browser Retina/High Resolution Media Queries
CSS Architecture
Distributed Architecture Faking with Vagrant
Dropbox File Uploader With Twitter...
November 2012
4 posts
1 tag
links of the week #85
20 Mobile/Desktop Browser bugs and tricks
Agile Designers : Best online resources for Web designers
Basic HTTP authentication on a symfony backend
Code smells in CSS
Continuos integration for Laravel with Jenkins and Git
How to Create a Simple Vector Avatar from a Stock Image
Kaleidoscope 2.0 Beta
KaleidoscopeVCSTidbits
Mockery: A Better Way
Pickadate.js
Responsive Menu Concepts
...
1 tag
links of the week #84
10 basic tips about responsive design
Adaptive Maps
Adminer - Database management in single PHP file
An Event Apart: Adaptive Web Content
Beanstalk Tools For Sublime Text 2
Blitz - Load testing from the cloud
Brand identity style guides from around the world
Continuous Deployment with Symfony2, Jenkins and Capifony
daylerees/colour-schemes
Everything You Need to Know About the CSS Cursor...
1 tag
links of the week #83
adamdbradley/focal-point
Alfred Shell Script Extension for opening an SSH tunnel via BrowserStack’s Java command line tool to test multiple internal hosts
Composer Level2: 5 more things like Class Maps, Forking, & Scripts
Creating SVG vector graphics for maximum browser compatibility
Demo Hub of Responsive Images
Emmet Cheat Sheet
facelessuser/RegReplace
github - Renaming remote...
1 tag
links of the week #82
Compressive Images | Filament Group, Inc., Boston, MA
GatherContent
Interaction Design Blog | Hover States
Kirby – Frontend Authentication with Kirby
Labeling home screen bookmarks for iOS6 — Stuff & Nonsense, And All That Malarkey
Mobile First by Luke Wroblewski
nelmio/alice
Yet another newb guide to git
October 2012
5 posts
1 tag
links of the week #81
Basic Ready-to-Use CSS Styles
biko2/symfony_complete
Device and Viewport Size In JavaScript
Drop-Down to Accordion
ecofone
Entity Code
Fine Uploader
Foundation Documentation: Get Started
Foundation Icons Fonts
How to Create a Self Portrait in a Geometric Style
Kick-Start Your Project: A Collection of Handy CSS Snippets
Kirby – How to build a “one-pager” with Kirby
Responsive tables
...
1 tag
links of the week #80
2400 Flag Icon Set
Autohosts for Symfony projects on Mac
Build a Responsive, Filterable Portfolio, with CSS3 Twists
Building WebView Applications
Clearless by clearleft
Codebug - PHP Xdebug frontend
Create a Cheeky Zombie with Basic Shapes and the Shape Builder Tool
CSS Ribbon Menu
Custom Login Form Styling
Custom Scrollbars in WebKit
Demystifying UX Design: Common False Beliefs and...
1 tag
links of the week #79
A Richer Canvas
Afbeeldingen bewaren voor hoge resolutie Retina schermen
Axure
box-shadow vs filter: drop-shadow
browserstack-bookmarklets
Build a smart mobile navigation without hacks
Committed
Don’t Forget About Favicons on Retina Screens
Easy CSS3 Checkboxes and Radio Buttons
Enlivicons
Help Desk Software | UserVoice
How can I get git to autocomplete, e.g. branches, at the command...
1 tag
links of the week #78
3 astuces pour des performances mobiles de l’extrême
Add to home screen
Be Square
Bolt - content management
Browser Trends October 2012: the Calm Before the Storm?
Build Web Apps from Scratch with Laravel – The Eloquent ORM
Build Web Apps From Scratch With Laravel: Filters, Validations, and Files
Building Web Applications from Scratch with Laravel
Composer Namespaces in 5 Minutes - Juan...
1 tag
links of the week #77
A List Apart: Articles: Mo’ Pixels Mo’ Problems
A majority of adult cell owners (55%) now go online using their phones
Adobe Edge Web Fonts
All About Mocking with PHPUnit
Animated GIFs the Hard Way
Antetype
Breaking Development: Mobile Content Strategy
Design a Cool Radio Icon in Photoshop
Establishing An Open Device Lab
Getting started with developing cross-framework Composer packages
...
September 2012
4 posts
1 tag
links of the week #76
aziz/PlainTasks
Base
Best Google Web Fonts
Building Your Own URL Shortener
Cycle2
Easy Content Deployment for WordPress: RAMP
Finally… A Text Editor That Speaks MultiMarkdown!
Five simple steps to better typography
Implementing Smart App Banners
Introducing the Command Bar
iPhone 5 and iOS 6 for HTML5 developers
Jarallax
Kube Framework
Our Favorite Tools for Sketching
Package...
1 tag
links of the week #75
.htaccess made easy
10 Terminal Commands That Every Mac User Should Know
A Guide To iOS SDK For Web Designers
app-UI by triceam
Backstretch
Big Menus, Small Screens: Responsive, Multi-Level Navigation
BOWER
Build an RSS 2.0 Feed with CodeIgniter
Convert Fonts for the Web - FontPrep
Creative Web Typography Styles
CSS Values
gwilson/iOSWebAppTemplates
Hidpi / Retina CSS media query
...
1 tag
links of the week #74
BookBlock: A Content Flip Plugin
Centering in the Unknown
davatron5000/Foldy960
Dependency Injection: Huh?
Designing for Retina
Do you have a clear idea of when a native app is required?
edas/webperf-book
enquire.js - Awesome Media Queries in JavaScript
Exporting Retina designs from Photoshop with Slicy
filamentgroup/unicon
Five steps to gettin’ flexy in responsive web design
...
1 tag
links of the week #73
15 things you can (and should) do to make your site faster for mobile users
An Event Apart: What’s Your Problem?
Complex Navigation Patterns for Responsive Design
Developing Responsive Designs With Opera Mobile Emulator
Making a Sublime Text Plugin: Markdown Reference Viewer
New Firefox Command Line helps you develop faster
Nielsen is wrong on mobile
Optimizing The Design Workflow With...
August 2012
4 posts
1 tag
links of the week #72
Data Monday: Mobile Browser Use
Divorcing Content from Form
Even More Syntactically Awesome Stylesheets
FitWeird by davatron5000
Generate a List of Open Safari Tabs with AppleScript
iTerm2 - Mac OS Terminal Replacement
Managing LAMP environments with Chef, Vagrant, and EC2
MediaElement.js
mpmont/ci-snippets
Quick Tip: Avoid FOUT by Adding a Web Font Preloader
Sass 3.2 is released
...