The first 3 weeks of freelancing has been intense! This is the first time I’m able to take a half day to myself since I started. I simply lined up way too much work. But to be honest, even though I’ve been working amazingly hard and exceptionally long hours, I’m still enjoying the freedom. I love that I can “stop the clock” so-to-speak, and research better solutions to whatever I may be working on.
Now that I have a minute to breathe, and since learning is one of the main reasons I quit my job, I figure it’s a good time to take a quick inventory of what I’ve learned over the past few weeks and share it.
I started using Wave Apps for my business accounting and it’s much better than using Quickbooks for Mac. Integration with PayPal and Stripe Payments make it really simple to use. It’s free to use. They charge for support and they take an acceptable percentage of credit card payments. Payroll is also available at an affordable price.
Contracts are much easier now that I use HelloSign for eSignatures. No more faxing or signing in person. They offer 3 contracts a month for free, or unlimited for $15 a month. HelloSign can integrate into a business workflow with it’s available API.
I’m using SVG (scalable vector graphics) images as much as possible. It turns out they don’t scale like the more traditional formats (e.g.: jpg, gif, png) with respect to CSS. You can read this long-ass post about why, or just use this code:
display: table-cell;. This was used on the logo of the Ft. Lauderdale Triathlete’s temporary page, which may be replaced by the time you read this.
Photoshop CS 14 is ridiculously overpriced in my opinion. But with that said, it’s the industry standard and pretty much required to have as a web designer / developer. CS 14 offers a cool feature that automatically generates images based on how you name a layer. For example, naming a layer corp-color.jpg75%, 63% corp-color-sm.jpg75% will automatically create a two images. The first will be saved as a jpg at 75% quality and the second image will be at 63% scale of the first original image saved at 75% quality. This happens while you work, no extra steps required. This is awesome for generating images for both high resolution (double pixel density) displays and normal displays. They call it generating assets. Here’s a detailed article and video.
Speaking of double pixel density, now that you have those two images, how do you use them? The answer is pretty simple. Like this:
<img src="boca-office-color-sm.jpg" srcset="boca-office-color-sm.jpg, boca-office-color.jpg 2x" alt="" />
Once this is used in your document, browsers on double density displays will only download the boca-office-color.jpg image while boca-office-color-sm.jpg will be downloaded on traditional single-density displays. This is being used on the front page of the Health-Fit Chiropractic & Sports Medicine website for each of the 4 main category images.
The Health-Fit front page also makes use of some cool CSS3 tricks. Mousing over each of the 4 images will slowly expand that image by using the
transition: all 500ms ease-in-out; CSS code. The title above each image uses this transform
transform: skewX(-15deg); to skew the box with the header. The gradient was done with
background-image: linear-gradient(to right, #880000, #880000 70%, rgba(255, 255, 255, 0)); The gradient doesn’t work on IE 9 so I used conditional comments to create a full color background for that browser.
I simulated a multi-threaded environment by using a job queue in PHP. I used Gearman and the Gearman module for PHP via pecl. Installation was a pain on Ubuntu because the repo packages were broken. I didn’t think to document the solution at the time but you can Google it if you’re having an issue. Unexpectedly, it was easy on Mac OS X Yosemite with homebrew.
I had the need to connect to a remote site and grab multiple pieces of data from different endpoints. Each endpoint was a different web request. The requests were triggered by a single web request. The data had to be available very shortly after the initial web request. The end-user couldn’t be expected to sit there and wait for 15 different connections to occur in the background. Supervisor is used to keep the server processes running and to automatically start them at boot. Michael Moussa gave a great presentation on Gearman at my PHP user group which he was thoughtful enough to record and post online.
I finally got a solid understanding of a few Git concepts; specifically, fast-forward, rebase and cherry-pick. Fast forward merging is a very simple concept. Basically, if a branch is merged into another and the original doesn’t have any changes, git will just append the changed branch to the end of the original like the changes were never branched to begin with. Rebasing is bit more complex. Here’s a great explanation by Atlassian. By the way, Atlassian has some of the best online documentation for Git. Although cherry-picking isn’t a difficult concept to grasp, here’s a nice little explanation.
On Ubuntu systems, when creating virtual network interfaces, don’t include the netmask and gateway in the config file for each virtual interface or the system will take forever to boot while it waits for networking configuration.
I attended a Meetup group where the guy who runs the Google AdSense campaigns for JG Wentworth and Peachtree taught the group how to work with AdSense. The skillset needed is small, but it requires a lot of attention to run successful campaigns. I also learned that Facebook now has a way to target advertising to users that have visited a business’ website.
There may be more but I just can’t remember everything right now. Like I said, it’s been pretty intense. I’ll update this post if I remember anything else. Thanks for reading!