Making Time: Learning New Things

One of the hardest things about being a web developer is finding time to learn new things. We spend a lot of our mental capacity each day solving a multitude of problems and yet we still have the biggest problem to solve of all, finding spare time.

Task and Commit

For the longest time I struggled with finding time in between work and family life to do the things that I liked doing, while still being able to add new skills under my belt. It wasn’t until I started making a list of things I wanted to work and forcing myself to complete that list each week that I really started to make progress.

You don’t have to do anything special, even a 30-minute block of time can make a huge difference and starting small you can always increase those blocks by 15 minutes or so.  Some nights I’ll spend a few hours working on something new, and on Sundays I am always going through Team Treehouse videos and making sure to complete a track section.

Preventing Burnout

Don’t be afraid to take a break from your learning to have some fun time. Play some CS:GO or ride a bicycle. A lot of studies show that the only way to increase your memory and skills is to exercise as that adds new grey matter to your brain which in turn allows you to absorb more data.

Learning How to Learn

It is also important to know the styles in which you learn the best. I am a watcher doer so I have to either watch a video of someone working on a problem or I have to throw myself deep into it until I solve it. Knowing your learning methods is critical to effectively make use of your time. There is no point in watching a training lesson if it does absolutely nothing for you, if a book is the best way, then stick to that.

Have Fun

Make sure that what you are learning is something you are actually interested in. I can’t tell you how many times I have seen people get started on a new technology only to not progress simply because they did not enjoy the material. If it is something that doesn’t get your brain juices going, skip it and move to something else that does.

 


Why Developers Should Design More

For a very long time I have always deflected any opportunity to do design work with the statement, “I don’t know how to design, I know how to code”.  In all reality, we are all designers to some degree whether we chose to see it or not. We all have preferences for clothes, car colors, the type of bikes we ride, we are constantly designing our lives and the world around us. As someone who develops code for an internet which is quickly becoming more interactive every day, we need to have at least a minimal understanding of design principals. The benefits cannot be underestimated nor can they go ignored about any longer.

Responsive Design Means Coding A Changing Site

As more and more devices start accessing the websites we build, it becomes increasingly important to make sure we understand the important elements of a design we are given and how to compose them on the hardware that is viewing them. What might be important to a desktop user, might need to take a backseat to someone visiting the website on a smart watch or even a phone. Knowing how visual hierarchy works can allow a developer to make smarter choices about how everything fits together without compromising the design or brand identity.

Better Team Collaboration

Understanding why a designer is making certain design choices allows you to better empathize with them and as well as communicate possible technical considerations and work arounds. It empowers you to make a suggestion that might have been overlooked by others simply because they may not have an understanding of how something could work within the code. Drop down menus definitely come to mind, as that is something I rarely see considered or even comped up most of the time.  This holds very true in agencies or groups that still use Photoshop to generate the designs, a process that often leads to impossible to implement shadows, borders, or other no-no’s (please start using Sketch). Having the ability to consult with your designer and offer a comparable solutions.

Less Time Waiting

Depending on how your team functions and how comfortable (and trusted) you are with taking on design responsibilities, having some basic design skills will allow you to make decisions without having to consult a designer every time. This doesn’t mean going rogue and changing everything, but understanding the brand identity and  how style guides work will allow you do confidently create buttons, forms, and other elements without wasting time asking if they look ok.

 Design Goes Beyond Looks

Another important consideration is that design on the web isn’t only about aesthetics it is also about performance. This goes hand in hand with the responsiveness of websites as the size of images, number of images, javascript functionality, and numerous other factors all weigh heavily in on the users perception of your product. Having good design judgement means being able to know your threshold for the acceptable quality of compress images, video, and other visuals. It can also be helpful when considering animations especially on smaller screens too.

Any Knowledge Helps

While I feel like it is important for every front end developer to learn a little be of design, I don’t think that you have to “know it all”. Even a little bit of basic knowledge about topics like content hierarchy, color theory, space, lines, can go a long ways.  Learn some of the Gestalt Principals too! They will make you a better developer because you will be more confident when you need to make decisions, and a better team player when you need to collaborate with others.


Bleeping Awesome Beta Blog!

Finally.

After many days and nights of working hard I have finally uploaded the beta version of my site. So far I am really proud of what I have done so far.  There is still a lot to do, and I plan on going all out, using as many new technologies as I can to see what I can do.

Performance

One of the important focuses I have while building this site is learning how to make everything run as fast as possible. Whether that means compressing images a lot or modifying the expiration on served assets, I’ll be taking care of it all. Currently using Yslow my site gets a rating of 92. Not half bad! The only other changes I could make to impact that would be using a CDN or doing cookie-less domain stuff, which I don’t really need to do.

On Pingdom everything looks good as well.  The site gets a 99/100 performance grade (damn you Google Fonts). Oddly enough it looks like 71% of the time my site is waiting on Apache reverse lookups and I am trying to find a solution to solve that, so if you have an ideas let me know! 😎 Using Grunt has helped a lot since I merge and minify most of my CSS/Scripts except for the ones that come with the few plugins I use.

Design

Google’s Material Design guidelines served as inspiration for me. In particular I like their approach to handling shadows via inferred global lighting and how animations are created to “make sense” of the changing user interface. There are a lot of developers out there with really fancy websites that have crazy animations and effects which are awesome but not really what I wanted to do.  Since I try and blog as much as possible I really wanted a layout that focused on the content instead of aesthetics .

The homepage consists of a layout of cards which are a modified post content format. This makes it really easy to see a quick overview of the various topics the site is about without overloading you with a lot of copy. Eventually I would like to use AJAX to load each segment of paginated posts in but for now I think it works just fine.

One of the things I would like to fix the most is the slide out menu on the right. It works great on tablets and phones but on desktops it is too far away from the center content area and I need to either find a better solution or I may end up using a full screen menu.

Content pages have changed a lot and for the better. The featured images now span full width and the copy is a larger size which makes reading a lot more enjoyable. Since there is little to deal with in terms of layout, it all scales down nicely. At some point down the road I will create some page template types for special posts and more enriched content.

Tools

During the design phase of this project I used Sketch as it was the perfect time to learn a new program.  It is probably the best design software I have used in a long time and it is tailored towards website and app design. Everything is vector based and styling falls within the constraints of what the web can do i.e shadows can only look the way that they would using CSS.  There are a lot of plugins out there that extend Sketch and allow you to export CSS/SCSS, HTML, and even multiple sizes of images.

Foundation 5 comes with Bower and Grunt and I made sure to use both extensively during this project. In the past I just used Compass, but I am glad I made the change as I feel it helped decrease the setup time. Bower allows you to download packages either through its own repositories or Github urls. This is great because you can package manage all of your libraries and update them all from the command line. Grunt is definitely the hero of this story though because it allows you to do all sorts of automated tasks. I was using it to compile my SASS and minify it while also doing the same to my Javascript files.

More to come

There is still a lot left to do and I don’t plan on stopping anytime soon. Lots of changes are happening in my personal life so I hope that they do not interfere with all of the great ideas I have in store. The one thing I have always liked about websites is that they are never finished, at least not if you plan on it being successful.  Anyways, thanks for stopping by and I hope that you like the direction the new site is going!


Goals for 2015

The past year was a really good year for me. I started a job at an agency, got really good at building responsively, started a few personal website projects, and read a bunch of books. This year I hope that I can do even more. Putting these goals here is a way for me to track what I said I’d do. (Apparently I had this set to 2014, it pays to make sure you type things correctly!)

  1. Read more – I’ve been doing a lot of reading and it really has helped me tremendously. Every book that I have picked up contained at least one gold nugget of information that I have used numerous times. My goal is to read at least 20 books, and try to do a write up as I finish each one.
  2. Learn AngularJS – A lot of projects on the web are starting to use Node/Angular/whatever to make fullstack applications. I definitely see that being important to know and I want to learn as much as I can about it. I already have a good solid understanding of the OSI model so it shouldn’t be too hard for me to figure out… at least I hope not!
  3. Bike to work – Not really a development thing, but I know that I want to ride my bike to work a lot more. I think that doing this at least twice a week should be doable and help me out a lot with the next goal I have.
  4. Lose Weight – I sit down A LOT. Due to the nature of the work that I do, I am not moving around as much as I probably should.  If I could lose about 20lbs. that would be amazing, so I will see what happens.
  5. Travel to California – This has been on my wish list for a while and Becca really wants to go so hopefully this is happening.
  6. Write Articles More –  I definitely need to step up my blogging game, I should be posting way more. I run several other blogs and feel like I have neglected them as well.
  7. Practice Design – I’ve always been a coder but I want to spend some time working on learning and getting better at design. If designers have to learn to code a bit these days I supposed I can learn how to make pretty things.

Well here are the primary things I am really striving to work on this year, if I come up with anything I will add them to the list.

 


What A Vacation Can Teach You About Web Development

Great Travels

Recently my fiancé and I attended a wedding for her sister which took place in Charleston, South Carolina. Little did I know that I was going to also be taking a pretty interesting lesson in web design and development. My new book, Responsible Responsive Web Design came in the mail just before we left.  It was a great read, and a very quick one at that.

The Exception

One of the main focus points of the book was that the internet connections many of us have are the exception not the rule. Most of the world, and even the majority of the United States has fairly slow internet access. Even if you live in a state that has a fiber provider there are still other considerations such as 4G/cellular networks, free wifi, and computers that for some reason still work very slowly.

Sweet, sweet lag

Upon arriving at the hotel I did the first thing I always do… figure out how to get on the wifi! Just like any other hotel the process was fairly simple, connect to the wifi and then enter your room number and last name after choosing the internet “plan” you want. I didn’t feel like paying the $5 a day for premium so I opted instead to just use the complimentary internet. Much to my dismay I learned exactly why it is complimentary. I witnessed page load speeds that were reminiscent of my old 56k modem.  Facebook didn’t load stylesheets half the time, sites I had built struggled to pipe through the limited bandwidth. I had to attend a company meeting the next day and decided to go with the premium packaged to avoid any issues, or so I thought.

Throughout the meeting I heard very strange sounds as the speakers voices tried to make it through the still-limited bandwidth. It almost sounded like someone was running auto-tune through their mic.  Even GoToMeeting couldn’t handle how limited the connection speed was.

Lessons Learned

After going through so many ordeals it really got me thinking about how we design and build websites. Most of us who work on the internet make sure that we have the fastest connections possible, and when we build sites we design them to be responsive across a multitude of devices. These devices aren’t the only factor, and often we overlook one of the most critical aspects of the internet  which is the connection speed itself. Some of us in the city get so spoiled using free wifi that we forget what it is like to be limited to a cell phone network’s speeds.

In many countries around the world that are still developing the common way to access the internet is through a cellular hotspot that uses a time card. Can you imagine using one of those on a daily basis? That is why it is so important to make sure we send the smallest possible assets across the wire. I would be interested to see how differently those people use the internet. Do they avoid going to sites they know will take to long to load? Do they disable images? All of those factors are important to consider when we design and build a website.

Build for slow connections! (Seriously, do it or you might be losing money!)

If my trip is any indicator of how important a fast website is for making a conversion, then you need to make sure you aren’t just building for devices, but for overall experiences in all conditions. Amazon has conducted research that concludes this statement, simply by adding a few milliseconds of time to the checkout process they found out that they were losing millions of dollars. If your website, blog, store, etc can’t be reached on a slow connection, the user will ultimately go somewhere else that does work when they become frustrated. Working in the 55+ market like I do, this is extremely important to consider because studies have shown that 50% of seniors give up after trying something if it doesn’t work the first time.

The reality is that we live in a world where there are so many devices and connections speeds that if we can build an experience that works across the board, we will build a product that works better than our competitors and it will give us an advantage as well as making our users happy.


(MY) {GEEK} Mental Health Week

An Important Idea

You may or may not have heard, but this week is Geek Mental Health Week.  The idea is to spend a week writing articles about how serious of an issue our mental health is, as well as to tell the world about our own personal struggles, or to provide support for those in need. I’ll admit I didn’t hear about it until a few articles on A List Apart started popping up but after reading them I got really excited. I’m a firm believer that our work lives impact our physical and mental health in significant amounts.  Once we “grow up” we start spending at least one third of our day at work and if you count getting ready in the morning, and getting home that number can quickly become greater than half.

The Chair of Listening

There has always been one commonality in every place that I have worked. Whatever office I am working in, there has always been a chair, not just any chair, but THE chair.  It is the place where many of my fellow coworkers go when they have something going on, be it at home or work. Sometimes there is a project going on that is kicking them down, other times it is a grievance about management and they just need to vent out. Whatever the issue, I have found that offering an ear to listen is one of the greatest traits that you can posses in any company.  I’ve noticed a difference in any work environment where there is a place for people to go to voice their frustrations or seek advice about life issues.

My Own Struggles

Maintaining a healthy work-life balance is something we all strive to do but I have to confess that it is something I am very terrible at.  People always look at me like I am crazy when they ask me what I did over the weekend and I tell them I spent most of it learning to program on iOS or building a new website for a personal project. They often wonder how I can go home to do essentially the same work I do all day. To be honest I don’ t really know the answer 100% but sometimes it can really wear me down.

The single handed hardest part about trying to learn new skills is bouncing back from a very rough day. I’ve had my fair share of days where I just wanted to walk out the door and never come back, and when I got home I would sit in front of my keyboard wondering how I could even find a shred of energy to start a project, much less finish one I had been working on.  That is often the vortex that many find themselves caught in, trying to progress their skills and not burnout. It is actually one of the reasons why some people get out of tech after only ten or so years. Some people find the energy to keep up with the constantly changing requirements and standards, while other simply toss in the towel.

The most important thing at the end of the day is finding out what matters the most to you, and making that become your motivation to continue progressing you skills. A lot of themes at tech conferences lately focus on side projects. Whether that is a cooking blog, or building a new tool that others can use, so long as it combines your skills with something you love to do then you are on the road to making your outside life far more balanced while still learning new skills.

Projects on the Side

I am a huge advocate of working on side projects. Most of the time I work on websites for activist groups, other times I do really simple electronics projects with my Arduino or Raspberry Pi. For the longest time I would come home and zone out in front of video games (which I still do sometimes) but after looking at the hours spent playing a game, I started thinking about how I could better use that time, and what sort of impact it would have. I was really frustrated that I wasn’t learning new skills at work, and that I felt like I didn’t have anything to show for the past year or so. That is when I started VeganRVA, which began as an idea for a food blog. I went all out with that, using Git and setting up a repo with Beanstalk, as well as using Foundation as a framework.

Working on a project that you are passionate about help gives you the drive and determination you need to work through all of the tough learning challenges you might run into, as well as motivate you to keep working.  At the end of the day you have something to show for all your time and effort as well as a bunch of newfound skills.

 

full-mental-health
No more of this!