I’ve just changed how my custom website portfolio is rendered. You can check it out here. I used to have a Flash portfolio but now have created a Spry portfolio that uses an XML data set that allows you to click a website name to view an image and accordion style information reveal.
Spry is Dreamweaver’s name for AJAX widgets that use JavaScript and add a new level of interactivity to websites. I already have implemented a Spry drop down menu that runs horizontally across the top of the page of my website at www.McCordWeb.com, but was looking for ways to use some of the other cool new Spry features.
The big deal is that Spry with XML data sets can be used in all kinds of ways. By creating your data set with any attributes you want, you can then use cool Spry widgets to return the data on your web pages without using a database. The XML widget acts as an easy “database” that is client-sided versus residing on your server accessed through a browser action call. The difference is the speed and the fact that your browser performs the functions versus calling up information from your website hosting server.
For me, you can click the column header and sort the websites by name or click the pages header and sort the websites by the number of pages. When you click a link in the list, a new image is shown and data under the image changes. If you click the accordion folds under the image you will see additional dataset information specific to that particular website. The folds open and close based on your click activity.
Dreamweaver facilitates the set up of the features, but it is no walk in the park. I ran into a few major problems in regards to syntax and the fact that the xpath.js file did not render HTML in the accordion folds. It worked fine to show text but when I wanted to show a bulleted list only the source code showed. I upgraded my Spry files and still had problems. I eventually loaded a saved copy of the xpath.js file and all was well.
It certainly pays to do significant testing on the new features if you add them as I did. I found that Safari does not show the accordion tab colors when highlighted as IE, Firefox, and Chrome do. But the major browsers do render nearly everything else the same.
With time to customize the style sheet that controls both the accordion panels and list you can style the widgets to complement your site. All in all, I learned quite a bit about Spry implementation and am looking for new ways to integrate more features. My next project is to “properly” skin my Spry drop down menu and move away from the default skin.
If you don’t know what Spry is or AJAX, click in to my custom web design portfolio and check out the implementation.
Quickly realized))))