Category: web design
Website optimization is important for a wide variety of reasons. For one, you want to make sure that your website is always performing at peak levels to ensure an optimal user experience. No one wants to waste time waiting for web pages and graphics to load. User attention spans are dwindling and you only get a couple of seconds to make a good impression. After that — it’s on to the next one. Furthermore, your website’s performance is also directly linked to SEO and it’s ability to rank on search engine results pages. If you’re interested in learning various tactics you can use to increase your website’s performance , then this article will provide you with 13 techniques to do just that.
1. Prioritize a mobile-first design
Google made their first official announcement regarding mobile first indexing in March of 2018 but marketers were on to the notion of mobile-first far before that. While Google insists that mobile-first indexing doesn’t impact rankings, the truth of the matter is that since the majority of people browse via their mobile devices, it does impact how your site performs.
Make sure your site is adaptive to not just mobile devices but a variety of devices so that users receive the best performance suited for their needs. Also keep in mind that less is often more when it comes to mobile. This applies to meta titles and content which is often easier to read when crafted with mobile users in mind. Furthermore, when using a responsive design, always scale your images and avoid pop-ups which cover content and can prevent users from seeing what your site is all about.
2. Consider user intent
Writing great content used to entail finding topics that are relevant to your industry, crafting in-depth, long-form, detailed articles and making sure content is adequately optimized with the right keywords. However, now a days, that’s only a part of the game. As Google’s algorithms grow and become more complex with the help of machine learning and artificial intelligence, things such as contextual relevance begin to come to the forefront of the conversation. It’s no longer just about optimizing for keywords and phrases but taking into consideration user intent. Does your website and fall in line with this when it comes to your keywords? Now more than ever contextual relevance must align when it comes to search queries. If your website isn’t in line with what is currently ranking, then chances are you’ll fall behind on the search engine results pages and your website simply won’t perform as well as you need it to.
3. Schema markup
Schema markup is essentially a form of microdata which when added to a webpage, creates a rich snippet which appears in the search engine results pages. This rich snippet is essentially an enhanced description of sorts. The reason why schema is used with regards to website optimization is that it can help provide context to your website and as a result, enhance the search experience. When it comes down to it however, adding schema markup can seem like quite the daunting task, especially for those who aren’t so technically savvy. Fortunately, if you happen to run your website on a platform such as WordPress, there are a number of plugins which can be used that can help you get the job done.
4. Optimize the user experience
The quality of your user experience is crucial when it comes to ensuring your website performs optimally with its intended audience. Your user experience essentially encompasses how users feel when they interact with not just your website but your products, your services and your company as a whole. There are a number of factors which influence UX.
For example, is the content provided on your website useful to the user? Does it satisfy their needs? Is your website easy to use and navigate through? Are navigation elements and the design crafted in a way that make it easy for users to find what they are looking for? Are you implementing web accessible design so that your content is accessible to everyone regardless of ability? Furthermore, is your website credible and valuable to the user? All of these questions and more should be considered when it comes to ensuring you have crafted an exceptional user experience.
5. Address 404 errors
You know that pesky little “Page isn’t found” message you get from time to time when your browsing through a website? That’s a 404 error. A 404 error happens when content that you are trying to access no longer exists. 404 errors can be quite a malfeasance when it comes to website performance (i.e. speed) and as a result, they must be properly identified and taken care of.
This is especially the case if these broken links are still generating traffic. Fortunately, handling the problem doesn’t have to be a hassle as there are a number of tools and resources you can use to identify and address 404 erros such as Google Webmaster Tools and Xenu’s Link Sleuth. There are also a number of plug-ins available for those who use platform such as WordPress, but keep in mind that a large amount of plug-ins will negatively impact your site’s performance and as a result, they should ideally be used sparingly.
6. Reduce redirects
Let’s face it, sometimes redirects are a necessity. But is this the case for all of the ones currently running on your website? When it comes down to it, redirects create HTTP requests and can quickly bog down your website’s performance and thus negatively impact its speed. This is why it is always advised to keep any redirects to an absolute minimum. If you’re interested in identifying any redirects on your page, you can do so by running a scan with useful tools such as Screaming Frog. Assess what they’re being used for and make sure to only leave the ones which are serving a vital purpose.
7. Reduce HTTP requests
A browser can only open a certain number of connections to a single host at a time. In general, when it comes down to it, the more HTTP requests that your page has to make, the slower it performs. According to Apiumhub, bottlenecks can be prevented when “the number of individual page elements are reduced using resource consolidation whereby smaller files, such as images, are bundled together into one file”. This just so happens to be one of the single most important web optimization techniques you can use to increase website performance. So, if you’re going to knock them out on a list and you have a limited amount of time to do so, this is the one to get crackin’ on.
8. Leverage website caching
Think of your website as a customer service agent having to handle numerous calls simultaneously. When there are a lot of users attempting to access a page all at once, naturally, your performance slows and needs to take more time in order to deliver the webpage to each individual person. When you use website caching, it prevents your web page from having to render over again and again for each individual attempting to access it because it stores the current version of your website on the hosting until it is updated. This means less database requests and an improved performance and speed.
9. Switch hosting
If you’re having issues with site performance and speed, it may be time to consider moving your website to a better host. There are three main types of hosts that are used:
- Shared hosting
- VPS hosting
- Dedicated server
By far, the most common type of hosting that is used is shared hosting. It’s cost-effective and pretty much the quickest way to get your website up and running. However, when it comes to shared hosting, it also just so happens to be the slowest of the options. This is because everything from CPU to disk space and RAM is shared with other sites which also use the hosting platform. VPS (Virtual Private Servers) use multiple servers. You’re still technically sharing the server with other users, but in this case you have your own part of the server where your usage doesn’t influence the other users and vice versa. Dedicated servers are the most expensive hosting option and are where you have your own personal server which is often managed and maintained by a system administrator.
10. Image optimization
Many times you can improve website performance by doing something as simple as reconsidering the image files that you use. Uploading original image files to websites can quickly begin to slow down performance because these images are often too heavy. Instead of doing this, opt for using image compressor tools such as TinyPNG or JPEGMini, which can help improve performance and save bandwidth without compromising on the quality of your images.
11. File compression
12. SSL certificates
Looking to optimize your website so it performs better? Believe it or not, adding an SSL certificate into the mix can help out. This is because Google actually penalizes websites which don’t have them. Many platforms such as WordPress, Squarespace and more provide their users with the option to get an SSL certificate. The downside is that this is most likely done via an upgrade or an extra fee. However, it’s absolutely worthwhile, especially when it is proven to also help instill trust in the eyes of visitors.
13. Reduce plug-ins
Let’s face it — plug-ins are pretty much lifesavers and that’s especially the case if you happen to be a WordPress user. These nifty little components allow you to add specific features to your website that are often hosted by third parties. However, the truth of the matter is that plug-ins add bulk and the more you use, the more resources you need in order to run them. This can result in bogging down performance and also cause security issues to arise. As a result, it is always recommended that you do a routine check of all of the plug-ins you’re currently running. Are there any you haven’t used in a while or ones which aren’t critical to your site’s performance? Keep only the ones that are absolutely vital and then delete the rest.
Is your website up to par when it comes to how it’s performing in comparison to the competition? Website optimization is key. Continually monitoring and keeping up with regular maintenance checks are crucial in order to ensure your website is performing at its optimal level. Use this article as a nifty little quick-action guide in order to help you with your web optimization efforts. Start 2020 out with a bang by improving your website’s performance today.
What are some web optimization techniques that you have found useful to implement? Let us know in the comments below! We’d love to hear from you!
According to recent research by the CDC, 26% of individuals within the United States alone have some form of disability. This amounts to approximately 61 million Americans or one in four individuals. With numbers like these, it’s hard to understand how web accessible design isn’t at the forefront of everyone’s mind.
Disabilities vary greatly in terms of type and can range from those related to hearing, seeing, cognition, mobility and more. So, the question begs to be asked – how does your website stack up in terms of accessibility? If you’re interested in learning more about web accessible design, what it is and the steps you can take to make sure your website stays compliant with international standards, then look no further than these next few lines.
What is Web Accessibility?
Web accessibility as defined by the World Wide Web Consortium (W3C) is when a website is designed so that it is made accessible to a wide range of individuals regardless of ability. This means that in order to remain compliant with web accessibility standards and guidelines, you must take into consideration individuals with varying disabilities. These disabilities include but are not limited to the following:
- Blindness/low vision
- Deafness/hearing loss
- Learning disabilities
- Limited movement
- Speech disabilities
- Cognitive limitations
When individuals of all backgrounds and abilities are taken into consideration, your user experience and the quality of your search engine optimization are also improved. These are two immediate advantages to be had from web accessible design which all companies can benefit from.
So, how does one go about implementing web accessible design? There are four basic principles to compliance as laid out by W3C which you can use to guide yourself through the transition.
The Four Principles of Web Accessible Design
The World Wide Web Consortium has laid out four basic principles of web accessibility for those looking to become compliant with international standards and guidelines. These four principles each include a number of specific guidelines which can essentially be implemented as tactics in order to achieve compliance.
Principle #1: Perceivable
The Perceivable Principle says that information presented on a website must be perceivable to a wide range of users regardless of their abilities. This means that individuals, regardless of ability must be able to perceive your content in some way, shape or form so that it is not invisible to all of their senses.
For all non-text content that is listed on your website, you must also have a text alternative that essentially serves as the equivalent of the content. There are a number of exceptions to this guideline which include controls, time-based media, tests, sensory content and CAPTCHA. However, many of these exceptions still require a degree of compliance and as a result, it’s essential to review W3C guidelines in order to ensure you’re following in the right steps.
Time-based media is defined within the boundaries of this article as either audio-only or video-only media that is either live or prerecorded. Essentially, the guideline stipulates that you must provide some form of equivalent alternative for these forms of media in order to remain compliant unless the time-based media is explicitly being used as an alternative media for text and is “clearly labeled as such”.
For example, captions must be provided for prerecorded and live audio content and audio descriptions must be provided for prerecorded and live video content. Sign language interpretation must also be provided for prerecorded audio content as well as extended audio descriptions in some scenarios for video content.
Adaptability deals with creating content that is adaptable in nature and thus can be displayed and presented in a variety of ways “without losing information or structure”. For example, you may want to provide an alternative, simpler layout option for the purpose of enhancing an individual’s ability to perceive content.
The distinguishability guideline essentially means that you’re making your content easy to see and hear by separating the foreground from the background with a variety of techniques. Color for instance cannot be the only method used to convey information or to for instance distinguish a visual element.
If audio plays automatically on your website for more than three seconds you must also include some control mechanism which makes it easy for the user to stop the audio or control the volume.
There is additionally a rule which requires text to have a contrast ratio of at least 4.5:1 with the exception of large text, incidental or logotypes. You must furthermore provide the ability to resize text up to 200% “without loss of content or functionality”.
For further information on how to comply with this guideline, you may visit the following link.
Principle #2: Operable
The Operable Principle as its name implies deals with the operability of your website. It essentially means that various interfaces, components and navigation must be operable in a variety of ways so that individuals of varying abilities are able to use your website effectively and efficiently.
This guideline essentially states that all aspects of your website must be functional via the use of a keyboard interface without requiring specific timings for individual keystrokes.
The time guideline is set to ensure that all users regardless of ability are able to read your content without being constrained by certain time limits. If there are time limits that are set, the website must provide the ability to turn these off, adjust them or extend them. There are also specific requirements for “moving, blinking, scrolling or auto-updating information” which help to ensure all users of all abilities have sufficient time to experience the content.
Content must also be designed in a way that is known not to cause seizures. For instance, web pages may not contain anything which flashes more than three times within a one second period and the flash must be below the “general flash and red flash thresholds“.
Websites must be easily navigable and sectioned off appropriately in order to enhance the user experience. For instance, websites must have page titles, section headings and labels where applicable and the purpose of in-text links must be able to be determined from the link text alone. Websites must also include more than one way to locate a web page and information about the user’s location within a set of web pages.
Principle #3: Understandable
The Understandable Principle essentially means that the information, content, interfaces and navigation of your website must be understandable to a wide range of audiences regardless of impairments or disabilities (i.e. cognitive).
This guideline essentially states that text content within a website must be made both readable and understandable to the user regardless of ability. For instance, the language of each web page, passage and phrase must be “programatically determined”. Furthermore, a mechanism must be available in order to help identify abbreviations, words or phrases which are used in an unsual way (i.e. idioms). Furthermore, if the reading level of the text is more advanced than a “lower secondary education level”, then a version must be made available which does not require this level of reading ability.
The predictability guideline essentially is set to ensure that websites “appear and operate” in a predictable manner. This means that certain things such has setting changes should not automatically cause a change of context unless the user has been notified that this will happen beforehand. Navigation must also be consistent as well as the components within each set of webpages.
This guideline essentially states that your website should include assistance for users to help avoid and correct any mistakes that may be made when it comes to inputting data. For example, errors should be automatically detected and described to the user in text. Furthermore, labels and instructions should be present when user input is required. Submissions must also be made reversible and data entered by the user should be checked for input errors with the ability to correct such errors if correction is needed. There must also be a mechanism in place to review, confirm and correct information before any user submissions are finalized.
Principle #4: Robust
The Robust Principle states that the content of your website must be robust enough so that it is able to be “interpreted reliably by a wide variety of user agents, including assistive technologies”. This means that as these technologies continue to evolve, your content should remain reliably accessible.
There are countless factors that we must take into consideration when it comes to crafting the perfect website. Is my content informative enough? Is it fresh? Is my website user-friendly? Is it well-optimized? The truth of the matter is that web accessibility all too often gets thrown to the wayside. In fact, many individuals aren’t even aware of such standards, guidelines and protocols.
If you’re just beginning to learn about web accessible design, feel free to use this article as a tool to help guide you through your website’s transition. Get yourself started on the right path today to making your website content more accessible to all individuals regardless of background or ability.
Is your content accessible to individuals of all backgrounds and abilities? What strategies have you used to get it there? Let us know in the comments below! We’d love to hear from you!