Configuring 10Web Services
10Web offers three exclusive web services, Backup, Image Optimization, Search Engine Optimization, and Performance, which let you get your website to function at its best. These tools take the performance of your website to a whole new level, thus can help you grow your community, business or organization.
*10Web developers create new fantastic services every day. The list below is continuously updated and will include the upcoming tools.
Managing Backup Service
Navigate to Backups toolbox to enable and manage the backup operations on your WordPress site. Press Enable Now to activate the service. After just a few seconds, the setup will be finished and you will be provided with the necessary backup tools.
Before initiating a backup process, navigate to Settings tab and select website components to backup:
- Files - the backup service will copy all files of your website and create an archive,
- Database - the MySQL tables of your WordPress database will be backed up.
As the preferred options are selected, run your very first backup by pressing Backup Now button. Depending on the size of your website files and/or database, the process can take a few minutes. After each backup operation is completed, 10Web Dashboard provides respective data under Backup tab. This allows you to:
- review the backup time and its size,
- restore the backed up files and/or databases,
- download the backup file.
Additionally, 10Web Dashboard provides you with a quick calendar tool, letting you check the dates of all backup processes that have run on your website.
Setting Up Backup Schedule
10Web Backup service lets you configure automated backups based on any preferred schedule. To begin the setup, click Scheduling tab and enable this feature. By default, the automated backups are set to occur on a weekly basis. While this is a preferable option for static websites with low traffic, you may wish to consider switching to one of the following instead:
- Monthly - perfect for small websites,
- Daily - usually used for websites which are updated at least once a week,
- Every 12 hours - great for sensitive websites with daily content updates,
- Every 6 hours - for high-traffic websites with multiple changes during the day,
- Real Time - best for critical websites with hourly content updates.
After choosing the best automated backup schedule for your website, make sure to press Save.
Image Optimization service of 10Web lets you boost the performance of your website by optimizing the pictures of your website. This tool helps you speed up your website and allow visitors to have enjoyable experience.
To begin configuring image optimization settings, press Enable Now. After this process is completed, click Activate Now button. 10Web Image Optimization service for WordPress provides you with the following 3 quick and easy optimization types:
- Reduces image size up to 20%.
- Keeps EXIF data of the pictures.
- Keeps full-size images.
- Reduces image size up to 40% (lossy reduction).
- Keeps EXIF data of the pictures.
- Keeps full-size images.
- Reduces image size up to 90% (extreme reduction).
- Doesn’t keep EXIF data of the pictures.
- Doesn’t keep full-sized images.
“How does it work?” link will help you compare the optimization results of all three types, and select the best option for your images. Once you have selected the type, press Optimize Now button, and the image compression will begin.
As the optimization process is finished, 10Web Dashboard provides you with comprehensive Statistics and History. You can quickly review the data and obtain in-depth information about image optimization on your WordPress site.
In case you wish to automatically optimize uploaded images of your WordPress site, turn on Auto Optimize setting.
Search Engine Optimization
10Web provides you with an amazing SEO service which helps you improve the rank and visibility of your website on various search engines. It assists you in detecting and fixing all SEO errors, provides the list of search queries users made to your website, and more. You can enable the service with just a few clicks using 10Web Dashboard.
Navigate to Websites section of 10Web Dashboard, hover over your WordPress site, then click Manage. Afterwards, click on Overview tab of SEO menu item to expand its tools.
Firstly, you need to click Activate SEO Plugin button to enable the service. This action will install SEO by 10Web plugin on your WordPress site.
SEO service retrieves notices and errors from the plugin and displays them on Overview screen of 10Web Dashboard. You can access Search Analytics and Search Console pages of the plugin on your WordPress site with a click.
To receive in-depth and precise information about the indexation behavior of your website, make sure Google Authorization Code is added to SEO by 10Web plugin.
You can also check this information from Search Analytics and Search Console tabs of 10Web Dashboard.
Furthermore, you can authorize SEO Moz account and display corresponding statistics on 10Web Dashboard, as well as in SEO by 10Web plugin.
Check the performance, load time, and speed insights of your WordPress site with Performance service of 10Web. Receive comprehensive information about the behaviour of your website, and find useful tips to improve the performance of it.
To begin using this service, click Manage on your website from 10Web Dashboard, then navigate to Performance tab. Press Activate Performance button to enable the service, and run a performance check on your site for the first time.
Checking the overall performance of your website will take a few moments. After the results are loaded, you will receive the following data:
- Performance grade (e.g. 90%),
- Average load time,
- Page size,
- Number of requests,
- Page speed insights,
- Timeline of the loaded files and requests.
Fixing Performance Errors
After running a performance check on your WordPress site, you will be provided with a list of insights, along with their grades. These grades are scored from 0 to 100%, and also, from A to F. errors and notices. Lets discuss every notice and find out how they can be resolved.
Don't scale images in the browser
Scaling images in the browser helps to make them appear nice with any screen size. However this is a common performance mistake. When the images are scaled in the browser, the website uses more CPU and hurts the performance on mobile. Also, this makes the user to download extra Kilobytes, or even Megabytes of information, and this could be avoided.
Instead of scaling images in the browser, you can create multiple versions of the same image and provide the appropriate one.
Do not load specific print stylesheets.
If you load a specific CSS stylesheet for printing, speed issues may occur on the page, even though the stylesheet is not used. Instead, you can include the print styles inside other CSS files by using
@media query to target type print.
Avoid slowing down the critical rendering path
To begin rendering a page, browser needs to use the critical rendering path. Each file or script included inside the
<head> element will slow down the rendering of the page. To prevent the rendering from slowing down, you need to avoid:
- including files from the same domain as your website (this prevents DNS lookups) and inline CSS,
- using server push for fast rendering and a short rendering path.
Inline CSS for faster first render
We can all agree, inline CSS can be one of the ugliest and messy things to do. However, this has changed nowadays, especially, if you wish to have quick rendering on your website pages. Use inline styling method for critical CSS, when you use HTTP/1 and HTTP/2. To put it differently, you need to prevent the site from making CSS requests, which block rendering. Additionally, you can lazy load and cache the rest of the CSS.
Alternatively, in case you use HTTP/2, HTTP push can be helpful, if your server supports it.
If most of your website users have a slow connection, it would be better to always use inline CSS. Some servers prioritize HTML content over CSS, letting the user download the HTML first. Having inline CSS will help you render the HTML and CSS content altogether.
Avoid using more than one jQuery version per page
It is highly recommended to avoid using multiple versions of jQuery on the same page.
This is done to prevent users from unnecessarily downloading extra data. Make sure your code is clean and the site uses only one jQuery version.
Avoid Frontend single point of failures
It is highly recommended to avoid loading 3rd-party components synchronously inside
<head> tag of your pages.
Declare a charset in your document.
Make your website read all fonts, characters, punctuations, and symbols by declaring document charset to Unicode Standard (UTF-8). It covers almost all available symbols in all languages of the world.
Declare a doctype in your document.
<!DOCTYPE> at the beginning of your HTML document. It is not an HTML tag. It informs the web browser about the version of HTML the page is structured with.
Serve your content securely.
It is highly recommended to use HTTPS over HTTP. This allows you to provide secure content to your users. Furthermore, HTTPS is required, in case you wish to use HTTP/2.
You can get a free SSL/TLC certificate from this link.
Serve your content using HTTP/2.
Having your website to tun with HTTP/2 together with HTTPS is the new best practice. If you do use HTTPS, which is highly recommended, you should also use HTTP/2.
Declare the language code for your document.
According to the W3C standards, you need to declare the language of the pages on your website. To do this, you need to add
lang attribute inside
<html> tag, e.g.
Search engines recognize your web pages with their titles and meta descriptions. Add a relevant text into
<title> tag, as well as meta description, to improve the SEO of your web pages.
Have a good URL format
A great URL improves the SEO of your web pages, and is good for your users also. Use readable, short URLs, avoid using spaces in the path, as well as too many request parameters. Do not have session IDs in your URLs.
Always use an alt attribute on image tags
Use heading tags to structure your page
Increase the readability of your pages by adding heading tags. This also provides a logical, easy-to-follow structure to your users. Have one
<h1> as the main heading of your page, and
<h6>, to emphasize subsections.
The headings also help screen readers and search engines to read the structure of your document.
Always set labels on inputs in forms
Most form elements, such as inputs, textareas and select boxes need to have labels which describe their purpose. Make sure to provide labels to increase the accessibility of your pages.
Structure your content by using landmarks
Semantic Elements of HTML5 allow you to indicate various sections of your page. Examples of these tags are
<nav> tags. Having appropriate landmarks will structure your document nicely and help users navigate easily.
Don't suppress pinch zoom
One of the most important features of mobile browsing is letting users to zoom the content in and out within a page. To have great accessibility on your pages, you need to provide pinch zoom for small screens.
Use headings tags within section tags to better structure your page
In case you have different
<section> tags on your pages, make sure to provide at least one heading tag in them. This provides a good structure for your content.
Use caption and <th> in tables
<caption> tag in
<table> elements to properly describe its content. You can find out more about captions within this link.
<th> tag is necessary to mark the headings of table columns and rows.
More 10Web Services Coming Soon
10Web continuously adds new features to products, develops new plugins, themes, add-ons and services. In the near future, 10Web will launch the following WordPress services:
- Website Security
- Web Hosting
- Uptime Monitoring
In case you have questions about 10Web’s upcoming services and products, feel free to drop us a line using this contact form. Our Customer Care Team will respond to you shortly.