Business, life, Sport

2015 Year Summary – Code, Books And Running

Overall, it was a very interesting and busy year. A quick overview on some of the fronts that kept me busy.

Code

On the coding front, it was a year that the ‘progressive web apprevolution started. It will be interesting to see what developers will build during 2016. You can see the main projects that kept me busy on this blog (e.g. monetizationstartups, web forms) and on my project site. It always great fun to meet developers around the world that are passion on the same topics you are. Here are a few presentations that I gave.

Screen Shot 2016-01-01 at 9.52.52 AM

I started to push the monetization efforts, both in code (e.g. like this demo or this article on Autofill) and with two courses with Udacity . Check out the courses, they both great (and yes – I’m totally objective on this one).

Running/Biking

On the running front, I had the pleasure to run all over the world. From “down under” to Europe, San Francisco, New York, Barcelona, Paris, London and even in the holy land. On the cycling part, I had the pleasure to participate in 110mile event that few good friends in CA organized – It was one big loop, from Mt. hamilton to Livermore and back. There were also, a lot of good rides in Ben Shemen and other woods. Continue reading

Advertisement
Standard
Chrome, Design

Design Better Forms

25%-metric-on-formsTL;DR

Make your forms as short as possible. The best form is no form. If you must have ‘few’ fields, make sure you optimized for Autofill with the right autocomplete attributes. As you can see in the image above, it’s moving the needle, for real.
Now, if you have another 4 minutes, here are few points to think while you are designing you next form. Continue reading

Standard
Chrome, JavaScript, webdev

Chrome 47 Updates And Web News

  • google-chrome-logoInput Device Capabilities: Chrome 47 has a new feature that makes it easier to understand the how users interact with your site: InputDeviceCapabilities! DOM input events are an abstraction above low-level input events, loosely tied to physical device input (e.g., click events can be fired by a mouse, touchscreen, or keyboard). However, there is a problem: there is no simple method to obtain the details of the physical device responsible for an event. In addition, certain types of input can generate further “fake” DOM input events for compatibility reasons. One such fake DOM event happens when a user taps a touch screen (such as on a mobile phone); it not only fires touch events but, for compatibility reasons, mouse events as well. The new InputDeviceCapabilities API provides details about the underlying sources of input events this come to helps with problems when supporting both mouse and touch input. Read More: developers.google.com/web/updates/2015/10/inputdevicecapabilities
  • Adding a Splash screen for installed web apps – Over the past year we saw an effort in the Chrome team to let developers build sites and apps that feel like they are installed on the user’s system. The home screen launch process on Android is a great first step. In Chrome 46 on Android, we got the background_color that removes any delay and paints the screen with a solid color until the browser is ready to paint something from the web page. This was a good addition, yet it still didn’t look fully like an app. Now in Chrome 47 on Android, Beta these days as of October 2015, we are introducing the concept of a “splash screen”. Have a look:

Continue reading

Standard
Chrome, JavaScript

What’s New On The Web And Chrome

In tslack-logohe last post about powerful new APIs we talked about Service Worker, notifications, push and more. This week we got some other news, videos, slides and a new slack channel for web developers that you should take part in.

New Stuff Around The Web

  • Google Tone is an experimental Chrome extension for sharing the URL of the current tab with other computers by using audio!
    Yes, it does not use Bluetooth, NFC or WiFi: it only sends audio waves. “Google Tone turns on your computer’s microphone (while the extension is on) and uses your computer’s speakers to exchange URLs with nearby computers connected to the Internet.”
  • Can web apps be as smooth and slick as native? YES!
    Paul Lewis made a web app to show how. The app uses all the latest goodies, including Service Workers, ES6 Classes and Fat Arrow functions, and Promises.
    Check out his blog post here for all the details!
  • The best (new) show in town about best practice tools.
  • Another new location we maintaining to hold all the news around web development: https://developers.google.com/web/updates/ and if you like medium we got a new channel there as well.
  • Polymer 0.9 library is released!
    The 0.9 release is very similar to 0.8, with many of the “experimental” 0.8 features now officially supported.
    Full release notes for 0.9, including the breaking changes from 0.8, are available on the Polymer site.
  • Two new videos from talks that Paul Lewis and Jake Archibald gave last week:

Continue reading

Standard
Chrome, HTML5, JavaScript, webdev

Chrome And The Web App Revolution

chrome 3dQuick update from the world of Chrome. The new version in stable (chrome://version = 42 just like the answer to the universe) brings some interesting and powerful features that give web developers more options to create amazing experiences.

google-chrome-logo

Chrome 42 (stable)

We are getting to a world where web developer could create web apps that act just like ‘native apps’ without any bridges (e.g. Cordova). The main enablers APIs are already in this version. Check out what you can do today with Service Worker and the options it’s giving you to cache, work offline and push notifications in the background. Here is an example I wrote that uses service worker to cache & offline. I think we are going to see some very interesting implications. There are many options for the “physical mobile web” and these powerful APIs. Continue reading

Standard
Chrome, HTML5, JavaScript, webdev

Maximizing Your ROI On The Mobile Web

mobile devicesIt’s a mobile world.
The next 4B users are going to use the web only on mobile so we should think on their experience. Moreover, a lot of people are using the mobile web as discovery mechanism and when they land on our site we got the (one) chance to impress. The summary of the slides below will focus on two main aspects: performance and user experience. In the slides you can read on the 25 principles and how to work with them.

  • Performance
    Get content to the user as quickly.
    I think this formula used in Ilya Grigorik’s talk sums this up:

    Perceived performance = f(Expected Performance, 
                               UX, 
                               Actual Performance)
  • User Experience
    Optimize for the mobile device. So start your design from the small screen and move forward to a bigger one.

Here are tools that every web developer should use (or embrace the concepts that these tools promotes): Continue reading

Standard
Chrome

Improving Your Mobile Sites

mobile devicesIt’s not a secret that the world is going mobile at a (crazy) rapid pace. We all seen the statistics about it, and we know that the next 4 billion people will see the web only on mobile. This post will focus on how you can build a mobile site that will be ‘in a good relationship’ with Google (and other search engines out there).

Responsive web design is one answer when it comes to ‘how to serve’. You wish to avoid redirects, sniffing for the mobile browsers agents or managing two versions of your sites.

How we can make our site mobile friendly?
Let’s try to think as developers of a search engine. If you were trying to figure out if a site was mobile friendly just by looking at a site, what would you look for? First, the content on our site must be readable on mobile so it should fit within the screen. Second, we will try to make sure that the site is usable. Continue reading

Standard
Chrome, HTML5, JavaScript, webdev

uptodate.frontendrescue.org just got a hebrew version

fed-uptodate-hebrewI’ve been contributing to this cool project: github.com/frontend-rescue/keep-up-to-date and today it’s live!

If you wish to check what are the best practices for front-end developers (in hebrew) this is your version: http://uptodate.frontendrescue.org/he/

Good luck.

Standard