Welcome to WebmasterWorld Guest from 54.161.110.186

Forum Moderators: open

Message Too Old, No Replies

Opera 7.11

Noticeable changes in support for CSS

     
7:10 pm on May 27, 2003 (gmt 0)

WebmasterWorld Senior Member pageoneresults is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I've been surfing the net these past few days using Opera 7.11. I also have 6.05 loaded which I was using prior to the upgrade to 7.11 Some changes I've noticed thus far in regards to CSS support...

1. Styling of input elements now supported.
2. Cursor elements are now supported.
3. Title attributes now show the word Title: in the tooltip or pop up.

I know these are very basic, but they have always bugged the heck out of me. I'm not too concerned about the word Title: in the tooltip, but the other two have been an ongoing issue. Anyone else seeing any noticeable changes in CSS support? In what ways?

7:32 pm on May 27, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



v7.11 also includes support for generated content. Not even Mozilla offers this.

Mark my words: Generated Content will offer the most cutting edge SEO options yet.

Believe it.

- papabaer

8:17 pm on May 27, 2003 (gmt 0)

WebmasterWorld Senior Member topr8 is a WebmasterWorld Top Contributor of All Time 10+ Year Member



... just when i thought i was swimming

along comes generated content - i'd never even heard of it until just now

... oh joyful evenings ahead

8:19 pm on May 27, 2003 (gmt 0)

WebmasterWorld Senior Member blobfisk is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Like pageoneresults I've recently installed Opera 7.11 and I am very, very impressed. So impressed that I dumped IE6 as my default browser and switched to Opera (sounds like the Remmington shaver ads!). The control it affords me as a serious web surfer is immense.

I would point out the huge advantage of the alternative style sheets that come with this browser, as pointed out by papabaer here [webmasterworld.com] in the CSS forum.


v7.11 also includes support for generated content

Now that is a superbly big step in the right direction.

11:01 pm on May 27, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



CSS2 support is pretty good. IIRC it was papabaer who mentioned somewhere that Opera 7 can even be set to allow scrollbar colors to be modified, just like in IE ;).

The support for <colgroup valign="top"> saves a lot of typing.

Another nice thing is that it supports the innerHTML property. That finally allows for dynamic content.

The best new feature in Opera 7 is the navigation with Shift-arrow, allowing you to jump from hyperlink to hyperlink in a superbly natural way. It's really amazing! It doesn't care about frames, tables, positioned boxes, document flow, or other stuff only relevant to developers. Makes it much easier to surf the web without using that #$% mouse.

11:29 pm on May 27, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Spatial Navigation
Spatial Navigation was first introduced in Opera's iTV business unit. With Opera for iTV on their set-top boxes, TV viewers appreciates how simple it is to use the arrows keys on their remote controls to navigate the electronic program guides or between links in Web pages. Now Opera is bringing the same concept to everyone's desktop computer. By combining the SHIFT and arrow keys on the keyboard, users can easily move to links or any other navigational element on a page.

It really is a very effective means of navigating links.

Opera 7.11 also has quite a bit of support for CSS3

Shrewd move in supporting a number of MSIE propriety features. A number of these, particularly innerHtml and custom/colored scrollbars, were contention areas that held back a number of IE users from making the switch.

1:32 pm on May 28, 2003 (gmt 0)

WebmasterWorld Senior Member blobfisk is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I wonder if we will ever see Google developing a toolbar for anything other than IE? Like Opera or Safari or Mozilla?
9:53 pm on May 28, 2003 (gmt 0)

10+ Year Member



I wonder if we will ever see Google developing a toolbar for anything other than IE? Like Opera or Safari or Mozilla?

Hopefully we will see Google creating one in the future, but for now, Googlebar [googlebar.mozdev.org] does a decent job of emulating much of the toolbar functionality in Mozilla... albeit without PageRank, which still requires firing up IE.

10:01 pm on May 28, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



OK, someone has to go to goole and FORCE THEM to create an opera toolbar...then I can switch.

I'm still on ie6 and opera 6 paid, do I have to pay to upgrade. Is the upgrade path difficult? (uninstall reinstall, I heard Opera 7 was a royal pain).

9:39 am on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member pageoneresults is a WebmasterWorld Top Contributor of All Time 10+ Year Member



papabaer had me too on that Generated Content [w3.org] part. Some very interesting stuff there! ;)
12:30 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You can keep both Opera 7 and Opera 6 as Opera 7 installs into a seperate folder. I'm have v7.11 as my default (irreplaceable!) browser and Opera v6.06b in my stable of "test-browsers."

Generated Content...? Oh YEAH!

12:38 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Opera also handles CSS to define any element as a table. In fact you can use your own tags! This piece of code illustrates the point. Try it and you will see that even though the body has no normal HTML tags, it still outputs correctly to the browser!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html>
<head>

<title>Title</title>

<style>

box {position:absolute; top:10px; left:10px; width:300px; height:248px; padding:10px; border: 1px solid black;}

header {font-size:24px; background-color:#eeeeee; display:block; padding:10px 0px 10px 0px;}

paragraph {font-size:12px; color:#000099; display:block; padding:16px 0px 0px 0px;}

mytable {display:table; color:black; border-collapse:collapse;}

row {display:table-row;}

cell {display:table-cell; padding:2px; border:1px solid black;}

</style>

</head>

<body>

<box>

<header>Custom Tags Trick!</header>

<paragraph>Mozilla 1 and Opera 7 allow you to use your own tags, and apply CSS to them, so they work just like HTML. It's almost like XML!</paragraph>

<paragraph>Note: This does not work with Internet Explorer.</paragraph>

<paragraph>
<mytable>
<row>
<cell>This is a sample</cell>

<cell>table using cells</cell>
</row>
<row>
<cell>yet no standard</cell>
<cell>HTML was used!</cell>
</row>
</mytable>

</paragraph>

</box>

</body>
</html>

12:40 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member nick_w is a WebmasterWorld Top Contributor of All Time 10+ Year Member




Mark my words: Generated Content will offer the most cutting edge SEO options yet.

Ok, I'm a dummy. Spill it PB, I'm in the dark here.....?

Nick

1:18 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Okay... I dangle the carrot just a bit more:

Generated Content - SEO Potential!

The page code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Generated Content - You see it, but it's not really there!</title>
<link rel="stylesheet" title="Widgets" href="generated-content-one.css" type="text/css" media="all" />
<link rel="alternate stylesheet" title="Widget Flavors" href="generated-content-two.css" type="text/css" media="all" />
<link rel="alternate stylesheet" title="Widget Prices" href="generated-content-three.css" type="text/css" media="all" />
</head>

<body>
<h1 id="variable-header"></h1>
<div class="=variable-content-by-stylesheet">
<p id="content-in-stylesheet"></p>
<p id="alternate-stylesheets-rule"></p>
</div>
</body>
</html>

The CSS for stylesheet generated-content-one.css:

#variable-header {content: Amazing Widgets!}
#content-in-stylesheet {content: Information that I DO NOT want on present in my page code as it dilutes my SEO formula and ruins the beauty of my concise and oh so beautifully scripted keyword rich text!;}
#alternate-stylesheets-rule {content: More information I would rather keep off page, but would LOVE my customers to see. You can change me by using ALTERNATE STYLSHEETS. Can you see the potential?;}

And... as you might already guess, the content is changeable via ALTERNATE STYLESHEETS!

Now the above example has no relevant keyword text anywhere in the actual page code, but the real potential is in mixing GENERATED CONTENT with standard content.

Imagine for a moment.... uh, pageone? Are you sitting down? Good... now take a deeeeep breath! There. Okay...

Imagine for a moment (and dream about it from this point on...!) being able to "craft" pages that have highly optimized keyword content present in the page code and uses GENERATED CONTENT to display content that well, for any number of reasons, you choose to keep out of the actual page code. CSS Cloaking? Not really... it's just 'lil ole Generated Content comin' at ya...

Looks like "G" is gonna hafta start parsin' "C"(SS) at some future date...

Intrigued?

- papabaer

1:33 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Do search engines spider CSS for text though? Otherwise your page would come up as blank?

Isn't this what XML is for anyway - dynamically selected content?

1:47 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



First, reality check: can't even begin to consider using Generated Content for the foreseeable future since Opera 7 is the only browser that supports it.

Secondly, it will be best deployed as an "enhancement" though we all know it will be used and abused, depending on the author's scruples and intended purpose. Generated Content will be most effective when used selectively.

This will not replace XML, but will be another tool it the advanced webmaster's toolbox. Another powerful tool.

Yes.. the above example has nothing on page for the spiders to parse... but remember, it is a very basic example. Real usage would see headers and page text (present in the actual HTML) that are finely tuned to a particular SEO target, while less relevant (read: potentially diluting) text, can be served via generated content.

There are MANY potential uses to be considered. Many.

But.. as I said, Only Opera 7 offers support for generated content at this time. Still.. it's nice to plan ahead.

1:53 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Oh.. one more thing. Images can also be served using generated conent. I see some very creative possibilities here...
2:12 pm on May 29, 2003 (gmt 0)

WebmasterWorld Senior Member nick_w is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Thanks PB, I knew the principles but just didnn't understand how you might apply it to SEO. Now I do ;)

----- I'm going to start incorporating some of these 'finer points' in an upcoming project where I expect a good portion of users to have Opera 7. I'll let you know how it pans out!

Thanks again..

Nick

12:43 am on May 30, 2003 (gmt 0)

WebmasterWorld Senior Member pageoneresults is a WebmasterWorld Top Contributor of All Time 10+ Year Member



From another thread and tedster...

Opera doesn't support background images on Pseudo Elements (which a:hover is).

Opera 7 does offer this support.

3:02 am on May 30, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



A few of my personal favorites:

em[title]:hover {
cursor: help;
background: #ffc;
}

pre:hover {
background: #ffd700 url(dido02.jpg) right top no-repeat;
}

code:hover[title] {
text-decoration: blink;
color: #8b0000;
}

Gotta love those attribute selectors!
Now how about :before and :after?

div.main:after {
color: #d6d6d6;
font-size: 0.7em;
}

p:before {
display: block;
text-transform: capitalize;
color: #00008b;
font-weight: bold;
content: counter(chapter,upper-roman) "-" attr(id);
counter-increment: chapter;
}

Now we're gettin' serious!
- papabaer

10:20 pm on Jun 3, 2003 (gmt 0)

WebmasterWorld Senior Member pageoneresults is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Anyone notice how Opera likes to tuck the <li> image right up on the <li> text? How are you addressing this issue? You know, that gap between the bullet and the <li> text. Usually we see questions on how to minimize that gap. Now I have a question on how to expand that gap, at least for Opera! ;)
 

Featured Threads

Hot Threads This Week

Hot Threads This Month