ShopTalk Show

By ShopTalkTechnology

ShopTalk Show episodes

August 29, 2013084: RAPIDFIRE #20
It’s time for another RAPIDFIRE! No news, no drama, just lots of question and answer action.
Q & A:
0:51 How do you prefer ordering your queries within your stylesheet? Is mobile-first really the best strategy here?
8:27 Would either of you have any insights as to how to test, target, and develop for the stock “Internet” browser app from Android?
12:37 Maybe Autoprefixer will be useful to your podcast listeners?
19:45 Is there a pretty CSS only solution to style a file input field? The default is so ugly and annoying.
24:00 I have noticed that many theme developers will have the header template that opens a div that is closed in the page template. I find this very frustrating. Is this common for wordpress or is this a bad idea all together?
28:12 So I’ve been having a habitual debate between the SEO department at my job, as well with my other developers, which is the usage of h1’s per page. I understand it use to be that we were suppose to use only one h1 per page for SEO purposes, however from my understanding with html5 elements like section and article we can now use multiple h1’s per page. With many conflicting articles out there, and all these SEO ranking tools that contradict one another, what’s the deal here?
36:10 I was wondering if you could explain the difference between web designers, front end developers, UI designers, etc.?
40:22 A lot of the development I do these days is responsive, but in order to accommodate advertising or Facebook widgets etc I am finding that working with a fixed width sidebar is cleanest. I have been experimenting with display:table-cell, it looked like the perfect solution until I had a page that had a series of short pieces of content that didn’t keep the left hand area full width ( example here Is there a way around this? Do I really just need to wait for Flexbox? Any advice would be awesome.
43:17 I’ve started working with Rails and the Rails asset pipeline. One thing I don’t like is that Rails does the Sass compiling instead of doing it via command line or with a tool like Codekit. I was wondering if you guys know if there are any benefits to using the pipeline vs just compiling it locally. Finally, what do your Sass file structure look like? Do you have one manifest file with many imports, or multiple files each with their own imports?
51:34 Hey guys, I am curious if you guys are familiar with Codekit’s KIT language?
Sponsors:
18:05 Web Design Day
Conference day: Friday October 25th, Workshop day: Saturday October 26th. 2013 is our fifth year and we’ve got workshops and a conference day this year.
Sessions from: Aaron Draplin, Josh Clark, Jenn Downs, Stacey Mulcahy, Sara Watcher-Boettcher, Brian Warren.
Shork and smart lightning talks from Jen Meyercheck, Rob Wierzbowski, Chris Cashdollar and Cathrine Farman.
Workshops by Bearded and Brad Frost
Topics include: devices and the future, UX testing, web typography, keeping your team awesome, controlling your content, the perks of open source, designing for the man without losing your soul, time-saving Sass and some inspiring design talk.
Also, Pittsburgh is awesome
34:15 Environments for Humans – CSSDevConf October 21–23, 2013. The Stanley Hotel in the Rocky Mountains · Colorado, U.S.
More :
Stumped: Android WebView + querySelectorALL()
Chris’ post on Autoprefixer
Shadow Dom
Chris’s post on Job Titles in the Web Industries
Chris’s Codepen on The secret power of revisiting the block formatting context, see original post
Guard for Rails
Codekit’s KIT Language
Hammer for Mac
59 min
August 28, 2013083: With Florian Motlik
This week we were joined by Florian Motlik. Flo is an awesome programmer an a co-founder of Codeship, a part of Techstars Boston. This episode is a deep dive into continuous deployment and automation.
We talked about (roughly in order):
Q & A
13:08 I would like to use Git for version control, and set up a deployment strategy so I can stop going “FTP commando’, but terminal is a bit scary for me. Do you have any suggestions for free or one-off-purchase alternatives for deployment so I can get off FTP?
20:50 Hey guys, I just did a little google-ing and found an FTP-post-commit-deploy-script for Bitbucket/Github. It works on public and private repos. I set it up on my server for a little project I’m working on, and so far it’s working great! I thought this could be a good tool for folks that don’t have a VPS they can setup Git on to still get on a version control work flow.
22:40 What’s the best way to handle database synching? Is it possible to do it with version control?
40:09 I have this site to build with about 30 pages, all one template. Where the line is drawn for static sites vs. CMS?
52:27 I have been looking at several PaaS options out there such as Heroku, Appfog, Paogdabox, and Fortrabbit. I was wondering if those types of scalable web application platforms are best used for all types of sites (blogs for example) since they provide a level of control and scalability, or are they really just meant to be utilized on custom web applications that do a lot of processing server side?
Sponsors
24:40 WP DB Migrate Pro: WP Migrate DB Pro eliminates the manual work of migrating a WP database.
50:15 CSS Dev Conf Join Eric Meyer, Estelle Weyl, Jonathan Snook, and more as they discover the latest in the intersection of CSS and Preprocessors (Sass, Compass, etc.), JavaScript, Responsive Web Design & Mobile at the second annual CSS Dev Conference.
More Flo
Flo on Twitter
Codeship Twitter
Flo on Github
Show Links
Chris’ post on deployment
Codeship
R-Sync
WordPress Theme Unit Test
CasperJS, navigation scripting & testing utility
Setting up a static site on Amazon S3
The ATX Web Show Podcast
WP Engine
Codeship Blog Posts
Smoke Testing with CasperJS
Getting started with Testing from Top to Bottom
More links about continuous integration, continuous deployment, and testing:
Continuous Integration
Continuous Delivery & Deployment
An introduction to test driven development
1 hr 5 min
August 18, 2013082: With Jason Santa Maria
This week we were joined by Jason Santa Maria, a designer currently in Brooklyn, New York. You might know Jason from his work on Typekit or more recently the writing collaboration tool Editorially. Or perhaps from past work like the WordPress logo and from working at renowned web studio Happy Cog. We talked about (roughly in order):
News’n’Links’n’Drama
14:31 WebKit now supports the srcset attribute on image (img) elements – Webkit.org
Q & A
20:53 Jason, you were one of the more prominent art-direction bloggers with your v4 redesign. Did you find it hampered your writing since you had the extra burden of laying out the article in addition to crafting the words?
26:21 What’s your favorite upcoming part of the CSS Fonts Module Level 3 and can you explain what attracts you to those parts and give a little info/background about that portion of the spec?
30:15 Should I chase money, or chase opportunity? I recently could have taken a high-paying corporate job, but chose instead to stay with my creative agency job. What would you do?
35:37 I’ve recently applied for a few jobs where mobile web development or responsive design was a requirement. I started using Twitter Bootstrap about a year ago and use it for every project that I work on now. The feedback that I’ve received from employers is that their IT team feels that I’m just using simple templates and that I don’t have the coding skills or chops required for the position. Does the IT team know what they are talking about?
41:05 If I post code on Github and someone makes my code better or fix any bugs, is it legal to make a profit on their own code if I post it on an app store?
47:44 How do I become a designer?
Sponsors
24:00 Ghostlab Cross-device testing app! Use SHOPTALK code for a 30% discount on the Ghostlab app over at the online store.
45:49 Environments for Humans: Digital Biz Summit – We’re gathering freelance, agency leads, and project managers to discuss how they handle projects, cultivate positive culture, and maintain effective communication from clients to employees. And also make money without losing their shirt. Discount code SHOPTALK still good for 20% off.
More
Jason’s Website
Jason on Twitter
A Book Apart
Editorally
1 hr 2 min
August 15, 2013081: With Geri Coady
This week we were joined by Geri Coady, an illustrator, designer, and author from Newfoundland, Canada. We talked about (roughly in order):
News’n’Links’n’Drama
17:51 WooThemes Price Change, also here
22:00 Chrome’s password saving drama
Q & A
29:02 Are there any particular hues and shades of colors that are particularly inaccessible or render unfaithfully? Also, how does this affect color accessibility?
38:27 I was wondering what your thoughts are on using design elements from web sites such as designshock.com and the slew of others that offer freebies or commercial license purchases?
45:40 In an industry that can be dramatic, cynical, and sometimes barbaric, how do you remain positive and keep your head up in what you do?
52:11 Am I stupid to quit my full-time corporate print design job?
Sponsors:
27:31 BlendConf – Blend Conference is a generalist conference in Charlotte, NC featuring 50 speakers sharing ideas and conversations about user experience design, user interface design, and web development. It’ll all happening September 5-7. 20% off with the discount code ‘shoptalk’.
44:05 CSS Dev Conf – Speakers Announced! October 21-23, 2013 – The Stanley Hotel in the Rocky Mountains · Colorado, U.S.
Show Links
Geri’s Website
Geri on Twitter
Colour Accessability Pocket Guide
Design Shock
Treehouse
Codecademy
Code School
1 hr 1 min
August 01, 2013080: RAPIDFIRE #19
It’s time for another RAPIDFIRE! We talk about (roughly in order):
Q & A
2:30 Which books would you recommend learning about CSS and /or UX design?
6:32 There is a lot of hype around the Hammer and Mixture static site generators right now. Can teams work on these together, or are they just made for prototyping?
12:00 What is the best payment gateway (ease of use and flexibility in their API) for processing both credit cards AND ACH debits?
19:10 What do you do about supporting older browsers like IE6?
24:10 Do you guys experience any wrist pain working at the computer so often?
28:40 How do you deal with this inconsistency across browsers?
37:40 What are your thoughts on Stylus and the ease/difficulty of switching (from SCSS)?
42:42 What are the most important steps a person should take to secure their WordPress sites?
48:30 This question is related to a post that Chris wrote on CSS-Tricks where he was exploring the pros and cons of object literal javascript patterns. Should there be a standard set to all shapes and sizes of sites, or would a large site with a team of people working on it have a different JS pattern than a small one?
54:27 Any tips on how to use the figure element in a more elegant way than just before or after a paragraph?
Sponsors
17:07 Blend Conf Blend Conference is a generalist conference in Charlotte, NC featuring 50 speakers sharing ideas and conversations about user experience design, user interface design, and web development. It’ll all happening September 5-7. You can follow @blendconf on Twitter and register for 20% off with the discount code “shoptalk”.
35:10 Environments for Humans – CSS Dev Conf October 21-23, 2013 The Stanley Hotel in the Rocky Mountains · Colorado, U.S.
Show Links
HTML & CSS Book
Any Book by Dan Cederholm
Don’t Make Me Think
A Book Apart
Mobile First
CSS-Tricks Bookshelf
What are the books have you guys read? (Leave comments!)
Stripe
Authorize.net
Matt Stow Viewport Genie
Viewport Genie on Github
Vaultpress
Learning Javascript Design Patterns
1 hr
July 30, 2013079: With Travis Miller
This week we were joined by Travis Miller, a full stack developer at SPARK. Chris and Dave met Travis at Front End Conf where he gave a talk about hip hop and the web. We talk about (roughly in order):
News’n’Links’n’Drama:
9:24 Why You Shouldn’t Tell That Random Girl On The Street That She’s Hot
Q & A:
14:40 What is the future of layout; CSS Grid or Flexbox?
22:32 Data URI vs linked image?
32:24 What solutions could you recommend for someone looking to provide video training with a paywall on their website? How would you handle memberships? Is Vimeo business secure?
39:36 What would you guys use if you were building a e-commerce site for a small store today?
47:28 I work for an agency looking to move from going “commando” with FTP over to git, sass, etc. What should we do when a client asks for FTP access?
52:34 Are there any performance hits or gotchas by simply linking to Google web fonts instead of downloading them?
57:04 There are a few ways people replace images with text.
Which is the best, considering performance and crossbrowser compatibility?
Sponsors:
46:09 Enviornments for Humans – Digital Biz Summit They’re gathering freelance, agency leads, and project managers to discuss how they handle projects, cultivate positive culture, and maintain effective communication from clients to employees (and also make money without losing their shirt).
Discount of SHOPTALK still good for 20% off.
29:27 BlendConf
SEPTEMBER 5 – 7, 2013
CHARLOTTE, NC
3 tracks / 40 talks
20% off with the discount code shoptalk at http://www.blendconf.com
Show Links:
Travis on Twitter
Travis works at Spark
Egghead.io
Chrome Dev Tools Auto Save
Chris’s guide to Flexbox
Mobify article – Data URI Is Slower
Restrict Content Pro
Vimeo Business
Bitcast.io
FoxyCart
Lemon Stand – All-in-one E-Commerce
1 hr 3 min
July 23, 2013078: With Rick Blalock
This week we were joined by mobile architect Rick Blalock. Rick currently works at Appcelerator, a framework for building out native applications in Javascript. Rick also knows quite a bit about Joomla.
We talked about (roughly in order):
News’n’Links’n’Drama:
12:30 Why mobile apps are slow
21:17 Tweetbot Neue
22:42 Clear up EE drama: Brandon Kelley did not “rage quit” on stage, and EllisLab is looking for a new owner for CodeIgniter
Q & A:
25:12 Do you guys know any good resources that feature some advanced knowledge about web-apps on mobile devices?
33:58 What do you guys think of the responsive image delivery services that are coming online? Have you tried any? Do they reduce the ‘Ughck’?
42:15 With Google getting ready to punish sites that aren’t mobile friendly, do I need to start learning mobile-first responsive design even as a beginner, or should I develop a non-RWD site and then go back later and make it responsive?
47:45 What’s up with Haxe? It’s an open source platform that can compile to many different things, including the mobile platform.
51:56 What are the Pros and Cons of using Drupal vs Joomla these days?
57:04 How do you guys work with Git?
Sponsors:
32:15 BlendConf SEPTEMBER 5 – 7, 2013, Charlotte, NC
3 tracks / 40 talks. 20% off with the discount code ‘shoptalk’
45:52 Environments for Humans OCTOBER 21–23, 2013, The Stanley Hotel in the Rocky Mountains, Colorado, U.S. All the top people awesome at CSS will be there. Plus, SMACSS workshop!!!
Show Links:
Rick’s Website
Rick on Twitter
Appcellerator
Titanium Framework
PhoneGap
Responsive.io
Resrc.it
Sencha
Gitflow
1 hr 7 min
July 11, 2013077: RAPIDFIRE #18
This week it’s another RAPIDFIRE! We talked about (roughly in order):
Q & A
2:23 I recently ran the W3C Markup Validation tool on one of my WordPress site. I was amazed to see how many errors came up… Do you have any suggestions for validating my markup?
9:19 Should I learn Haml or Emmet to speed up writing HTML?
14:47 Do you know of any good tutorials or resources that explain how to set up a workflow for WordPress using GitHub for version control? (Yes: The Lodge at CSS-Tricks and WP Migrate DB Pro)
23:40 I was wondering if you know of a way to synchronize break points values between different assets? Is there a way to set the breakpoint values in some way so that both Sass and JS can load them in and use them?
27:45 Whenever I use SVGs as a background-image and add the background-size property, the SVG in Firefox is blurry. I’ve tried fixing this several ways, including making the width and height of the SVG 100%, but that doesn’t seem to work in every case. Have you ever run into this problem?
30:48 Do you follow any specific style guides for personal/team coding? ( Yes: Sass Style Guide)
37:15 Sponsor: CSS Summit Use the discount code “SHOPTALK” for 20% off!
39:48 I was wondering if you had any advice for what should go into every .htaccess file – do you have a standard that gets put into every project? I heard some talk about the one included in the HTML5 boilerplate, and took a look, but a lot of it didn’t really mean anything to me, so I wasn’t sure what to take…or should I just take it all?
46:32 I have a question for you: What is the best way to create column layouts in CSS?
56:15 In order to use em and rem better, I declare html {font-size: 62.5%;} so that the root size is 10px. This allows me to do mathematical calculations much easier and faster. (For eg., a 15px font size can be declared as font-size: 1.5rem;). However, this doesn’t work when it comes to using em in media queries. I’ve noticed that for these to work correctly, I have to revert back to the default 16px. So a min-width: 1000px will be the inconsistent min-width: 62.5em instead of 100em. Do you guys know of a fix for this? Should I even be using em for media queries?
61:35 In one of your previous episodes you talked a little about nginx, and I was hoping you could talk more about that. In the little that I read, it seems like it’s much faster than Apache. But are there any catches? Or is it a no-brainer to switch from Apache?
66:56 Could you talk about using Normalize with Compass on Sass? What is your workflow for getting started?
Sponsors
WP Migrate DB Pro
CSS Summit It’s the 5th annual CSS Summit w/ three tracks focusing on CSS3, workflow, and a whole day dedicated to Sass and Compass. It’s gonna be amazing. Sign up now! Use the discount code “SHOPTALK” for 20% off!
More
Introducing HTML Inspector by Philip Walton
Try Cmd+D in CodePen
Dave’s other podcast, The ATX Web Show
.htaccess Book
The Tao of WordPress
HTML5 Boilerplate
Using Flexbox
Github Normalize Sass
1 hr 13 min
July 08, 2013076: With Tim Sabat and Alex Vazquez
This week we were joined by Tim Sabat and Alex Vazquez. Like Chris, Tim and Alex worked at Wufoo, then SurveyMonkey after the acquisition. Now all three of them are the founders of CodePen. We talk about (roughly in order):
News’n’Links’n’Drama
13:02 Expression Engine Drama – “Competition Ethics & Add-ons”
17:40 Firefox 23: Disable Javascript button is GONE.
26:10 Google Reader is dead.
27:38 H&FJ Fonts now available as web fonts
Q & A
30:25 What are your thoughts on mod_pagespeed?
36:20 Where would you start a major front-end design project for a new software-as-a-service website?
47:24 Is it worth the time and money to go to college to study web development?
52:42 Have you guys had any experience deploying projects with Capistrano?
58:20 Is there a easy way to work locally yet have the clients still be able to view the website?
Sponsors
45:50 BlendConf – September 5 – 7, 2013 – Charlotte, NC – 3 tracks / 40 talks – 20% off with the discount code “shoptalk” at Blendconf.com
29:12 Environments for Humans CSS Summit – Val and Dave and lots of other great designers are speaking at it, use discount code “SHOPTALK” for 20% off at CSSsummit.com
Show Links
Tim’s Website
Tim on Twitter
Alex’s Website
Alex on Twitter
New Relic
Dave’s “Excuse Generator”
Brad Frost’s Pattern Lab
Guard
Local Tunnel
1 hr 7 min
July 04, 2013075: With Tim Kadlec
This week we were joined by Tim Kadlec. Tim is a front end developer, blogger, book author, and started the web conference Breaking Development at his previous job. We talk about (roughly in order):
News’n’Links’n’Drama
3:40 “Just Build Websites!” Soundbyte
5:30 Breaking Development Conf
9:30 Tim’s Drama: Science and responsive images
19:15 “The Sidebar In Your Site Is Hot Garbage”
24:20 Brad Frost: Mobile Web Problems
Q & A
30:52 1. Tim, you’re a husband and father of three, you write books, run and speak at conferences and still have great looking hair. What’s the secret?
Do you generally favour responsive image techniques that require author ‘intervention’ (e.g. writing or srcset style markup) or set and forget methods such as adaptive-images.com (and why)?
41:30 Have you seen any examples of pages using mostly CSS animation to tell a story? Also, for Tim, how do animated infographics fit into a responsive workflow?
48:35 Isn’t display: table-cell awesome? Why don’t CSS developers use it more often?
56:24 How do you find the people that you want to interview? The reason I ask is because on your site — and most other design sites I’ve found — never talk about or feature any black designers or developer.
Sponsors
40:10 Environments For Humans CSS Summit – July 23-25. The best conference for front end designer! Dave will be talking about responsive images! Use “Shoptalk” for 20% off.
28:02 TP2WP The quickest and easiest way to move your TypePad or Movable Type blog to WordPress. Use “shoptalk6″ for $10 off.
Show Links
Tim’s Website
Tim on Twitter
8:32 Tim’s Book: Implementing Responsive Design
BigQuery
PictureFill
Matt Wilcox’s Adaptive Images
Sencha IO
1 hr 6 min

About ShopTalk Show

From the publisher's feed

ShopTalk is a podcast about front end web design, development and UX. Each week Chris Coyier and Dave Rupert are joined by a special guest to talk shop and answer listener submitted questions.

Share ShopTalk Show

Sign up to save your podcasts

ShopTalk Show

ShopTalk Show episodes

About ShopTalk Show