Videos Tutoriales

Destination Infinity asked:

What is this CSS and why should some one edit it?

CSS is the acronym for Cascading Style Sheets, and it is a language used to style web pages written in HTML and XHTML. In other words, with CSS stylesheets you can specify the colors, spacing, fonts and other design elements for all or some HTML pages inside a website.

CSS was developed to separate the content of the document (i.e. the information itself) from its presentation. This separation is beneficial both for web publishers and for the end user.

For web publishers, it becomes much easier to create tableless designs and to have a consistent look across different pages. Using just HTML, for example, you would need to specify your fonts, colors and spacing on every single page of your website. Imagine if we were talking about hundreds of pages. It would become time consuming to create all of them with the same design elements, and virtually impossible to make quick layout changes after that.

Using CSS, on the other hand, you would specify all your design elements on the stylesheet (usually called style.css), and the browser would refer to that document when displaying your HTML pages to know what color, fonts and spacing it should use.

As a consequence, it becomes much easier to make design changes, too. You would just need to tweak the CSS stylesheet to change a specific element, say the color of your links or the size of the H1 titles, across all your website pages.

The advantage for the end user, on the other hand, comes from the fact that CSS enables the same page to be displayed in different styles. It becomes possible therefore to have a version of your site for people that will access it on a computer monitor and another version for people that want to print it out.

Now the reader also asked about “why one should edit the CSS.” Well, provided you used a CSS based design, you should edit it whenever you want to make changes on your design. Suppose you have a WordPress blog, and you want to increase the size of your font, or perhaps align your logo slightly to the left.
You would need to log into your control panel, then choose “Design,” then “Theme editor.” and then you would need to edit the style.css file.

That is the stylesheet of your blog, and it controls all the design elements. If your theme was coded properly, it should be easy to understand what code is controlling what element, and within minutes you will be able to navigate around. Sometimes you will need to go with trial and error too, but as long as you keep a backup file, there is nothing wrong with that.

Got the Internet Marketing Newsletter?

---

Q&A: What Is CSS?

Original Post:
QA: What Is CSS?

Etiquetas: copyright, CSS, domain-names, Firefox, Flash, Java, Php, question, recent-articles, stumbleupon, Word

I think that pop-ups are one of the most intrusive and most irritating things that you can encounter when visiting a web site. I simply dislike it when I click on a link to visit a blog or a web site and even before I get to see what the site has to offer, I am already being bombarded with some one sort of advertisement or another.

I am sure that I am not the only one who feels this way but then again, I am also pretty sure that there are a lot of people who disagree. After all, didn’t John Chow and Jeremy Shoemoney – both blog royalty in their own right – use pop-ups to increase their newsletter subscriptions? Let me correct myself – they are using pop-ups to promote their newsletters. So there must be something right about using pop-ups for your site…

Well for those like me who have an aversion to pop-ups, here is what John Chow said about using pop-ups to the advantage of both the blogger AND the reader:

Adding a Lightbox newsletter sign up box is pretty straight forward. I’ve made a screen cast on how to do it. So far, I’ve gotten a few comments about the sign up form but no real complaints because I set the Lightbox to display only once per visitor. In other words, if you’ve been shown the Lightbox, you’ll never see it again unless you delete your cookies.

I set the Lightbox to display only once per visitor – that right there is the key, I believe. Perhaps I will consider using this in the near future. What about you?

Original Post:
Your Blog And Pop-ups

Etiquetas: Access, CSS, design-and-themes, HTML, Image, Java, lightbox, Php, promotion, Resources, travelogger

CSS Image Replacement is a web design technique that calls a logo or specific image via the CSS stylesheet, while hiding some text behind it on the web page.

The normal code for a logo would look like this:

<h1 class="logo">
<img src=”images/logo.jpg” alt=”logo name” />
</h1>


Using the CSS Replacement technique, first you would create a CSS class that would look like this:

h1.logo {
width: 300px; height: 50px;
background: url(images/logo.jpg);
text-indent: -9999px;
}

And then you would call the logo on the web page with the following code:

<h1 class="main-logo">Logo name</h1>

The visual result would be the same in both cases, but with the CSS Image Replacement you would have the “logo name” text hidden in the page.

Why? Why Not?

Why did people started using this technique? Mainly because it makes the logo more accessible. Search bots, for example, will be able to know what it is about (they can read text, but not images).

Why there is some controversy regarding this technique, though, if it makes the web design more accessible? Simply because it can be exploited for SEO purposes. Hidden text is a very old SEO trick, and today most search engines penalize it.

CSS Image Replacement in theory is a legitimate reason to hide text, but it is not always clear if Google and the other search engines are fine with it.

What Does Google Say?

Matt Cutts, who is head of Google’s Web Spam team, once wrote:

If you’re straight-out using CSS to hide text, don’t be surprised if that is called spam. I’m not saying that mouseovers or DHTML text or have-a-logo-but-also-have-text is spam; I answered that last one at a conference when I said “imagine how it would look to a visitor, a competitor, or someone checking out a spam report. If you show your company’s name and it’s Expo Markers instead of an Expo Markers logo, you should be fine. If the text you decide to show is ‘Expo Markers cheap online discount buy online Expo Markers sale …’ then I would be more cautious, because that can look bad.

So according to him it depends on how you use the technique. He does mention that it can be a reason to get your website flagged for spam though.

Who Uses It?

Apart from checking what people are saying about it, it would be nice to see who, among the SEO experts, is actually using the technique, right?

Rand Fishkin from SEOMoz seems to be a big proponent of that. He uses CSS Image Replacement on the logo of his popular website, and he also wrote a post once defending the idea behind it.

Aaron Wall from SEOBook, on the other hand, does not use it.

Wikipedia seems to be using CSS Image Replacement, while Google does not use it on any of its properties.

What Do You Think?

Do you think that CSS Image Replacement could cause SEO problems to a site using it? Obviously we are considering a site using it legitimately, and not abusing it. Let us know what you think and leave a vote on our poll too (RSS readers might need to visit the post to see the poll).

Do you think that CSS Image Replacement can cause SEO problems?
( surveys)

Got the Internet Marketing Newsletter?

---

Is CSS Image Replacement OK for SEO?

Original Post:
Is CSS Image Replacement OK for SEO?

Etiquetas: CSS, Design, domain-names, Flash, Image, image-replacement, Internet, Logo, our-network, Php, Plugins, Seo, stumbleupon, Technique, Word