Zodiac1978

QA testing your website(s) with free online tools

W3C classics

• https://validator.w3.org/
• https://jigsaw.w3.org/css-validator/
• https://validator.w3.org/feed/

General

kevinkub

// Licence: Robert Koch-Institut (RKI), dl-de/by-2-0

class IncidenceWidget {

  constructor() {
    this.previousDaysToShow = 31;
    this.apiUrlDistricts = (location) => `https://services7.arcgis.com/mOBPykOjAyBO2ZKk/arcgis/rest/services/RKI_Landkreisdaten/FeatureServer/0/query?where=1%3D1&outFields=RS,GEN,cases7_bl_per_100k,cases7_per_100k,BL&geometry=${location.longitude.toFixed(3)}%2C${location.latitude.toFixed(3)}&geometryType=esriGeometryPoint&inSR=4326&spatialRel=esriSpatialRelWithin&returnGeometry=false&outSR=4326&f=json`
    this.apiUrlDistrictsHistory = (districtId) => `https://services7.arcgis.com/mOBPykOjAyBO2ZKk/ArcGIS/rest/services/Covid19_hubv/FeatureServer/0/query?where=IdLandkreis%20%3D%20%27${districtId}%27%20AND%20Meldedatum%20%3E%3D%20TIMESTAMP%20%27${this.getDateString(-this.previousDaysToShow)}%2000%3A00%3A00%27%20AND%20Meldedatum%20%3C%3D%20TIMESTAMP%20%27${this.getDateString(1)}%2000%3A00%3A00%27&outFields=Landkreis,Meldedatum,AnzahlFall&outSR=4326&f=json`
    this.stateToAbbr = {
   

jkva

Add this as a bookmark to get a small span fixed to the top-right of the viewport. I use this to find breakpoints in designs, comments welcome.

javascript:((w, d) => {
const el=d.createElement('span'),calc=()=>{const a=w.getComputedStyle(d.body).getPropertyValue('font-size').match(/(\d+)/)[1],b=parseInt(w.innerHeight/a)+'em',c=parseInt(w.innerWidth/a)+'em';el.textContent=c+' '+b};el.style.cssText='position: fixed; right: 0; top: 0; background-color: #000; color: #fff; padding: .2em; z-index:9001',d.body.appendChild(el),w.addEventListener('resize',calc),calc();
})(window, document);

svinkle

Safari Keyboard Navigation

In order to allow for full keyboard navigation of all element in Safari on macOS, make sure the following options are enabled.

All Controls in macOS

In the macOS settings, allow "All Controls" to be keyboard accessible. Enable this feature by going to:

1. Settings
2. Keyboard

blairanderson

<fieldset class="rating">
    <legend>Please rate:</legend>
    <input type="radio" id="star5" name="rating" value="5" /><label for="star5" title="Rocks!">5 stars</label>
    <input type="radio" id="star4" name="rating" value="4" /><label for="star4" title="Pretty good">4 stars</label>
    <input type="radio" id="star3" name="rating" value="3" /><label for="star3" title="Meh">3 stars</label>
    <input type="radio" id="star2" name="rating" value="2" /><label for="star2" title="Kinda bad">2 stars</label>
    <input type="radio" id="star1" name="rating" value="1" /><label for="star1" title="Sucks big time">1 star</label>
</fieldset>

svinkle

Screencast with VoiceOver

Here’s a quick how-to on recording your Mac desktop while using the VoiceOver screen reader. With this setup you’ll be able to capture both video and internal audio at the same time, and hear the audio output while recording.

Setup

For this setup we’ll be on OS X El Capitan and use QuickTime to capture the video and audio. The only extra thing required is the iShowU Audio Capture driver.

Steps

davatron5000

// Vanilla version of FitVids
// Still licencened under WTFPL
//
// Not as robust and fault tolerant as the jQuery version.
// It's BYOCSS.
// And also, I don't support this at all whatsoever.

;(function(window, document, undefined) {
  'use strict';
  

elijahmanor

Comparison of npm scripts vs Gulp

npm scripts

Pros

• npm scripts are low-level and leverage the actual library you want to use (example: "lint": "eslint ./")
• package.json is a central place to see what scripts are available (also npm run will list all scripts)
• When things get too complicated you can always defer to another file (example: "complex-script": "babel-node tools/complex-script.js")
• npm scripts are more powerful than one might first think (pre/post hooks, passing arguments, config variables, chaining, piping, etc...)

rcugut

DEPRECATED as of macOS 10.13 (High Sierra). See the new GUIDE to install nvm and yarn for macOS (updated July 2019)

Fixing npm On Mac OS X for Homebrew Users

Installing node through Homebrew can cause problems with npm for globally installed packages. To fix it quickly, use the solution below. An explanation is also included at the end of this document.

Solution

This solution fixes the error caused by trying to run npm update npm -g. Once you're finished, you also won't need to use sudo to install npm modules globally.

danmall

Here are a few questions that will tee us up for a good conversation:

- Can you tell me about your project in a few sentences? 
- What’s the timeframe? Does a certain event depend on this project launching?
- What are you looking for from us? Do you want us to design, build, and launch the whole site? Or do you have developers or other partners lined up and only need us for design?
- Have you already started on any part of the project? Do you have existing work? A new logo? Some rough designs or ideas for the site?
- How large is your team? What are the roles you envision on your end?
- How did you hear about our work? What specifically interests you about it? Any projects that you’re keen on?
- How much money have you set aside for this project?
- Are you talking to others about this project? Might we ask how many? What do you like about their work?