An Event Apart 2013 San Francisco Links
December, 2013The San Francisco instance of the An Event Apart 2013 conference is in the books. An overwhelming amount of great, up-to-the-minute information on web design and development was shared. This post contains the links I compiled for future reference. Since an oft repeated theme of the conference is that we should all make an effort to share knowledge, I'm posting them here for posterities sake.
[Note to attendees: Yes. About 95% of the conference was focused on responsive design. No. This site is not responsive. Someday, I'll fix that. But if I waited until that happened, I'd never get anything posted.]
###Speakers
- Jeffrey Zeldman - Founder, Happy Cog and A List Apart
- Samantha Warren - Designer, Twitter
- Tim Brown - Type Manager, Adobe Typekit
- Luke Wroblewski - CEO & Co-Founder of Input Factory Inc.
- Ethan Marcotte - Author, Responsive Web Design
- Karen McGrane - Author, Content Strategy for Mobile
- Jeremy Keith - Maker Of Websites
- Chris Coyier - Author, CSS-Tricks.com
- Lea Verou - Developer Relations, W3C
- Mike Monteiro - Design Director, Mule Design
- Erika Hall - Co-founder, Mule Design Studio
- Jared Spool - Founder, User Interface Engineering
###The Links
- 1811 COMMISSIONERS PLAN FOR NEW YORK
- 4 awesome slides showing how page speed correlates to business metrics at Walmart.com
- A Book Apart, Design Is a Job
- A conversation with Erik Spiekermann Blog Elliot Jay Stocks
Elliot Jay Stocks is a designer, speaker, and author - A Dao of Web Design · An A List Apart Article
Web designers often bemoan the malleable nature of the web, which seems to defy our efforts at strict control over layout and typography. But maybe the problem is not the web. Maybe the problem is us. John Allsopp looks at web design through the prism of the Tao Te Ching, and decides that designers should let the web be the web. - A List Apart: For People Who Make Websites
A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices. - A Simpler Page · An A List Apart Article
Want to design a book? There are mountains of beautifully designed examples to inspire you. But what about digital books? How do you create elegantly typeset, gloriously balanced reading experiences when tablets render type differently and support different fonts, text can extend in every direction, and type can change size? Craig Mod (Flipboard, Art Space Tokyo) addresses these questions and presents the initial release of Bibliotype, an HTML baseline typography library for tablet reading. - ABC notation - Wikipedia, the free encyclopedia
- Actual Facebook Graph Searches
Compiled by @tomscott. Don't worry, we'll all be used to this in a few weeks' time. You may also enjoy When Facebook Resurrected The Dead. - adactio/Canvas-Sparkline · GitHub
Canvas-Sparkline - Create a sparkline in a canvas element. - adactio/Pattern-Primer · GitHub
Pattern-Primer - Generating styled markup from a folder of markup snippets. - Alexa Top 500 Global Sites
- Asia: mobile internet`s tomorrow - South Africa - Moneyweb
Moneyweb - Breaking news, independent analysis, latest JSE share prices, exchange rates and data on investment, finance and business in South Africa - Bangladesh Internet Usage and Telecommunications Reports
Bangladesh Internet usage, population, and telecommunications reports. - BBC - Homepage
Breaking news, sport, TV, radio and a whole lot more. The BBC informs, educates and entertains - wherever you are, whatever your age. - BBC News - Home
- Bibliotype — Craig Mod
Homeland for Bibliotype, HTML tablet typography library - Building the Happy Cog Test Lab - Cognition: The blog of web design & development firm Happy Cog
Cognition - the blog by world-renowned web design and development agency Happy Cog, discussing design, user experience, business, content strategy and more. - Cloudinary - Cloud-based image management & upload
Manage your website's images in the cloud - Cloudinary seamlessly delivers your website's images from the cloud to your users. - CodeKit — THE Mac App For Web Developers
- Compass.app: compile Sass/Compass easily without resorting to command line interface
- Contents Magazine - a new magazine for new-school editorial
- dabblet.com
An interactive CSS playground and code sharing tool. Dabblet saves to Github gists and offers many conveniences for CSS editing. - Design For The Real World: Human Ecology and Social Change: Victor Papanek PAPANEK: 9780897331531: Amazon.com: Books
Design For The Real World: Human Ecology and Social Change [Victor Papanek PAPANEK] on Amazon.com. FREE shipping on qualifying offers. Design for the Real World has, since its first appearance twenty-five years ago, become a classic. Translated into twenty-three languages - designaw
- Don't Overthink It Grids - CSS-Tricks
The vast majority of websites out there use a grid. They may not explicitly have a grid system in place, but if they have a "main content area" floated to - Editorially
- Embeddable Comments? Yes, Please. ∙ An A List Apart Blog Post
Just like tweets, you can now embed ALA comments anywhere you like. This is one of those features that we’ve been wanting for our own purposes, and then we figured: as long as we’re building it, let’s give everyone the ability to embed comments. - Experiment No 8 — Responding to Voice Commands
- Facebook Announces Monthly Active Users Were At 1.01 Billion As Of September 30th, An Increase Of 26% Year-Over-Year - TechCrunch
Today, Facebook introduced its third quarter earnings for 2012 and shared some updated stats on how the social network is performing. Recently, Mark.. - filamentgroup/grunticon · GitHub
grunticon - A mystical CSS icon solution. - filamentgroup/picturefill · GitHub
picturefill - A Responsive Images approach that you can use today! - FitText - A plugin for inflating web type
- FitWeird by davatron5000
- Font Hinting and the Future of Responsive Typography ∙ An A List Apart Column
Font hinting has been the source of countless headaches for type designers and users. In the meantime, some of the most fundamental and important elements of typography still can’t be addressed with the web of today. Rather than being seen as a tedious chore whose demise will be celebrated, hinting might actually provide the essentials for truly responsive design, and vastly expand the possibilities of digital typography for designers, publishers, and readers. - Foundation - MobilityFoundation: The Most Advanced Responsive Front-end Framework from ZURB
Documentation and reference library for ZURB Foundation. JavaScript, CSS, components, grid and more. - Francis O'Neill - Wikipedia, the free encyclopedia
- Generate a placeholder attribute from the datalist associated with that input.
Generate a placeholder attribute from the datalist associated with that input. - Gist is a simple way to share snippets of text and code with others. - Globe circulation rises on wave of digital subscriptions - Business - The Boston Globe
Paid circulation at The Boston Globe continues to climb on the strength of digital subscriptions, which shot up by almost 50 percent in six months, according to figures released Tuesday by the Alliance for Audited Media. The Globeâs weekday circulation, which includes print readership and digital subscriptions, was 245,572 during the six-month period ended in March â its highest since 2009 and 8.9 percent higher than figures for the same period a year earlier. Sunday circulation rose 4.6 percent to 382,452. It was the third straight period of gains, after circulation fell in every reporting period from 2004 to 2011. The increases helped make the Globe the 24th highest among paid circulation papers in the country, a year after it had fallen out of the top 25. - Gridset - Fully-custom grids for responsive layouts
Gridset is a tool that allows you to create sets of responsive grids for your site. - Grumpicon. A Web app for the Grunticon workflow.
- Grunt: The JavaScript Task Runner
- guard/guard · GitHub
guard - Guard is a command line tool to easily handle events on file system modifications. - Guy's Pod Blog Archive Responsive Web Design Makes It Hard To Be Fast
- Hotel Tonight is revamping the hotel review for mobile devices — Tech News and Analysis
Relying on the smartphone's built-in camera, the app for last-minute, day-of bookings is looking to enhance its curated hotel choices with photo-oriented user reviews. - How Apple.com will serve retina images to new iPads Cloud Four Blog
- How Do Users Really Hold Mobile Devices? :: UXmatters
- How People Really Use Mobile - Harvard Business Review
- How to Explain Why Typography Matters
Awareness of fonts and typography has become a bigger part of mainstream culture. If you are a designer who cares about typography, odds are that you regularly try to explain to somebody why anybody should care about it. - How to make Chrome understand the Sass/SCSS in your rails app - fonicmonkey
When you open the Chrome web inspector, you can browse to the styles that are being applied to your elements. It's great. Unfortunately, if you're using a framework like LESS or Sass, then by default Chrome will reference the CSS files that those frameworks generate, even if you've never seen them before. If you pay… - How to Prioritize: 12 Steps (with Pictures) - wikiHow
How to Prioritize. Have a lot to do and running out of time? Then learn to rearrange things in order of priority. Here's how: Choose the scope. It's easier to prioritize if you focus on a single area at a time. Choose homework, housework,... - How to Size Text in CSS · An A List Apart Article
It's a tug-of-war as old as web design. Designers need to control text size and the vertical grid; readers need to be able to resize text. A better best practice for sizing type and controlling line-height is needed; and in this article, Richard Rutter obligingly supplies one. - How we learned to leave default font-size alone and embrace the em - Filament Group, Inc., Boston, MA
At Filament Group, we build elegant communications and interactions that help people understand, work, and collaborate effectively across a variety of media - from web sites to wireless, to interactive exhibits and print. - http://www.asymco.com/
- IcoMoon - Icon Fonts Done Right
IcoMoon provides a package of vector icons, along with a free HTML5 app for making custom icon fonts. Browse among thousands of pixel perfect icons or import your own vectors. - Icon Fonts are Awesome
- imgix - Image Processing On-Demand, Served By CDN
The on-demand image-resizing CDN. Our technology is faster and easier than doing image processing yourself. Never deploy ImageMagick again. - Inside Paragraphs: Typographic Fundamentals
A book by Cyrus Highsmith about what goes on inside a paragraph of printed text. Published by Font Bureau. - Key findings from the Mobile Africa 2012 report - Communicating Data
Recently, the fourth annual Mobile Africa Report (2012) was recently released by Mobile Monday and Extensia. The report contains an absolute treasure trove of ideas, reflections and quantitative assessments of the continued growth of mobile ownership and use throughout the continent. The research behind the report was led by Dr. Madanmohan Rao, Research Project Director… - Kick Ass Kickoff Meetings · An A List Apart Article
Too many kickoff meetings squander the busiest, most expensive people's time reiterating what everyone already knows. If every meeting is an opportunity, why waste your first one? By asking stakeholders tough questions before the kick-off, and using the meeting itself to explore ideas and build relationships, you can turn a room of mutually suspicious turf battlers into an energetic team with shared ownership of the end-product and the kind of bond that can sustain the group through the challenges ahead. - Koala - a gui application for LESS, Sass, Compass and CoffeeScript compilation.
Koala is a gui for Less, Sass, Compass and CoffeeScript. Koala can run in windows, mac, and linux. - LiveReload
- Long Live the Web: A Call for Continued Open Standards and Neutrality: Scientific American
The Web is critical not merely to the digital revolution but to our continued prosperity—and even our liberty. Like democracy itself, it needs defending - LukeW - Breaking Development: Optimizing the Critical Rendering Path
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Data Monday: How Long To a Mobile Majority?
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Data Monday: Mobile Is Entertainment
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Data Monday: Multiple Device Users
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Data Monday: The Growing Mobile Only Audience
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Data Monday: While Watching TV...
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Quotes from Objectified
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - RESS: Responsive Design + Server Side Components
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - LukeW - Warm Gun: Designing for Mobile Commerce
LukeW Ideation + Design provides resources for mobile and Web product design and strategy including presentations, workshops, articles, books and more on usability, interaction design and visual design. - Meta viewport
- Microjs: Fantastic Micro-Frameworks and Micro-Libraries for Fun and Profit!
- Modular Scale
- Molten Leading
- More Meaningful Typography · An A List Apart Article
Designing with modular scales is one way to make more conscious, meaningful choices about measurement on the web. Modular scales work with—not against—responsive design and grids, provide a sensible alternative to basing our compositions on viewport limitations du jour, and help us achieve a visual harmony not found in compositions that use arbitrary, conventional, or easily divisible numbers. Tim Brown shows us how. - Mule Design Studio
- Naming Media Queries - CSS-Tricks
It would be pretty cool if we could do this someday in CSS. The best idea for it that I've come across is to define it in a tag in the . That way (perhaps) - Nice Web Type – Breakpoints and range rules
For the betterment of typographic style and practice. - Nicholas Zambetti – LiveView for iPhone & iPad
Mobile Application Design & Prototyping Tool - NPD ConnectedIntelligence
- Oakley Airbrake MX // A Revolution In Impact Protection
Introducing Oakley Airbrake MX, a revolution in impact protection. A moto MX game changer. - Optimize CSS Delivery - PageSpeed Insights — Google Developers
- Page Weight Matters
Three years ago, while I was a web developer at YouTube, one of the senior engineers began a rant about the page weight of the video watch page being far too large. The page had ballooned to as high as 1.2MB and dozens of requests. This engineer... - Chris Zacharias - Founder of imgix. YCombinator alum. Ex-YouTuber. Studied New Media at RIT. - PageSpeed Insights
- Pears
- phuu/sparksvg · GitHub
sparksvg - SVG Sparklines all up in your browser - Pirate-themed CT scanner helps New York City kids find calm waters before tests - NY Daily News
Young buccaneers in need of a CT scan at one New York City hospital are in for an adventure on the high seas. - Prefix free: Break free from CSS vendor prefix hell!
- Prepros :: Compile Sass, less or any preprocessing language
Compile less, sass, scss, compass, stylus, cofffeescript, jade, haml, slim and markdown with live browser refresh. - Prism
- Rare 1770 Map of New York City Is Restored - NYTimes.com
Restoring a 1770 map, found at the Brooklyn Historical Society, entailed boiling old books to get the right aged color. - Remote Preview
Remote Preview allows you to preview any URL on large number of mobile devices simultaneously - Remote Research: Real Users, Real Time, Real Research: Nate Bolt, Tony Tulathimutte: 9781933820774: Amazon.com: Books
Remote Research: Real Users, Real Time, Real Research [Nate Bolt, Tony Tulathimutte] on Amazon.com. FREE shipping on qualifying offers. Remote studies allow you to recruit subjects quickly, cheaply, and immediately, and give you the opportunity to observe users as they behave naturally in their on environment. In Remote Research - Responsive Design on a Budget - Clear Thinking - The Clearleft Blog
- Responsive Measure: A jQuery plugin for responsive typography
Responsive - Responsive News
Where BBC News developers blog about responsive design. Opinions expressed on this blog are those of a specific product team, and are not necessarily those of the BBC as a whole. - Responsive News — Cutting the mustard
Cutting the mustard - Responsive Retrofitting - Web Standards Sherpa
Older, legacy sites may limit your ability to modify CSS, but you can still use responsive web design techniques for a better user experience. Ben introduces you to responsive retrofitting. - responsive table patterns
Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus. - Responsive Typography Demo
- Responsive Web Design · An A List Apart Article
Designers have coveted print for its precision layouts, lamenting the varying user contexts on the web that compromise their designs. Ethan Marcotte advocates we shift our design thinking to appropriate these constraints: using fluid grids, flexible images, and media queries, he shows us how to embrace the “ebb and flow of things” with responsive web design. - Sass: Syntactically Awesome Style Sheets
- scottjehl/picturefill · GitHub
picturefill - A Responsive Images approach that you can use today! - Scout - Compass and Sass without all the hassle
- ShopTalk: A Web Design and Development Podcast with Chris Coyier and Dave Rupert
- Sight on Vimeo
A short futuristic film by Eran May-raz and Daniel Lazo. This is our graduation project from Bezaleal academy of arts. Please share if you enjoyed it! Contact:… - Skinny Ties and responsive eCommerce Blog Gravity Department
- Slides: Mobile is eating the world – Quartz
This is a high-level view of mobile devices and usage worldwide, and the dynamics that shape them. Click to skip ahead to each section: mobile scale, tablets, ecosystem, mobile social & discovery. You can leave an annotation by hovering above any slide and clicking on the quote bubble to the right. ... - Style Tiles
A Style Tile is a design deliverable consisting of fonts, colors and interface elements that communicates the evolution of a visual brand for the web. Learn how to use them here. - Surveying the Big Screen · An A List Apart Article
We’ve been designing responsively for more than three years, now, and have the small-screen pattern libraries and portfolios to prove it. But what about larger screens? While we commonly use liquid design for smaller breakpoints, allowing our content to expand and contract as needed, few of us consider what happens beyond a maximum width of 960 pixels or so—which can leave a heap of unused pixels on a contemporary desktop display. Mike Pick explores how to use negative space, scale, density, and layout devices such as grids, modules, and columns to break through the 1024-pixel layout barrier. - Sweet Systems - Cognition: The blog of web design & development firm Happy Cog
Cognition - the blog by world-renowned web design and development agency Happy Cog, discussing design, user experience, business, content strategy and more. - Taking Your Talent to the Web is now a free downloadable book – Jeffrey Zeldman Presents The Daily Report
- Test on Real Mobile Devices without Breaking the Bank - Brad Frost Web
- The Asset Pipeline — Ruby on Rails Guides
- The CSS3 Test
- The Reading Edge™ Series – A group of fonts for small sizes on screens
The Reading Edge series of webfonts were designed from the ground up by Font Bureau specifically for small sizes onscreen. - The Session
An online community dedicated to traditional Irish music. Find tunes, recordings, sessions and events. - The Technium: Better Than Free
- The Web Is a Customer Service Medium (Ftrain.com)
I look forward to your feedback. - Time spent on the most visited websites in the United States 2013 - Statistic
The statistic presents the most visited websites in the United States in June 2013, sorted by user engagement. - Trent Walton - Trent Walton's Web Site
- Twitter / KentBeck: first you learn the value of ...
Instantly connect to what's most important to you. Follow your friends, experts, favorite celebrities, and breaking news. - Type Rendering Mix
- Type study: Sizing the legible letter - The Typekit Blog
Type study is an ongoing series of guest posts about typography on the web. In this article, Ethan Marcotte dishes up advice on font size. Yes, it’s true. This is a blog entry about sizing text for the web. …look, I know you’re still out there. I can hear you breathing. Sure, sizing text isn’t… - Typekit
- TYPEKIT - Font events
- Unicorn Institute
Dr. Leslie Jensen-Inman and Jared Spool research the skills user experience designers need and what type of learning environment is best suited to learn UX skills. - Urban Development
- User Interface Engineering - Usability Research, Training, and Events - UIE
- VW vs. FitText - CodePen
- Web Design Best Practices
- Web Font Specimen
- Web metrics: Size and number of resources - Make the Web Faster — Google Developers
- WebKit for Developers - Paul Irish
Let's try to answer some questions: What is WebKit? What isn't WebKit? How is WebKit used by WebKit-based browsers? Why are all WebKits not the same? - When the Most Personal Secrets Get Outed on Facebook - WSJ.com
The era of social networks like Facebook creates a challenge for individuals navigating the personal-data economy: how to keep anything private when it is difficult to predict where your information will end up. - WordPress › AssetsMinify « WordPress Plugins
- Yelp Official Blog: Ask Yelp: Why can't I write reviews from my mobile?
Over here in Yelpland, we get quite a few questions on everything from our products and people to just about everything in between. We do our best to answer these via our FAQ, our customer service team, and of course,... - Yeoman - Modern workflows for modern webapps
- You like apples? - Electric Pulp
This collection was built by running a script over the URLs I bookmarked. The source of the HTML returned was parsed. The text form the HTML <title> tag was used for the link. The content from the <meta name="description"> tag was used for the follow up description. Lots of sites didn't have the meta tag which is why several links don't have follow up descriptions. It's interesting to me to see how sites are treating those two tags.