Category: Link Day

Business, teamwork and marketing

Interesting article about assessing developer (and designer, I guess) performance: https://medium.com/javascript-scene/assessing-employee-performance-1a8bdee45c1a

There’s a new version of the web developers SEO cheat sheet: https://moz.com/blog/seo-cheat-sheet

Working with other: the sliding scale of giving a f**k (language warning): http://bit.ly/1Gn8XKc

Seth Godin on making faster decisions: http://sethgodin.typepad.com/seths_blog/2015/05/how-to-go-faster.html

Beware of calendars: https://medium.com/@monteiro/the-chokehold-of-calendars-f70bb9221b36

“Writing for the web with style and purpose”: http://www.nicelysaid.co/

Voice and tone – writing email newsletters (and more): http://voiceandtone.com/

Performance

The big news over the last couple of weeks has been Facebook Instant Articles, which FB have been touting as the answer to – get this – slow websites. Lots of articles about this news.

Facebook has made performance a high priority for the entire web: http://alistapart.com/column/instant-web

There needs to be a cultural change (Jeremy Keith): https://adactio.com/journal/8956

Tim Kadlec: performance is a cultural problem: http://timkadlec.com/2015/05/choosing-performance/

Facebook and the media: united, they attack the web: https://www.baldurbjarnason.com/notes/media-websites-vs-facebook/ (fantastic article)

Thoughts on the business motivations behind Facebook Instant Articles: http://www.theawl.com/2015/05/what-could-go-wrong

Other performance articles

Parts 1 and 2 of a 3 part series on page weight:

1 – understanding page weight: http://mobiforge.com/research-analysis/understanding-web-page-weight

2 – measuring page weight: http://mobiforge.com/design-development/measuring-page-weight

Very detailed case study of a performance rewrite for Base Creative: http://jaicab.com/2015/05/18/making-a-difference-with-performance/

Mobile first – perhaps the PC is the limiting factor in web tech: http://ben-evans.com/benedictevans/2015/5/14/mobile-first

Who initiates images downloads in IE? http://bigqueri.es/t/who-initiates-image-downloads/568

Animation performance tips: https://ada.is/blog/2015/04/26/animation-perf/

Accessibility

Practical ARIA examples: http://heydonworks.com/practical_aria_examples/

Accessibility resources: http://www.iandevlin.com/blog/2015/05/accessibility/accessibility-resources

21^st May was Global Accessibility Awareness Day. Videos of the talks given will soon be available at http://www.inclusivedesign24.org/

Design and UX

The 10 commandments of good web form design: http://mono.company/journal/design-practice/the-10-commandments-of-good-form-design-on-the-web/

One from the archives: applying good design principles to the humble airline boarding pass: http://petesmart.co.uk/rethink-the-airline-boarding-pass/

“Hamburger” menus mystify most people (BBC): http://www.bbc.co.uk/news/magazine-31602745

Hamburger wars, a presentation by Michael Ryan: http://www.slideshare.net/ryaninteractive/hamburger-wars-5-2015

Brad Frost’s call-to-arms: http://bradfrost.com/blog/post/perform/

Fantastic article about why design is everyone’s responsibility: http://www.uie.com/articles/designing_without_a_designer/ (remember: design is not just how it looks, but how it works)

Sometimes we need to slow users down a bit: http://alistapart.com/article/meta-moments-thoughtfulness-by-design

Gerry McGovern say it like it is: http://www.gerrymcgovern.com/new-thinking/if-you-love-customer-your-organization-will-hate-you

UX is UI: https://medium.com/@mikeatherton/ux-is-ui-105460807734

Conducting an interface inventory: http://bradfrost.com/blog/post/conducting-an-interface-inventory/

Using Consistency To Improve The User Experience Across Desktop And Mobile : http://usabilitygeek.com/using-consistency-to-improve-the-user-experience-across-desktop-and-mobile/

Functional animations in UX design: http://www.smashingmagazine.com/2015/05/14/functional-ux-design-animations/

Code For America style guide (love the musical note values for layout): https://style.codeforamerica.org/

Progressive enhancement

Myth-busting progressive enhancement: http://www.sitepoint.com/javascript-dependency-backlash-myth-busting-progressive-enhancement/

Progressive enhancement for non-online experiences, in this example an airport: http://christianheilmann.com/2015/05/24/the-ryanair-approach-to-progressive-enhancement/

The true cost of progressive enhancement: https://medium.com/@AaronGustafson/the-true-cost-of-progressive-enhancement-d395b6502979

Jeremy Keith (my hero) hits the nail on the head with regard to browser support: https://adactio.com/journal/8982

Development

Solved by Flexbox – examples using Flexbox to implement tricky common layouts: https://philipwalton.github.io/solved-by-flexbox/

10 principles for effective front-end development by Harry Roberts: http://www.thedotpost.com/2014/11/harry-roberts-10-principles-for-effective-frontend-development

JavaScript for Cats: http://jsforcats.com/ If a cat can learn JavaScript then so can you.

Also: Good (re)introduction to JavaScript: https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript

I’ve only just heard of this comic, but it’s a goodie: http://notinventedhe.re/on/2015-5-19

Thoughts on migrating to a microservices architecture: http://boringgeek.com/thoughts-on-migrating-to-a-microservices-architecture/

“Browserhacks is an extensive list of browser specific CSS and JavaScript hacks”: http://browserhacks.com/

Christian Heilmann (from Microsoft) video presentation about using the latest JavaScript features without breaking everything: https://channel9.msdn.com/Events/WebPlatformSummit/2015/Advancing-JavaScript-without-breaking-the-web

This is so true; curiosity is a highly-important part of being a good developer: http://boyd.multerer.com/posts/2015/05/curious_programmer

A developer at Twitter talks about technical debt: https://phuu.net/2015/05/12/technical-debt.html

Free ebooks from Microsoft: http://www.microsoftvirtualacademy.com/ebooks

An introduction to graphical effects in CSS: http://blogs.adobe.com/dreamweaver/2015/04/an-introduction-to-graphical-effects-in-css.html

PPK lights a fire under web developers’ current obsession with tools: http://www.quirksmode.org/blog/archives/2015/05/tools_dont_solv.html

Testing

I’m not sure of the usefulness of this, but the idea is good: http://mobilewebtest.eu/

Guide to online research and testing tools: http://boxesandarrows.com/your-guide-to-online-research-and-testing-tools/

In other news

A Qualitative Study of Internet Non-Use in Great Britain and Sweden (PDF) : http://spir.aoir.org/index.php/spir/article/download/10/pdf

Remember the 5K competition? I do, and it was 15 years ago! Sheesh, I’m old… http://alistapart.com/blog/post/fifteen-years-ago-in-ala-much-ado-about-5k

Fantastic guide to the WWW from the BBC: http://www.bbc.co.uk/guides/z2nbgk7

Incognitube: the least watched YouTube videos: http://www.incognitube.com/

Here we are again, a lovely set of links for you to enjoy.

Performance

A beginners guide to high-performance website (free 89-page course): http://gomakethings.com/wicked-fast-websites/

Think you know web performance? Take the quiz: http://www.webspeedgeek.com/quiz/content/home.aspx (but check out the leaderboard, some Very Clever People on there)

Open source performance dashboard: http://www.peterhedenskog.com/blog/2015/04/open-source-performance-dashboard/

Performance bookmarklet, Chrome and Firefox extension: https://github.com/micmro/performance-bookmarklet

Free course on browser rendering optimization: https://www.udacity.com/course/browser-rendering-optimization–ud860

More weight doesn’t mean more wait: http://www.filamentgroup.com/lab/weight-wait.html but this does not mean that page weight doesn’t matter

Tips for surviving Google’s “Mobilegeddon”: http://www.aaron-gustafson.com/notebook/tips-for-surviving-googles-mobilegeddon/

Design and accessibility

Revisiting the Priority+ pattern: http://bradfrost.com/blog/post/revisiting-the-priority-pattern/ (also contains links to other useful navigation patterns)

There is no fold: http://www.lukew.com/ff/entry.asp?1946

Practical ARIA examples: http://heydonworks.com/practical_aria_examples/

Accessibility is not what you think: https://boagworld.com/accessibility/accessibility-is-not-what-you-think/

In search of a living design system: https://the-pastry-box-project.net/jina-bolton/2015-March-28 (contains great examples)

Using flexbox today: http://chriswrightdesign.com/experiments/using-flexbox-today/

10 methods for optimizing your forms for mobile devices: http://speckyboy.com/2015/03/30/10-methods-for-optimizing-your-forms-for-mobile-devices/

Web tech

There’s a new browser on the block: https://www.microsoft.com/en-us/windows/browser-for-doing?wt.mc_id=MM13J6

Microsoft have launched a new developer site specifically about their new Edge browser: http://dev.modern.ie/

Visual Studio 2015 now has a network tool: http://blogs.msdn.com/b/visualstudio/archive/2015/05/04/introducing-visual-studio-s-network-tool.aspx

Build cross-platform desktop apps with web technologies: http://electron.atom.io/

Business

Think of starting your own software company? Here’s the handbook: http://www.singlefounderhandbook.com/

Clarifying what is meant by “minimum viable product”: http://blog.heyimcat.com/ (scroll down to the article named “It’s called ‘ship’ not ‘sh*t’” – the email system doesn’t like profane language)

“There is a difference in how well businesses decision makers think industries are able to provide application technologies and how well consumers believe the same industries are actually delivering”: http://www.gerrymcgovern.com/new-thinking/bridging-senior-management-disconnect-digital by the very, very clever Gerry McGovern

The one-minute test: https://medium.com/@jmspool/the-one-minute-test-68738cb111ea a great idea for the end of any meeting

The web’s grain by Frank Chimero: http://www.frankchimero.com/writing/the-webs-grain/ (I put this under “business” as it’s something that managers should read so they understand what the web is really about)

A/A testing: http://kadavy.net/blog/posts/aa-testing/ – important points about “statistically significant” numbers

Development

Reference for HTML characters: http://htmlarrows.com/

Package a web app as a native app across Android, iOS and Windows: http://www.manifoldjs.com/

Explore and master Chrome DevTools: http://discover-devtools.codeschool.com/

9 truths that computer programmers know that most people don’t: http://macleodsawyer.com/2015/03/06/nine-truths-computer-programmers-know-that-most-people-dont/

Progressive enhancement with handlers and enhancers: https://hiddedevries.nl/en/blog/2015-04-03-progressive-enhancement-with-handlers-and-enhancers (bonus link:http://performerjs.org/)

And finally…

Pay a granny to knit for you: http://www.granniesinc.co.uk/

For several years I have been sharing links with work colleagues, giving my emails the snazzy name of ” is Link Day!”. The day, of course, is the day I send the email. I have been silly in not also sharing these links on my blog, not because of the thousands of regular reads I have (ha!) but because I regularly find really useful resources I easily forget about. So, without further ado, is my latest Link Day:

Performance/UX/Responsive design

Google have expanded their Web/Fundamentals section with great information on website performance: https://developers.google.com/web/fundamentals/performance/

Incredibly detailed case study of a performance audit for several sites by speed genius Paul Irish: http://www.paulirish.com/2015/advanced-performance-audits-with-devtools/

Improve mobile UX with these six podcasts: http://www.uie.com/brainsparks/2015/03/06/improve-your-mobile-ux-with-these-six-podcasts-2/

An oldie but a goodie. Leeds lad Harry Roberts gives a great overview of performance tweaks to make on websites: http://csswizardry.com/2013/01/front-end-performance-for-web-designers-and-front-end-developers/

The BBC news site is now fully responsive: http://responsivenews.co.uk/post/114413142693/weve-made-it

Presentation by Bruce Lawson on responsive images: http://brucelawson.github.io/talks/2015/respimg/ (can’t find a video, sorry)

Jeffrey Zeldman on progressive enhancement, and what it means for wearables: https://the-pastry-box-project.net/jeffrey-zeldman/2015-March-21

Oh my word, Kathy Sierra has a new book out: http://www.amazon.com/Badass-Making-Awesome-Kathy-Sierra/dp/1491919019/ref=sr_1_1?ie=UTF8&qid=1425149544&sr=8-1&keywords=badass&tag=rnwap-20 (here’s a trailer video: https://vimeo.com/122214185)

Lots of performance tooling resources: http://perf-tooling.today/

Strategies for staying on top of web performance: https://css-tricks.com/strategies-for-staying-on-top-of-web-performance/

Accessibility

There is ample evidence to suggest that increasing accessibility of a website increases interaction and conversion. Here’s a list of sites that get accessibility right: http://a11ywins.tumblr.com/

Penman Ross (16 years old!) nails why progressive enhancement matters: http://alistapart.com/article/let-links-be-links

Yet another company in a lawsuit over web accessibility: http://the-digital-reader.com/2015/03/20/scribd-faces-setback-in-lawsuit-over-accessibility/

Design

Anna Debenham has put together a great set of resources about Style Guides: http://styleguides.io/

A set of lovely loaders in pure CSS: http://connoratherton.com/loaders

Huge set of design patterns for inspiration: http://www.pttrns.com/

“A collaborative research project aimed at designing better tools and practices for learning web development”: http://openhtml.org/

Development

Free course on JavaScript design patterns: https://www.udacity.com/course/ud989

Interactive tutorial and reference site for the Markdown formatting language: http://thisismarkdown.com/

If you want to get into Angular don’t forget accessibility: http://simplyaccessible.com/article/spangular-accessibility/

Good writeup of use of flexbox for a site header: http://www.lottejackson.com/blog/with-a-spoonful-of-flexbox

Open source book on JavaScript development: https://github.com/getify/You-Dont-Know-JS

Business, teamwork and general interest

We know strategy is important, and execution of that strategy more important still. So why do they often unravel? https://hbr.org/2015/03/why-strategy-execution-unravelsand-what-to-do-about-it Contains the great line “no Gantt chart survives contact with reality”.

Don’t say the solution is easy until you’ve worked out what the problem is: http://curtismchale.ca/2014/10/21/dont-say-its-easy-you-have-no-idea-yet-if-it-is-easy/

The illusion of free: an essay by Laura Kalbag: http://alistapart.com/column/the-illusion-of-free

And finally

“A website should be so easy to use a drunk user could use it”. This guy will test that for you: http://theuserisdrunk.com/

You may not have heard of “the mother of all demos” (fascinating story: http://en.wikipedia.org/wiki/The_Mother_of_All_Demos) but it’s now an opera: http://www.wired.com/2015/03/epic-demo-computer-history-now-opera/

“Public shaming as a blood sport has to stop”. Monica Lewinsky on the price of shame: http://www.ted.com/talks/monica_lewinsky_the_price_of_shame

BusinessTown, inspired by Richard Scarry: http://welcometobusinesstown.tumblr.com/

Submarine cable map 2015: http://submarine-cable-map-2015.telegeography.com/