The short version is that that the various tags and CSS have different purposes.
<h1>Whatever</h1>, for example, carries a certain amount of meaning along with its use: "This is a header, an important–first-level one" and so on. Some parsers also use the hx tags(and others) to create an outline of the document's structure which can be used for ...
@toomanyairmiles is partially correct - the purpose of this technique is to allow parallel connections from the web-browser to the server. Web browsers should allow a minimum of two simultaneous connections to a single host, but many new browsers can manage up to 60. Regardless, concurrent simultaneous connections between browser and web-server(s) is a major ...
Markup and presentation are different
This is a bit like asking "why should we have walls when we have paint?" :)
HTML tags denote what your content is - this is a headline, this is a list, etc.
CSS denotes what your content should look like - headlines should be blue, lists should be indented this much, the menu should be on the left, etc.
Google have very recently updated their guidelines to officially state that you should not block access to CSS or JS files in robots.txt. This ensures that when Google crawls the site, it can render it exactly as a browser would.
If you block CSS or JS files, it could harm how well your website performs in the rankings.
More info here: Updating our ...
Yes. You can use an app that auto-compiles LESS files to CSS on your development machine as you code. Then simply upload the generated CSS file to your server when you're done developing.
Crunch! for Windows & Mac
WinLess for Windows
CodeKit for Mac
http://unused-css.com/ Does some of what you ask, and they have this to say:-
Latish Sehgal has written a windows application to find and remove unused CSS classes. I haven't tested it but from the description, you have to provide the path of your html files and one CSS file. The program will then list the unused CSS selectors. From the screenshot, it looks ...
As the text is part of the logo, I would keep it in the image (saves on trying to match any non-standard fonts and having to position it exactly like it is in the logo) - you can always put it in the alt attribute or use microdata to to enhance your seo:
<div id="main-logo-holder" itemscope itemtype="http://schema.org/Organization">
I think it really depends on what you find easiest for development and what helps you keep a tidy stylesheet.
The only real downside I can think of in splitting would be that should an element's attribute appear in all your stylesheets, you would have to update 5 separate files to change it (rather than it appearing side-by-side in one place).
Actually, you don't need any conversion tool to start working with LESS. LESS syntax is backwards compatible with CSS. It means any CSS file is also valid LESS file.
Simply get your CSS and rename it to a LESS file. Then use LESS-specific features along with your changes. The more you'll update the file, the more you'll be able to use LESS features.
I did ...
Here's an example that forces the browser to download ...
For Helvetica I would just specify the font-family with CSS like so:
font-family: Helvetica, Arial, sans-serif;
This says, "use Helvetica if it's available, Arial if it's not, and the system's default sans-serif font if neither are installed". Helvetica is installed on 100% of Mac and iOS devices [source]. The other two cover the rest, and Arial ...
Many companies also use a CDN, a tool which ensures the end user gets their data from a server that is geographically close to them, ...
Sure. Obviously, it would be better to use CSS alone but if you can't, use what you have. Do as much as you can with CSS and use JS as needed. Not sure why you can't change the existing CSS but you can add a style sheet with JS.
//create a new element
var newStyle = document.createElement("link");
//set the required attribute for a ...
I don't know of a compressed version out there but you might want to create a saved Google search to keep yourself updated.
You could submit it to http://www.cdnjs.com and it has a shot being hosted by them for free.
Also, it looks like you could get an uncompressed version from here, http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css.
Google says nothing about that.
The more important things are page structure (correct tags, H1 for headers, sections, etc..), metatags and urls.
The google prefers sites that loads fast, that have good structure and descriptive urls.
You should focus on that.
More info here:
Search engines index pages by URL, and duplicate content is content that's found at more than one URL - see this for more: What is Duplicate Content?
Search engines would only penalize content appearing more than once on the same page if it appears to be spammy or an attempt at keyword stuffing. Incorporating different menus and layout structures would not ...
They're using the lowest common denominator web browser. In other words, they're trying to render reasonably well in older browsers. Because these sites get huge amounts of traffic even a browser with .1% of the browser market can add up to a significant number of users. So in an attempt to support those users they shy away from more ...
Su answered the semantic portion. With regards to SEO, you'll find that the h1 element is given more weight by search engines than other tags. The h2/b/strong tags are given a little more weight than regular text.
Most other tags are pretty much equal, but you should always use the most appropriate tag for the job. Google has recently begun parsing tables ...
LESS comes with a binary (lessc) that lets you precompile your .less files. You use it as such:
$ lessc styles.less > styles.css
But I think most people just use the lessc -w or lessc --watch command to recompile the CSS stylesheet automatically whenever the LESS file is updated. You can also have lessc minify the CSS, e.g. lessc -w -x.
Edit: Just to ...
This is happening because Telex doesn't actually provide a bold weight, which means the browsers synthesize it, and that doesn't always come out so great. (Note as @toscho points out below, this is a general problem, not limited to Google Webfonts or even just font embedding.) WebKit/Safari seems to especially suck at this and in the mobile version you'll ...
Google penalizes for text that is not visible to the users. White text on a white background can be used for keyword stuffing. In that case the keywords are put in the page source where Googlebot indexes them, but the font color makes it so that users don't see it.
Shadow text is not cloaking because the user can see it clearly. There is no risk of ...
Google has no problem with hidden text. They do have a problem with hidden text that is only available to search engines for the manipulation of their rankings.
So unless your hidden text is only there for the search engines to see, you have nothing to worry about. And making your site mobile friendly by removing content is definitely common and acceptable....
The short answer is that email client developers don't have a strong business case to support web standards in their products. Their products are designed and sold as plain text or rich text person-to-person communication tools, not as mass-marketed HTML intrays.
The original web standards movement
The longer answer is that it took a huge effort from some ...
View the source code using a tool like Firebug or Chrome Developer Tools will make that easier to do. You can inspect an element, in this case the background, and see the CSS rules that applies to it.
Use a browser extension like Colorzilla to click and tell you what the color is.
Right click with your mouse on the web page and then click "Inspect Element". Then look to the right under the "Styles" tab (assuming you're using Chrome), and then under where it says:
This is the color (#f8f3ef). For future reference, you may have to do some looking around in the Inspect Element next time and just look ...