Latest Blog Entries

  • Thinking About Responsive Design, Part I

    In finally starting to write about responsive design, I realize that there’s a trap. I’ve known about RWD since 2010 with An List Apart’s article Responsive Web Design. So by now, it’s something that should be commonplace and a regular process.

    Then again, if that was true, I wouldn’t have written the blog post that this new lecture is based on.

    The only true wisdom is in knowing you know nothing.
    Socrates

    In the next couple of months, I will know more about RWD than I did before as a front-end developer. And from that, more questions about it. But it’s an interesting trip just to see what else can be found along the way :-).

    That said, a couple of months ago, I was looking a PBS/American Masters biography on architect Eero Saarinen. I followed up with a few lectures on him and his work on YouTube. There was a quote that stood out:

    Always design a thing by considering it in its next larger context – a chair in a room, a room in a house, a house in an environment, an environment in a city plan.
    Eero Saarinen

    Sounds like a way to think about responsive design.

  • A Brief Note on Container Queries and RWD

    Well, while making the first steps in writing my next lecture about responsive design, I came upon a Tweeter discussion last week. Ethan Marcotte, author/mastermind behind RWD, talked about container queries and his support for them. Very interesting read.

    Ethan Marcotte “On container queries.”

    I’ve heard about container queries before during the last year or two. But I decided to read this article with much more intent because of topic relevance.

    To describe container queries, you need to think about web apps/sites as a system. Changes via media queries are macro, that is, applied to the whole system. It’s what we been doing for years. We build the base (preferable mobile first but any sort of initial state we want) and apply changes at certain breakpoints. So when we write the following media queries:

    @media (global conditions/breakpoints #1) {

    … some changes here...

    }

    @media (global conditions/breakpoints #2) {

    … some changes here...

    }

    etc..

    what we are doing is

    Global Media Queries (Ottawa Model)

    Even though these changes are to certain areas such as footer/header/etc.., these are applied as if the whole app is one big container.

    But with container queries, we are applying changes at the micro level. Instead of the previous example, we are applying changes to local containers. The queries will be influenced by the container conditions, not by the overall viewport. So now instead of the previous model, we have the following:

    Container Media Queries (Ottawa Model)

    and with each part

    Container Media Queries - Expanded (Ottawa Model)

    we are applying changes on the local level/containers. These media queries are not global and [could] be different from other containers. You could have a combination of global and local conditions in this system as well (don’t know if this would happen but you never know):

    Container/Global Media Queries (Ottawa Model)

    As for the talk/lecture, nothing had really changed. The main focus of the talk is the “why’s” of what we do in terms of RWD. However, it is obviously something to think about further.

  • The Secret Life of Forms

    CSS Dev Conference 2016 - San Antonio, Texas

    Slides – http://www.slideshare.net/IvanWilson3/the-secret-life-of-form-67435952
    Lecture – https://cssdevconf2016.sched.com/event/7Q0d/the-secret-life-of-forms-secretforms

    One of the highlights of the year was lecturing for the first time at a conference. In this case, CSS Dev Conference at San Antonio, TX. Basically, I decided to take some advice and take a chance. After sending my proposal, I was shocked and thrilled to be selected via anonymous vote in July.

    Of course, getting the talk ready was even harder than the waiting. It took months of writing and editing and practice. But I was able to get it together and delivered it a small audience at the conference on October 17, 2016. This talk was about UX, coding, and forms. However, it was peppered with things that I’ve done during the last ten years. That said, I want to thank Brian Schlansky for his time and his ear while prepping the talk.

    I also want to thank the other speakers at the conference in helping me not only relax but also giving me advice for speaking not just for the first time but also their experiences in giving lectures as well.

    And finally, I want to thank Christopher Schmitt, Ari Stiles, and Elizabeth Moore in helping me make my first-time experience as a lecturer a wonderful and memorable one. It means so much when for years I was attendee, to be not only speaking but giving back to the community that I respect.

    Thank you all 🙂

    Lecture - The Secret Life of Forms, left - notebook, right - presenter pass

  • Innate’s spotlight on Olympic Fencing

    (Originally published on CDG Interactive/Innate blog, edited by Hilary Finkelstein)

    Fencer

    Photo taken by Casey Hawes

    Ivan Wilson, who is one of Innate’s front end developers, has been a competitive fencer for over 17 years! Ivan, who began his career in college, currently belongs to Olde Town Fencing club in Alexandria, Virginia and DC Fencers Club in Silver Spring, Maryland. As a epee fencer, he has participated in numerous local, regional and national tournaments. He is currently active in numerous competitions on various levels/groups, including Vet-40. Ivan’s years of experience and expertise gives us some insight on what to expect from Team USA in this summers upcoming Olympics.

    Who to look out for in Rio Olympics in fencing for the US

    Fencing has been in the Olympics since the very first games in 1896. Americans have been making up for lost time, ever since Zagunis and Jacobson medaled in 2004 (gold and bronze in women’s sabre).. As a nation, we’ve won medals in fencing in the last three Olympiads, the most in 2008 Bejing with 6 medals.

    At Rio, there are a few favorites among the US team who not only could place well but also get medals. But fencing is known for being unpredictable, and surprises do occur. The familar saying,“The best fencer on the day“ can hold true, especially in an event such as the Olympics.

    Amidst all this, can we continue this brief medal streak? Let‘s take a look.

    Women’s Épée

    Individual – 8/6

    Team – 8/11

    Team – Kelly Hurley, Courtney Hurley, Katerine Holmes, Katarzyna Trzopek (alternate, team event only)

    In London 2012, the women’s team beat Russia to win the bronze medal. Half of that team, the multi-Olympian Hurley sisters, are back with two new fencers. One of them, Katerine Holmes, is a native of this area. The team is currently rated #7 in the world and are a dark horse for a bronze medal. They will have to deal with some strong teams such as Russia, China (world/defending Olympic champions and current world #1), Romania, Korea, and Estonia (who recently won the Europeans).

    Same for individual event, with anyone of the three being dark horse favorites.

    That said, épée (men‘s or women’s) is one of the more unpredictable events, where some one unexpected could make a run.

     

    Men’s Foil

    Individual – 8/7

    Team – 8/12

    Team – Alexander Massialas, Gerek Meinhardt, Miles Chamley-Watson, Race Imboden (alternate, team event only)

    Besides the woman’s sabre team, this is considered one of the favorites to medal at these games. This quartet won a silver medal at the 2013 championships and are the world #2 team behind the Italians (the current world/Olympic champions). The team itself is a set of highly decorated individuals. Massialas is currently world #1 and silver medalist at last year’s world championship. He recently won his second event of the year, Shanghai Grand Prix in June and followed with a Pan-American title last month. Meinhardt won his second career world bronze medal behind Massialas last year and currently world #4 foilist. The #3 fencer on the US team, Chamely-Watson, was 2013 World Champion – the first American individual men’s title in the senior championships. The alternate, Imboden, was last year’s world #1 and won Paris World Cup (repeating from last year) and bronze in Havana Grand Prix this year.

    For the individual – Massialas is currently the hot fencer and one of the favorites to win or at least medal in these games. Meinhardt is consistently a top finisher and could get in for a medal as well. If Chamley-Watson is in the same form as he was in 2013, a medal is also possible.

    As for the team – everyone is waiting for the (no pun intended) spaghetti western showdown between the Italians (current World and Olympic champions) and the Americans (winners of two of four team events during the year at Tokyo and Paris). Either one could take the gold medal. Of course, there are other teams like Russia (European champions, world #3), France, China, and the upstart Brits that could be roadblocks.

     

    Women’s Sabre

    Individual – 8/8

    Team – 8/13

    Team – Mariel Zagunis, Ibtihaj Muhammad, Dagmara Wozniak, Monica Aksamit (alternate, team event only)

    Headed by twice-gold medalist Zagunis, this team has been the most consistent – winning medals at the last four world championships, grabbing the title in 2014. Both Zagnuis and Wozniak are both returning Olympians (fourth for Zagunis, second for Wozniak) with the other two making their first appearances. Expected to get the bronze again but would like to have an upgrade. Currently world #4 team, they are competing against France, Ukraine (headed by world #2 and London bronze medalist Olag Kharlan), and Russia (headed by current world champion, world #1 and London silver medalist Sofia Velikaya).

    As for the individual, Zagunis is one of the favorites again – #3 in rankings and recently won a medal at Moscow Grand Prix (silver) and title at Athens World Cup. She was disappointed in London (4th place) but still a medal favorite along with Velikaya and Kharlan. Muhammad has had a good season as well – bronzes at Athens and Orleans World Cups and Pan-American title last month. If she fences well, she could be in the medals.

     

    Men’s Épée

    Individual – 8/9

    Team – 8/14 (no US Team)

    Team – Jason Pryor

    United States did not qualify a team, which meant individual qualification. Pryor worked his way up steadily in the year long qualification, with some top 32 finishes at grand prix events at the right moments (beating the World #1 Grumier at Doha) and medaling in satellite events. Prior to the Games, he recently won silver medal at the recent Pan-American champions.

    He will be the lone American in a tough, mostly European dominated field. Could finish in the top 16. Same statement about women’s épée goes here as well.

     

    Women’s Foil

    Individual – 8/10

    No team event

    Team – Lee Kiefer, Nzingha Prescod

    Both fencers are world medalists – Kiefer in 2011 (bronze) and Prescod in 2015 (bronze). Kiefer has taken the place as the top American foilist with her high #3 ranking and silver medals at the Shanghai and Havana Grand Prix events. She is looking like a medal favorite at this point.

    On both occasions, Kiefer was defeated by Italian Arianna Errigo, current #1 and London silver medalist. Apart from Errigo, the other top rated fencer is Irian Deriglazova from Russia, world #2 and current world champion. Also returning is the defending Olympic champion Italian Elisa Di Francisca.

     

    Men’s Saber

    Individual – 8/10

    No team event

    Team – Daryl Homer, Eli Dershwitz

    Homer won the silver medal at last year’s world champions, the first American sabre medalist at the senior worlds. Dershwitz is fencing is first full year at the senior level, after coming off the junior title. His highlight was winning the Seoul Grand Prix in March.

    Both have a decent shot at medals. They will have to go against a strong field which includes all three medalist from London – champion Szilágyi (Hungary), Occhiuzzi (Italy), Kovalvev (Russia) – as well as world champion/world #1 Yakimenko (Russia), and a duo of Koreans (Kim, Gu) in the top 5.

     

    That’s it for now. Hope all you enjoy the fencing events from Rio

  • Revisiting The Art of Responsive Design

    The Art of Responsive Design

    About a year ago, I wrote a blog post about responsive design. But instead of the usual techniques, I decided to describe it with three terms – Constraints, Content, and Context.

    A year later, these three terms are more relevant than ever, especially Context. I am thinking about re-editing the post for brevity but the main points will remain.