Blog

What Really Killed the Dinosaurs?

According to a new theory dinosaurs may have become extinct because of how long it took for them to hatch. The study used fossilized dinosaur teeth from embryos to gage a time frame of six months, as opposed to other birds which  lasts from 11-85 days. In order to acquire this number, scientists used CT scans of “von Ebner” line patterns on the fossilized teeth. These patterns are similar to tree rings and happen to be present in all animals. Due to this long incubation, the dinosaur eggs were exposed to predators and environmental disturbances and simultaneously was linked to their extinction.

 

 

Annotator.JS

What does it do?

As the name might suggest, this is a JavaScript library that allows users to annotate webpages. The days of bookmarking a webpage and inevitably forgetting what you were thinking at the time seem distant now. However, Annotator doesn’t come in the form of a browser plugin, instead it is included on a webpage and will require some setup.

With Annotator you can make notes for you and a group of others or only yourself–really, it’s pretty customizable.

 

I will update this blog post this weekend when I have a live demo for show.

Giving back with 24 Pull Requests

In the spirit of giving back that accompanies the end of the year, a new project named 24 Pull Requests has launched with the goal of helping developers give back to open source projects. To use the site you login with your GitHub account and choose the languages you’re proficient with, then 24 Pull Requests provides you with a list of suggested projects that you can contribute to on GitHub.

So much of our, or at least my, digital life is made possible because of OSS. Whether it’s an act of good will or an effort to pad your résumé, contributing to the projects that make our professional and personal lives better is a great way to give back to the developer community.

If I have seen further, it is by standing on the shoulders of giants.” — Isaac Newton

Just Walk Out with Amazon Go

A few days ago, Amazon announced their grand experiment in brick and mortar grocery and light food shopping called Amazon Go. Basically a shopper checks into the store using the Amazon Go app, puts their items in their bag and “just walks out”. Their items will be tallied and charged when they leave the store.

Of course this seems like the future of shopping to me. I personally like to limit my human interaction when doing things like grocery shopping which is why I use Instacart several times a week. But it does have scary implications for removing the human out of the shopping experience. There will still be jobs for people to stock shelves and prepare food but no more baggers, no more neighborhood checkout girl. We’ll have to see how well the technology works and whether or not people end up wasting time with a buggy UX but for now, it’s a pretty neat idea and I’d love to see how it can be implemented to other traditional retailers.

Space X wants to deploy 4,425 satellites for broadband services

Space X filed an application with the FCC recently to deploy 4,425 satellites orbiting at altitudes ranging from 715 miles (1,150 km) to 790 miles (1,275 km). “With deployment of the first 800 satellites, SpaceX will be able to provide widespread U.S. and international coverage for broadband services,” SpaceX wrote. “Once fully optimized through the Final Deployment, the system will be able to provide high bandwidth (up to 1 Gbps per user), low latency broadband services for consumers and businesses in the U.S. and globally.” 4.2 billion people (or 57% of the world’s population) are offline for a wide range of reasons, but often also because the necessary connectivity is not present or not affordable, so this would make a huge impact for populations both in those areas that are underserved, as well as in developed nations where even with broadband, the average speed is far below the purported Gigabit Internet.

If approved, and implemented, the effect that this could have for content, advertising/marketing, and e-commerce could be huge; opening up markets both  domestically and internationally. From the article “According to a June 2015 story by Christian Davenport at The Washington Post, Google and Fidelity invested $1 billion into Musk’s company, in part to support the project. So it’s a good guess that if and when the network becomes functional, those companies would partly assume control of it. (Google parent company, Alphabet, is also working on its own effort to beam internet connectivity from the skies using satellites, balloons, and drones.)”

Composition Notebook Kickstarter

I am a sucker for anything paper and this is why I chose the Composition Notebook Kickstarter from designer Aron Fay of Pentagram who set out to redesign the classic composition notebook which has been around in its recognizable marble form since the early nineteenth century. Fay set out to recreate the iconic notebook into a sophisticated and elegant device for the modern day human. His result is a striking minimalistic design, with some ruled and some unlined sections of the book. When opened, it has the ability to be laid flat on its spine for easier use. The paper is also thicker than normal paper in composition notebooks, allowing for a wide range of pens and pencils, perfect for the 21st century.

comp_note

Designing Progressive Websites

Last week it was my turn to bring something cool to the team and I decided to share was some stuff I learned at a meetup from earlier in the week.

The meetup was hosted by Sergey Chernyshev from the NY Web Performance meetup group and the topic was “Designing Speed with Progressive Enhancement”.

 

The underlying topic is Progressive Enhancement. If you ask a group of web developers what Progressive Enhancement means, odds are good you’ll get several definitions. But what each of those definitions have in common will be amount or type of features available to a user. Whether that’s in the form of prioritizing content loading (like the main-navigation) or building your website such that it works without JavaScript (this idea is a little older).

This presentation focused more on prioritizing loading and it also touched on pre-loading effects when navigating once already in the website.

Something to focus on is getting that time to “first paint” down to or below 3 seconds, so how can we do that?

In addition to moving your javascript calls to just before the closing </body> tag, when focusing on getting that “first paint” to render as soon as possible you can inline your CSS for static elements such as the main navigation, that way the loading of that interactive content isn’t waiting for your css to get loaded.

When testing for your loading time I recommend using your browser of choice’s developer tools to simulate different mobile networks. This will allow you to see how your website is loading from your current WiFi connection but also allow you to see how it would load for a mobile user on their phone network.

Google Chrome Developer Tools
Google Chrome Developer Tools

For more of a breakdown and slew of other great Progressive Enhancement tips I highly recommend you look through Sergey’s entire presentation.

Full Stack Toronto

I spent the beginning of this week at Full Stack Toronto, a 2-day conference devoted to all things web development. I was honored to be asked to be the Keynote speaker where I gave a talk about the Radical Topic of Women in Tech.  The talk was well received and prompted some really good conversations about the ratio of women to men in the workplace.

Some of the highlights of the conference were:

  • Jennifer Wong’s (Eventbrite) What The Duck-Typed Are My Engineers Saying? talk which fully admitted that developers often use terminology they don’t fully understand.
  • Kate Travers’ (Flatiron School) talk about converting their CSS to Object oriented CSS
  • and my personal fav Henri Helvetica’s talk about The Hateful Weight which discussed how we are accruing way too much page debt in our development and some techniques for getting those page weights down. Check out the slides here.

I’ve been spending much of this week incorporating some of the things I learned into this very website.

Custom Numbered Lists With CSS

This week was my turn to find something cool and share with the team.
And now I’d like to share this with you, so let me give you a summary of CSS counters!

Just like the author Samuel Oloruntoba notes in this article, web developers had to previously resort to an approach like the following:

PHP HTML Example of Archaic Solution
Photo / Code Credit – Samuel Oloruntoba

The reason why this solution is less than desired is that it puts more logic into our markup than is necessary, whereas now we can simply specify this sort of functionality in our stylesheets.

Markup for CSS Counter Example
HTML
SCSS for CSS Counter Example
CSS (SCSS)

With additional styling, this results in the following:

And in addition to incrementing / decrementing decimal values, we also have access to lower/upper-roman, lower/upper-latin, and several other symbolic counters.