Thursday 7 March 2013

M1- Assess different implementation styles of CSS

Implementation styles of CSS


In this blog post I am going to assess different implementation styles for CSS which include Internal, External and inline style sheets.


CSS= Cascading Style Sheets this is used for formatting and coding web sites
HTML is used for page layouts

Inline
The CSS is attached to the HTML element e.g.
<h1 style="color:blue; font-size:12px<h1 style ="color:red;">

One of the advantages of using inline is that it is easier to scroll up in the source, rather than change the whole  source file also website's would load much faster compared to if you’re using external CSS because it has Lower HTTP requests which mean that Inline loads faster.

0ne of the disadvantages of using inline is that Inline styles must be applied to every element that you want it to be in also it is the most specific in cascade which means that it can sometimes over ride things which you didn't intend for.

Internal
 Internal styles are placed inside the <head> section

<head>
<style>
h1{
color:blue;
}
</style>
</head>

This coding only allows for one heading to be edited at the time which means that a new code will be needed for every new heading.

Advantage
-Internal styles don’t need to be applied to every element like inline styles need to be.
- Internal style sheets allow you to test your website without breaking pages apart.

Disadvantage

-Internal also tends to Load slower compared to External and Inline.

 External
The CSS is used to link a file back to the HTML element  

<head>
<link rel="stylesheet" href="style.css">
</head>

External style sheet allows us to reuse styles as many times as we want this is done by linking the external style sheer to other web pages styles only need to be used once because they can then be copied. External style sheets are stored in a different CSS file they can also be written in any text editor. External style sheet are mostly use when there are multiple pages and you need there to be the same style on each web page.


Advantages
      -The files size of the page is reduced because the text is in another document this will reduce the file size a lot.
      - allows you to Control multiple documents at the same time





Disadvantages
           Extra download time is needed to import the style sheet
           Change an element is time consuming

The different types of implementation styles for CSS all have different advantage and disadvantages. Depending on the website the user wished to create and what the web site will contain they will have to choose the implementation style that will best suit their type of website. If the user is creating a complicated web site they would be best suited to use an External style sheet because the CSS code is separate to the HTML which will keep the code manageable and not confusing as they would be separate.


Reference 

 

1 comment:

  1. did u pass m1 with this much work? what course are u doing ( extended diploma) ??

    ReplyDelete