Ajax and Ajax Frameworks

I have been a developer for nearly 20 years and a web developer for about 10 years. Over the years, I have considered creating a blog to share the things I have learned (and am learning) about web design and development, but I never seemed to have the time. When I began learning about web development using Ajax and Ajax Frameworks, I decided to take the time to create this blog.

My intention for this blog is to focus primarily on Ajax Frameworks, but since web development requires knowledge of many technologies, I will occasionally write about things such as CSS, Javascript, PHP, MySQL, Flash, etc.

Lately, I have been using JQuery as my primary Ajax tool. Although I have used other Ajax Frameworks in the past (Dojo Toolkit, Yahoo! User Interface Library, Scriptaculous/Prototype), JQuery has thus far been the easiest to learn. In my first few posts I will discuss some of the JQuery Plugins that I have created. Some of these include: a plugin for Google Maps (jquery.imGoogleMaps), Form validation and submission  (jquery.imValidateForm), Page Populater (jquery.imPagePopulate), and a plugin to create lists (jquery.imList).

While I am still learning about some of the other Ajax Frameworks, I hope that what I have learned will be helpful to others. Just remember, “When you can pull the pebbles from my hand…”

Posts Tagged ‘Photoshop’

I finally completed the redesign/development of my portfolio site (GreenScorpion.com).

This site was my first attempt at grunge design. I used Photoshop brushes that I downloaded from GetBrushes.com to design the site (and followed some tutorials that I found on SixRevisions.com and DesignHard.com).

I developed GreenScorpion.com using Flash/ActionScript 3 and Joomla (and a bit of JQuery).

For the portfolio display, I created a Flash Movie relied heavily upon the gpAS3Library and XML. I then used Joomla to create a component that incorporated the Flash movie. After the Joomla component was completed, I created a Joomla module based upon the component so that the Flash movie could be displayed in a specific area on a page (on the home page).

I need to add more to the site, but the portfolio part is done. I also need do something to create a more consistent color feel between operating systems. I created the design on my Mac, but I did most of the development on Ubuntu. The website is much darker on Ubuntu than on my Mac (I haven’t looked at it on Windows, but I’m sure that there will be a difference as well). But for now, I’m done.

I recently downloaded a great set of  web 2.0 gradients for Photoshop. The ‘Ultimate Web 2.0 Gradients’ can be found here.

In the past, one of the more tedious tasks of web design was creating the thumbnail and large view images for a photogallery. I would open an image in a graphics editor, adjust the size to create a thumbnail image, save, re-adjust the size to create a large view image, and save again. I would repeat these steps for each image of the photogallery. Depending upon the amount of images, creating a web photogallery could take quite a long time.

Quite a few years ago, I began to use Express Thumbnail Creator to create the images for a photogallery. The tool can be used to make web photogalleries, but I only used it to create the thumbnail and large view images. I would select a source folder (or select multiple images), set the width or height for both the thumbnail and large view images, and then let Express Thumbnail Creator generate the images in batch mode. It would reduce each image according to my specifications in a fraction of the time that it took me to manually reduce each image.

Over the last few years, my Mac has become my primary computer. Because Express Thumbnail Creator does not have a version for the Mac, I began to explore other ways to quickly adjust image sizes for a photogallery. Little did I know that Photoshop has the capability of creating a web photogallery.

  1. Open Photoahop and then open all of the images that you want in your photogallery
  2. Select File->Automate->Web Photogallery and the Web Photo Gallery Dialog appears.
  3. You can select a style for the photogallery, but I only use it to adjust the image sizes in bulk, so the default style is fine.
  4. Select the source and destination folders
  5. Under “Options”, select “Large Image” and set the image size and quality. You can also choose whether to constrain the height, width, or both.
  6. Under “Options”, select “Thumbnails” to set the max width.
  7. Click “OK” to create the photogallery.

Easy enough.