Explore Our Thinking
Published September 6
Snappy Web Design is the one-stop-shop for web design.
Michigan's Newest Web Design Company
You search Google for “Michigan web design” and find my site. I’m Joe, and I’m the head developer at Snappy Web Design. I’m the new guy on the block, and an expert in providing full-service web design for small business owners in MI.
I’m different from typical web design agencies because I aim to be your partner for all things related to your onli...
Published August 29
A horrifying trip through poor UX design
Visit this website and you’ll be infiltrated by three separate popup modals and two banners urging you to sign up for something. You’ll be forced to sequentially close the popups and banners to actually see the text on the page. One modal, fine - but three of them? And two banners? A bit excessive. The worst is yet to come ...
Published August 21
You’ve heard of WordPress, Squarespace, and Wix...but what the heck is Gatsby.js?
You’re hiring a freelancer or agency to build your company's website and considering your options - WordPress, Squarespace, Wix - and then, someone mentions Gatsby.js. You learn that it’s used by many of the largest companies across the globe - but you’ve never heard of it, and don’t know what to think. This is the position that 95% of our new clients find themselves in and it’s understandable. Technology evolves fast and it can be hard to keep up. However, if you’re hiring an agency to build...
Published August 6
Learn how to style and set the active link in this Material-UI Tutorial
Wondering how to set or style the active link in Material-UI? This Material-UI tutorial will teach you how to style an active drawer / tab item with simplest code possible.
The Mui AppBar and Drawer provide a great starting point - but they don't provide a solid foundation for highlighting the active tab. As a result, many developers end up with 'hacky' methods of setting active nav items. Fortunately, there's a better way.
Published July 27
Looking for design inspiration for your website? We curated a list of our top 10 favorite website designs for small businesses.
A good landing page should clearly reflect your company's brand and values. You only have a few seconds to communicate the value you provide to potential customers. You also have to consider usability and accessibility - is your site easy to navigate? Does it flow logically from section to section? Are call-to-actions strategically placed to keep users engaged?
With all of the aforementioned to worry about and more, it may make sense to outsource web design to an expert. However, a goo...
Published July 13
How to Interpret Google PageSpeed Scores and Boost Conversation Rates as a Small Business Owner
In 2021, the quickest and most effective method of boosting your websites conversation rate (and search rankings) is improving your Google PageSpeed Insight scores by making your site faster.
It's why we focus so intently on building Snappy websites, and it permeates every decision we make when developing websites for our clients.
What are Google PageSpeed Insights?
Google PageSpeed Insights is a free tool by Read more · 5 minute read
Read more · 5 minute read
Published July 9
Positioning yourself with your content is one way to establish yourself as a market leader in your field and to provide your visitors with useful and relevant information.
The quality of website content determines the success or failure of a website visitor wanting to do business with your company. When creating a website, one of your top priorities should be to create appealing and compelling content. Here are some tips for getting started.
1. Answer your customers questions
Think back to your recent Google searches - if you're like most people, you probably find yourself querying in the form of a question. If you're not sure where to start whe...
Published July 5
How to code split a Gatsby single page site using Loadable Components (SSR alternative for React.lazy & Suspense)
Modern web apps are now thought of as bundles of modules interacting with each other to create functions/features. Bundling is the process of merging code into one "bundle" (think: script/file) to deliver to the user.
Code Splitting converts these 'bundles' from one file to many, which can further dramatically improve performance by lazy-loading just the parts of your site that the user needs.
Code Bundling Example
Published July 2
This tutorial will show you how to code a mobile compatible "Copy Link to Clipboard" button in less than 2 minutes
Providing your users an easy way to share your blog posts is an SEO no brainer. Using the default Navigator api
[navigator.clipboard.writeText] is a common approach, but lacks mobile support.
The best way to copy selected text to the clipboard is by creating a hidden textarea. Luckily, all you need to do is copy the following code:
Published June 15
Turn your Gatsby website from light mode to dark mode with Material-UI
Dark mode is a feature that users can't get enough of. It saves battery life, reduces eye strain, and minimizes blue light emissions. It's a simple feature that as a developer (all else equal), will set you apart far and wide from your competition. To boot, Read more · 12 minute read
Read more · 12 minute read
Published June 14
Start your project with this Material-UI template. This starter ships with the main Gatsby configuration files you might need to get up and running blazing fast with the blazing fast app generator for React.
Looking for a free Gatsby + Material-UI template to help you get started building your app? Onesnappy is a beautiful template that will provide you with a great foundation for your next static site. Onesnappy is a Gatsby.js port of the Material-UI + React template "Onepirate." Licensed under the MIT license.
Published June 12
Working on your click rate is the best way to improve your search ranking.
At a recent congressional hearing attended by major technology companies investigating antitrust issues, Google acknowledged that user signals are used as part of the calculation of page placement in search results. Google's official line is that "user signals," such as click-through rates, page dwell time, and bounce rates, do not affect the site's position in the SERP rankings. If CTR has an immediate impact on organic search rankings, it's a temporary jump, as Google's algorithms try to pr...
Published June 10
The Skyscraper Technique is a link-building tactic developed by Brian Dean of Backlinko to create engaging content that will help you to earn high-quality editorial links.
In this article, we'll tell you everything you need to know about it and how to execute the Skyscraper Technique to get the best SEO results. The Skyscraper technique is a way to improve and enhance your content by turning it into a backlink.
Skyscraper Technique is a strategy that uses content marketing to create functional content. The more you base your content on what reaches the audience, the less likely your marketing campaign is to fail. If you are looking for a...
Published June 8
Step-by-step guide of how to create a dropdown share button for all of the top social media sites with Material-UI
Social share buttons are a must-have element of every website with a blog or article outlet. Social share buttons allow users to spread the word about your content by posting links which turn in to backlinks for your site and boost your SEO.
See final codesandbox below ⬇️
Published June 8
Breadcrumbs are an extremely important part of a good website. These navigational aids help Google work out how your site is structured.
Published June 8
A curated list of the 30 most effective ways to get backlinks according to the collective expertise of Reddit
Boosting your sites ranking through SEO can be a tricky process. If you choose to do it on your own, you may soon find yourself frustrated and lost in SEO audit reports. We curated a list of the top 30 ways to get more backlinks from Reddit so you can boost your search rankings today.
1. Images Submission
Image submission in SEO involves leaving images related to your website in different image sharing or submission sites. It entails choosing the right image, alt text, file fo...
Published June 7
Adding structured data to your blog posts with react-helmet is a simple way to display previews of your content
Structured data tells search engines the exact content of a webpage, and is complementary to meta tags.
Structured data is important for SEO because it makes it easier for Google to understand what your blog post and website are about. Google will use your structured data to show a rich search result, which are always displayed at the ...
Published June 4
Dynamic font size sliders are great for boosting accessibility on your website
Wondering how to code a slider/toggle to change the font size on the screen? This feature can be seen on sites like the Wall Street Journal (and cough cough, the blog we sell). This article will show you how, step-by-step.
Published June 4
Web development insights for business owners and developers
First, welcome to our brand new blog! Next, what can you expect to read on this blog?
For Small Business Owners
You can expect to get the latest news about tech and what it means for your business in plain English. We'll deliver the latest insights from the most reputable sources in a condensed and easy to understand form.
You'll learn tricks about our preferred tech - Material UI, Gatsby.js, Contentful, and Netlify. ...