CSS And Semantic Markup

CSS And Semantic Markup


Advancements in CSS and semantic markup

One thing that I have learned in over 10 years creating sites is that the ‘web is persistently changing, and to keep up you have to change with it. One of the later advancements in website composition is the utilization of CSS and semantic markup. CSS and semantic website composition have a few advantages: lucidity in code, program and other web-empowered gadgets similarity, separation of substance and introduction, littler weight on bandwidth, and better permeability to web crawlers.

Once upon a time, we outlined locales with divs and hacked those divs into doing things that they were never intended to do. The div tag was intended to show unthinkable information, not as an approach to rendering the design of a site. Lamentably, a superior option did not exist, so we utilized divs. This made for wasteful, moderate stacking destinations with code that was difficult to peruse and keep up. characterizes semantic markup like this:

Sematic pages “supply data for web indexes utilizing web crawlers. This could be machine-lucid data about the comprehensible substance of the record, (for example, the designer, title, portrayal, and so on., of the report) or it could be absolutely metadata speaking to an arrangement of certainties, (for example, assets and administrations somewhere else in the site). (Take note of that anything that can be related to a Uniform Resource Identifier (URI) can be depicted, so the semantic web can reason about individuals, places, thoughts, felines and so forth.)”

Nowadays, hip fashioners and engineers utilize CSS broadly to make lovely, completely guidelines agreeable locales. CSS-based design permits us to create destinations that will corrupt viably – that will be that they will be perceptible to a wide range of gadgets, for example, PDA’s, phones, T. V.’s- – and will work accurately on gadgets that don’t exist yet the length of they are guidelines agreeable.

CSS Isolation

Above all, creating destinations with CSS permits us to adequately isolate substance and introduction. Have you ever taken a gander at the source code of HTML pages that were made with a div-based format and pondered “what the hell is going ahead here?” You see heaps of opening and shutting of divs and div lines all combined with literary substance and representation. With a clean, CSS-based design you can make pages that are effectively comprehended by taking a gander at the source, making them less demanding to comprehend, keep up, and refresh.

On the off chance that you have a site with high activity, you can essentially lessen the measure of bandwidth utilized by transitioning from a div-based site to a CSS-based design. In the event that a guest to your site doesn’t need to load the greater part of the code expected to render those divs and spacer gifs, you are transmitting less information.

CSS likewise offers site improvement benefits over divs. In the event that you have divs construct a business website that relies on the light of Internet activity to turn a benefit or acquire new customers, you will see genuinely favorable circumstances by changing to CSS. At the point when a web index insects your divs-based web page, they recover a lot of substance that has nothing to do with your business. At the point when web search tools arachnids a clean CSS-based website, the larger part of substance recovered will be a literary substance that depicts your business. The proportion of substance to code is higher with CSS-based designs.

We’ve all observed web search tool depictions that don’t bode well; that is on account of web search tool creepy crawlies utilize a top-down technique for recovering data. Whatever is highest on your record, the web crawlers will believe is the most vital piece of the archive, and in this manner ought to be utilized as the depiction. Since we separate substance and introduction with CSS, we can put the most critical data at the highest point of a report regardless of where it is really shown on the page. Attempt that with divs!

I trust this article gives you an outline of why it is imperative to move from your present divs-based format to a completely substantial CSS usage. On the off chance that you don’t have a site, yet are anticipating propelling one sooner rather than later, ensure you tell your engineers you need a CSS-based usage.

Common CSS Mistakes

Common CSS Mistakes



Common Cascading Stylesheet Mistakes

Cascading Stylesheet or CSS is one of the most used and convenient ways of coding the markup languages. Most of the websites are built on an HTML platform and hence it is important for us that the CSS is also correctly applied so that the information that the website wants to transmit to its viewers is correct. But, designers often commit fundamental mistakes that can make things go terribly wrong for a website.

Zero pixels

You don’t waste bytes by adding units such as px, pt, em, etc when the value is zero. The only reason to do so is when you want to change the value quickly, later on, otherwise declaring the unit is meaningless. Zero pixels is the same as zero points. In order to get the accurate choice of the color, you must specify the hex code rather than writing the color in plain English. Never forget to add hash “#” at the start of the code so that it can be parsed correctly. Otherwise, you will have to remember to add another hash to prevent errors.

Unless you are likely to be changing your code much, avoid using several lines when only one line can serve your purpose. For example, when setting borders, some people set each side separately when each border is the same. So condensing the code is required here. It is okay to style the same element twice if it means avoiding the repetition mentioned in the point above. For example, let’s say you have an element where only the left border is different. Instead of writing out each border using four lines, just use two.

Space in code

But sometimes designers like to waste a lot of space in their code, by using plenty of unnecessary line-breaks or spaces before and after the code. It’ll only make the stylesheet bigger, meaning it’ll cost you more in the long run, as your bandwidth usage will be higher. Of course, it’s wise to leave some space in to keep it readable, though some people like to condense everything, leaving no space at all.

Designers must be careful about some common mistakes so that they can design the web pages in a proper manner and convey the message to its reader correctly.

Welcome To The World Of CSS Web Design

Welcome To The World Of CSS Web Design


Improved with the help of CSS

Although CSS was first introduced in the mid-1990s, it did not become a mainstream tool for web designers and masters until more recent years. This is unfortunate because there are millions of poorly designed websites cluttering the internet that could be easily improved with the help of CSS.

So what exactly is CSS?

CSS is an acronym that stands for Cascading Style Sheets. The term Cascading Style Sheets implies two things. First off, the style sheets are cascading. This means that multiple style sheets can be used for a single web page. Additionally, the term “cascading” also refers to the way a style is determined in the event that more than one rule matches a single element. The second thing that is implied by the name Cascading Style Sheets is that the purpose of CSS is to style web pages. Whereas the purpose of HTML (or XHTML) is to define the structure of a web page, the purpose of CSS is to define the presentation.

Different browsers

The reason that so many web pages have broken layouts in different browsers is that they try to use HTML to control the structure and presentation of the page. The most common abuse of HTML is attempting to use tables as a presentation method. Although you may be able to achieve the look you want in a single browser, your web page will look broken and distorted in many other browsers. The only time that tables should be used is to hold a set of data (such as the results of a scientific experiment). If you do have a legitimate use for tables on your web page, you can even use CSS to style your table and make it more attractive.


By taking the time to learn CSS, you will be able to create a web page that looks much more consistent across a variety of browsers.