How to Fix and Remove Inline CSS

How to Fix and Remove Inline CSS


How to Fix and Remove Inline CSS

Learn how to fix inline CSS in your code, and speed up both your development time and website in the process. Test your site for free at www.seositecheckup.com.

In this video, you’ll hear some of the following:

” In this video, we’ll show you how to improve your site’s SEO score and loading time by fixing a common issue – using too much inline CSS. After running the diagnostics of our site on seositecheckup, we can see that it’s failed a few common checks. In this case, our site has 36 instances of inline CSS styles, which slows down its loading page time quite dramatically.

Now, CSS if you’re not fully aware, stands for for Cascading Style Sheets. Your CSS file describes how HTML elements are displayed on your site. CSS saves a lot of redundant code as it controls the layout or styling of multiple web pages all at once.

If we click here, we can see the details on each instance. And if we click “how to fix”, we see some general guidelines on how to code this properly, so we can have all of our CSS used in one external style sheet, instead of sprinkled throughout the code of our main page. In this case, we should locate each issue, remove it, and point the code towards our one external CSS file. ”

Hear more by watching the full video!

#removeinlinecss #externalstylesheet #searchengineoptimization


Content

0.03 -> hello in this short video we'll show you
2.79 -> how to improve your site's SEO score and
4.89 -> loading time by fixing a common issue
6.66 -> using too much inline CSS after running
10.59 -> the diagnostics of our site on SEO site
12.84 -> checkup we can see that it's failed a
14.88 -> few common checks
18.91 -> in this case our site has 36 instances
21.97 -> of inline CSS which slows down its
24.429 -> loading page time quite dramatically
26.699 -> now CSS if you're not fully aware stands
30.039 -> for cascading style sheets your CSS file
33.34 -> describes how HTML elements are
35.53 -> displayed on your site
36.93 -> CSS saves a lot of redundant code as it
39.76 -> controls the layout or styling of
41.739 -> multiple web pages all at once
45.75 -> if we click here we can see the details
48.36 -> on each instance
56.19 -> and if we click how to fix we see some
58.95 -> general guidelines on how to code this
60.54 -> properly so we can have all of our CSS
63.48 -> used in one external stylesheet instead
66.12 -> of being sprinkled throughout the code
67.41 -> of our main page in this case we should
70.68 -> locate each issue remove it and point
73.68 -> the code towards our one external CSS
75.39 -> file so let's jump right in and look at
78.51 -> a few examples here well click on the
80.82 -> results list again and we have one issue
83.97 -> here
85.939 -> and we can use the general guidelines to
87.979 -> fix the issue if we check our site
91.819 -> source code and you can do this by right
93.95 -> clicking inspect source in your browser
95.81 -> you can see the offending code then in
99.319 -> your text editor we can remove the style
101.539 -> margin write 35 pixels
104.45 -> and in our CSS stylesheet we'll come to
108.53 -> our button row forward hide attribute
110.39 -> and we'll add margin right 35 pixels
118.82 -> let's do the same for another issue
122.67 -> in our index page we'll remove the
124.83 -> display:none style attribute
128.579 -> and in our external CSS we'll come to
131.65 -> our suggestions box parameters and add
133.87 -> display:none to it and so on by avoiding
138.609 -> inline CSS wherever we can we can avoid
141.459 -> redundant code we can make global
143.53 -> changes to websites once instead of
145.54 -> coming through all our pages and
147.04 -> changing lines one by one and most
149.56 -> importantly for the purposes of SEO and
151.75 -> the overall user experience of our site
153.639 -> our pages will be leaner and meaner and
156.099 -> load much faster

Source: https://www.youtube.com/watch?v=rAiDACDq3oY