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

BAM!

[Metabolife]

"including: Ad boxes, Pop-ups, Spinners, and Tabs. Easy ways to show and hide content on the page." Then you just mix it in the bowl and BAM! You have upset customers and lost respect!

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?

Re:IE Script Warnings

[Tx]

For a minute there I thought you meant the bar at the top that says "Microsoft Internet Explorer", makes every website look threatening to me ;)

Re:IE Script Warnings

[eggz128]

My biggest hesitancy in using javascript is the IE warning bar that makes any page containing script look threatening

That only happens on XP post SP2 and when the content you are viewing is on a local drive. Once your page is uploaded -- or if you give it "The mark of the web" (Google for it) on your local drive -- the yellow warning bar no longer appears.

Wow

[aftk2]

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

For me, I really like JavaScript and AJAX when it helps to actually improve the user experience. Dynamic tabs? What's the point? How is it really functionally than just heading to a different page, or using some middleware to control what content is served, after a page reload?

Now, on a website I built, I've used AJAX (shudder) to create a commenting system that doesn't require the user to initially be logged in. The user can visit a page, submit a comment through the form, and if the user isn't logged in, they're presented with the ability to login right then and there, without losing their comment, and without even being shuttled off to a different section of the site, wondering if their comment will post when they're finished. If they don't have an account, they can create one right there. I think those kinds of tricks make remote scripting worthwhile.

Plus, I think adding new widgets to HTML through JavaScript is pretty keen - like the sliders and calendar that Yahoo is making available under the BSD license at their developer area.

Re:Wow

[ultranova]

Now, on a website I built, I've used AJAX (shudder) to create a commenting system that doesn't require the user to initially be logged in. The user can visit a page, submit a comment through the form, and if the user isn't logged in, they're presented with the ability to login right then and there, without losing their comment, and without even being shuttled off to a different section of the site, wondering if their comment will post when they're finished. If they don't have an account, they can create one right there. I think those kinds of tricks make remote scripting worthwhile.

Or you could just have the comment submit form include "username" and "password" fields if the user is not logged in, and if you need to go to another page to create an account, move the comment text around in a hidden field. No reason whatsoever to use user-side scripting, just good old PHP / JSP / ASP / whatever.

The worst page ever.

[caluml]

I wonder - we should have a competition to see who can make the most obnoxious web 2.0 page. Sort of like 1997 web "1" style - "under construction" gifs, flashing text, and scrolling status bars.

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.

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?

Urge to kill...rising...

[crerwin]

Great, instructions for ad-boxes, pop-ups, and spinners (I stopped reading the article before I got to what spinners were, but I'm sure they're obnoxious). This is almost as bad as the fact that Macromedia has a forum on their site dedicated to creating ads. Some people just give humans a bad name.

Next week: Your first phishing page with php and dhtml in just minutes!

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.

Stupid code

[Bogtha]

IBM's JavaScript articles are usually high quality. But this one is awful. It uses invalid code, it doesn't degrade gracefully, it mixes HTML, CSS and JavaScript into the same file instead of separating them, and it breaks when you try and do things as simple as open a link in a new tab.

Don't be fooled by the "senior software engineer with more than 20 years of experience" author, this guy doesn't know the most basic, newbie things. I can only imagine that his 20 years of experience was with something other than HTML, CSS and JavaScript. For example:

• The code doesn't use a doctype line. Not only does that preclude basic QA in the form of validation, but it kicks browsers into "quirks mode", which screws up CSS rendering.
• The code uses href="javascript:...". This is stupid and wrong.
• He just dumps content out wherever he likes, hides it with CSS and then shows it with JavaScript. So much for backwards compatibility. When CSS is not available, you'll just get random bits of content scattered throughout the page.

That's just the tip of the iceberg. This is an exceptionally poor article.

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: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.

Re:Hmmm....

[Intron]

Us begrizzled hippies used the tag for this stuff.

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?@#$?@#$!?