Archive for April, 2009

This Week in jQuery UI vol. 7

April 28th, 2009 by Leaskhahcaw

A couple days late to press this week. Friday and Saturday were filled with the first ever JavaScript Conference, JSConf 2009 . What a weekend! jQuery UI was represented by Scott González and myself (Richard Worth).

See the original post: 
This Week in jQuery UI vol. 7

Wordpress mostly used plugins

April 24th, 2009 by admin

Events Manager

A plugin to manage events such as music gigs, art expositions, or job meetings. Events Manager inserts an Events page in the Manage menu of WordPress Administration, to let you insert, modify and delete events. You can describe events specifying their date and location, and also add a few notes. You can then add events list, calendars and description to your blog using a sidebar widget; if you’re web designer you can simply employ the template tags provided by Events Manager.

General Stats

Counts the number of users, categories, posts, comments, pages, links, tags, link-categories, words in posts, words in comments and words in pages.

TimeZoneCalculator

Calculates different times and dates in timezones with respect to daylight saving on basis of utc.

Inline Google Docs

Many people maintain dynamic content on Google Documents or hold volatile data on Google Spreadsheets. These change when collaborators save an update or users submit a form. Occasionally, one may wish to embed the contents of one’s Google Documents or Spreadsheets in a post/page to reflect the latest updates on one’s blog. This plugin seeks to provide this functionality without using an iframe.

Cross References Plugin

With this plugin you can easily set a reference to another post or page in posts und pages and you get all back references automatically listed for every post and page.

Aleph

Aleph implements profiles, paginated and customizable user lists, and some characteristics of social networks, like friends and sets. It supports localization and pretty permalinks. Suggestions, bug reports and fixes (specially security & bug fixes) are welcomed. PHP 5 is required.

Tags: , , ,

Give your Web Interface a Great Look

April 24th, 2009 by admin

Every designer has a set of controls they rely on to communicate an effective UI. This is my library of essential controls.

30_essential_controls

Unfortunately, no single RIA framework offers all 30 of these. So I included a checklist of which frameworks provide each control. If you have an addition or correction, please e-mail me, and I will post an updated framework/control matrix.

ria_frameworks

The frameworks reviewed include: Flex, Laszlo, Silverlight and 12 Ajax frameworks and toolkits: ExtJS, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, SproutCore, LivePipeUI,IT Mill, Backbase.

01. Auto Suggest

auto_recomend

Google’s Auto-Complete

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, IT Mill, Backbase, Silverlight.

02. Carousel (variation as Coverflow)

carousel_ex

Carousel Prototype carousel widget

Supported by: YUI, Prototype/script.aculo.us, JQuery, ITMill, Backbase, iCarousel

coverflow_ex1

Coverflow MediaEvent Service’s Slideflow

Supported by: Flex, Prototype/script.aculo.us, JQuery, MooTools, RadControls for Silverlight

03. Charts & Graphs

graphchart_wesabe

Charts Advanced charting features like hover details, drill down, rolling windows, toggle views…

Supported by: Flex, Laszlo, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery (SWF/Chart), MooTools, MochaUI, Backbase, SilverLight, AnyChart, Dundas, JPowered, JFreeChart, OpenFlashCharts, Flot, Plotr, PlotKit, WebFX, AjaxMcGraph, Measure Map.

04. Collapsible Panels (accordion, disclosure triangles, slide drawer)

collapsible_accordion

Accordion Mutually exclusive collapsible panels showing status

disclosure_arrows_mint

Disclosure arrows Mint.com uses disclosure arrows for summarizing and displaying accounts

collapsible_sliding_fluxiom

Sliding panel Fluxiom uses a sliding panel instead of a dialog to show the selected photo’s details

Supported by: Flex, Laszlo, ExtJs (called panels), Dojo, Google Web Toolkit (disclosure panel), Prototype/script.aculo.us (accordion), JQuery, MooTools (accordion), MochaUI (split pane), SproutCore (split pane), IT Mill, Backbase (accordion), RadControls for Silverlight (PanelBar and Sliding Panel).

05. Combobox (select multiple, alternate list box UI, editable)

combobox_multiselect_livepipe1

Select multiple LivePipe UI’s control takes less space and is easier to scan than an ocean of checkboxes

combobox_multiselect_ex1

Alternate listbox UI Best alternative for multi select in small spaces, clearly displays all selections, and provides an easy way to edit

Supported by: Alternate Listbox UI, LivePipeUI

combobox_editable1

Editable combobox Editable combobox allows for lookup and/or text entry

Supported by: Flex, Laszlo, ExtJs, Prototype/script.aculo.us, JQuery, MooTools (MUI.ComboBox), IT Mill, Backbase, RadControls for Silverlight.

06. Date Picker/Calendar (select range, date/time combination)

datepicker_jquery

Advanced calendar Select a range, discontinuous dates, or exclude a certain day

date_time_picker_ex3

Date/time picker Select a date and time in a single control

Supported by: Flex, Laszlo, ExtJS, Dojo, YUI, JQuery, Scal built on Prototype, MooTools, MochUI, IT Mill, Backbase, Silverlight, dhtmlxCalendar, keyboard accessible calendar, more examples on Woork

07. Dialogs (modal, light weight, lightbox)

dialog_modal1

Modal dialog Mint offers a modal for adding an account

dialog_modeless

Modeless dialog Google Maps provides a modeless dialog for getting directions

dialog_lightbox_jquery

Lightbox JQuery provides a lightbox plugin, a modal dialog that blacks out the parent screen

Supported by: Flex(modal), Laszlo (modal and modeless), ExtJs (modal), Dojo (modal and lightbox), YUI( listed under Containers: Modal and Overlay), Prototype/script.aculo.us, JQuery (modal, modeless, lightbox) , SproutCore (has a really nice example of each under ‘panes’), MooTools, MochaUI, LivePipe UI, IT Mill, Backbase (modal and modeless window), Silverlight (modal and lightbox).

08. Docking

ria_frameworks

Dockable menu Campaign Manager by eyeblaster offers a pinned/unpinned menu for navigating between campaigns

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, LivePipe UI, Backbase, Silverlight.

09. Drag & Drop Manager

drag_drop_extjsdrag_drop_extjs_drop

Drag and drop ExtJS photo organizer demo

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, LivePipe UI, Backbase, Silverlight.

10. Dynamic Filter

dynamic_filter_flex

Dynamic table filtering Flex offers a filter feature that dynamically filters the results while the user types, demo

dynamic_filter_rico
Dynamic column filtering Dynamic filtering can be implemented at the column level providing advanced filtering capabilities
Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, JQuery, IT Mill, Backbase, Silverlight, Open Rico

11. Feedback/ Status

ria_frameworks

Feedback Gmail status message

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, LivePipe UI, IT Mill, Backbase, Silverlight

12. Fisheye/ Spotlight

fisheye_alpslab

Fisheye Apslab Fish-eye Lense

Apply this concept to a dense chart or map for a truly useful feature.

Supported by: Flex, ExtJs (spotlight), Dojo , Prototype/script.aculo.us, JQuery, MooTools, MochaUI, Silverlight

13. Gauges (and other visual progress or status indicators)

gauge_citibank
ria_frameworks

Gauge Thermometer gauge in RadControls for Silverlight

Gauges provide a concise visual summary in heads-up-display or other goal directed designs

Supported by: Flex (various plug-ins and Flex Charting), ExtJs (combined with GWT), Dojo, Google Web Toolkit, Prototype/script.aculo.us, JQuery (SWF/Gauge), MooTools, MochaUI, Silverlight, AnyChart, Dundas

14. Help Tip/ Quick Tip

help_tip1

Quick Tip Picnik engages new users with some helpful advice

More than just a tooltip, these are fully formatted messages typically presented in a modeless dialog.

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI (use overlay container), Google Web Toolkit (use popup panel), Prototype/script.aculo.us, JQuery, MooTools, MochaUI, LivePipe UI (use window control), IT Mill, Backbase, Silverlight

15. Hot Keys

ria_frameworks

Hot keys Balsamiq Mockups has hot keys for frequent actions

Supported by: Flex, Laszlo, Mochui, LivePipe UI, IT Mill, Backbase, Silverlight

16. Hover Action

ria_frameworks

Hover action Instead of cluttering the screen with redundant actions, Basecamp reveals the edit and delete actions onHover

Supported by: Flex, Laszlo, ExtJs, YUI, JQuery, MooTools, MochaUI, Backbase, Silverlight, good post by Bill on hover actions and missed moments

17. Hover Detail

ria_frameworks

Hover detail Netflix hover details

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI (overlay), Prototype/script.aculo.us, JQuery, MooTools (smart hover box), IT Mill, Silverlight

18. Inline Edit

inline_edit_flickr

Inline edit Instead of showing form fields in pages that are usually read (not edited), Flickr provides inline editing

Supported by: Flex (only in the grid), Laszlo (only in the grid), ExtJs, Dojo, YUI, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, IT Mill, Backbase (only in the grid), Silverlight (only in the grid)

19. Progress Indicator/ Loading

loading_picnik

Progress indicator Picnik loading indicator

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, LivePipe UI, IT Mill, Backbase, Silverlight

20. Rating

rating_graffletopia

Star rating Graffletopia offers one-click star ratings for shared stencils

Supported by: ExtJs extension, Dojo widget, Starbox for Prototype/script.aculo.us, JQuery, MooTools , MochaUI

21. Record Locator/ Paginator

record_locator_lls

Record locator Like the control in PDF Viewer, the record locator lets you navigate through records in a dataset or skip to a specific record by name

paginator_yahoo

Paginator Typically used for paging through tables, screens, or other result sets

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, LivePipe UI, Backbase, Silverlight

22. Slider

slider_innography

Slider Innography provides sliders in their quick filter for refining results displayed on a chart

Supported by: Flex, Laszlo, ExtJs, Dojo, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, IT Mill, Backbase, RadControls for Silverlight

23. Scoped Search

scoped_search_vimeo

Scoped search Like iTunes, allows for the optional selection of a category before entering free form search text, example from Vimeo’s help page

Supported by: custom css and js code, example at Janko at warp speed, RadControls for Silverlight

24. Sparklines

sparklines_retailmenot_goodcouponsparklines_google_analytics

Sparklines Great way to show the “shape” or trend of data is a small space, examples from RetailMeNot.com and Google Analytics. Created by Edward Tufte.

Supported by: Nuby on Rails, Any Chart, JQuery plugin, Flex , and two more ones for Flex at Microcharts and Birdeye, Google API, Visifire for Silverlight

25. Table/ Data Grid ( scrolling, editable, grouped)

table_scrolling_extjs1

Scrolling table Endless scrolling, no paging, just like a desktop app, example from ExtJS

table_cell_editing_blist1

Editable table Blist offers inline cell editing in their products. Best practice, highlight the selected row, and only display an editor in the selected cell. Don’t forget to accomodate keyboard navigation.

table_grouping1

Tree table Grouping by row, displays as a tree table, example from ExtJS

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Backbase, Silverlight

26. Toolbar

toolbar_sugarsynctoolbar_flickr1

Toolbar Provide actions in proximity to the object, examples from SugarSync and Flickr

Supported by: Flex, Laszlo, ExtJs, Dojo, YUI, Google Web Toolkit, Prototype/script.aculo.us, JQuery, MooTools, MochaUI, Backbase, RadControls for Silverlight

27. Vertical Browser

vertical_browser_apple

Vertical browser Apple’s vertical browser for exploring Dashboard widgets

Supported by: custom code of multiple list boxes

28. View Toggle (buttons, button bar)

view_toggle2

Toggle buttons Separate buttons for switching between graph and grid views Campaign Manager by eyeblaster

view_toggle_paypal

Toggle button bar Single button bar for capturing binary choices

Supported by: Flex, Laszlo, Dojo, YUI, JQuery, MooTools, MochaUI, Backbase, Silverlight

29. WYSIWYG Editor/ Rich Text Editor

wysiwyg_wordpress

Rich text editor WordPress offers a a WYSIWYG editor for blogging

Supported by: Flex, Laszlo, Dojo, YUI, Google Web Toolkit, JQuery, MooTools, MochaUI, IT Mill, Backbase, Silverlight

30. Zoom

zoom_jqzoom

Zoom Zoom in on a certain spot, example from jQZoom

Supported by: Flex, Laszlo, ExtJs (spotlight), Prototype/script.aculo.us (zOOm), JQuery, MooTools (Joomla), MochaUI, Silverlight (silverZoom)

Bonus- Desktop Style Container

desktop_container_otherinbox

Desktop style app OtherInbox built with SproutCore

A desktop style container isn’t actually a control, but frequently required when developing enterprise software and productivity web applications. Many of the frameworks that offer this feature include built in windows management, split panels, and fluid layout.

Supported by: Flex, Laszlo, ExtJs, YUI, JQuery, MochaUI, Backbase, SproutCore, Silverlight

Send me any corrections and/or additions, and I will upload an updated control/framework matrix.

Thanks to Joonas Lehtinen of IT Mill, Ryan Johnson of LivePipe, and Peter Svensson who is a Dojo expert, and Darren James, co-author of Ajax in Action.

Update* Cody Lindley at jQuery provided a comprehensive list with links to code for jQuery support for all 30 controls.

Tags: , , ,

Web Design Terms

April 21st, 2009 by admin
A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

Access (Microsoft)

Microsoft Access is a simple database application and format developed by Microsoft, and is commonly included in their Office suite of applications. Although not as commonly used in web environments as MYSQL or MSSQL, Access is used by some in conjunction with smaller database-dependent websites.

Admin/Administrator

It is necessary for networks and networked systems to be constantly managed and maintained, and this is what administrators do. This is an individual responsible for managing, maintaining, troubleshooting, and often times supporting aspects of an infrastructure, such as systems administrators, database administrators, network administrators, etc.

Affiliate Marketing

This is an arrangement whereby individuals, “affiliates,” promote products and services of another company, and are compensated for successes, be they measured in clicks, sales, etc. This is a little different from a reseller, where the individual acts as the front for the products and services. Affiliates simply refer customers.

Alias

This is a name that points to resource with a different name. In the context of email, an alias is an email address which, when it receives email, directs that mail to an email account on the same domain with a different address. In the context of domain names, a domain alias is a domain name that points to a website at a different address, such as mydomain.net pulling up mydomain.com. mydomain.net would be an alias of mydomain.com.

Anonymous FTP

An FTP feature which allows users to download files anonymously, without having to establish or login to an FTP account. This is commonly used to distribute files to a broad base of visitors such as software updates or documents.

Apache

A popular, versatile and very stable open source web server application. Apache is the de facto standard in web server software, and is the most widely used today.

ASP (Active Server Pages)

Active Server Pages, a server-side scripting language developed by Microsoft and supported by Microsoft’s IIS web server software, enables the development of dynamic and database-driven websites. The web server processes the ASP pages, and renders the output as HTML which is then sent to the visitor’s browser.

ASP Hosting

Web hosting that supports ASP, a server-side scripting language developed by Microsoft. In essence, this means Windows/IIS hosting, the required platform for hosting ASP pages.

Autoresponder

This is an email feature that is commonly used when a recipient will not be available for a period of time, or to confirm to a sender that their email was received by the system. For instance, if you were going to be on vacation for a month, you might setup an autoresponder with a message indicating your absence. When mail is sent to you, the mail is delivered as normal, but in addition, an email is sent back to the sender by the autoresponder, the message being whatever was specified when the autoresponder was setup. Once you return, you would simply turn off the autoresponder.

Top of the page
B

Backups

This is the practice of making a copy of the content of a server’s hard disks to a safe external resource, such as another server or a tape backup system. This is vital for disaster recovery, and should be performed regularly.

Bandwidth

This is the “speed limit” of a particular data pipeline, such as the data connections that connect a web server to the internet. Different types of data connections, such as T1s and OC48s, support different amounts of bandwidth. The greater the amount of bandwidth available, the more data can be moved across the connection per time frame, generally measured in seconds.

Billing Cycle

This is the period for which payment of services is made, usually in advance of the services. For instance, if you were to pay for 1 year of hosting, on a recurring basis, then you have a billing cycle of 1 year.

Blog

This is common parlance for weblog, a kind of website or component within a website whereby an individual may post journal entries which are then viewable by visitors to the site, ordered from the most recent to the eldest entries.

Browser

This is kind of client software with which a user can access resources on the internet, and which renders the markup language as the web page seen by the user. Although all browsers perform the same basic functions, additional capabilities vary widely from browser to browser. The most common browsers in use today are Microsoft’s Internet Explorer, Netscape, Mozilla’s FireFox, and the much respected Opera. Safari for the Macintosh has also quickly become a favorite amongst Apple users.

Business Hosting

This is hosting that provides for a range of features and a level of performance and reliability that is suitable for commercial websites, such as online stores or corporate sites.

Top of the page
C

CGI (Common Gateway Interface)

This enables the passage of data between a web server and a CGI program, commonly referred to as a script. This expands the capabilities of a website significantly, permitting HTML pages other applications to interact, and perform functions that HTML is incapable of on its own.

Chat

This generally refers to a service on the internet wherein people may communicate in real-time, in virtual chat rooms, using nicknames to identify themselves. These have waned in popularity over the years, but are still commonly used throughout the internet.

CMS (Content Management System)

This is a kind of web application which allows for high-functionality sites with minimal effort needed to set them up. These are also known as “portals” and are database-driven applications usually developed in PHP or ASP. Popular examples of these are Joomla, Drupal, e107, PHPNuke, and Movable Type.

Cold Fusion Hosting

Web hosting that supports the parsing of Cold Fusion code, a server side scripting language originally developed by Allaire, and currently owned by Adobe through their acquisition of Macromedia.

Colocated Hosting

Colocation is the practice of leasing space at a facility which provides connectivity and security, for the placement of ones own equipment, such as a web server or mail server. This is similar to dedicated hosting, except that instead of leasing the server as well as space in the facility, you provide the equipment to be housed at the facility.

Cookie

This is a tool used to store important information about a client for subsequent reference by a web server. An example of this might be a weather site. If you go to the site, and provide your zip code so as to see the weather in your area, the web server might place a cookie in your browser with this information stored in it, and when you visit the weather site again, the server will attempt to access the cookie, and if it is able, will bypass your having to provide your zip code, and take you straight to the weather for your area.

CSS (Cascading Style Sheets)

Cascading style sheets are essentially repositories of directives which, in the absence of explicitly coded html variables, apply the qualities specified in the CSS file to all tags used in the linked-from HTML document. For example, if you have a CSS file that specifies that all H1 tags adopt a particular font, color, size, etc., any use of the H1 tag will adopt these settings from the CSS file, keeping everything clean and centralized. This makes site-wide changes to, say, text color, very simple to implement.

Top of the page
D

Data Center

These are facilities built and tooled specifically for the purpose of housing equipment that must maintain high-bandwidth connectivity to the internet, and experience a minimum of downtime for such reasons as power failure. Security measures are employed, and network and systems administrators are on hand to attend to any issues that might arise immediately.

Data Transfer

This is the sum total of data transferred through a particular account on a per-month basis. When a web page or a file, or any form of data, is accessed with a browser, that data must be transferred to the visitor’s machine before it can be used or viewed in a browser. The movement of this data constitutes bandwidth usage. Data transfer is currently measured in megabytes or gigabytes, and in some cases terabytes, per month.

Database

This is a structured collection of information, similar in form to a spreadsheet. In the web world, databases are used to drive online stores, search engines, bulletin boards, content management systems, and other dynamic web applications. Databases come in a variety of flavors, such as MySQL, MS SQL, Access, and PostgreSQL.

Dedicated Hosting

A form of hosting whereby a customer leases a server from a dedicated hosting provider, the use of which is exclusively that of the customer. This is the opposite of shared hosting, wherein multiple websites of multiple difference customers, many times numbering in the hundreds, are hosted on a single server. Multiple sites may be hosted on a dedicated server, but the server itself is completely under the control of a single customer, however they choose to use it.

Dedicated IP

An IP address which is assigned to one specific resource, such as a website or home computer, which does not change, and which is not shared amongst multiple resources, such as multiple websites. Dedicated IPs are necessary for certain features, such as SSL, to function properly. Due to the finite number of IP addresses currently available, dedicated IPs in a shared hosting environment is considered a premium feature.

Disk Space

The amount of hard drive space on a server that is allotted to a particular hosting account, and generally includes email storage and database storage as well as web storage.

DNS (Domain Name System)

Analogous to a phone book, which resolves names to phone numbers, DNS is a distributed directory system which allows for the resolution of hostnames/domain names to IP addresses. Correct DNS settings are necessary for services dependant on hostnames on the internet to function.

Domain Name

These are human-friendly alphanumeric addresses that are resolved to the IP address of the resource the domain name serves. Domain names consist of 2 distinct parts: the top level domain and the second level domain. Using domain.com as an example, the top level domain would be com, whereas the second level domain is would be domain. Together, these parts are known as a “domain name”

Domain Name Registration

In order for a domain to be functional, it must first be registered. Domain name registration occurs through what is called a registrar. Many hosting companies have the capacity to register domain names, often through a reseller account with a registrar, sometimes the host themselves are a registrar, although this is quite rare. Registration is paid for in 1 year increments, in advance. Registration must be kept current by renewing the domain names prior to their expiration in order that the domain remains functional.

Domain Parking

Registered domain names must have at least 2 name servers provided for it at the time of registration. Often times, the domain is registered prior to hosting being setup for it. In these instances an individual will “park” the domain on a par of temporary nameservers, which serve as placeholders until real nameserver information is available to replace them with.

DoS (Denial of Service) Attack

This is the act of preventing access to a service by congesting, through whatever means, the data connections involved, usually on the hosting company’s network. These actions are considered computer crime, and are illegal.

DreamWeaver

This is the web development product created by MacroMedia, and now owned by Adobe. DreamWeaver is considered one of the best html editors on the market, and has become a popular development environment amongst webmasters. Nothing special is needed to use DreamWeaver to build and publish websites.

Top of the page
E

Ecommerce Hosting

A hosting account that provides for those functionalities required for commercial websites, such as SSL support, database access, and often times even the shopping cart software is included in the hosting account’s feature set. It also implies escalated levels of performance and reliability.

Email Client

This is an application which is specifically designed to access remote mail servers (and often news servers as well), retrieve mail from them, and manipulate that mail. Popular examples of these are Microsoft Outlook, Thunderbird, and Eudora. Mail clients must be configured to access particular email accounts.

Email Forwarding

This is an email address that points to an email address elsewhere, usually on a different domain name altogether. For example, a forward setup as user@mydomain.com might forward all mail sent to it to user@aol.com. The forward will not store any mail, but will only forward received mail to the remote address.

Email Hosting

In its purest form, this refers to a form of hosting specifically geared towards email. Although there are many companies who provide email hosting, independent of web hosting, the vast majority of users on the internet use email accounts provided by their ISP or web host provider. Given that virtually all web hosts provide email capabilities within their web hosting accounts, email hosting is usually referred to in the sense of a subsidiary function of web hosting.

Top of the page
F

Firewall

A security measure whereby all IP traffic can be managed in as much detail as is necessary. This is used to disallow unauthorized kinds of traffic, traffic from specific IP addresses, or any other such form of traffic. This can be thought of as a virtual security gate that controls all traffic into, and even out of, a network.

Flash

This is a multimedia format and application created by MacroMedia, now owned by Adobe. Flash allows a person to create highly functional and visually appealing web content, and has become the standard format for such content. It is known to be rather difficult to learn, but its capabilities are impressive. It provides capabilities for audio, video, streaming, and vector animations, and is able to communicate with PHP and with databases, allowing for dynamic content.

FrontPage

This is a web design and development application developed by Microsoft, and distributed as both a standalone application and as a component in Microsoft’s Office suite of applications. Although FrontPage can work just fine on its own as an HTML editor, many of its functions require the presence of FrontPage Server Extensions on the web server.

FrontPage Hosting

A web hosting account which has FrontPage server extensions installed, allowing for the functionality of many of FrontPage’s advanced features. It is an extension of standard hosting, rather than a completely different kind of hosting in and of itself.

FrontPage Server Extensions

A suite of server add-ons which allow FrontPage to communicate with the web server in a manner necessary for the proprietary features of FrontPage to function. These are not necessary in order to use FrontPage, but many of FrontPage’s features rely on them, such as FrontPage forms.

FTP (File Transfer Protocol)

An acronym for File Transfer Protocol, this is the standard protocol used to transfer files to and from machines on the internet. This is distinct from, say HTTP, which is another protocol altogether. Although some browsers, such as Microsoft Internet Explorer, have built in FTP capabilities, the most common, and most functional, way to use FTP is by way of an FTP client, such as WS_FTP, CuteFTP, or even a command line.

Top of the page
G

Guestbook

This is a small web application with which visitors to a site have the option to leave small notes, including some form of identification, letting other visitors know that they had been there.

Top of the page
H

Hosting

The provision of infrastructure necessary to make services available to remote users. This includes web hosting for websites, email hosting for email, database hosting for databases, and so forth. The term “hosting” does not solely refer to web hosting, although the term is commonly used this way. You can think of a mall, for instance, as a “store host.”

HTML (HyperText Markup Language)

This is the standard markup language used in web pages. HTML contains the text of a web page, as well as an extensive range of code which instructs the browser as to how the web page should be displayed, such as the color of the text, the background image to be used, tables, hyperlinks, and the like.

HTTP (HyperText Transport Protocol)

HTTP is the standard protocol used to transfer documents, particularly HTML documents, on the world-wide-web. This is the protocol used to access and, thus view, web pages in your browser, for instance.

Top of the page
I

IIS (Internet Information Services)

IIS is Microsoft’s proprietary web server software, and is included with their Windows NT-based operating systems. It is free, and is required for the use of ASP code in a website. It also provides FTP functionality, and an easy-to-use management console for administrators.

IMAP (currently Internet Message Access Protocol)

This is a remote mail box protocol, which is much more advanced than the much more common POP method of retrieving email. It provides advanced capabilities and a wealth of functions not supported by POP, but has not caught on yet with most internet users.

IP Address

This is a numeric address which identifies a particular resource on an IP network such as the internet. The format of an IP address is xxx.xxx.xxx.xxx, with each xxx representing a number between 1 and 254, the decimal representations of the underlying 8-bit “octets.” For a resource to be accessible on the internet, it must have an IP address assigned to it, and no 2 devices can have the same publicly accessible IP address.

ISP (Internet Service Provider)

ISPs are entities who provide points of access to the internet. These may be universities, corporations, or any other entity. The means of connecting to an ISP include dial-up through a modem, broadband access via cable or DSL, or corporate networks with internet connectivity. Web hosting companies are entirely different from ISPs.

Top of the page
J

Java

Created by Sun Microsystems, this is a programming language similar to C and C++. It is platform-independent, and is used to build “applets,” small mini-programs that run within a web page client-side, or “servlets,” applications that run server-side and pass information to the browser through the web site.

JavaScript

This is a scripting language that draws influence from C programming language, and is commonly used to incorporate advanced client-side functionality into web pages, such as animations, forms, and roll-over effects.

Top of the page
L

Linux Hosting

This is web hosting that is hosted on a Linux-based server. Linux is an open-source operating system which is based on Unix, and is available in a wide variety of flavors commonly referred to as “distributions.”

Log Analyzer

An application which reviews the contents of log files, and arranges that data in a way that can be easily read and understood by humans. This usually involves graphs and charts to assist in making the information accusable, and covers everything from when visitors came to a website, what they did while they were there, what kind of browser they were using, the IP address they visited from, and so forth.

Log File

A text file in which entries are placed whenever any web server activity, such as a visitor to a web page, occurs, including information about the visit and the visitor.

Top of the page
M

MSSQL (MicroSoft Structured Query Language)

This is Microsoft’s SQL database system, and is commonly used in conjunction with ASP and Cold Fusion sites. It is a proprietary system, and must be run on a Windows platform. MS SQL is more commonly used in business and enterprise environments than on the internet, but its footprint on the web is respectable.

Multi-Domain Hosting

A kind of hosting which allows multiple independent domains, pointing to separate web sites with completely separate file structures, to be hosted in one single hosting account. With better hosting companies, each of these domains is provided its own dedicated IP address as well, which is considered a prerequisite for “true” multi-domain hosting.

MySQL

This is a database management system, and is arguably the most commonly used database model on the internet. It is free, and has earned a reputation for performance, reliability, and ease of use.

Top of the page
N

.NET Hosting (”dot net”)

Hosting in which sites build on .NET, an application framework developed by Microsoft, can function. This generally means Windows hosting with IIS, which is necessary for ASP and .NET code to be processed.

Top of the page
O

ODBC (Open Database Connectivity)

This is an API that allows the usage of SQL queries with data sources such as Access. It uses drivers for particular data sources to communicate and interact with them. It is necessary, for instance, to use an ODBC connection to communicate with an Access database from a website hosted on a Windows platform.

Top of the page
P

Payment Gateway

This is an application service provider which is comparable to a point of sale system, only virtual. These involve the encryption of sensitive information like credit card information, the authorization of payments, and the handling of transactions between the issuing and acquiring banks involved. A payment gateway is essential to processing credit card payments through an online store.

PHP (Hypertext PreProcessor)

PHP is a server-side scripting language. Like ASP and Cold Fusion, its instructions are interpreted by the web server, which renders the output as HTML which is then sent to the visitor’s browser for rendering. PHP allows for dynamic sites capable of communicating with databases, and extended capabilities not possible with HTML alone.

PHP Hosting

Web hosting capable of parsing PHP code. Virtually all hosting these days provides this capability.

POP (Post Office Protocol)

This is the standard protocol used by mail clients to connect to and retrieve mail from mail servers. The current version is 3, and is sometimes referred to as POP3.

PostgreSQL

This is a very powerful, but still rather obscure, database system which is free, and which is considered a free alternative to larger relational database systems like Oracle.

Top of the page
R

Raw Logs

Also known as server logs, these are records of web server activity which can be used for such purposes as troubleshooting or analyzing traffic.

Registrar

This is an entity which to sells, renews, and manages domain name registrations. These are the ultimate agencies for domain registration, and are often assisted in their efforts by resellers, who are not, in and of themselves, registrars, and who lack many of the capabilities of the registrar itself.

Reseller Hosting

This is a scenario whereby one entity sells hosting that resides in the infrastructure of another. This often involves rebranding, and relates more to the reseller/resold relationship than to the customer/reseller relationship. Customers are usually unaware that they are hosting through a reseller.

Top of the page
S

Server

A computer or piece of software which provides some sort of service to other computers, referred to as clients. For example, a DHCP server is a server which provides dynamic IP addresses to client machines on request. The term “server” can be used to describe a wide range of functions, but the core idea is that the server provides a central go-to point for a service, or services, that other machines depend on, even other servers.

Setup Fee

A one-time fee, usually charged in conjunction with the initial hosting fees, which is intended to cover the overhead involved in the establishment of a hosting account.

Shared Hosting

A form of hosting wherein multiple clients, and thus multiple websites, are all hosted on a single server. This is distinct from dedicated hosting, where multiple websites may be present, but where the server itself is under the control and authority of a single client. If dedicated hosting is like buying a mansion, shared hosting is like renting an apartment.

Shared IP

An IP address which is assigned to multiple resources (domain names). Where an IP address is shared, the web server is responsible for determining which resource (web site) assigned to that IP is being requested, and serving that resource to the visitor. Resources on a shared IP must be requested by URL, as this is what tells the web server which of the resources at that IP is being requested.

Shell Accounts

These are accounts which allow an individual to connect to a remote machine, such as a server, by way of a Unix shell, a command line interface with which a user can run commands on the remote machine.

Shopping Cart

This is a kind of software which, in conjunction with a database, allows products to be browsed and ordered online, and usually involves the implementation of a 3rd party payment gateway to complete credit card transactions. If you intend to sell products online, you will most likely use a shopping cart to facilitate this.

Site Monitoring

A service that monitors a web server on a regular basis, usually a cycle of a few minutes, and alerts specified individuals of any problems that are encountered.

SMTP (Simple Mail Transfer Protocol)

This is the protocol used to distribute electronic mail on the Internet. SMTP provides a standard for how the sending and receiving computers should interact.

SPAM

This is slang for junk email, also known as unsolicited email. These are emails that are sent to large numbers of recipients trying to sell them on everything from weight loss products to loans, and are often associated with scams. Spam has become a big problem on the internet, and most ISPs and web hosts are constantly taking measures to reduce the amount of spam that is received by their customers, or passed through their network.

SSH (Secure SHell)

This is secure shell access, a secure way of connecting a client machine and a server. It incorporates, authentication, encryption, and message authentication, and can be used for more than just shell access.

SSI (Server Side Includes)

These are blocks of code, usually HTML, which are stored in independent files, and which can be called into a document, allowing for the centralization of commonly used code, such as for the header and footer used in all pages on a website. This is very convenient, especially for sites which reuse the came code amongst a number of different pages.

SSL (Secured Sockets Layer)

This is a protocol that provides for encryption and authentication of traffic between a web server and a client’s machine. This requires the use of an SSL certificate, which is issued by a SSL authority, such as Verisign or Thawte. This is a necessary tool whenever sensitive information, such as credit card information, is to be transmitted across the internet.

Streaming (Media)

Media streaming is a technique whereby a media file, be it audio or video, is played back on a client’s machine while the file is being downloaded. Advanced streaming services offer options such as providing a media stream that is appropriate for the visitor’s bandwidth, providing a media stream to a large number of visitors at the same time, real-time content, and the like.

Top of the page
T

TCP/IP (Transmission Control Protocol / Internet Protocol)

This is a suite of protocols used to facilitate services on an IP-based network, such as the internet.

Top of the page
U

UNIX

A server-oriented multitasking and multi-user operating system, with a reputation for stability and versatility. It is the most common operating system for servers on the Internet, and is available in a vast range of flavors, from the Linux family of operating systems to FreeBSD.

UNIX Hosting

Web hosting that is housed on a UNIX-based server, such as Linux or FreeBSD, and is usually facilitated by the Apache web server software. This is easily the most popular and commonplace platform for web servers and web hosting, the primary alternative being Windows based hosting.

URL (Uniform Resource Locator)

The standard addressing format used for HTTP requests. URLs resolve the protocol to be used for the request, the IP address of the host to which the request is to be made, and the location on that host where the resource is located.

Unlimited Bandwidth

This is a policy wherein additional charges are not incurred on account of “excessive” bandwidth usage. Technically, there is no such thing as “unlimited” bandwidth, and in practical terms simply indicates that there is not a hard limit on bandwidth usage, rather an understanding that reasonable bandwidth usage is always permitted.

Uptime Guarantee

A guarantee that provides for compensation in the event that the uptime of a server does not meet a predefined percentage of time in a set timeframe, usually on a per month basis. Uptime guarantees of 99.9% per month have become common.

Top of the page
V

VBScript

This is a scripting language based loosely on Visual Basic, and is developed by Microsoft. Its functionality in a web environment is dependant upon either an ASP engine or the Windows Scripting Host, and must be used on a Windows hosting platform.

Top of the page
W

Web Hosting

This is the service whereby the infrastructure and connectivity necessary for a website to be available on the internet is leased to customers by a hosting company.

Web Hosting Control Panel

A web interface that enables the management and control of one’s web hosting account. These control panels have become an indispensable tool for hosting customers, and are now offered by the vast majority of web hosts.

Weblog

Also known informally as a “blog,” this is a kind of website or component within a website whereby an individual may post journal entries which are then viewable by visitors to the site, ordered from the most recent to the eldest entries.

Webmaster

This is an individual who builds, publishes, maintains, and updates websites. Webmasters can be thought of as website administrators, as opposed to network and systems administrators, who handle the infrastructure behind the website. Webmasters do not necessarily handle all of the processes involved in the creation and maintenance of a website, and may act more along the lines of a manager than a developer or designer.

Web Mail

This is a manner of accessing your POP mail by way of a web-based interface. This is commonly used to access mail when not at a computer setup to retrieve their email through an email client.

Web Server

This is a server which is setup to serve documents, usually built in HTML or server side scripting languages, over HTTP connections. This may refer either to the machine itself, or to the web server software, such as IIS or Apache, that is running on the machine for this purpose.

Web Site

This is a structured collection of documents and associated files which contain everything necessary to instruct a web browser on how to render a site and what content it contains. These are usually written in HTML, but commonly also use CSS, scripts, Flash, and other components that expand the capabilities of the site beyond that provided by HTML alone. Web sites are hosted with web hosts on web servers, usually housed in a data center.

Windows Hosting

Web hosting that is based on IIS, operating atop a Microsoft Windows operating system, usually Windows NT or Advanced Server. Windows hosting is necessary for the functionality of ASP-based websites, and usually Cold Fusion-based sites as well. Windows hosting is generally more expensive than UNIX-based hosting on account of licensing costs associated with Windows.

How to install Windows7 on VMware

April 17th, 2009 by admin

I downloaded the Windows 7 beta DVD and decided to install it in a VM. Since I’ve read a few other blog posts where the soon to be released version of the Windows operating system works great as a VM, I decided I’d try it for myself. On my company notebook I run VMware Workstation 6.5 on Microsoft Vista, and I chose to create a guest there first. I’ll probably try VirtualBox on my Ubuntu desktop soon too.

The installation was very simple and uneventful. I used the Workstation Easy Installer feature to pick all of the VM hardware configurations for me. There was very little to do actually. If you have never tried the Easy Install feature of Workstation it is very impressive and makes building VMs so easy that even a caveman could do it. (Maybe I should copy write that saying? ;) )

I’ve documented the install with screen shots in this post in case readers would like to see the process, but honestly it’s straightforward. I’ve added some notes and impressions as well.

I started at approximately 6:25 am
You have to love the Workstation Easy Installer feature:

  • Install from: Installer disk
  • auto detected as Vista
Leaving the Windows Product Key blank for the beta
Thanks for the confirmation?
I had to change the default Name from Windows Vista, and I do not keep my VMs in the default location
I kept the suggested virtual disk configuration
Summary screen showed that the

  • RAM was 1024 MB
  • vNIC set to NAT

Easy Install does not ask you to set these, but gives you the button to Customize Hardware if you don’t like. I kept them as is.

VM auto started
I installed the Windows Ultimate Edition.

Not sure if 1GB RAM is enough for all features, but as a VM you don’t need all the visual enhancements anyways.

Installing by 6:30 am

Interesting note:

My mouse passed seamlessly between the VM console and my host notebook during the install. I was not prompted to make any changes or input anything, but I did click inside the console a few times and was able to move the mouse back out without using CTRL + ALT + INS

By 7:04 am I was ready to log in

Windows 7 displays “Preparing Your Desktop” until you are prompted for the usual OS configurations.

Windows 7 networking
Easy Install also installs VMware Tools for you after you log in to the VM. The tools install takes place simultaneously as the Windows desktop is being configured.
When the tools install is complete there is an auto reboot
By 7:19 am I was finished.

Note:

The time it took to complete the install was delayed by my documentation in this post

After I logged in I was prompted if I wanted to auto install updates and I chose Yes. Updates began to download immediately. LOL! Some things never change!

Turns out the update was a definition update for Windows Defender.

Unity mode is not supported yet with Windows 7 Beta

JQuery Image Plugins

April 13th, 2009 by admin

JavaScript frameworks have become very popular in the recent years by making the creation of dynamic effects much easier. Lightweight, used in the Wordpress and Drupal core, jQuery is now one of the most used JavaScript libraries around.

The following list of jQuery plugins will help you to improve the usability of your website or web applications by enhancing the display of your images.

1. s3 Slider

 - screen shot.s3 Slider Demonstration page.

A simple way to add smooth image slideshows and showcases on your website.

2. jQuery Image Strip

jQuery Image Strip - screen shot.jQuery Image Strip Demonstration page.

Nice little image viewer that uses fancy visual effects. This can be of great use for displaying various views of a product in an e-commerce website.

3. jQuery Thumbs

jQuery Thumbs - screen shot.

Easy thumbnails creation with jQuery, jQuery Thumb dynamically wraps images and/or link images with a div.

4. jCrop

jCrop - screen shot.jCrop Demonstration page.

Quick and easy way to add image cropping functionality to your web application. It combines the ease-of-use of a typical jQuery plugin with a powerful cross-platform DHTML cropping engine.

5. Image preview

Image preview - screen shot.Image preview Demonstration page.

Create image previews with this accessible and easy to implement script.

6. EOGallery

EOGallery - screen shot.

Web animated slideshow gallery made with jQuery.

7. jCarousel Lite

jCarousel Lite - screen shot.jCarousel Lite Demonstration page.

Carousel script with jQuery. Navigate images or HTML in a carousel-style widget, lightweight and flexible, customizable to fit most needs.

8. Thickbox

Thickbox - screen shot.Thickbox Demonstration page.

Webpage UI dialog widget using the jQuery library, it shows any type of content in a modal box.

9. PanView

PanView - screen shot.

To let your visitors view details of a big image. Great for letting them have a better view of an artwork, map or panorama. PanView creates a fixed size div in which the user can move the bigger image.

10. jQuery Cycle plugin

jQuery Cycle plugin - screen shot.

The jQuery Cycle Plugin is a lightweight slideshow plugin that supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects.

11. Coda Slider

Coda Slider - screen shot.

A jQuery script that emulates the effect used on the gorgeous Coda website.

12. Rounded Corners

Rounded Corners -screen shot.

Easy rounded corners creation. Tons of effects are available for fixed or fluid divs.

13. ImageCube

ImageCube - screen shot.

Cool effect to rotate your image as if they were the faces of a cube.

14. jQZoom

jQZoom - screen shot.jQZoom Demonstration page.

Javascript image magnifier to give a better view of your images.

Got more jQuery plugins for images?

Do you use (or know of) any more jQuery plugins for working with images? Talk about it in the comments!

Tags: , , ,

Image Slideshow Gallery Scripts

April 13th, 2009 by admin

Family photos, vacation snapshots or creative artistic works: whatever images you have to present, you can present them in a variety of ways. On a big screen, in slide shows or in a thumbnails gallery. However, to convey the message of presented data effectively, it’s important to offer it in an attractive and intuitive way. Furthermore, the presentation itself can make images more valuable and simplify the browsing through hundreds of slides.

There are literally hundreds of solutions for web-based galleries out there. We’ve selected 30 scripts of impressive slideshows, lightboxes and galleries you can use for effective presentations of your images. Most of them don’t have any technical requirements, so you can use them right away. Let’s take a look.

Ajax Image Galleries & Lightboxes

  • Minishowcase
    Minishowcase is a small and simple php/javascript online photo gallery, powered by AJAX/JSON that lets you put easily your images in an online gallery, without having to configure databases or changing and customising code (though you may do it if you feel so) allowing to have an up-and-running gallery in a few minutes.
    Screenshot
  • JonDesign’s SmoothGallery
    Unlike other systems out there, JonDesign’s SmoothGallery is designed from the ground up to be standard compliant: You can feed it from any document, using custom css selectors. And even better, this solutions is very lightweight: The javascript file is only 16kb.
    Screenshot
  • Ajax Photo Gallery
    The AJAX version of AgileGallery is a free AJAX photo gallery that rips through the XML output from Picasa (a free download from google) and generates DHTML for the paging and thumbnails and displays the full sized photos along with any description entered in Picasa. Since this photo gallery uses AJAX technology, it eliminates the need for any page refresh as the user pages through the photos.
    Screenshot
  • Pyxy-gallery
    Pyxy-gallery is an AJAX image gallery in PHP and JavaScript, which optionally uses lightbox.js. It is designed to be an ultra-light-weight, “drop-in” image gallery.
    Screenshot
  • zenphoto
    Zenphoto is an answer to lots of calls for an online gallery solution that just makes sense. After years of bloated software that does everything and your dishes, zenphoto just shows your photos, simply. It’s got all the functionality and “features” you need, and nothing you don’t. Where the old guys put in a bunch of modules and junk, we put a lot of thought. We hope you agree with our philosopy: simpler is better.
    Screenshot
  • Couloir.org: Resizing, Fading Slideshow Demo - AJAX Slideshow
    This photo slideshow is a demonstration of Flash-like behavior implemented solely in Javascript, HTML, and CSS. The code is offered as-is — Couloir.org offers no technical support. However, you are permitted to use it on your own project so long as you do so according to the rules outlined in the Creative Commons ‘Attribution-ShareAlike 2.0′ License and the license terms contained in the associated, third-party APIs.
  • Grey Box
    A pop-up window that doesn’t suck. GreyBox can be used to display websites, images and other content in a beautiful way.
  • Lightbox2
    Lightbox JS is a simple, unobtrusive script used to overlay images on the current page. It’s a snap to setup and works on all modern browsers.
  • Litebox
    Litebox is a modified version of Lightbox v2.0 created with one thing in mind, size reduction. Litebox utilizes the 3kb javascript library moo.fx in association with prototype.lite, giving us the basic tools we need to make this work and you the ability to expand.
    Screenshot
  • Multifaceted Lightbox
    A script (JavaScript) that allows you to focus the users attention on a particular portion of the screen. It creates the equivalent of a modal dialog box - this means that while the user looks at this focused part of the screen, they can’t interact with the rest of the screen.
    Screenshot
  • Slightly ThickerBox 1.7
    Slightly ThickerBox is a modification of Cody Lindley’s Thickbox script. I modified it for use on my Jason’s Toolbox Redesign. The modifications allow the script to generate “Previous Image” and “Next Image” links. The result is that you can use Slightly ThickerBox to create image galleries. In addition, you can create groups of galleries by setting a “rel” attribute on the links. (I also moved the Caption and Close link to the top and made the script case insensitive.)
  • TripTracker
    The TripTracker slideshow is a lightweight JavaScript image viewer with an animated slideshow feature.
    Screenshot
  • Slimbox, the ultimate lightweight Lightbox clone
    Slimbox is a 7kb visual clone of the popular Lightbox JS v2.0 by Lokesh Dhakar, written using the ultra compact mootools framework. It was designed to be small, efficient, more convenient and 100% compatible with the original Lightbox v2.
    Screenshot
  • Suckerfish HoverLightbox
    The Suckerfish HoverLightbox is a mashup of three very popular Web design techniques blended together to offer a new way of presenting your image galleries.
    Screenshot
  • Suckerfish HoverLightbox Redux
    The Redux has a number of improvements, mostly visual, but some behavioral changes as well. Before going into detail, it’s important to give due credit to those who helped make the Suckerfish HoverLightbox a possibility.
  • ThickBox 2.1.1
    ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.
    Screenshot

CSS-Based Image Galleries

  • A Photograph Gallery
    Just a simple :hover over thumbnail images to give a full size view of each photograph. With all but Opera you can also click the thumbnails to retain the image on the screen. Text can be added at the bottom of each picture. Ideal for photograph albums.
    Screenshot
  • A simple CSS photo-album
    The text numbers and images are held in an unordered list without any extra markup (no ‘ems’ or ’spans’ etc). The CSS just styles the text numbers so that they appears in a box and the images so that they are hidden until your visitor clicks a number square.
    Screenshot
  • Cross Browser Multi-Page Photograph Gallery
    Based on Suckerfish HoverLightbox this one uses my multi-page layout system but includes images instead of text. Unlike the Suckerfish HoverLightbox this version is pure CSS.
    Screenshot
  • CSS Image Gallery
    This is a purely CSS based image gallery that displays larger versions of thumbnail images dynamically when the mouse hovers over them. A rich HTML caption can be added to the enlarged image, and every aspect of the Image Gallery exists as plain HTML on the page. The idea is to use CSS’s “:hover” pseudo class to cause an element to react onMouseover. When that happens, an absolutely positioned container holding the enlarged image, anchored on the page by another container with position set to relative, is shown. Furthermore, it’s possible to modify the behavior so the enlarged images are only shown onClick, though IE6 currently doesn’t support this behavior well. The gallery works in IE6+, Firefox, Opera 8+.
    Screenshot
  • CSS: Photo Showcase
    This experiment uses CSS and basic markup to create a simple way to display photo thumbnails on your site while offering convenient fast zoom viewing, even for dialup users.
    Screenshot
  • Hoverbox Image Gallery
    Basically, it’s a super light-weight (8kb) roll-over photo gallery that uses nothing but CSS.
    Screenshot
  • Photo scroll gallery
    A combination of several of my previous galleries to give a scrolling ‘thumbnail’ image, a medium size image on hover and a full size image on click. The thumbnail, medium size and full size images are all the same image just resized using CSS. The thumbnails are square to make the scrolling area simpler to work with. This does make these images a little distorted but not so much that they look wrong.
    Screenshot
  • Sliding Photograph Galleries
    It is just an unordered list of images that are normally compressed vertically (reduction 8:1). When you hover over one of these compressed images it expands to full size. It is based on my sliding menu system and adapted to use images. No thumbnails are required and all the images are ‘pre-loaded’.This method can be used either vertically, as shown, or horizontally.
    Screenshot

JavaScript + CSS-based Galleries & DHTML-Galleries

  • xImgGallery - Javascript Image Gallery & Slideshow
    This script implements a Javascript image gallery and slideshow - all in one file.
    Screenshot
  • easyAlbum
    A DOM photo Gallery solution that is browser friendly, keyboard friendly, bandwidth friendly and more.
    Screenshot
  • ImageGal
    imagegal is a simple PHP script that will automagically create a JS/CSS/DHTML powered image gallery for you when dropped into a directory containing images. This simple script was inspired by a Jeremy Keith’s article on aListApart.com.
  • Highslide JS
    Highslide JS is a piece of JavaScript that streamlines the use of thumbnail images on web pages. The library offers these features and advantages: No plugins like Flash or Java required. Popup blockers are no problem. The images expand within the active browser window.
    Screenshot
  • Satellite
    Satellite is an all in one photo gallery website that takes advantage of Yahoo Flickr’s image hosting and management tools. You can upload and manage your images using Flickr and host your portfolio on your own server via Satellite.
  • Dhonishow
    Showing Picture Online with Javascript.
Tags: , , ,

Designing the Magento

April 10th, 2009 by admin

Creating a new theme

How to duplicate a design theme

The first step will be duplicating the default theme folder structure so that we can always turn back the changes if we damage anything. Magento’s default template structure is shown below, and there are two folders we must duplicate. Duplicating means creating a new folder with the same contents as the source folder. The simplest method is copying the folder from the original theme or duplicating it with an SSH or similar client.

Base folder structure:

  1. /app/design/frontend/default/default/ - theme customizations
  2. /skin/frontend/default/default/ - where design themes css and images are

Lets name the new template as new_theme. Then the new folder structure should look like this:

New folder structure:

  1. /app/design/frontend/default/default - default theme
  2. /app/design/frontend/default/new_theme/ - our new, duplicated theme
  3. /skin/frontend/default/default - is where design themes css and images are
  4. /skin/frontend/default/new_theme/ - our new, duplicated skins folder

Of course we don’t need to duplicate the whole structure. If the required file is not found in the new_theme directory it will be taken from the default theme’s directory.

How to Design Maganto.

How to setup a new theme in administration area

After duplicating the folders we need to switch the theme from the administration area.

Step 1. Go to System > Configuration > Design via the top navigation bar Step 2. Under “Themes” and in the “Default” text field, type: new_theme Step 3. Press the “Save config” button in the upper right corner

Adding custom stylesheets and js libraries (part I)

Any external stylesheet files (css) or javascript/ajax libraries (js) that we want to include in our new project must be also copied to the proper folders.

Stylesheets Copy the files to /skin/frontend/default/new_theme/css/ folder Don’t forget to include any new css files in the styles.css file. We can do this by appending the following line as specified:

  1. @import url(‘new_styles.css’);

After

  1. @import url(‘custom.css’);

Javascript / AJAX libraries Create a new folder under /js/ named custom_js and copy your files to it. If you are using javascript libraries then this is also a good place to put the library files.

Using XML to change layout

With the use of XML we can change almost every aspect of our new_template. For example we can set an alternate column layout for particular pages, change META information, page encoding, block types used on each page etc. There are two XML files you will be modifying in order to manage these tasks, and the two files are as follows (this info is outdated):

  1. app/design/frontend/your_package/your_theme/etc/config.xml
  2. app/design/frontend/your_package/your_theme/layout/page.xml

The new place of config.xml is:

  1. app/etc/config.xml

Changing META section

The main file used to control values for META tags and other miscelaneous details is config.xml which is located in the /app/design/frontend/new_template/default/etc/ folder.

Below is a short description of every META tag and possible values:

  1. </span></span>Magento Commerce<span class=”sc2″><span class=”kw2″>

This is the name of our ecommerce site. This text will appear in the browser’s title bar or the browser tab for the site. This text is also highly important for search engine keyword optimization.

  1. text/html</media_type>

This is default page header encoding so we should leave this as is.

  1. utf8</charset>

UTF8 is a variable-length character encoding for Unicode. It is able to represent any character in the Unicode standard, yet the initial encoding of byte codes and character assignments for UTF-8 is backwards compatible with the ASCII table. For these reasons, it is steadily becoming the preferred encoding for e-mail, web pages, and other places where characters are stored or streamed.

Of course we can change it to any other encoding (ex. ISO-8859-1 or ISO-8859-2) but there is no need as long as we’re saving our files with proper UTF8 encoding.

More information about UTF8 is in the Wiki: http://en.wikipedia.org/wiki/UTF-8

  1. Default Description</description>

The description tag controls the description meta tag and allows us to enter a short description about our site. It’s often a way to get a nice description of your page to show up in the search results if your page does rank highly in a search engine. Your best bet is to write a succinct sentence or two that uses the keyword phrases that sum up the page content.

  1. Magento, Varien, E-commerce</keywords>

The keywords tag controls the keyword meta tag and is the place to put the most important words that refer to the site content. Best practices suggest to enter no more than 500 characters in no more than 20 words for best results.

  1. *</robots>

The robots tag controls the robots meta directive and is a simple mechanism to indicate to visiting web bots and search engine spiders if a page should be indexed, or links on the page should be followed. The content of the Robots meta tag contains directives separated by commas. The currently defined directives are index, noindex, follow and nofollow. The two index directives specify if an indexing robot should index the page or not. The two follow directives specify if a robot is to follow links on the page or not. The defaults are index and follow. The values all and none set all directives on or off: all=index,follow and none=noindex,nofollow We can simply override Magento’s default directive by placing one of the four following lines here, however it’s not recommended. The options are:

  • index,follow
  • noindex,follow
  • index,nofollow
  • noindex,nofollow

The file config.xml also contains two additional tags, not connected with any meta tags but used as a default settings for every page in our shop.

  1. images/logo.gif</logo_src>

The logo_src tag sets up a reference to the logo file we wish to use on our site. The image logo.gif is located in the folder /skin/frontend/new_template/default/images/ so if we want to change it we must copy a new logo file to that folder. We can also create a new folder inside the images folder (ex. new_images) and put all our new files used by new template into it and change this tag appropriately. The easiest way to customize the logo it to simply overwrite the default logo.gif file with a new logo.gif file.

  1. Magento Commerce</logo_alt>

The logo_alt tag defines the alt attribute for our logo image and is mostly used by screen readers or browsers with images disabled. If one of our customers uses a screen reader or has images disabled he will see the alt text instead of image.

Understanding layout XML files

Introduction

Using xml instead of other methods (JSON, .ini files, include / require functions) allows us to change many aspects on our page without manually changing the .phtml files. This chapter refers to our default theme so after changing the theme (as we have done above) the paths will also change.

Layout / page structure

Your core Layout is defined by page.xml which is located in /app/design/frontend/your_package/your_theme/layout/page.xml

There are two large tasks layout carries out.

First it defines the visual layout for your store. By default Magento uses a 3-column layout, so it defines use of 3columns.phtml (Located in your template/page/ folder):

  1. type=“page/html” name=“root” output=“toHtml”>
  2. method=“setTemplate”>page/3columns.phtml</template></action>

If you wanted to change your store a 2-column layout, for instance, you would change the line above to reflect the .phtml you’d like to use (in this case, 2columns-left.phtml or 2columns-right.phtml).

  1. method=“setTemplate”>page/2columns-right.phtml</template></action>

More information about the action tag and associated methods is located in section d of this chapter.

Secondly it creates “block containers” filled with application data for output to your .phtml template files. First, if take a look at your standard 3column.phtml file you’ll see it calls the method (function) getChildHtml() a number of times:

(excerpt from 3columns.phtml - Starting at line 56):

  1. =$this->getChildHtml(‘header’)?>
  2. /div>

Tags: , , , ,

GX: A new animation framework

April 10th, 2009 by admin

Friday, March 13th, 2009

Riccardo Degni has created GX, his latest animation framework. He actually created moo.rd in the past, and this time he is playing on top of jQuery:

I’ve developed GX keeping in mind mainly two Design Patterns:

  • the “Write Less, Do More” Pattern picked from the jQuery Library. With GX you’ll always write as less code as possible to get the best results.
  • the DRY (Don’t Repeat Yourself) Pattern. If a GX’s functionality is needed more than once, it will be internally reused with no duplicate.

GX respects the Strict Standards and doesn’t generate CSS/Javscript warnings. Moreover it prevents possible Memory Leaks because it will always use the same instance for a determinate element (say goodbye to “flickering”) to avoid either memory leaks and flickering issues. This technique allows you to always keep track of your animation’s state.

Although GX is completely cross-browser, it doesn’t contain any Browser sniffing: it’s 100% pure Javascript engine.

Example

JAVASCRIPT:

  1.  
  2. // simple animation
  3. $(‘element’).gx({‘width’:‘+=200px’, ‘height’:‘4em’, ‘opacity’:0.4, ‘color’:‘#ff0′},
  4. 4000);
  5.  
  6. // queue animations
  7. $(‘element’).gx({width: 0}, 200)
  8.             .gx({width: 200}, 4000)
  9.             .gx({width: 0}, ‘verySlow’)
  10.             .gx({width: 100}, ’slow’);
  11.  
  12. // ‘Complete’ callback
  13. $(‘element’).gx({width: 200, height: 200}, 2000, ‘Bounce’, function(el) {
  14.   el.html(‘The animation is completed!’);
  15. });
  16.  
  17. // ‘Start’ and ‘Complete’ callbacks
  18. $(‘element’).gx({width: 200, height: 200}, 2000, ‘Bounce’,
  19.   {’start’: function(el) { el.html(‘The animation is started!’); },
  20.    ‘complete’: function(el) { el.html(‘The animation is completed!’); } }
  21. );
  22.  
Tags: , , , ,

Booting Mac OS X Using Open Fireware

April 8th, 2009 by admin

What is Mac OS X?

Booting Mac OS X

This page contains a brief description of the Mac’s firmware (analogous to the PC BIOS in many respects), the bootloader, and the typical Mac OS X boot up sequence. There are significant differences between how older (68k, “Old World” PowerMacs) and newer (everything currently, but essentially “New World” machines with Open Firmware 3.x that load ROM from a file) boot. The discussion here applies to the newer systems.

The firmware is not part of Mac OS X, but it plays an important role in the operation of the machine, and is useful in debugging. Hence, we discuss it here.

Open Firmware

Background

Open Firmware (IEEE-1275 Standard for Boot Firmware: Core Requirements and Practices) is a non-proprietary, platform (CPU and system) independent boot firmware. Similar to a PC’s BIOS, Open Firmware is stored in ROM and is the first stored program to be executed upon power-up.

An Open Firmware implementation is based on the Forth programming language, in particular, the FCode dialect (FCode is an ANS Forth compliant dialect that supports compilation of FCode source to bytecode). Apple and Sun are two prominent computer system makers that use implementations of Open Firmware in their systems (Sun’s trademark is called OpenBoot). The Open Firmware Working Group’s home page is hosted at various places, including Apple and Sun.

Thus, the firmware is implemented in Forth, and stored in the ROM as FCode bytecode. Device drivers that are required during system startup are also implemented similarly. Such drivers usually exist in the expansion ROM of expansion cards that are needed before the operating system has loaded.

Interaction

You can enter Open Firmware by pressing the key combination cmd-opt-O-F just as you power on a Macintosh. The cmd key is the one with the Apple logo, and the opt (option) key is the same as the alt key. You should see a welcome message and some other verbiage, and should be dropped into a prompt like the following:


ok
0 >

You can continue booting the machine by typing mac-boot, or shut it down by typing shut-down.

Even though this Forth “shell” supports reasonable (for a BIOS) command line editing (you can use ctrl-a to go to the beginning of a line, ctrl-e to go to the end, ctrl-u to erase a line, the up-arrow key for history, etc.), you would find it more convenient (particularly if you are trying to write any code in the firmware) to access a Mac’s Open Firmware from another (arbitrary) computer, over the network. Here is the command sequence to do this (everything is typed at the Open Firmware prompt, unless stated otherwise):


0 > dev /packages/telnet

Note that upon success, Open Firmware prints the string “ok” on the same line as you press . In the examples on this page, if you see ok, remember that it is printed by Open Firmware and you are not supposed to type it in (it’s not a valid Open Firmware word anyway).

If your Mac’s Open Firmware includes the telnet package, you would see:


0 > dev /packages/telnet ok

If you do get an ok, you can run a TELNET server on it:


" enet:telnet,10.0.0.1" io

This would run a TELNET server on the machine with IP address 10.0.0.1 (you can and should choose any appropriate address). Thereafter, you can connect to Open Firmware on this machine using a TELNET client - say, from a Windows machine. See The Towers of Hanoi in Open Firmware for a programming example.

Note that current (at least G4 and above) Apple computers come with Ethernet ports that are auto-sensing and self-configuring, so you do not need a cross-over cable to connect it directly to another computer (no hub is required, etc.).

Examples

1. The following command prints the device tree:


0 > dev / ls
ff880d90: /cpus
ff881068: /PowerPC,750@0
ff881488: /l2-cache
ff882148: /chosen
ff882388: /memory@0
ff882650: /openprom
ff882828: /client-services
...
More [,,q,a] ? _

2. The following command gives you information about installed RAM:


0 > dev /memory .properties ok
name memory
device_type memory
reg 00000000 10000000
10000000 10000000
slot-names 00000003
SODIMM0/J25LOWER
SODIMM1/J25UPPER
...
dimm-types DDR SDRAM
DDR SDRAM
dimm-speeds PC2700U-25330
PC2700U-25330
...

The machine in the above command (a PowerBook G4 15, although that is not relevant) has two PC2700 DDR SDRAM chips installed. The two pairs of numbers against reg are specify the starting address and size of the chips. Thus, the first RAM chip starts at address 0x0000000 and has a size 0x10000000 (which is 256 MB). The second chip starts at 0x1000000 (256 MB) and has a size 256 MB. The total RAM is thus 512 MB.

If you need to reduce the installed RAM size (as seen by Mac OS X) for any reason, without actually having to remove a RAM stick (or you want to simulate an arbitrary size that’s less than the total installed RAM), you can actually delete the reg entry using the delete-property command, and specify your own reg. Referring to the previous example of the 512 MB PowerBook, the following command essentially disables the second RAM stick (note that this change is not written to NVRAM - it is transient - once you reboot, the other chip will be detected and used as before):


0 > " reg" delete-property ok
0 > 0 encode-int 10000000 encode-int encode+ " reg" property ok

It must be kept in mind though that the reg properties can change from machine to machine, or more likely with architectural changes (for example, the format changed with the PowerMac G5). A less adventurous and more appropriate way to limit visible RAM is to use the maxmem boot argument, such as at the shell prompt:


# nvram boot-args="maxmem=128"

3. The following command sequence shows you various information on the machine’s CPU(s):


0 > dev / ok
0 > dev /cpus ok
0 > ls
ff886d58: /PowerPC,G4@0
ff8871f8: /l2-cache
ok
0 > dev PowerPC,G4@0 ok
0 > .properties
name cpu
reg 00000000
cpu-version 80020101
state running
clock-frequency 4a817c7b
bus-frequency 09ef21aa
...

The rest of the output contains various cache sizes, the processor’s graphics capabilities (Altivec, support for certain instructions, …), and so on. You can think of this as analogous to /proc/cpuinfo on Linux.

4. The following command lists files in the root directory of the disk (partition) referred to by the “alias” hd


0 > dir hd:\

Size/ GMT File/Dir
bytes date time Name
6148 12/25/ 3 4:25:25 .DS_Store
156 9/12/ 3 20:41:59 .hidden
589824 12/25/ 3 6:45: 6 .hotfiles.btree

5. The following command expands the alias hd, and gives you the complete path of the device in the tree (type devalias by itself to see a list of current aliases, along with what they refer to):


0 > devalias hd /pci@f4000000/ata-6@d/disk@0 ok

6. You can load a file (kernel) using the load command, and boot it using the boot command. As stated earlier, mac-boot and shut-down are predefined to boot the machine normally, or shut it down, respectively. You can get and set variables (options) using the printenv and setenv commands. These variables are stored in the non-volatile memory (NVRAM) of Open Firmware. For example, if you want your email address to be used as the “OEM banner”, you should do the following:


0 > setenv oem-banner you@your.email.address
0 > setenv oem-banner? true

You do not actually need to drop into Open Firmware to set the NVRAM variables. You can access (get and set) these from within Mac OS X via the nvram command line utility.

To sum up, Open Firmware is a powerful tool for controlling, debugging, and exploring the computer.

Operation

When an Open Firmware equipped Macintosh (all current Apple systems at the time of this writing) is powered on, hardware is diagnosed (by some POST code) and initialized. The first entity to control the CPU thereafter is the firmware. Open Firmware (which runs with interrupts disabled) builds a device tree, probes slots for devices, queries PCI devices and assigns them address space appropriately, and then looks for the default boot device (unless one was specified explicitly). The following “snag” keys let the user specify a boot device as the system is powered on:


C device referred to by the 'cd' alias, a CD-ROM drive
D device referred to by the 'hd' alias, a hard disk drive
N device referred to by the 'enet' alias, a network card
Z device referred to by the 'zip' alias, a ZIP drive

It is worth noting that pressing T while your Mac powers on would boot it into what’s called the FireWire Target Disk Mode. Essentially, your Mac becomes a fancy external FireWire disk drive.

You can also specify the complete pathname of a device, or have the machine boot over the network using TFTP:


boot enet:,,;,;

If Open Firmware fails to find a boot device, a blinking folder is displayed.

Open Firmware then loads a file of type tbxi (ToolBox ROM Image, for historical reasons) from the system partition. Note that this would have been the file called “Mac OS ROM” in the System Folder on Mac OS 9, while OS X loads /System/Library/CoreServices/BootX, which is the bootloader as well. BootX is then executed and Control is then passed to it.

Note that Open Firmware can directly load ELF, XCOFF and “bootinfo” (any supported format with an XML header) binaries, but not Mach-O, the native executable format on Mac OS X. BootX can load Mach-O binaries.

Bootloader

BootX (/System/Library/CoreServices/BootX) is the default bootloader on Mac OS X.

BootX is also the name of an open source bootloader (different from Apple’s BootX) that allows dual-booting Mac OS and Linux on “Old World” machines.

BootX can load kernels from various filesystems: HFS+, HFS, UFS, ext2, and TFTP (network, abstracted to look like a filesystem). In addition to Mach-O, BootX can also load ELF kernels, although Mac OS X does not use this feature. To reiterate, BootX can load ELF kernels from an ext2 partition!

The “Old World” Macs had various issues with the implementation of Open Firmware, which in turn caused many booting problems for Apple engineers, and even more problems for the PowerPC Linux port. Now, Apple had access to the firmware’s source. They solved most of the problems either via NVRAM patches, or by integrating required changes into BootX itself (in the instances where the changes could not be implemented as patches). As BootX matured, Apple added support for ext2 and ELF with the goal of making the platform more amenable to PowerPC Linux.

The sequence of events when BootX starts executing (after being handed control by Open Firmware) is described below:

  • BootX first initializes the Open Firmware client interface (that it would use to talk to the firmware), and retrieves the firmware version.
  • It then creates a pseudo-device called sl_words (’sl’ implies secondary loader) in the firmware, and defines various FORTH words in it (it is here that code for the spinning cursor is set up).
  • BootX looks up the options device in the firmware, which contains various variables (that you can see and set using the printenv and setenv commands in Open Firmware).


0 > dev /options .properties
name options
little-endian? false
real-mode? false
auto-boot? true
diag-switch? false
...
boot-command mac-boot
...

  • BootX looks up the chosen device, which contains handles for entities such as the boot input/output devices, memory, the MMU, the PMU, the CPU, the PIC, etc. For example, the following command at the Open Firmware prompt shows you the contents of chosen:


0 > dev /chosen ok
0 > .properties
name chosen
stdin ffbc6e40
stdout ffbc6600
memory ffbdd600
mmu ...
...

  • BootX initializes handles to the MMU and memory using chosen.
  • BootX initializes handles to the boot display and the keyboard (if present).
  • BootX checks if the “security mode” is “none”, or
  • BootX checks if the “verbose” (cmd-v) or “single user” (cmd-s) flags were specified, and sets the “output level” accordingly.
  • BootX checks if the system is booting in “Safe Mode”.
  • BootX claims memory for various purposes.
  • BootX finds all displays and sets them up. It does this by searching for nodes of type “display” in the device tree. The primary display is referred to by the screen alias. For example, you can try this at the Open Firmware prompt:


0 > dev screen ok
0 > .properties
name ATY,Bee_A
compatible ATY,Bee
width 00000400
height 00000300
linebytes 00000400
depth 00000008
display-type 4c434400
device_type display
character-set ISO859-1
...

  • While opening the display(s), BootX also sets the screen color to the familiar whitish gray.
  • BootX looks up the boot device, boot arguments, etc., and determines where to get the kernel from (via a network device, from a block device, etc.), whence the path to the kernel file (mach_kernel) is constructed. If booting from a block device (which is the usual case), the path to the kext cache (see kextcache(8)) is calculated, along with the extensions directory (usually /System/Library/Extensions).

Mac OS X uses a few kinds of “kext” (kernel extension) caches to speed up loading of kexts. Kernel caches are kept in the directory /System/Library/Caches/com.apple.kernelcaches. The cache files are named kernelcache.XXXXXXXX, where the suffix is a 32-bit adler checksum (the same algorithm as used by Gzip).

  • At this point, BootX draws the Apple logo splash screen, and starts the spinning cursor. If booting from a network device, a spinning globe is drawn instead.
  • Depending on various conditions, BootX tries to retrieve and load the kernel cache file.
  • The next step is to “decode” the kernel. If the kernel header indicates a compressed kernel, BootX tries to decompress it (typical LZSS compression is used, as you compress this kind of data once but expand it many times). Since the kernel binary can potentially be a “fat” binary (code for multiple architectures residing in the same binary), BootX checks if it indeed is (fat), and if so, “thins” it (figures out the PowerPC code).
  • BootX attempts to decode the file (possibly “thinned”) as a Mach-O binary. If this fails, BootX also tries to decode it as ELF.
  • If the above fails, BootX gives up, draws the failed boot picture, and goes into an infinite loop.
  • If BootX is successful so far, it saves filesystem cache hits, misses and evicts, sets up various boot arguments and values (such as whether this is a graphical or verbose boot, whether there are some flags to be passed to the kernel, the size of installed RAM), and also calls a recursive function to flatten the device tree.
  • Finally, BootX “calls” the kernel, immediately before which it “quiesces” Open Firmware, an operation as a result of which any asynchronous tasks in the firmware, timers, or DMA get stopped, etc.

System Startup

Mac OS X user level startup is neither pure BSD style, nor SYSV style, although the presence of /etc/rc indicates a BSD heritage. In fact, various things are unsurprisingly similar to NEXTSTEP.

The next section, XNU: The Kernel, describes some of the things the kernel does as it comes up. Mac OS X System Startup continues with a description of (mostly) user-level startup.

BootCache

Mac OS X uses a boot-time optimization (effectively a smart readahead) called “BootCache” that monitors the pattern of incoming read requests to a block device (the boot disk), and sorts the pattern into a “playlist” (it also measures the cache hit rate and stores the request pattern into a “history list” for being adaptive in future).

The loadable (sorted) read pattern is stored in /var/db/BootCache.playlist. Once this is loaded, the cache comes into effect.

Note that this feature requires at least 128 MB of physical RAM before it is enabled (automatically).

/System/Library/Extensions/BootCache.kext is the location of the kernel extension implementing the cache while Contents/Resources/BootCacheControl within that directory is the user-level control utility (it lets you load the playlist, among other things). The effectiveness of BootCache can be gauged from the following: in a recent update to “Panther”, a reference to BootCacheControl was broken. BootCache is started (via the control utility) in /etc/rc, and a prefetch tag is inserted (unless the system is booting in safe mode). /etc/rc looks for BootCacheControl in the “kext” directory, as well as in /usr/sbin, and finds it in the former (it doesn’t exist in the latter). However, another program (possibly loginwindow.app) accesses /usr/sbin/BootCacheControl directly, and does not find it. For what it’s worth, making BootCacheControl available in /usr/sbin, say via a symlink, reduces the boot time (measured from clicking on the “Restart” confirmation button to the point where absolutely everything has shown up on the system menu) from 135 seconds to 60 seconds on one of my machines!