sixtwothree.org: Links https://sixtwothree.org/links Recent links from sixtwothree.org — Online home to Jason Garber, one of the Internet’s top Jason Garbers. Tue, 19 Dec 2017 22:24:34 EST jason@sixtwothree.org (Jason Garber) jason@sixtwothree.org (Jason Garber) en-US Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International https://sixtwothree.org/links/922 Fizzy School http://fizzy.school/ Tue, 19 Dec 2017 22:24:34 EST

jQuery makes writing browser JavaScript so accessible, it’s easy to skip over some of JavaScript’s core concepts. Fizzy School covers these concepts so novice developers can fill in the missing areas in learning JavaScript and jQuery.

This is a great resource from long-time DC-area Web developer David DeSandro. If you’re just dipping your toes in the JavaScript/jQuery worlds or if you’re looking for a refresher, click on through!

View on sixtwothree.org

]]> development JavaScript jQuery https://sixtwothree.org/links/921 HEAD - A free guide to <head> elements https://gethead.info/ Mon, 18 Dec 2017 22:48:49 EST

A list of everything that could go in the <head> of your document.

This is a pretty comprehensive resource of all the stuff that you might put in the <head> of your HTML pages.

View on sixtwothree.org

]]> development HTML markup metacrap https://sixtwothree.org/links/920 Marvin Visions - A typeface with character https://www.readvisions.com/marvin Mon, 18 Dec 2017 22:43:52 EST

Marvin Visions is a more modern and consistent reinterpretation of Marvin, a typeface originally designed by Michael Chave in 1969 and published by Face Photosetting. It has been revived by Mathieu Triay for the identity of Visions, a new science fiction magazine that aims to be a literary introduction to the genre, mixing classic texts with new writing.

This typeface speaks to me.

View on sixtwothree.org

]]> fonts science fiction typography https://sixtwothree.org/links/919 Essential Image Optimization https://images.guide/ Mon, 18 Dec 2017 22:38:40 EST This online book by Google developer Addy Osmani looks to be an excellent resource for Web developers. Topics include JPG compression, SVG optimization, and WebP details among many others.

If you’re an on-the-go reader, the project’s README includes instructions for creating a PDF version of the book.

View on sixtwothree.org

]]> development images JPG optimization performance SVG WebP https://sixtwothree.org/links/918 IndieWebCamp Baltimore 2018 - Baltimore, Maryland https://2018.indieweb.org/baltimore Mon, 18 Dec 2017 22:31:17 EST

IndieWebCamp Baltimore 2018 is a gathering for independent web creators of all kinds, from graphic artists, to designers, UX engineers, coders, hackers, to share ideas, actively work on creating for their own personal websites, and build upon each others creations.

I’m hoping to make it out for this event next month. If you’re in the DC/Baltimore area and interested in the IndieWeb movement, I recommend you consider signing up!

View on sixtwothree.org

]]> event IndieWeb https://sixtwothree.org/links/917 Extended Validation is Broken https://stripe.ian.sh/ Mon, 18 Dec 2017 22:27:30 EST

Today, I will demonstrate another issue with EV certificates: colliding entity names. Specifically, this site uses an EV certificate for “Stripe, Inc”, that was legitimately issued by Comodo. However, when you hear “Stripe, Inc”, you are probably thinking of the payment processor incorporated in Delaware. Here, though, you are talking to the “Stripe, Inc” incorporated in Kentucky. This problem can also appear when dealing with different countries.

In this post, Ian outlines several Web security-related flaws in current-era browser user interface. Browsers, in an attempt to be clever, obfuscate several important pieces of information that might provide users with details about the people behind a particular website. On top of that, Ian demonstrates flaws in the cross-jurisdicitonal systems that allow for the coexistence of like-named but unrelated business entities.

Browser vendors treat extended validation certificates as special cases, giving them visual priority over standard TLS certificates. The average user won’t know the difference—nor should they—when they see “Trusted Company X” highlighted in green in their browser’s URL bar. The expectation is that they’re actually viewing Trusted Company X’s website and not the website of some rando with a little bit of money to spare.

View on sixtwothree.org

]]> design security UI https://sixtwothree.org/links/916 In praise of those who serve. Yes, even under Donald Trump. Especially under Trump. - Recode https://www.recode.net/2017/9/27/16375110/president-donald-trump-james-mattis-public-service-military-values-code-for-america Fri, 29 Sep 2017 09:02:16 EDT In this article, Code for America founder Jen Pahlka expertly captures many of the reasons I have for choosing to serve our country in tumultuous times.

But sometimes [leaving the federal government] is a luxury. The veteran to whom we’ve promised benefits after she served our country does not have the luxury of choosing to opt out of the federal government; she needs processes to work for her to access benefits. About 75 million people in our country rely on Medicaid; they don’t have the luxury of opting out, either. If the people who administer these and other services walk away and others don’t come to replace them, that choice will be made for them, with devastating consequences.

Earlier this year, I willingly ran into the burning building with a goal of helping as many of my fellow Americans as possible. Six months in, I’m proud to say that—in spite of the three-ring circus at 1600 Pennsylvania—my work continues apace.

View on sixtwothree.org

]]> Code for America government public service work https://sixtwothree.org/links/915 Deploying ES2015+ Code in Production Today — Philip Walton https://philipwalton.com/articles/deploying-es2015-code-in-production-today/ Sat, 16 Sep 2017 13:01:00 EDT

Most developers think of <script type="module"> as way to load ES modules (and of course this is true), but <script type="module"> also has a more immediate and practical use-case—loading regular JavaScript files with ES2015+ features and knowing the browser can handle it!

To put that another way, every browser that supports <script type="module"> also supports most of the ES2015+ features you know and love.

This very helpful article outlines how you can take advantage of modern JavaScript features while still serving usable code to older browsers.

View on sixtwothree.org

]]> development JavaScript modules progressive enhancement https://sixtwothree.org/links/914 Rejected Princesses http://www.rejectedprincesses.com/ Sat, 09 Sep 2017 10:30:22 EDT Rejected Princesses is a fabulous website featuring the stories of women “too awesome, awful, or offbeat for kids’ movies” run by illustrator and former DreamWorks animator Jason Porath. I came across the site via his Twitter thread sharing Neerja Bhanot’s story resisting the armed hijackers on Pan Am Flight 73:

In 1986, a 22-year-old flight attendant named Neerja Bhanot fended off a group of armed hijackers on Pan Am flight 73. When the attackers boarded the plane, she shouted a secret command to the pilots, allowing them to escape. With them gone, she was now the senior member on the plane. It was her, the rest of the crew, and 300+ passengers.

She and the crew set about hiding all the international passengers’ passports, so they wouldn’t be targeted. After 17 hours, the power began to fail and the terrorists began opening fire and setting off explosives. She threw open the emergency exit. She died on that plane, shielding children with her body. She died 2 days short of her birthday, which is today [September 7th]. She would have been 54.

It’s also worth checking out the site’s blog which contains additional stories and bits of ephemera.

View on sixtwothree.org

]]> animation feminism history illustration https://sixtwothree.org/links/913 Software development 450 words per minute - Vincit https://www.vincit.fi/en/blog/software-development-450-words-per-minute/ Tue, 29 Aug 2017 08:41:51 EDT

“Something’s a little bit off here.” That’s what I predict your first thought to be upon seeing my cubicle for the first time. There’s no screen or mouse in sight. Instead there’s a guy hammering away on a keyboard, staring at seemingly nothing.

It’s only me, and my colleagues can assure you that I’m mostly harmless. I’m a software developer working at Vincit offices in Tampere. I’m also blind. In this blog post I’m going to shed some light on the way I work.

Tuukka Ojala shares his experience and the tools he uses to develop software.

View on sixtwothree.org

]]> accessibility development https://sixtwothree.org/links/912 The HTML Tags Everybody Hated - The History of the Web http://thehistoryoftheweb.com/blink-marquis-tag/ Mon, 28 Aug 2017 20:21:32 EDT Jay Hoffmann on the origins of the HTML Editorial Review Board (which would later become the HTML Working Group):

In February of 1996, this new HTML ERB held their first meeting. The board had representation from all across the map, from browser vendors to software makers to standards advocates. And they each had a different idea of what HTML could do. What they needed was some uniform consensus. A common enemy to bring them together.

Which brings us back to blink and marquee.

View on sixtwothree.org

]]> HTML HTML Working Group W3C Web standards https://sixtwothree.org/links/911 Hiding DOM elements - ally.js https://allyjs.io/tutorials/hiding-elements.html Sat, 26 Aug 2017 16:54:40 EDT

This document explains the various ways of hiding things and the implications that come with that.

Indeed it does! This is a very thorough, detailed article on the ins and outs of hiding content with markup and CSS.

View on sixtwothree.org

]]> accessibility CSS HTML https://sixtwothree.org/links/910 WAI-ARIA Authoring Practices 1.1 https://www.w3.org/TR/wai-aria-practices-1.1/ Mon, 03 Jul 2017 23:15:33 EDT

This document provides readers with an understanding of how to use WAI-ARIA 1.1 [WAI-ARIA] to create accessible rich internet applications. It describes considerations that might not be evident to most authors from the WAI-ARIA specification alone and recommends approaches to make widgets, navigation, and behaviors accessible using WAI-ARIA roles, states, and properties. This document is directed primarily to Web application developers, but the guidance is also useful for user agent and assistive technology developers.

View on sixtwothree.org

]]> accessibility ARIA development patterns https://sixtwothree.org/links/909 htmlreference.io – A free guide to all HTML elements and attributes. http://htmlreference.io/ Thu, 16 Feb 2017 09:03:20 EST

htmlreference.io is a free guide to HTML. It features all elements and attributes.

This site—along with its sister site, cssreference.io—is an excellent, thorough, and well-designed resource.

The elements list is clearly alphabetized, but it’s some small pleasure seeing the almighty anchor listed first.

View on sixtwothree.org

]]> CSS HTML reference https://sixtwothree.org/links/908 Align SVG Icons to Text and Say Goodbye to Font Icons https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4 Thu, 02 Feb 2017 09:35:58 EST In this helpful article, Elliot Dahl details his process for creating and aligning SVG icons to text.

View on sixtwothree.org

]]> CSS flexbox SVG https://sixtwothree.org/links/907 [Insert Clickbait Headline About Progressive Enhancement Here], From the Notebook of Aaron Gustafson https://www.aaron-gustafson.com/notebook/insert-clickbait-headline-about-progressive-enhancement-here/ Wed, 07 Dec 2016 09:31:48 EST In a lengthy response to a hyperbolic, ill-informed opinion piece, Aaron Gustafson describes progressive enhancement:

It’s a philosophy that recognizes the nature of the Web as a medium and asks us to think about how to build products that are robust and capable of reaching as many potential customers as possible. It isn’t concerned with any particular technology, it simply asks that we look at each tool we use with a critical eye and consider both its benefits and drawbacks. And it’s certainly not anti-JavaScript.

I spent a good deal of time in 2015 writing and speaking on the benefits of this approach to designing and building for the Web:

The observant reader would note that Aaron and I address the same tenuous arguments made—coincidentally—by the same people.

View on sixtwothree.org

]]> Aaron Gustafson development progressive enhancement https://sixtwothree.org/links/906 Adactio: Journal—The imitation game https://adactio.com/journal/11130 Mon, 05 Sep 2016 10:51:46 EDT Jeremy, on how he thinks about building progressive web apps:

In my opinion, the term “progressive web app” can be read in order of priority:

  1. Progressive—build in a layered way so that anyone can access your content, regardless of what device or browser they’re using, rewarding the more capable browsers with more features.
  2. Web—you’re building for the web. Don’t lose sight of that. URLs matter. Accessibility matters. Performance matters.
  3. App—sure, borrow what works from native apps if it makes sense for your situation.

He also links to Jason Grigsby’s Designing Responsive Progressive Web Apps which is another great read.

View on sixtwothree.org

]]> development Jason Grigsby Jeremy Keith progressive web apps Service Worker https://sixtwothree.org/links/905 Gezeitenstrom - Musikmagazin + Blog: The Orchid - Apogee, Perigee (2016) http://gezeitenstrom.blogspot.de/2016/07/the-orchid-apogee-perigee-2016.html Tue, 26 Jul 2016 17:55:52 EDT The first review for The Orchid’s new album and it’s in German! Related: my band The Orchid has a new album out today. Give it a listen and let me know what you think.

View on sixtwothree.org

]]> The Orchid https://sixtwothree.org/links/904 How did Hitler rise to power? https://www.youtube.com/watch?v=jFICRFKtAc4 Thu, 21 Jul 2016 17:47:58 EDT

Decades after the fall of the Third Reich, it feels impossible to understand how Adolf Hitler, the tyrant who orchestrated one of the largest genocides in human history, could ever have risen to power in a democratic country. So how did it happen, and could it happen again? Alex Gendler and Anthony Hazard dive into the history and circumstances that allowed Hitler to become Führer of Germany.

Jason Kottke shared this excellent video which gives a high-level overview of Hitler’s rise through the ranks of German government in the run up to World War II. As chance would have it, I’ve recently been reading up on the very same subject (thanks, Wikipedia).

The video is part of a TED-Ed lesson that includes additional links and resources.

View on sixtwothree.org

]]> Adolf Hitler Alex Gendler Anthony Hazard history TED World War II WWII https://sixtwothree.org/links/903 Vox Product Accessibility Guidelines http://accessibility.voxmedia.com/ Mon, 18 Jul 2016 15:28:22 EDT

Making work accessible creates a better experience across the board. Use this checklist to help build accessibility into your process no matter your role or stage in a project.

The team at Vox open-sourced their accessibility guidelines. Check the announcement blog post for more details on their process.

View on sixtwothree.org

]]> accessibility ARIA design development HTML patterns Vox Media