Blog

BLOG

por Matthew McWaters 14 ene, 2018

If we’re not mincing words, web design is the business of getting people to buy stuff, or buy into stuff. Except, you know, it’s on the web. And unlike with printed ads, or TV ads, we have to make sure it works in every browser. Nowhere is this more literally true than in ecommerce. Hence, we find ourselves always chasing traffic, clicks, and our holy grail: the almighty conversion.

 

That sounds kind of cynical, and more than a little religious; but I prefer to think of it as making sure we all get to eat. Eating is good.

 

In order to keep us all full of steak tacos with soft white cheese and green salsa, our friends at Website Builder compiled a list of 46 ideas to help you make your ecommerce site convert more users. For example:

 

·        Use the word “Pricing” – This resulted in a 160% increase in conversions when compared to “Request a quote”.

·        Remove social media share buttons – A nearly 12% increase.

·        Customer reviews – Including them yielded a nearly 60% increase in sales.

·        Personalized pictures – The lovely people at 37Signals put a picture of an actual person up, and got a 102% increase in conversions.

 

These ideas are presented in a handy infographic , which we’ve provided below. Give it a look if you need some new ideas. Do be sure to check out the sources at the bottom for more information on each of these starting points.

A big thanks to Website builder for compiling all of this information, and for letting us share it here.

If you want to build your own infograhic like this, we recommend using Cava . Its an amazing tool.

por Matthew McWaters 03 ene, 2018

Once upon a dark, stormy night, when all was quiet, a lone web designer was designing away. He had Sketch open, a coffee nearby, and a cheerful tune in his wired earbuds, because Bluetooth is weird and has a delay that bugged the heck out of our Hero. Ahem, anyway…

 

During a lull in the music, our intrepid designer saw a notification on his phone. It was an email from his favorite customer, and he smiled. That smile disappeared when he read the contents. There were three broken links in the client’s site. Three!

 

“It’s okay.” he thought. “That happens someti…” But the list went on. The slideshow was broken. The layout looked a “little bit weird, somehow”. And worst of all, the contact form didn’t work.

 

In a panic, he scrambled to type in the URL. Everything looked fine. No, it looked pristine. He’d just fix the broken links and… no. He was thorough and diligent. He opened up Chrome/Fox* to see how the site looked in the client’s browser of choice.

 

It was as though staring into the mouth of Hell, and this portal to damnation was three pixels off-center. But all is not lost, dear Reader. Our fictional designer might be shamed, but we can help you avoid this. New web designers would be wise to follow this list, and save themselves from incredible awkwardness!

 

* All names have been changed to protect imaginary browsers.

 

1. Check Your Links

Every so often, go back and click on every link in your website. Every. Single. One. You should do this after making any major changes to your site, obviously, but not only then. Servers can be weird sometimes. And if you link to outside sources of information, you need to check to make sure they’ve not been broken, removed, moved, or simply been eaten by some computer error.

 

Few things look as amateur as links that are no longer relevant, or don’t work.

 

2. Update Your Content

Out-of-date content doesn’t look great. It’s not as bad as a broken link, but it can make people decide to leave, and not come back. Up-to-date information is relevant information. God knows how often I’ve been looking for information, only to have Google ’s top results be four or five years out of date.

 

Now, if you have a brochure site for a small business, and the prices are not often subject to change, it can be fine to mostly leave the content alone. But if you have any sort of blog, media feed, or what-have-you: keep it up to date. Update once a month at the least.

 

If you offer useful information, tutorials, or reference information, keep that up to date, too. Go back and make edits when stuff happens. You might even want to publish new editions of entire articles when things change. God knows how often I’ve been looking for information, only to have Google’s top results be four or five years out of date.

 

3. Test On New Browsers And Devices

When a new browser comes out, test your site. If you friend gets a new phone or tablet, ask to borrow it so you can test your site. New version of JavaScript comes out? Test your site with it. Get a new TV that can browse the web? You get the idea, I’m sure.

 

4. Double Check All JavaScript Interactions

This is actually a big one. So many sites now rely on JavaScript for basic functionality. This is a practice I’ve never condoned; but I’ve decided that I dislike beating my head against brick walls. Scripters gonna script. Large swathes of content, and even entire websites will stop working if their JavaScript stops working for any reason.

 

5. Double Check All Forms

It’s one thing if a small widget stops working. That’s not ideal. Forms are another matter. Forms are typically used for contacting people, or buying things, and other very essential functions. They are one of the primary ways that users provide websites with vital information. If they’re willing to fill out a form, that means they’re at least partially willing to commit to whatever you have to offer.

 

Forms can stop working for a variety of reasons. Maybe the form has JS, and it stopped working (see above), or maybe the PHP version on your server got upgraded. Maybe the email account your contact form is sending messages to stopped working for whatever reason. Maybe it’s getting flagged as SPAM. Whatever the reason, check the forms regularly, so you don’t lose business.

 

6. Update All Hacks And Workarounds

Okay, sometimes, when you build a site, you use hacks. You use workarounds. When things get dire, you use polyfills . This is normal, and everyone does it; because no matter how ugly the hacks might be, your site must be beautiful.

 

But browsers get updates, browser market saturation changes, and CSS gets updated, too. At least once a year—and whenever you hear of any big changes to browsers that might affect your site—you should check to see if any of your hacks and workarounds are now obsolete. If they are, they could actually slow your site down.

 

7. Have A Backup Plan

No, I mean that literally. Have a plan for backing up your entire website. Now, any decent web host should be handling backups for you, for the most part. However, for smaller sites, it’s totally worth it to make regular manual backups yourself.

 

Large sites are another thing entirely. People with data caps (now those are spooky) could easily run into trouble when downloading gigabytes of data regularly. In this case, look into a third-party backup solution. It costs money, but it’s worth it.

 

And that’s it. Regular testing and considerable preparation are what it takes to make sure you are never shamed by a site that fails to work, or even “Just looks wrong”. Good luck!

por Matthew McWaters 29 dic, 2017

Animation was once thought of as just decoration. But as technology advances and internet connections accelerate, designers are embracing the practical benefits. In this article, we’ll focus on one particular benefits of animation—marketing animation or animations that sell. Despite the fact that such animation isn’t intended to improve usability, it can impress the user, and give them some context for the subject.


Designers can utilize this type of animation in following ways:

 

1. Demonstrate Craftsmanship

People do notice the details. Attention to animation can make the experience feel crafted. When apps/sites create a visually stimulating experience it brings a level of excitement to the user.

 

Load Screen Animation

Loading animation is one of the oldest uses of animation which is supposed to distract the user from loading times. But even this type of animation can demonstrate that your product is great. For example, when a user launches Uber app they immediately notice an animated drop that is turning into the pin on a map. This animation isn’t purely delightful, it also influences a user’s eyes and control where users should focus. This quick opening moment makes a clean first impression and entices the user to interact further.

por Matthew McWaters 01 dic, 2017

Whitespace (or “negative space”) is an empty space between and around objects of a page. Elements of whitespace in graphical user interfaces are:

  • Margins, paddings, and gutter
  • Space around images and graphic objects
  • Line-spacing and letter-spacing within text content

 

Although some people may consider whitespace a waste of valuable screen estate, it’s an essential element in a design. In fact, whitespace is just as important as the content. As Jan Tschichold said:

 

“Whitespace is to be regarded as an active element, not a passive background.”

 

All good user interfaces incorporate proper whitespace values into all page elements from top to bottom. The whitespace on a page can be every bit as important as the space occupied by UI elements because text, buttons, logos and other objects need room to breathe.

 

In this article, you’ll find how to use whitespace in your designs to give it a clean, uncluttered feel:

 

1. Improve Text Readability

Whitespace is able to make reading much easier by reducing the amount of text visitors see all at once. The lack of whitespace (cluttered page) doesn’t make users want to read the content. On the other hand, properly used whitespace has been proven to increase text comprehension up to 20%, as pointed out by Dmitry Fadeyev.

 

Two important things to keep in mind when optimizing your text content are paragraph margins and line spacing (the space between each line in your text). The latter can drastically improve the legibility of a body of text. Generally, the larger the spacing, the better experience the user will have whilst reading (although too much line spacing can make the lines disconnected).

 

2. Clarifying Relationships

The whole layout arises from the sum of its parts and content relationships are defined by surrounding whitespace. The Law of Proximity states that objects near to each other appear similar. The whitespace acts as a visual cue in this case. Take a look at the image below:

por Matthew McWaters 28 nov, 2017

UX design doesn’t work…And it won’t make us money.”

 

Business executives aren’t all that fond of UX design , or even design in general. It’s an incredibly common problem.

 

Too many executives see good design as an inconvenient expense. At a certain point, executives see UX design as an unnecessary cross to bear. A burden they’re expected to tolerate. If another department needs more money in their budget, design departments are hit first.

 

You know the value of good UX design, they don’t and that’s the problem.

 

This Isn’t a Problem for Design Driven Companies

What do Apple , Coca-Cola , Herman Miller , Disney , and Target all have in common? They’re all design driven companies.

 

The bad news?

Out of the pool of publicly traded companies evaluated by Motive, only 15 companies met the criteria of a design driven company. Others have found the same. So what does this tell us? Most companies aren’t all that interested in good design. UX design and design in general just isn’t a priority.

 

But you know good UX matters. You see the difference good design can make. It’s obvious, anyone can see it if they’re paying attention, so why can’t they?

 

Executives can’t see it because they don’t care. Not even a little bit.

 

They aren’t interested in design as a whole. In fact, most are looking to spend as little on design as they can. Because in their minds it’s just not worth their time.

 

But why?

We need to get inside their heads if we want to know the answer.

 

As Designers, We Speak a Weird Foreign Language

We use words like opacity and kerning and descender as a normal part of our everyday conversations. We argue about design trends, which ones are worth embracing, which ones to avoid. We obsess over tiny, seemingly insignificant details, because we understand the importance small details make.

 

We’re critical of ourselves and other designers in general because we understand the consequences of poor design on a deep and intimate level.

 

It’s intense.

And none of that matters. Not a single shred of our world matters to the vast majority of executives. That’s a very big problem.

 

When it’s time to teach executives about the value of good UX design, we choose the wrong approach. We use the wrong vocabulary. Instead of speaking their language, we speak our language.

 

Almost immediately, executives glaze over and tune out.

This inevitably leads to:

 

  •     Your ideas being ignored or rejected;
  •     A loss of income for you, the company, your customers or all of the above;
  •     Dwindling budgets as other departments fight for more money from your department’s budget which means department layoffs;
  •     A terrible experience for customers, who spend less money or shop elsewhere, making it harder for your organization to survive.

 

This wouldn’t be happening if executives understood the value of good design, but most aren’t even willing to hear us out. How on earth are we supposed to change their mind?

 

Grocery Stores Show us How to Win Hearts and Minds

The competition in your local grocery store is fierce. The shelves are lined with thousands of competing products, all focused on one thing: Getting customers to buy their product instead of a competitor’s.

 

The grocery stores themselves are competing for your attention and your money. It’s a cutthroat environment that only a few stores and some products can survive in.

 

Their secret? Design.

Your local grocery store is filled with lots of subtle design elements, these elements are used to get you to buy:

 

  •  Customers bought more bananas if their peels were Pantone color 12-0752 (Buttercup) vs the slightly brighter Pantone color (13-0858 (Vibrant Yellow). Growers altered the color of their bananas to produce the desired color.
  •  Store layouts are designed around the user experience. It’s a common strategy for grocery stores to show you the produce section first. The bright colors, fresh produce and pleasant aromas lead you to conclude the store is an inviting and ideal place to buy food.
  • Product designers mark up prices strategically on products with strong brand loyalty. Remember the Pepsi Challenge ? Pepsi conducted a blind taste test, asking consumers whether they preferred the taste of Pepsi or Coca-Cola. Pepsi won, but consumers continued to buy Coca-Cola. This happens all the time. It’s why people consistently choose the $90 bottle of wine over a $10 bottle, even if the only difference is price .
  •  Grocery stores are designed to be traps. A well known study found that people spent 34 percent more time shopping in stores that played music. These stores hide time cues to keep you inside. No clocks, windows or skylights. The rationale goes like this: The longer you stay the more you’ll buy.
  •  Product placement on shelves. This study found kid friendly foods are placed at kids’ eye-level. The characters on cereal boxes make eye contact with kids, a clever way to increase influence and sales. Expensive items are placed higher while inexpensive items are placed near the bottom shelves.

 

There are thousands of examples like these. The process, environment, imagery, ambiance and displays in grocery stores are all designed.

 

And here’s the interesting part.

Grocery store executives support these design conventions wholeheartedly. Their executives have fully embraced UX design.

 

Can you see why?

Designers and executives spoke the same language. Executives don’t care about design for design’s sake. Rather, they view design as a means to an end. A way to attract more customers and sales. A way to grow their business.

 

But the examples above are manipulative and sleazy!

I completely agree. Does that mean you need to approach things the same way they did? Of course not. It goes without saying, you should be honest and above-board with everything you do. But to change an executive’s mind you’ll need to think and talk like an executive.

 

What Exactly Are Executives Thinking About?

They’re thinking about results. They have a very specific set of problems they’re required to solve on behalf of the company. An executive’s thought process basically boils down to three basic problems.

 

  •     Will this save money?
  •     Will this make money?
  •     Will this cut costs?

 

The vast majority of their desires, goals, fears, frustrations and problems tie back to these three problems in some way. Getting customers, selling more product, making more money, it’s all part of it.

 

An executive’s language is based almost entirely around one of these three core problems.

 

What does that mean for you?

A request that’s focused on “What’s best for users” is far less likely to work. A request that’s positioned and presented properly is far more likely to succeed.

 

Here’s what that looks like:

 

  •     “We’ll be able to blow past Q3 projections if we make these four UX changes.”
  •     “We’re losing $467,891 a month. We have some UX problems here, here and here that would stop the financial bleeding.”
  •     “We can get a 1/3 increase in revenue overnight with these UX design ideas.”
  •     “Right now, we’re losing 8 out of 10 customers on our site. With the right UX design, I can get that down to 4 out of 10.”
  •     “We can get 1/4 of our customers to spend $250 more per order, per month if we make these UX changes.”

 

See what I did there?

I know, I know it’s loathsome. The last thing many of us want to do as designers is talk business, sales or marketing. Anything but that. I get it.

 

Here’s the thing. When you speak the same language as executives you communicate value in a way they can understand. They aren’t as worried about looking stupid, protecting their egos or acting as if they understand the finer points of your job.

 

They’re focused squarely on the things that matter to them. Get these details right and they look like the hero.

 

Do this consistently, and they’ll slowly begin to understand

They’ll begin to see why good UX design matters. Why design, as a concept matters far more than they think. And more importantly, they’ll understand why design can help them hit the goals they’re desperate to achieve.

 

Pitch your ideas the right way, get inside the mind of your executives and you still may fail. That’s part of the risk. That risk drops dramatically however, if you’re focused on them.

 

Pursuing things this way sends an important message. It shows executives that you understand them. That you’re willing to take their concerns seriously and you’re willing to invest in them.

 

This is huge because it shows you have potential, that you’re someone they can count on for the future. All because you decided to speak their language.

 

Executives Think UX Design Doesn’t Work

They’re wrong, but they don’t know it. Their subconscious impression is, UX design doesn’t work and it won’t make us money. Business executives aren’t all that fond of UX design, or design in general. It’s viewed as fluff, an unnecessary cross to bear.

 

It’s up to you.

You know the value of good UX design. You can change their perceptions, but only if you can speak their language. Start small, showing executives you can make a difference. With consistent effort and lots of patience, your company can become a design driven company.

por Matthew McWaters 26 nov, 2017

There is nothing quite like running your own business. It can be demanding at times, however you’re in total control over your own schedule and the level of income you make. You can take time off when you need or want to, and you can generate more income when you want to.

The same things are true for our business partners as well and in this article, I’ll talk about the 5 Reasons Why Our Partnership Program Works.

 

1. Income

It goes without saying that generating more income is number one on our list of the 5 reasons why our partnership program works. Our Partners are seeking to generate more revenue for themselves or for their own business by using the services our partnership program offers. Unlike other programs out there, LUCID offers a 65% commission on all of our Partner’s sales and web design projects. This makes our partnership program very lucrative and it also allows our Partner’s to see a higher level of return on investment (ROI).

 

Let’s do some math (even though I hate math personally), to see how our partnership program can increase your monthly income and give you a good ROI. First and foremost, our Partners will generate on average $4,000 per month from the commissions they earn. That’s rough $48,000 per year. The only other expense a Partner will incur, unless they open an office and hire employees, is our monthly fee of $29.99. That’s roughly $359 per year. With that being said, our Partner’s investment gain will be about $47,641, their ROI will be about 13,274.94%, and their annualized ROI will be about 166.23%.


Where else can you go to see that type of ROI? Nowhere! Not the stock market, not real-estate, and definitely not your average job.

 

What if I want to open an office?

This is a question we get from time to time and here is the answer. In most cases, Partners who open an office will generate somewhere in the neighborhood of $96,000 per year. With the cost associated with renting an office and having an employee or two, the Partner will still make about $46 – $48k a year, which means that their return on investment will be very similar to that of a Partner who doesn’t open an office. If a Partner hires a sales rep, the revenue could easily increase by 33% making the total revenue the Partner generates for him/her self, jump to $61,000 per year.

 

2. The Local Touch

We’ve designed a lot of websites over the years and there a lot of things that we’ve noticed along the way. The most intriguing thing that we’ve noticed is that web design customers want someone they can talk to in person, in other words, customers are looking for a local touch, someone they can call or meet with.  

The local touch is what set us apart from our competitors (even the competitors who are local). Why? Its simply, we meet with our customers and take the time to get to know them and befriend them. We take there dream and make it reality online, while also providing a personal experience and excellent customer support.  

 

3. Coaching

There is nothing like being coached to greatness. Professional athletes get coached to become superstars and we believe that our Partners should be coached to become superstars as well. The is the foundation of Partnership and we are dedicated to coaching you into becoming a great Partner so that you can generate more income for yourself and your family.

 

We work hand in hand with you, teaching you how to run your division, how to generate leads and how to close sales. We even offer advanced in person coaching for Partners who are seeking to take their division to the next level.

 

4. Sales Collateral

We want your sales presentation to be filled with confidence and knowledge. We offer a ton of great sales collateral that will help you understand more about the web design industry and how to close a sale.

With these material, you’ll have a deeper understanding of our services and the services that will best meet your client’s needs and/or wants. You’ll also be able to offer your customers a real-time service and cost analysis with our handy Service & Cost Guide.

 

5. The Smart Website Builder

Last, but definitely not least is our smart website builder. With our easy to use and intuitive website builder, you’ll reduce your development time by at least 25%, which means you can take on more projects each month and generate more income.

 

This is only the tip of the iceberg though. With our website builder, you’ll be able to add more streams of income through the other services we offer, such as SEO, Analytics, Personalized Options and our web design options, all of which are incorporated into the website builder. Not only that, you’ll be able to generate more income through our website management plans and you’ll also be able to update your client’s website in no time flat.

 

Conclusion

These are just a few reasons why our partnership program works for individuals or businesses who are seeking to increase their income. Some of the other great features include, local Google listing and Google My Business Management, a local Facebook page that you manage yourself, and on top of that, we run ad campaigns for you as well.

 

So why not sign up today and start generating more income.

por Matthew McWaters 24 nov, 2017

When you do it right, a call-to-action button will get visual attention. When paired with an offer that is compelling, it actually gets people very eager to act. The way the CTA button is created, as well as the text used, actually has a very big impact on click-throughs .

 

The Call-To-Action

What color? What size? Where do I put it? What does it say? Is it converting? Yes, that’s a lot of questions. And, there are CTAs everywhere, from landing pages to home pages , blog posts , e-mails etc. The copy used in the CTA is actually just as important as the size, shape, and color of the button itself. And, even a minor change may have a pretty significant impact.

 

What is a CTA?

A CTA (Call to Action) is usually an image, text, button or video, that contains a link to a page with a compelling offer. Its primary job is to capture the attention of your leads and make them click through, to learn more. You will find that there are two main types of CTAs:

 

·        The one that sends the visitor to an informational, or product page, where they can either learn about your product(s) or buy them.

·        The one that is part of the Inbound Marketing methodology. Your visitors are sent to a landing page with a form, which, once filled out, lets the users download or sign up for some kind of free offer, like a guide, e-book, coupon code etc.

 

Things to Understand Regarding CTAs

The call-to-action is the tipping point between bounce and conversion. When you need someone to do something online, the call-to-action is what they have to go through if they are to do it, regardless of whether it’s clicking through to another page, or buying something. Important visual cues include, but are not limited to, shape and color. They attract the attention to the placement of the button.

 

However, when the prospect is at that point where they need to make up their mind, they’re interacting with the copy. A minor change on the page can have a huge impact on conversion rates. Making a small change on the button copy is actually a pretty minor change on the page as a whole. However, it has a much bigger impact on the decision-making process of the potential customer, and, as a consequence, the conversion rate.

 

It is very important to test the variables on your CTA button, regardless of what you’re selling. They are a crucial element of both the landing page, and the conversion funnel, and paying attention to detail makes sense.

 

Designing CTAs

If you want an effective way to guide the user towards your CTA button, use directional cues. Regardless of whether it’s obvious methods such as flashy arrows, or something more discrete, like eyes on the page looking at it, just go for it.

 

When you’re talking shape and design, the button should look like a button. This means that you can go with shading, 3D effects, and subtle gradients, to make it look like something you can click.

 

·        Size basically tells you that the more noticeable it is, the more likely it is for someone to click it. However, you shouldn’t make a garish, green neon animated button, but it should be easily seen, instead of lost among the other elements on your page.

·        Button color should be contrasting to your background colors. It should be vibrant in a way that it catches attention in the first glance, and the color shouldn’t be used anywhere on the page, if possible.

·        The text will tell you that people buy with emotion, but logic follows it. If you want to encourage impulse shoppers, put a button that conveys urgency. The text should clearly tell what happens if they click the button, and this isn’t the time to be clever, or confusing.

 

Special Effects

Since not all buttons are made equal, you should know that the CTA button might do a better job if you put some graphical effects that make it interactive. This includes things like:

 

·        Beveled edges

·        Rounded corners

·        Drop shadows

·        Gradients

·        Arrows, or other small icons

·        PayPal/Credit card logos (to build security and credibility)

·        A hover effect on mouseover

 

 

CTA Placement

You’ve heard that the CTA should be above the fold, right? No, wrong. Re-think your CTAs. “The fold” is just a myth.

 

A higher conversion rate is usually achieved by moving the CTA below the fold. For some more complicated offers, people want to understand things a bit better before they take action. In such a situation, if you put the CTA above the fold, not many people will even bother to click it. White space is best used for situations when you want to place an attention-grabbing CTA, but don’t put it too far from the main text, it should look connected.

 

CTA Microcopy

For a moment, forget about placement. Forget about color. Focus on the CTA copy. There are a few rules for naming the CTA button, and here they are:

 

·        Don’t be clever – don’t try to re-invent the wheel.

·        Nobody wants to submit. People may want to send a message, post a question or subscribe to a newsletter, but they don’t want to submit.

·        Don’t be verbose, and go with terms people understand easily instead.

 

Put the Privacy Policy Where the User Can See It

If you want to boost the credibility of your offer, that is. And, many website owners consider it to be a good practice because it contributes to the overall credibility factor if it’s taken through Google’s manual review. However, it won’t make much of a difference to ranking.

 

If you think that putting the privacy policy page next to a CTA button is distracting, don’t worry. People seldom click on the privacy policy pages anyways, as they consider them boring.

 

How to Make Your CTAs More Effective

There are a few small tips that can boost the effectiveness of your CTAs below, make sure to give them a read.

 

·        CTR is not the end-all, be-all. Both CTR, as well as the conversion rate, are important when analyzing CTAs.

·        Your own CTAs should be tested, and this is crucial.

·        The CTAs can make an incredible difference to the performance of your campaign. A good CTA can boost effectiveness up to a hundred times when compared to a bad CTA.

 

De-clutter

Everything around your CTA should be clutter free. Unrelated videos, content, social media buttons, keep all of this as far as possible from the CTA. Only things that can push the offer better are allowed nearby.

Value and Relevance are Important

Why would a small tweak have such a big influence? The answer is in the messaging, actually. “Order” will emphasize things you need to do, instead of things that you’re going to receive. However, “Get” will tell you what you’re receiving, and not what you have to do to get it. The treatment copy will convey value, but this isn’t always enough.

 

The button copy should be relevant to the specific conversion scenario, the scenario the prospect is in when he has to click the button.

 

Wrapping Up

The CTA button has been around for ages. It is an essential part of digital marketing, and will often make the difference in conversion when your user turns into a lead, and a customer later on. With all the tips and tricks in the article above, you will be able to easily make a smart CTA button.

por Matthew McWaters 24 nov, 2017

Last week, Mozilla launched Firefox 57—aka “ Quantum ”—the biggest update to the browser in its 13-year history.

 

As of today, 75% of Firefox’s code has been rewritten for Quantum, 5,000,000 lines of code in total. 700 developers, including 80 volunteers, have contributed to the codebase since August. It is, in effect, a brand-new browser.

 

Firefox has always been a cool browser . Open-source credentials and a confirmed underdog status make it the first choice for those who prefer not to use their OS’ default, such as Edge or Safari . The latest stats put Firefox’s global share to around 6%, compared to Safari’s (combined MacOS and iOS versions) 15%, and Chrome’s 55%.

 

Despite much affection for Firefox, there hasn’t been a compelling reason to make the switch, until Firefox Quantum.

 

Quantum Speed

I don’t recall when a new version of a browser was met with so much excitement, and it’s almost entirely down to one thing, Firefox Quantum goes like a rocket.

 

Firefox Quantum – rocket speed

Every browser makes the claim to have improved render speed, usually by a single-digit percentage. Firefox Quantum is twice as fast as the previous version of Firefox, which is an amazing accomplishment. However, that feels like an understatement; Firefox Quantum is perceptibly faster than any other browser on my machine, notably it’s substantially faster than Chrome. Browsing in Firefox Quantum feels like the whole web has been pre-cached and as a developer this is a great feeling, especial when I'm working with multiple tabs and projects at on time or bouncing around from one analytic dashboard to another.

 

Mozilla’s own tests found that the beta release of Firefox Quantum was at least as fast as Chrome, but wasn’t substantially faster. They feel they closed the gap on Chrome , without exceeding it. They’re being modest. Anecdotally, my experience in the last couple of days is that Firefox Quantum is substantially faster across the board; it’s possible that I’m simply browsing sites that favor Firefox’s approach, like Google Search for example.

 

What’s undeniable is that Firefox’s new-found speed delivers an enjoyable browsing experience.

 

Quantum Efficiency

One of the ways Mozilla turbo-charged Firefox Quantum is changing the way it makes use of modern hardware. Complex software makes use of multiple processor cores by allocating different tasks to different cores to speed up processes. Developing in this way is complex, because if two cores are working on related tasks, one can easily override the other, introducing bugs to the system. This complexity is often solved by ring-fencing tasks, for example, allocating a CSS engine to a single core; less efficient, but more stable.

 

Firefox Quantum has taken a leap forward by leveraging multiple cores for single tasks, or rather by subdividing tasks into smaller bite-sized chunks so that they can be distributed to more cores. One of the key components of Firefox Quantum’s speed is the new CSS rendering engine, Stylo . Stylo extends the multi-core approach by allocating different parts of the DOM rendering to different cores.

 

According to Mozilla, Firefox Quantum uses 30% less memory than “the competition” (aka Chrome) on Windows. Digg’s testing found that Chrome used 40% more RAM and three times more processes than Firefox Quantum. What’s cool about Firefox Quantum is that the more cores you have, the faster it renders. Firefox is fast now, and it will only get faster in future.

 

To make Quantum so efficient, Mozilla studied how people actually use the web. As a result, Firefox Quantum prioritizes tasks, for example a button interaction takes priority over something like caching, or garbage collection. This is a direction Mozilla intend to focus on in future releases. One of the most obvious benefits of prioritizing tasks is tabbing. Firefox Quantum uses less memory for multiple tabs than Chrome. Conducting research, with multiple tabs open, makes Firefox a no-brainer for me.

 

In Quantum, your active tab is prioritized over all other tabs, making the best use of resources. Which makes me wonder: Why weren’t browsers doing this before? It’s so obvious.

 

Mozilla Photon

Firefox Quantum’s UI will probably look a little different to you, especially if you’re upgrading from an earlier version of Firefox. Mozilla have taken a leaf out of Google’s book and developed their own design system for their Products, named Photon. While there’s no suggestion of Mozilla pushing Photon as a cookie-cutter approach to all design problems—as Google have with Material Design —it’s a pleasingly coherent approach that Mozilla previously lacked. Photon, in Mozilla’s own words, aims to be adaptable, quick, aware, approachable, supportive, and whimsical. Firefox Quantum’s UI ticks all of those boxes.

 

There’s a greater attention to detail than we’ve seen in earlier versions of Firefox. For example, the nice subtle hover animation on inactive tabs. It all combines to be an enjoyable experience that is happy to fade into the background—which is precisely what a browser should be.

 

The Verdict

There’s no question that Firefox Quantum is going to pick up market share. By this time next year, it will have 15% of the market, still less than a third of Chrome’s user-base, but numbers that Opera would kill for. By any reasonable criteria Firefox Quantum is the best browser currently available

 

I switched to Firefox Quantum out of curiosity, fully expecting to switch back to Chrome in a few days; Chrome is now gone from my dock, and Firefox is set as my default browser. Admittedly Firefox Quantum has some extension compatibility issues, but that’s the case for any new browser and developers are already catching up. And I felt an unexpected pang of remorse when I finally bit the bullet and removed Firebug.

 

By any reasonable criteria Firefox Quantum is the best browser currently available. Whether it remains so depends on the competition, and future Firefox enhancements—all indications are that Mozilla is determined to keep pushing the envelope with Firefox and its capabilities.

 

Firefox Quantum is a fast, resource-friendly, intelligently designed product. Browsing in Firefox is simply a more enjoyable experience, what more could you ask?

por Matthew McWaters 22 nov, 2017

All SEO experts know the power of link building. It’s no secret that including links on your website, asking other sites for links to your pages, and creating content that is worthy of the powerful control+K helps your domain authority and SEO . But is that all you can do? What about those of you who are looking for new strategies to build SEO on your website?

 

You’ve already built up backlinks , optimized your images, and created high-quality content. And now, you’re wondering what is left to give. Well, look no further. We’re going to discuss the secret strategy that far too few websites are using: second-tier link building.

 

What is second-tier link building? Most of the strategies I mentioned above qualify as first-tier link building. A first-tier link is a basic backlink. It links directly to your website from another website . And there’s no mistaking its power. When a high-authority website links to your site, it essentially serves as an advocate for your content in Google ’s eyes. But a second-tier link is a little more complicated.

 

Instead of linking directly from an external piece of content to your website , a second-tier link goes from any website to the piece of content that links to your website. I know. That’s a little confusing. Let me explain. Usually, second-tier links revolve around one singular strategy: guest blogging.

 

Here’s how it works.

You write a blog post for a publication that’s relevant to your website’s niche. While you’re writing it, you include a backlink to your website either within the content itself or in the author bio. Why? You’re a smart marketer and you know the benefits of backlinking. That’s no big deal. Then, you run to all your social media accounts and share the guest blog piece after it goes live.

Congratulations. You’ve just engaged in second-tier linking.

Más entradas
Share by: