Table of contents
CSS styles – what’s that?
CSS style is a term that refers to the definition of styles that are applied to HTML documents using css. This means that it defines how an element should look like. With CSS styles, you can manually create a new page layout.
What HTML element can be changed with CSS?
In CSS, the possibilities for change are many. We can change, for example:
- page layout – cascading style sheets allow us to change the layout of elements on a page, their position, size, spacing,
- color and background – enter properties for font, background or image colors,
- responsiveness of the page – CSS allows you to adjust the layout of the page to present it on different size devices, in a different orientation,
- visual effects – cascading style sheets allow you to create advanced effects, such as gradients, shadows, animations or transitions.
Font size (font size), text alignment (text align)and background color (background), etc. The language is being developed all the time, with new selectors and tags that are compatible with earlier versions.
How does the CSS code look like?
Example of code:
How to combine CSS with HTML?
- External style sheets – CSS styles is a separate file that contains in one sheet a list of declarations about the appearance of the page. Such a file is linked in the HTML file.
- Internal style sheets – style declaration is inserted inside the <style> element in the <head> section of the HTML document.
- Inline styles – the appearance is defined directly in the style attributes to the selected HTML element.
Why CSS is important for SEO?
Cascading style sheets have a very big impact on SEO. It is important for several reasons:
- Page loading speed is one of Google’s main ranking factors. By optimizing the CSS code and resources, you can improve the page’s position in the browser,
- structure and semantics – keeping HTML code clean and clear is very important. Separating CSS allows search engine robots to better understand the page and index it.
- responsive site – cascading style sheets (CSS) allow you to create a responsive site that can display on different devices, with different dimensions (tablet, smartphone or computer). Google places a premium on sites that are responsive because they provide a better user experience, regardless of the device on which the site is displayed.