Web 2.0 Recipes With PHP + DHTML

An anonymous reader writes "Take a look at these full simple code examples for dynamic elements for your web apps, including: Ad boxes, Pop-ups, Spinners, and Tabs. Easy ways to show and hide content on the page." From the article: "Incorporating JavaScript into your page makes the page dynamic and creates a more compelling user experience. Users can get more data more quickly, look at information from different aspects, and seamlessly navigate the site -- and the site doesn't have to go back to the server for lots of pages. However, there's also a reason to avoid using JavaScript: browser compatibility. In the early days of flat HTML, Internet Explorer rendered pages differently from Netscape. Those problems were fixed, but when support for CSS was added, new compatibility issues arose. Now most of the CSS issues have been solved, but JavaScript compatibility issues have cropped up. These compatibility problems have no easy solution. You need to weigh the benefit of what the JavaScript is doing against the number of browsers you'll need to test against and support."

Comments

IE Script Warnings

[serutan]

My biggest hesitancy in using javascript is the IE warning bar that makes any page containing script look threatening. It's no problem with Foxfire, but most people still use IE. How many of them would see that warning and just assume something bad is lurking if they click Allow?

Search Engine Visibility

[fragmentate]

If you use JavaScript to render content, you're going to have a really hard time getting indexed by the search engines. If you're an individual, not such a big deal. If you're a company... make sure you have an alternative to pure javascript so that the search engine robots can find the content.

Same goes for Flash...

I can't believe how many companies spent tens of thousands of dollars on a CMS package, or to a "web designer" that rendered them invisible to the search engines.

The article does recommend a fallback for unsupported browsers. Take this to heart, because "GoogleBot" is an unsupported browser.

Re:Search Engine Visibility

[oliderid]

Concerning FLASH a potential explanation is this real life experience.

The CMS was installed and running for weeks but our client was still requesting modifications after modifications on the lay-out. HTML+CSS and nice visual. Nothing really wrong with it. Until that contract, Our lay-outs would only suffer few modifications before being accepted.

Their profile: a medium interior design company.

We were about to lose money. We spent more money on the lay-out than on the tool in itself. What's puzzled me is that Visuals were more important than the content for them. They couldn't care less about the newsletter module or the stat modules or the e-commerce module we have installed for their product. They didn't care that the space dedicated for the text (the content) was around of a paragraph's size. they wanted a beautiful web site. It should be beautiful, not efficient nor informative nor easy to update and google was a "detail" for them (the biggest source of new visits is a "detail")

So...We end up with a bet: Use FLASH, make a lot of fanzy animations, and see what happens.

Our clients were looking like kids to the "standard" animations you can get with the SWISH Max (89 Euro) software. That's probably the best investment I have ever done. 89 Euro have saved a 15K+ contract. They were extremely impressed, they tought that we have all spent a lot of extra hours to please them. In fact It took me with our poor web designer a couple of hours (To select some predined animations). We have also used another product called SWISHPIC to make FLASH pictures galeries...And that's it.

Within a week the Lay-out/web site was accepted.

We told them that witht his new technologies, they will have to pay us to update their picture galeries (no problem), that they would have to type twice the text to make newsletter (no problem), the homepage will be static and the menu too (strange for a CMS, isn't it) again no problem.

They live in another world.
FLASH has been made for customers like them.

How useful is this?

[Eideewt]

Except for the tabs, these all seem like a pretty bad idea. Nobody wants to click all over to get at information that could have just been displayed in the first place.

Oh greaaaat...

[radiotyler]

"...including: Ad boxes, Pop-ups, Spinners, and Tabs. Easy ways to show and hide content on the page."/i>

Did we really need php/dhtml ad boxes and pop-ups? What, the good-ol' fashioned ones weren't annoying enough, or was there a strong demand for pretty dynamic pop-ups? This is one of those things that you see, and read the article and think, "Oh boy, I can't want to see this get implemented poorly and exploited." Anyone care to take any bets on how long it takes before this annoying crap is assulting us in ad format on a wide scale - or is it already?

Re:Oh greaaaat...

[kuzb]

Never worked in internet advertising before?

Trust me, there is a strong demand for this stuff (it is in use already), and advertisers don't care how much it annoys you. In fact, it's been shown in our in-house studies that really annoying ads work better than ones that are not. This means, the more movement it has, and the more noise it makes, the more effective the ad will probably be. The solution? Convince everyone not to click on them. That would make them go away faster than anything.

The fact of the matter really is that people click on this stuff. More than you probably realize.

this is sad...

[Jehlon]

I was hoping for some good code, it is from IBM after all, but its nothing more than crappy javascript from '99. Someone buy this guy the DOM Scripting book (http://www.domscripting.com/) and teach him what the seperation of structure (XHTML), presentation (CSS) and behavior (javascript) is all about.

customer: overloaded variable. ambiguous.

[NotQuiteReal]

Customers who use websites might not like that stuff, but customers who buy websites often love it and ask for it by name, and pay by the hour!

Re:Wow

[ticklemeozmo]

This article's been on the front page for a couple of minutes, with no comments. Perhaps Web 2.0 is tired?

I don't think it's that. It's just.. rehashed drek from other websites with a .ibm.com domain name.

Really, there is NOTHING new in that tutorial that hasn't been done on other beginner websites. Nothing here is really Web 2.0, it's just hiding divs. That was in Javascript a long time ago. There's no backend business, no combining with other technologies. No data being "fetched", no integration with a db, no real css stylings. Just.. "visible" or "hidden".

What the...

[Null Nihils]

*cough* *sputter*

... I'm sorry... this isn't Web 2.0, this is Web 1996... this is... this is... I couldn't even cope with TFA, it was giving me horrible flashbacks from back when I wrote IE-only webpages because I didn't know any better.

Seriously, I'm not trying to troll, I'm genuinely at a loss for words here... how... what...??? ...who are you people, and what have you done with Slashdot?

Re:Cross-browser Flash.

[Anonymous Coward]

Flash!

Ah-aaaargh!

Seriously though. Flash is an awful choice. One the plus side, you get fairly consistent rendering. On the minus side it completely fucks up your entire interface. Middle-click to open in a new tab? Right-click to bookmark? Shift-click to open in a new window? Ctrl-F? Find-as-you-type?

Flash is great if you want to trade in the quality of the end result for ease of development. But I'd rather put a bit of effort in and get a decent interface rather than put little effort in and get crud. Crud that might look pretty, granted, but still a horrible, horrible interface.

Who the fuck wrote this?!

[Anonymous Coward]

In the early days of flat HTML, Internet Explorer rendered pages differently from Netscape. Those problems were fixed, but when support for CSS was added, new compatibility issues arose. Now most of the CSS issues have been solved, but JavaScript compatibility issues have cropped up.

Aaaaaaaaaaaaaahhh. My eyes are bleeding. What the fuck are you talking about?

In the early days of HTML, Internet Explorer did not exist.

Only IE and Netscape render pages differently?!

Most of the CSS issues have been solved?!? What?!

Javascript compatibility problems are new?@#$?@#$!?

Gimmicks vs. Usefullness

[ChrisMitchell]

From a practical point of view the information provided by the site in question is useless (not to take away from the efforts of those involved). The focus really should be on the convenient, useful aggregation of content, while providing ease of use for visitors to the site.

I was roped in by the "wowee zowee" stuff as IE battled Netscape in the 90's. Eventually we all realized that coding to the lowest common denominator was the key to creating a consistent, error free experience for our end users.

The bottom line is to make our sites useful. If done properly the sites can look great, be secure, provide great functionality and be compatible with all platforms. The caveat is that we remain at the mercy of browser quirks, making standards compliance a serious inconvenience for both users and developers.

This is the direction that emerging (AJAX, for example, is not new. It IS emerging) techniques and technologies should be focused on. Such a focus could cause new tricks to enhance compatibility/usefulness across platforms.

Thanks for letting me participate in the discussion!

CSS Issues Have Not Been Solved

[Mikey-San]

"In the early days of flat HTML, Internet Explorer rendered pages differently from Netscape. Those problems were fixed, but when support for CSS was added, new compatibility issues arose. Now most of the CSS issues have been solved, but JavaScript compatibility issues have cropped up."

CSS compatibility issues have been worked around; they have not been "solved", and any quick trip through Position is Everything or A List Apart will show you that. JavaScript compatibility issues have also been around since the first days of JavaScript implementation in browsers.

Neither are going to "be solved", especially if Microsoft have anything to say about it. Right now, as in the past, implementation differences equal a certain degree of lock-in. The truth is that no rendering engine provides a complete, perfect-for-intents-and-purposes CSS2 implementation, and IE is easily at the bottom of that pack. Combined with its field dominance, it is largely responsible for "CSS compatibility issues".

IE 7 isn't going to provide a better rendering engine than Gecko, KHTML/WebCore, or whatever Opera's engine is called; it will simply address a list of the most important problems, such as the infamous box model fuck-ups. There will not be a "kickass" rendering engine in IE 7, and as much as I hate to say it, that's going to keep us in compatibility hack hell for the near future.

Now, if you ask me--and obviously you did, right, lol internet_rant--Microsoft have had more than ample time, people, and resources to produce a rendering engine on-par with Gecko and its peers. But that's not going to be the case. Only one reason for that.

CSS compatibility issues mostly solved? Not even close.

Re:Hmmm....

[mattwarden]

Sure, if you want to keep promoting non-standard garbage. Please try to use the cross-browser, standards-compliant, Web 2.0 version of the blink tag in the future.