-->

Optimize Blog CSS Delivery Using External Hosting

Search engines like Google, Bind and Yahoo might not absolutely acquire the content amount on a page if the page contains plenty of code like script and CSS. Extraneous code will push the content down within the page supply, creating it more durable for a probe engine crawler to induce to. A soft limit for faster page load is 125KB used to make sure all content (Text, HTML, Script and CSS) & links area unit obtainable within the page supply to be cached by the crawler. This essentially suggests that if the page size is simply too massive, a search engine might not be ready to get all of the content or might find yourself not absolutely caching it.

Optimize Blog CSS Delivery

Inline CSS loses several of the benefits of CSS by compounding content with presentation. As well, inlined designs implicitly apply to all media, since there's no mechanism for specifying the meant medium for an inlined style. This technique ought to be used sparingly, like once a mode is to be applied on all media to one incidence of part.
The blog CSS code delivery rule triggers when PageSpeed Insights detects that a page includes render blocking external CSS file, which delay the time to first render.

CSS generally affect the loading speed of a blog. By adding a lot of inline and internal CSS code in the blog templates, will make progressively slow loading speed of a blog.
So, simple clarification is to use a compressed external css file, use CSS compressing tools and host these file to Google Drive or Dropbox.

There is two ways to use an external third party hosted CSS file.

1. Link to an external CSS File:

The <link> tag defines a link between a document file and an external resource.
<head>
<link href="Source URL" type="text/css" rel="stylesheet"/>
</head>

2. The import statement to an external CSS File:

An external CSS file may be imported with CSS's @import statement. This statement may be used in inside the <style></style> element.
<style type="text/css" media="screen ">
  @import url(http://www.example.com/style.css);
</style>

No comments