04.24.2012 By Ben Anderson
Web Performance: Why Good User Interface Design Matters
When it comes to software, users don’t really care that something “just works” as that’s expected in what you’re selling. For developers though, “just working” is the most significant step in writing an application and when it’s functioning correctly, it is all too often considered “done” in their eyes.
Functionality is only half the battle. A good UI (user interface) is the other half.
Read More04.03.2012 By Raj Vysetty
Ecommerce Lessons Learned At eMetrics San Francisco
Last month’s eMetrics event in San Francisco, CA, was one of the best conferences I’ve ever been to with several lessons that were truly important to myself, Dyn and anyone that is charged with better online conversions and sales.
Motivation, Ability and Trigger
Motivation, ability and the call to action (trigger) combine to determine whether a conversion happens or not. For example, if you are looking for email subscribers to eventually convert later, the easier you make the process, the more likely you are to succeed.
You could potentially increase motivation by adding things like discounts and coupons in, but the best path to increase conversions is always to reduce the ability required in order to complete the conversion. The graph is an illustration of when triggers work and when they don’t.
We are all looking to swing a golf ball. Each mm makes a difference.
I am a huge believer in this point that was reiterated at eMetrics. Small improvements driven by data can make the difference between a successful marketing campaign and a break-even campaign. Let’s say you invested $1000 in an online marketing campaign and recovered $900 through online sales. This campaign would possibly fall under the ‘break-even’ category.
On the other hand, say you had tested multiple landing pages which led to 20% improvement in conversion rates, tested variations of the A copy which had a 10% improvement and optimized your bidding strategy across geographies/ad groups that reduced costs by 20% by maybe not bidding in areas that did not have conversion.
Suddenly you have a marketing campaign that you have only spent $800 and managed to generate $1200 — a 50% ROI. With that knowledge in hand, we know we can scale this up and drive more revenue and continuously optimize to further improve ROI.
Tying this back to the golf ball analogy, the small changes might just make the difference between a golf ball (read marketing campaign here) that ends up in the sand or on the fairway.
Read More02.29.2012 By Alex Sergeyev
Browsers Vs. Servers: Using JavaScript For Number Crunching Theories
Dyn is crazy for dashboards. We wake up looking at them and always have ideas on how to make them better. We use several platforms – Munin, Graphite, and Nagios to name a few – but recently we have started building our own data processing tools that allow us to build real-time dashboards.
Data for one of the new dashboards is collected in different places and delivered directly to a browser via WebSockets. Early on, I decided to try and minimize server-side processing by delivering raw data to JavaScript code inside of our dashboard HTML pages. The work outlined in this post was performed to justify our decision to do data manipulation in the browser.
I aimed to prove that the speed of processing with JavaScript in modern browsers is not much slower than on a server. Note that for our case, we did not have a need to archive or collect processed results and my strategy wouldn’t be useful if we did need that. This post is to demonstrate a strategy that could be used to evaluate “in browser” versus “on server” paths. Remember, your dashboard could require different types of data manipulation and you may run into bottlenecks in JavaScript.
Here’s what we did and how we did it.
Read More02.24.2012 By Lara Swanson
Responsive CSS Table Design In Practice & Execution
We recently launched a new DNS Product feature comparison table to help users more easily compare our DNS products and what they offer. I’m eager to make all of this content accessible for people on smaller screens (particularly people on mobile devices), but it’s very hard to make tables look as good as they do on wider screens.
Here’s what we did and how we did it.
Read More02.03.2012 By Lara Swanson
Retail Page Speed & Web Performance Report: How Did Dyn Stack Up?
Strangeloop recently published their State of the Union for Page Speed and Website Performance, focusing on retail industry websites. Their extraordinarily disappointing key finding was that retail sites are 60% slower than they expected with an average page speed of 11.21 seconds. It’s really too bad that websites, especially ecommerce sites, haven’t met site speed expectations.
Retail sites should be at the forefront of optimized page load time. There’s been plenty of research about the correlation between fast page load and revenue and I would guess every retail site wants to increase their revenue using established best practices like compressing text and images, combining JavaScript and CSS, using a CDN, and other tools mentioned in Strangeloop’s report.
Strangely, according to the report, most sites failed to implement these.
Read More01.16.2012 By Lara Swanson
Looking At Smashing Magazine’s Web Redesign & Resulting Performance Loss
I’m always eager to see a major website’s approach to a site redesign. Any site that focuses on best practices for front end coding and design will take interesting approaches to incorporating emerging technologies and styles and it’s something that the front end development community always learns from.
We also are fairly quick to jump on things about redesigns that are buggy or faulty, which is why I’m surprised that Smashing Magazine‘s recent redesign overlooked one pretty big issue that could have easily been prevented.
Read More12.15.2011 By Lara Swanson
How To Create A Countdown Clock With CSS3
I had my first opportunity to code some CSS3 animations for November’s CSSOff, which is “a competition for front-end developers to show off their skills in a no holds barred display of CSS and markup skills.”
Part of the competition centered around creating a countdown clock. In an attempt to break out from the pack, I decided to keep it CSS-only, which I found out later was fairly unique. Post-competition, I saw others’ completed challenges and similar clocks used Javascript to create it.
My goal was to stay as semantic as possible and to learn more about animations and transitions using CSS. Below is the HTML markup for the clock and the explanation for my methods.
Read More11.21.2011 By Lynda Elliott
Email Marketing Development: A New Way To Create Gradients
Email design and coding requires an awareness of email client limitations rather than web browser standards, so when I was assigned the task of creating a new email newsletter template, I thought it was a good idea to start with a review of email CSS support.
Since emails are coded using tables, it helped to sketch a table-based layout design before creating the mockup in Photoshop. With a background in web design, I can get quite opinionated about aesthetics even when I know the extra visual details may make cross-browser compatibility more challenging and time consuming. My email template design contained subtle gradients that would make cross email client compatibility even more difficult.
Once the design mockup was approved, it took some trial and error experiments in a code editor to figure out the right solution for the gradients and then some painstaking planning before the real coding began.
What I came up with was a new way to create email gradients.
Read More11.15.2011 By Lara Swanson
Web Development Tips For Navigation In Responsive Design
We coded Dyn.com’s HTML and CSS to respond well to different screen sizes because it was important to us that the site remain intuitive and easy to use on any device and in any orientation. We made sure it loads fast and that users can quickly find what they’re looking for, using media queries to shift and redesign our WordPress templates to make sure they flowed nicely at different sizes.
One of the most important parts of a responsive design is navigation and it can be really tricky to figure out what navigation should be removed, where it should live and how it should look among the rest of the content. We did a lot more in our media queries than just restyle and reorganize the navigation on our pages, but I want to dig in to our process for deciding how the navigation would change at different screen sizes.
From the planning to the execution, here’s how we attacked the navigation on Dyn.com from all experiences.
Read More11.08.2011 By Dan McAuliffe
How To Use Cookies To Better Understand Your Customers’ Needs
Every online business wants to cater to their customers’ needs in the most effective way possible. Sometimes that means knowing your target audience better as a whole, but sometimes it means knowing a little more about your customers as individuals. Nowadays, there are all sorts of paid software and services to help better understand your online customers by tracking their behavior and spending habits on your site.
However, there are some great cost-effective ways to help you monitor your online users as well. One of the most useful ways is to utilize cookies, which are a great non-invasive way to gather information about visitor behavior on your website and learn how to improve their user experience at the same time.
Read More