<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>page speed &#8211; tekRESCUE</title>
	<atom:link href="/tag/page-speed/feed/" rel="self" type="application/rss+xml" />
	<link>/</link>
	<description>SEO &#38; Managed IT Solutions for Austin, San Marcos &#38; Central Texas</description>
	<lastBuildDate>Tue, 07 Jun 2022 18:47:55 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.0.1</generator>

<image>
	<url>/wp-content/uploads/2020/09/tekrescue-site-icon_512-84x84.png</url>
	<title>page speed  - tekRESCUE</title>
	<link>/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Choosing the Right Hosting for Your Austin Business Website</title>
		<link>/choosing-the-right-hosting-for-your-website/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=choosing-the-right-hosting-for-your-website</link>
		
		<dc:creator><![CDATA[Stephen Mesko]]></dc:creator>
		<pubDate>Mon, 25 Oct 2021 16:23:04 +0000</pubDate>
				<category><![CDATA[Website Hosting]]></category>
		<category><![CDATA[austin hosting]]></category>
		<category><![CDATA[page speed]]></category>
		<category><![CDATA[websites]]></category>
		<guid isPermaLink="false">/?p=17793</guid>

					<description><![CDATA[<a href="/choosing-the-right-hosting-for-your-website/" title="Choosing the Right Hosting for Your Austin Business Website" rel="nofollow"><img width="900" height="600" src="/wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600.jpg" class="webfeedsFeaturedVisual wp-post-image" alt="People discussing San Marcos hosting company options on a computer screen" style="display: block; margin-bottom: 20px; clear:both;max-width: 100%;" link_thumbnail="1" srcset="/wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600.jpg 900w, /wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600-600x400.jpg 600w, /wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600-300x200.jpg 300w" sizes="(max-width: 900px) 100vw, 900px" /></a>In this current economy and age where online shopping is one of the most popular activities globally, getting it right when choosing the right host becomes as important as your business itself. It is estimated that e-commerce returns worldwide will be 4.24 trillion dollars of the United States in 2020 alone, and these numbers are...]]></description>
										<content:encoded><![CDATA[<a href="/choosing-the-right-hosting-for-your-website/" title="Choosing the Right Hosting for Your Austin Business Website" rel="nofollow"><img width="900" height="600" src="/wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600.jpg" class="webfeedsFeaturedVisual wp-post-image" alt="People discussing San Marcos hosting company options on a computer screen" loading="lazy" style="display: block; margin-bottom: 20px; clear:both;max-width: 100%;" link_thumbnail="1" srcset="/wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600.jpg 900w, /wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600-600x400.jpg 600w, /wp-content/uploads/2021/10/people-discussing-options-on-computer-screen_900x600-300x200.jpg 300w" sizes="(max-width: 900px) 100vw, 900px" /></a>
<p class="has-drop-cap">In this current economy and age where online shopping is one of the most popular activities globally, getting it right when choosing the right host becomes as important as your business itself. It is estimated that e-commerce returns worldwide will be 4.24 trillion dollars of the United States in 2020 alone, and these numbers are expected to rise to 5.4 trillion dollars in the year 2022. Nonetheless, choosing a host that can guarantee you speed, attractive features tailored to your needs, good storage, and security should rank in your top list.</p>



<p>Whether you&#8217;re not sure where to begin with web hosting or your current host isn&#8217;t cutting it for your business&#8217; needs, this article from our Austin hosting team is sure to help point you in the right direction.</p>



<h3 id="what-is-web-hosting">What is Web Hosting?</h3>



<p>Technology has brought us to an age where you do not have to hire a whole team of IT professionals to get the job done. Your work is to look for the company that bests serve your needs when it comes to hosting. Web hosting is one of the most fundamental parts of a website.</p>



<p>There are great companies out there that have put in the time to create technological solutions that cater for different needs, and not all hosts are equal. Therefore, careful consideration should be taken to ensure you choose the right host to suit your needs.</p>



<p>Instead of hiring a whole team to develop a website for you, with a small fee, you can get the same services from a web hosting company which is a great business decision you can make.</p>



<h3 id="types-of-web-hosts">Types of Web Hosts</h3>



<p>To better identify and choose the right host, you must first understand the types of web hosting companies that exist in the market. The web host is the infrastructure that allows an organization to publish a website. Some offer simple web hosting services, some are in highly lucrative markets, and others are in less crowded markets. The six most basic types include the following:</p>



<h4 id="1-shared-hosting">1. Shared Hosting</h4>



<p>Good for those at the starting stage of website hosting, shared hosting is where a site is stored on the same servers just like other sites. Random Access Memory as well as the Central Processing unit are shared, and therefore the cost is cheaper. This makes shared hosting companies the most excellent choice for beginner website owners.</p>



<p>It can be used by an owner of an enterprise, a community group, or a blogger as it is simple to host. Facilities like website builders, WordPress hosting, and even email interface are available. The only downside to it is that sudden surges of users can affect your site&#8217;s speed and performance, as shared hosting isn&#8217;t built for a high capacity of website users.</p>



<h4 id="2-vps-virtual-private-server-hosting">2. VPS (Virtual private server) Hosting</h4>



<p>This is most appropriate for site owners who require more control but don&#8217;t necessarily require a dedicated server. Each website is hosted in its own space even if it integrates with others as well. Even though VPS still cannot handle high traffic, it allows access to more customization and storage space.</p>



<h4 id="3-dedicated-server-hosting">3. Dedicated Server Hosting</h4>



<p>This allows for more control as the server is absolutely for you, and only your site is stored in it. You have access as an admin, and you can regulate the whole thing, including security as well as the operating system. You should keep in mind, however, that this is an expensive web hosting option. It&#8217;s only practical for website owners who get high traffic and need control over their servers.</p>



<h4 id="4-cloud-hosting">4. Cloud Hosting</h4>



<p>Cloud hosting means many interconnected computers operating applications together with the help of shared computing resources. It is a technique used by companies that operate one network and offer computing resources as a utility.</p>



<p>Users can involve as many resources as they require without building and maintaining the infrastructure of their computers. They are widespread over several servers with little chance of malfunctioning. With cloud base hosting, your website can grow while your business only pays for the resources it needs.</p>



<h4 id="5-managed-hosting">5. Managed Hosting</h4>



<p>Here, the provider takes care of the the day-to-day operation as well as management of the standardized applications. Several of the hosting packages available are actually managed, but it all comes down to what you need. Each plan caters for different groups and needs.</p>



<h4 id="6-colocation">6. Colocation</h4>



<p>This hosting service allows you to rent a physical space where you are provided with electricity, internet connection with a bandwidth of great strength, an IP address, and cooling systems. With these resources, you are left to manage your own devices. If you own your own computer server, you may choose to “co-locate” instead of keeping it in your home or office.</p>



<p>Which one do you want? What is good for you? This is a question only you can answer. Even though there are many to choose from, it boils down to what best suits you need.</p>



<h3 id="factors-to-consider-when-choosing-a-web-host">Factors to Consider when Choosing a Web Host</h3>



<ol><li>The resources required</li><li>Expected traffic</li><li>The kind of website available</li><li>Your budget</li></ol>



<h3 id="criteria-to-choosing-the-best-web-hosting-service-for-your-website">Criteria to Choosing the Best Web Hosting Service for Your Website</h3>



<p>Measure up each web host against these criteria to get the best choice.</p>



<h4 id="1-understand-your-website-s-needs">1. Understand Your Website&#8217;s Needs</h4>



<p>Make a list of what you need on a website. From there, compare them to what the potential host is offering. If you have a specific need, make sure you consider it. For photography, you might need and look up hosts that offer speed and storage and a content delivery network for content-heavy sites. For E-commerce sites, you might want to consider bandwidth and security.</p>



<h4 id="2-consider-the-host-s-subscription-period-contract">2. Consider the Host&#8217;s Subscription Period Contract</h4>



<p>Consider the contract lengths including monthly and yearly plans, and think how long you would want to commit upfront. It is advisable to pay for a few months first to experience it, and you can commit long term if you like it. This strategy can save you quite a lot of money.</p>



<h4 id="3-check-for-server-reliability">3. Check for Server Reliability</h4>



<p>Look for uptime guarantees and how reliable the service can be. You want to ensure that your website will be online and available when users need you without issues.</p>



<h4 id="4-ask-about-host-s-refund-policy-and-guarantees">4. Ask About Host&#8217;s Refund Policy and Guarantees</h4>



<p>This is for “what if” purposes. You want to know whether they are fluid and flexible to refund your money if you change your mind.</p>



<h4 id="5-know-your-upgrade-options">5. Know Your Upgrade Options</h4>



<p>It is important to know if some charges or penalties will accrue to you later when you try to upgrade. Your business or blog might go viral, and there might be a need to upgrade quickly. You need to know if you can upgrade on short notice and how smooth the process will be.</p>



<p>In addition to that, verify your hosts&#8217; features, determine whether hosts support e-commerce, find out what kind of control you will have access to, and understand your account&#8217;s limitations. Those are the most basic criteria you might need to find the right web host.</p>



<h3 id="find-web-hosting-in-austin-tx"><strong>Find Web Hosting in Austin TX</strong></h3>



<p>If you&#8217;re in need of reliable, fast commercial hosting with excellent customer support, the web team at tekRESCUE is ready to help. Our <em>Austin hosting Services</em> can take your business&#8217; site to the next level with managed updates and priority support. Contact us to learn how we can help!</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>How Icon Fonts Are Used On the Web—and Why They Matter</title>
		<link>/how-icon-fonts-work/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=how-icon-fonts-work</link>
		
		<dc:creator><![CDATA[Stephen Mesko]]></dc:creator>
		<pubDate>Fri, 26 Feb 2021 21:29:16 +0000</pubDate>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[page speed]]></category>
		<category><![CDATA[search engine optimization]]></category>
		<guid isPermaLink="false">/?p=15067</guid>

					<description><![CDATA[<a href="/how-icon-fonts-work/" title="How Icon Fonts Are Used On the Web—and Why They Matter" rel="nofollow"><img width="900" height="600" src="/wp-content/uploads/2021/02/how-icon-fonts-work.png" class="webfeedsFeaturedVisual wp-post-image" alt="Icon of a brown fox jumping over a lazy dog" loading="lazy" style="display: block; margin-bottom: 20px; clear:both;max-width: 100%;" link_thumbnail="1" srcset="/wp-content/uploads/2021/02/how-icon-fonts-work.png 900w, /wp-content/uploads/2021/02/how-icon-fonts-work-600x400.png 600w, /wp-content/uploads/2021/02/how-icon-fonts-work-300x200.png 300w, /wp-content/uploads/2021/02/how-icon-fonts-work-20x13.png 20w" sizes="(max-width: 900px) 100vw, 900px" /></a>While browsing the web, you may have noticed similar sets of icons used on all kinds of different sites—think of all those phone, envelope, and map marker icons that seem to be everywhere. If you&#8217;ve ever used a website building tool or content management system, you may already be familiar with using these icon sets...]]></description>
										<content:encoded><![CDATA[<a href="/how-icon-fonts-work/" title="How Icon Fonts Are Used On the Web—and Why They Matter" rel="nofollow"><img width="900" height="600" src="/wp-content/uploads/2021/02/how-icon-fonts-work.png" class="webfeedsFeaturedVisual wp-post-image" alt="Icon of a brown fox jumping over a lazy dog" loading="lazy" style="display: block; margin-bottom: 20px; clear:both;max-width: 100%;" link_thumbnail="1" srcset="/wp-content/uploads/2021/02/how-icon-fonts-work.png 900w, /wp-content/uploads/2021/02/how-icon-fonts-work-600x400.png 600w, /wp-content/uploads/2021/02/how-icon-fonts-work-300x200.png 300w, /wp-content/uploads/2021/02/how-icon-fonts-work-20x13.png 20w" sizes="(max-width: 900px) 100vw, 900px" /></a>
<p class="has-drop-cap">While browsing the web, you may have noticed similar sets of icons used on all kinds of different sites—think of all those phone, envelope, and map marker icons that seem to be everywhere. If you&#8217;ve ever used a website building tool or content management system, you may already be familiar with using these icon sets like <a rel="noreferrer noopener nofollow" href="https://fontawesome.com/" data-type="URL" data-id="https://fontawesome.com/" target="_blank">Font Awesome</a> or <a rel="noreferrer noopener nofollow" href="https://material.io/resources/icons/?style=baseline" data-type="URL" data-id="https://material.io/resources/icons/?style=baseline" target="_blank">Material Icons</a>. These are examples of icon fonts, and they offer a way for web designers to leverage a browser&#8217;s text rendering capabilities to deliver any shape imaginable. With <a href="/infographic-page-speed-all-about-it/" data-type="post" data-id="12341">page load speed</a> and <a href="/mobile-responsive-websites/" data-type="post" data-id="6357">cross-device compatibility</a> being more important than ever before in today&#8217;s web landscape, icon fonts can be a valuable way to improve a website&#8217;s performance and user experience quickly and dramatically.</p>



<p>How does this technology work, and how can you use it to its maximum effect? We&#8217;ve put together an overview of how exactly icon fonts work, how to use them on a website and how to create your own with any shapes you can dream of. Exciting stuff!</p>



<h3>What Are Icon Fonts?</h3>



<p>Let&#8217;s start with the basics. All digital fonts work by assigning a letter, number or special character to a string of numbers called a <a rel="noreferrer noopener nofollow" href="https://home.unicode.org/" data-type="URL" data-id="https://home.unicode.org/" target="_blank">Unicode</a>. For example, in a typical font the letter “A” will be assigned to the Unicode “U+0041.” Every time you type or typeset the letter “A,” that code is used to identify which typographic character should be rendered.</p>



<p>Icon fonts work in the exact same way. Instead of assigning a typical text character to a given Unicode, a font designer can assign any shape they choose. This concept isn&#8217;t new, as dingbat or ornament fonts have been around since the beginning digital typography to allow typesetters to easily add glyphs and other symbols to page designs. They&#8217;ve gained an increased relevance in recent years, however, due to their versatility and performance in the world of modern web design.</p>



<figure class="wp-block-image size-large"><img loading="lazy" width="900" height="600" title="dingbats example" src="/wp-content/uploads/2021/02/dingbats-example.png" alt="Lineart of various hand illustrations used in typesetting" class="wp-image-15094" srcset="/wp-content/uploads/2021/02/dingbats-example.png 900w, /wp-content/uploads/2021/02/dingbats-example-600x400.png 600w, /wp-content/uploads/2021/02/dingbats-example-300x200.png 300w" sizes="(max-width: 900px) 100vw, 900px" /><figcaption>Example of dingbat ornaments used in traditional typesetting</figcaption></figure>



<h3>What Advantages Do Icon Fonts Bring to Web Design?</h3>



<p>Being fonts instead of <a href="/infographic-image-file-types-decoded/" data-type="post" data-id="10179">raster images</a>, icon fonts offer several advantages over &lt;img /&gt; elements when designing a website. For one, digital font files like .TTF or .OTF have a much smaller file size than the typical .JPG or .PNG image file, and this is especially true for web-optimized font files like .WOFF. This alone can go a long way towards increasing a page&#8217;s load speed, which plays a huge role in the user experience in today&#8217;s age of mobile device browsing.</p>



<p>On top of this smaller size, having every icon you need in a single font file can lower the number of HTTP requests the browser needs to make to the server when loading a web page. If you have a page with several icons in the form of image files, the browser will need to send separate requests to fetch each image individually, one at a time. Having all those images load in a single request will allow the page to load much faster and with much less demand on the server.</p>



<p>In addition to these speed improvements, icon fonts allow web designers to take advantage of all the CSS properties that can be used to style text. From color changes to text shadows, scaling, transitions and animations, icon fonts a are just as versatile as <a href="/typography-web-2019/" data-type="post" data-id="11439">any other piece of text on a website</a>. Last but not least, they can be rendered at any size without losing quality just like typography.</p>



<h3>Can an Icon Font Replace Every Image on Your website?</h3>



<p>Despite their exciting potential for CSS styling, fonts can only render flat shapes with a single color. They can&#8217;t take the place of photos and other complex images, and even icons with multiple flat colors are better served as PNG files. They also can&#8217;t be set as background images through CSS, and workarounds to achieve this effect may be more trouble than they&#8217;re worth.</p>



<figure class="wp-block-image size-large"><img loading="lazy" width="900" height="600" title="what icon fonts can replace" src="/wp-content/uploads/2021/02/what-icon-fonts-can-replace.png" alt="Flat icon of a taco with the text &quot;CAN REPLACE&quot; next to a multi-color taco icon with the text &quot;CAN'T REPLACE&quot;" class="wp-image-15092" srcset="/wp-content/uploads/2021/02/what-icon-fonts-can-replace.png 900w, /wp-content/uploads/2021/02/what-icon-fonts-can-replace-600x400.png 600w, /wp-content/uploads/2021/02/what-icon-fonts-can-replace-300x200.png 300w" sizes="(max-width: 900px) 100vw, 900px" /></figure>



<p>If your site uses a large number of simple, flat shapes, however, then it&#8217;s the perfect candidate to take advantage of an icon font&#8217;s benefits.</p>



<h3>How Are Icon Fonts Used in Web Design?</h3>



<p>As mentioned before, many website builder apps and content management systems like WordPress make it easy to add icon fonts to a web project. Many WordPress themes come pre-loaded with icon sets and easy ways to implement them right out of the box, no HTML or CSS needed.&nbsp;Even without these tools, using an icon font is just like using any uploaded font on a web project. There&#8217;s a broad range of free icon fonts available for designers to download, and these fonts can be uploaded to a hosting server and implemented with the <a href="https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp" data-type="URL" data-id="https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp" target="_blank" rel="noreferrer noopener nofollow">“@font-face” CSS</a> rule like any other font. From there, the “font-family” property can be used to set any text content in the icon font.</p>



<h4>CSS</h4>



<pre class="wp-block-preformatted">@font-face&nbsp;{
&nbsp;&nbsp;font-family:&nbsp;myIconFont;
&nbsp; src:&nbsp;url(https://example.com/fonts/myiconfont.woff);
}

.my-icon-font {
  font-family: myIconFont;
}</pre>



<p>In the above example CSS, the @font-face rule is used to load the icon font by specifying its url in the “src&#8221; property. The “font-family” property is used to assign a name to the icon font, and any element with the “my-icon-font” class will be set in the specified font.</p>



<p>The most common way icon fonts are used in web design, however, is through ::before or ::after <a rel="noreferrer noopener nofollow" href="https://www.w3schools.com/css/css_pseudo_elements.asp" data-type="URL" data-id="https://www.w3schools.com/css/css_pseudo_elements.asp" target="_blank">CSS pseudo-elements</a>. A typical approach is to create an empty &lt;i> tag and use CSS to select that tag&#8217;s ::before or ::after pseudo-element, inserting the Unicode for the desired icon using the &#8220;content&#8221; attribute. Once the content is generated, additional properties are used to specify the icon font as the font-family as shown below.</p>



<h4>HTML</h4>



<pre class="wp-block-preformatted">&lt;p&gt;&lt;i class="font-icon dog"&gt;&lt;/i&gt; Dog&lt;/p&gt;</pre>



<h4>CSS</h4>



<pre class="wp-block-preformatted">.font-icon::before {
  font-family: myIconFont:
  color: blue;
}

.font-icon.dog::before {
  content: " 041"
} </pre>



<p>In the above example, the &#8220;font-icon&#8221; class is used to specify the correct icon set and styling to be used for all icons in the set, while the &#8220;dog&#8221; class inserts the Unicode for the dog character within the set. Since no actual content exists in the HTML, icons can easily be swapped out and changed using nothing but CSS.</p>



<h3>How Can You Create a Custom Icon Font?</h3>



<p>While there&#8217;s an ever-expanding selection of free icon fonts with even more options available if you&#8217;re willing to pay a premium, nothing compares to a set of original icons to make a website stand out and deliver value for a client. If you&#8217;re familiar with using software for creating and editing fonts, you probably already guessed that making a font out of icons is exactly the same as making one out of letters and numbers. Just be sure to export your font as a .WOFF or .WOFF2 if possible, since those file types are optimized for serving as web content.</p>



<p>For those of us without font editing tools, there are several web apps available that allow you to upload a set of .SVG files and export them as a font. One such app is <a rel="noreferrer noopener nofollow" href="https://icomoon.io/app/" data-type="URL" data-id="https://icomoon.io/app/" target="_blank">Ico</a><a href="https://icomoon.io/app/" data-type="URL" data-id="https://icomoon.io/app/" target="_blank" rel="noreferrer noopener nofollow">M</a><a rel="noreferrer noopener nofollow" href="https://icomoon.io/app/" data-type="URL" data-id="https://icomoon.io/app/" target="_blank">oon</a>, which is free to use as long as you don&#8217;t need to save your projects on their servers.</p>



<p>To use IcoMoon and similar apps, create a set of icons in a vector editing tool like Adobe Illustrator or the free <a rel="noreferrer noopener nofollow" href="https://inkscape.org/" data-type="URL" data-id="https://inkscape.org/" target="_blank">Inkscape</a>, and export each icon as an .SVG individually. These can be uploaded to a new icon set in IcoMoon, where they can then be mapped to whatever Unicode you choose and downloaded as a font file. IcoMoon even includes sample HTML and CSS to make implementation into a web project a bit easier.</p>



<figure class="wp-block-image size-large"><img loading="lazy" width="900" height="568" title="icomoon screenshot" src="/wp-content/uploads/2021/02/icomoon-screenshot.png" alt="Screenshot showing a starter project open in IcoMoon's app" class="wp-image-15093"/><figcaption>Screenshot showing a starter project open in IcoMoon&#8217;s app</figcaption></figure>



<h3>Conclusion</h3>



<p>Whether you plan to create your own icons or to use one of the exciting variety of existing icon sets out there, we hope this overview has inspired you to try this new approach to adding graphics to your next web project. In addition to their versatility and scalability, icon fonts can improve your website&#8217;s performance, making them a valuable asset for both usability and <a href="/tag/seo/" data-type="URL" data-id="/tag/seo/">search engine optimization</a>. And on top of it all, they&#8217;re just a lot of fun to work with!</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>[Infographic] Page Speed: All About It</title>
		<link>/infographic-page-speed-all-about-it/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=infographic-page-speed-all-about-it</link>
		
		<dc:creator><![CDATA[Alec Carter]]></dc:creator>
		<pubDate>Thu, 12 Sep 2019 22:06:48 +0000</pubDate>
				<category><![CDATA[Digital Marketing]]></category>
		<category><![CDATA[infographic]]></category>
		<category><![CDATA[optimization]]></category>
		<category><![CDATA[page speed]]></category>
		<guid isPermaLink="false">/?p=12341</guid>

					<description><![CDATA[<a href="/infographic-page-speed-all-about-it/" title="[Infographic] Page Speed: All About It" rel="nofollow"><img width="900" height="600" src="/wp-content/uploads/2019/09/infographic_page-load-speed_hero.png" class="webfeedsFeaturedVisual wp-post-image" alt="An illustration shows how much of a web page should be loaded after 1, 2, 3, and 4 seconds." loading="lazy" style="display: block; margin-bottom: 20px; clear:both;max-width: 100%;" link_thumbnail="1" srcset="/wp-content/uploads/2019/09/infographic_page-load-speed_hero.png 900w, /wp-content/uploads/2019/09/infographic_page-load-speed_hero-600x400.png 600w, /wp-content/uploads/2019/09/infographic_page-load-speed_hero-300x200.png 300w, /wp-content/uploads/2019/09/infographic_page-load-speed_hero-20x13.png 20w" sizes="(max-width: 900px) 100vw, 900px" /></a>As mobile devices increasingly become the de facto way to access the Internet, a website&#8217;s loading speed has become more important than ever before. If your potential customers feel like your website is taking too long to load, they&#8217;ll likely leave and visit a competitor&#8217;s site instead. Additionally, search engines are increasingly using page load...]]></description>
										<content:encoded><![CDATA[<a href="/infographic-page-speed-all-about-it/" title="[Infographic] Page Speed: All About It" rel="nofollow"><img width="900" height="600" src="/wp-content/uploads/2019/09/infographic_page-load-speed_hero.png" class="webfeedsFeaturedVisual wp-post-image" alt="An illustration shows how much of a web page should be loaded after 1, 2, 3, and 4 seconds." loading="lazy" style="display: block; margin-bottom: 20px; clear:both;max-width: 100%;" link_thumbnail="1" srcset="/wp-content/uploads/2019/09/infographic_page-load-speed_hero.png 900w, /wp-content/uploads/2019/09/infographic_page-load-speed_hero-600x400.png 600w, /wp-content/uploads/2019/09/infographic_page-load-speed_hero-300x200.png 300w, /wp-content/uploads/2019/09/infographic_page-load-speed_hero-20x13.png 20w" sizes="(max-width: 900px) 100vw, 900px" /></a>
<p>As mobile devices increasingly become the de facto way to access the Internet, a website&#8217;s loading speed has become more important than ever before. If your potential customers feel like your website is taking too long to load, they&#8217;ll likely leave and visit a competitor&#8217;s site instead. Additionally, search engines are increasingly using page load speeds as a ranking factor—meaning your site&#8217;s presence in search engines might suffer if it isn&#8217;t optimized for speed.</p>



<p>Whether you&#8217;re a business owner or a web developer, understanding page speed and how to improve it has become extremely important. To help familiarize you with this tricky subject, we&#8217;ve put together an infographic detailing why page speed matters, how web pages are loaded, and tips for making your site faster. If you&#8217;d prefer to read the info in text form, scroll past the infographic for an article summarizing its content.</p>



<figure class="wp-block-image"><img loading="lazy" width="700" height="1478" title="infographic page load speed v1 0" src="/wp-content/uploads/2019/09/infographic_page-load-speed-v1.0.png" alt="An infographic details website page load speed. Scroll down to read the information in text form." class="wp-image-12356" srcset="/wp-content/uploads/2019/09/infographic_page-load-speed-v1.0.png 700w, /wp-content/uploads/2019/09/infographic_page-load-speed-v1.0-426x900.png 426w" sizes="(max-width: 700px) 100vw, 700px" /></figure>



<h2>Why Page Speed Matters</h2>



<p>Did you know that 43% of website visitors will leave a website if it takes longer than 3 seconds to load? The average load time of a web page is 3.21 seconds, meaning that the majority of websites are losing nearly half of their potential customers and driving up their bounce rates simply due to poor load time optimization.</p>



<p>If your website is slower than average, the <a href="/click-rate-bounce-rate-seo/">bounce rates</a> only get higher. For every additional one-second delay in page load times, visitors are 11% more likely to leave a website before the page is fully loaded in. This effectively makes your visitor retention rate nonexistent if your landing page takes 8 seconds or longer to load.</p>



<p>On the other hand, faster load times will help retain website visitors much longer. On average, website users will visit 9 pages on a site if the load times are under 2 seconds per page. If a potential customer stays on your site this long, it&#8217;ll greatly increase their chances of moving forward with a purchase.</p>



<h2>Website Load Time Benchmarks</h2>



<p>Before we get into techniques to help your website load faster, it helps to understand the steps it takes for a browser to render a web page on your visitor&#8217;s screens. We&#8217;ll be breaking down a web page&#8217;s rendering process into four seconds and giving you an idea of where an ideal web page should be at the end of every second.</p>



<ol><li><strong>First Paint—1 Second</strong><br>After the first second, an ideal website should be showing the &#8220;first paint&#8221; or the initial visuals visible to the browser. First paint should include the web page&#8217;s background color as well as header elements that appear at the very top of the page.</li><li><strong>Contentful Paint—2 Seconds</strong><br>Two seconds in to the loading process, your web page should have started to load actual page content such as text and images. Ideally, the above-the-fold content should be fully rendered even if the rest of the page&#8217;s content isn&#8217;t finished being rendered yet.</li><li><strong>DOM Loaded—3 Seconds</strong><br>After the third second, an ideal web page should be fully parsed by the browser and have all content understood and rendered. This includes all HTML and style sheets. Your web page should feel as though it&#8217;s finished loading at this point.</li><li><strong>Onload—4 Seconds</strong><br>After the third second, the page should be fully loaded and begin executing JavaScript and other advanced widgets that could otherwise delay content to load in. It is important that these scripts load last, after the page&#8217;s content and style sheets are already completely finished loading.</li></ol>



<h2>Tips for Fast Web Speeds</h2>



<p>Now that we&#8217;ve taken a look at an ideal web page&#8217;s rendering process, what can you do to make your website&#8217;s pages closer to this ideal? While not everything about a page&#8217;s load speed is under your control (your visitors could have slow connection speeds, outdated browsers, or slow hardware), most of it is determined by the way your pages are built and served. Below, we&#8217;ll go over a few tips on building and serving a page that loads faster.</p>



<ol><li><strong>Prioritize Above-the-Fold Content</strong><br>Borrowing from the language of print design, &#8220;Above-the-fold&#8221; refers to the first content visitors will see on their screen as they visit a web page. This includes the website&#8217;s header, page title, and any hero image or content a page might have. It&#8217;s important that this content is rendered before anything else, as any delay in its loading will make the page feel sluggish and poorly put together.</li><li><strong>Optimize Images</strong><br>Images are often the most data-intensive part of a web page&#8217;s content. While it&#8217;s inevitable that pages with large, beautiful hero images will take longer to load than those with simple text content, there are a number of strategies you can use to keep your image file sizes as low as possible without sacrificing too much quality. The most important of these strategies is choosing the right file type for your image—refer to <a href="/infographic-image-file-types-decoded/">our previous infographic</a> for a full break down of the various image file types you can use on a web page.</li><li><strong>Use a Content Delivery Network (CDN)</strong><br>Finally, you can improve your website&#8217;s load speed by optimizing the way it&#8217;s served to visitors. One strategy that&#8217;s increasing in popularity is to use a CDN, or a network of servers with shared data covering a broad geographic range. This not only improves the time it takes for the servers to get your website data to your visitors, but it also makes visitor&#8217;s connection to your site more secure. We use <a href="https://www.cloudflare.com/" target="_blank" rel="noreferrer noopener nofollow" aria-label="Cloudflare (opens in a new tab)">Cloudflare</a> as our CDN at tekRESCUE, but there are many options available in this growing market.</li></ol>



<p>In Conclusion, it&#8217;s time to start taking page speeds seriously. Between visitor bounce rates and search engine penalties, the consequences of having a slow website are impossible to ignore. We hope you found this information helpful, and we hope it gets you started on your way to a faster website and more conversions.</p>



<p>As always, feel free to <a href="/contact/">contact the experts</a> at tekRESCUE if you have concerns with your website&#8217;s page speeds. We&#8217;ll be happy to consult with you and help build you a faster website.</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
