To improve readability of your web site on smart phones and other handheld devices, add a handheld media type style sheet which simplifies the page layout, user interface, and eliminates unnecessary items. <!– for other devices –> <link href=”handheld.css” rel=”stylesheet” type=”text/css” media=”handheld, only screen and (max-device-width: 320px)” /> <!– for iphones–> <link href=”handheld.css” rel=”stylesheet” type=”text/css” [...]

Internet Explorer 6, 7, and 8 can often provide a different design than intended due to the lack of adherence to WC3 standards. To help make your web design look like it does in FireFox, Chrome, and Safari, try these options: Use IE-only hacks in an existing external style sheet. Use a conditional statement in [...]

Optimize images using the Macintosh iPhoto application Double-click the Pictures menu in the Finder to open iPhoto. Select Preferences from the iPhotomenu on the main menu bar. Choose General->Edit Photo->in Separate Window to ensure you edit inside iPhoto and not another application. Select a photo from the Events, Photos, or Albumslist. Click the Edit icon [...]

Word processing applications allow writers to add hyperlinks to sources. Hyperlinks are sometimes automatically created when the writer pastes a web address/URL into the document. While long web addresses may be helpful to some they are generally hard to read and longer than the width of the page. To alleviate these problems, writers embed the [...]

Alternating table row colors Alternating row color is common practice on large tables of data. It improves readability. Try these resources to use CSS or JavaScript to enable row coloring. How to Alternate Table Row Colors in CSS and HTML Using CSS3 to Alternate Table Row Colors Zebra Tables Zebra Striping: More Data for the [...]

Optimize photos with Office Picture Manager In Windows, click Start->Programs->Microsoft Office->Microsoft Office Tools-> Microsoft Office Picture Manager. From the File menu, choose Add Picture Shortcut. From the choose file screen, navigate to the folder where you photos reside. Click Add to add the folder of photos to the Picture Manager. Double-click on the photo you [...]

Optimizing images in Paint In Windows, click Start->Programs->Accessories->Paint. Open an original file graphic file. Usually one of these formats: .gif .jpg, .wmf, or .tif Save As a copy of this file so you do not overwrite the original. Name it something else. Choose Stretch and Skew from the Image menu. Update the height and width [...]

Optimizing images in PaintShop Pro Open the original file. Usually one of these formats: .gif .jpg, .wmf, or .tif Select the image you want to optimize using the selection tool. If cropping is necessary, from the image menu, choose crop to selection Make any other adjustments to the image such as sharpen, brightness/contrast, etc. Save [...]

Photoshop tutorial for preparing images for online viewing Open the original file Usually one of these formats: .jpg, .gif, .tif .wmf, .eps, .pdf. Choose RGB from the Image Mode menu. Select the area of the image you want to keep using the crop tool. Double-click in the center of the selection to keep the crop. [...]

CSS pseudo-classes Notice the menus in this page have a pseudo-class applied to them for the link, visited, hover, and active, colors. For the site with no need for fancy menus, these pseudo-class changes in the style sheet can make tagging your pages fast. Where “a” is a link tag, “a:hover” is a pseudo class, [...]

What makes a web page different from a web site is how the pages connect to each other visually and mechanically. The purpose of a template is to provide a consistent message to the users, via color, navigation, content, and placement of elements, no matter what page they land on. Once you have a page [...]

Readings Optimizing Images Also includes Freehand and Paintshop Pro instructions. Batch Process Like Images Using Photoshop’s Actions, Droplets, and Batch Process automations. Lesson 10.5: Slicing Images Adobe Web Tech Curriculum. Photoshop output options Photoshop is designed to handle all manner of image enhancing, from high-resolution "painting" and photography to be printed, to tiny little web [...]

Readings Formatting for Accessibility Van Londen. 2004. Approximating Master Pages in PHP Spinning the Web. 2006. An Introduction to Accessibility on the Web Macromedia Training Cafe Accessibility Techniques for Dreamweaver MX Macromedia Training Cafe How to make skip navigation links this technique allows visitors who listen to websites (rather than read them) to jump over [...]

Readings CSS, DHTML, & Ajax Visual Quickstart Guide Jason Cranford Teague. Chapter 23 has navigation choices. Download the code. JavaScript for the World Wide Web, 6th Edition Tom Negrino, Dori Smith, Visual QuickStart Guide. Read for 14 days free, or buy the online or paper book. Calling A Rose by Any Other Name Gidget Pizzashorts [...]

Some media options work best in specific situations. Begin testing your discoveries. Compatibility   Windows Macintosh Unix/Linux Windows Media Files .wmf :-) plug for 9,10 VLC QuickTime .qt [plug] :-) VLC Real Audio .ra [plug] [plug] VLC Real Media .rm [plug] [plug] VLC Wave (.wav) wmp :-) XMMS .Mp3 :-) :-) :-) .MPEG QT, WMP [...]

Readings HTML For the World Wide Web Page 32, 55; chapter 2, 3. The Unusually Useful Web Book June Cohen. New Riders. 2003. Pages 191 to 192. Creating Web Pages with Dreamweaver Pages 82 to 91. It is the linking of separate, single web pages that turns them into a web site. How the pages [...]

Visitors to your site will want menu items listed on each page so they don’t have to click back and forth to move to a new topic. In addition, the visitor will want each page of the site to be a quick-read—once they see the home page, and understand it—they should not have to think [...]

Readings Approximating Master Pages with PHP Spinning the Web. 2006. PHP using a typical ASP concept. Manage Your Content With PHP Christopher Robbins. A List Apart. 2002. This method uses a cookie to store a visitor’s’ preferences. Other Templating Systems Templating systems provide separation between presentation and application logic. mod_perl Documentation: Choosing a Templating System [...]

Readings Introduction to PHP W3Schools. PHP.net Tutorials and functions list with syntax and examples. PHP Basics: Writing Simple PHP Applications Ewald Geschwinde ,Hans-Juergen Schoenig. InformIT, 2002. The Unusually Useful Web Book June Cohen. New Riders. 2003. Pages 155, 168 to 169. PHP and MySQL for Dynamic Web Sites Larry Ullman. Visual QuickPro Guide. Peachpit Press. [...]

infOSU GAP set up ONID login Blackboard login ONID FTP ONID Database This tutorial will teach you to set up a General Access PIN (GAP), ONID User Name and Password, and login to the Blackboard course management system. If you have already set up your GAP through infOSU, skip to #2. 1. InfOSU If you [...]

Use the chart below to choose the most appropriate file format and application for your project. For more detail, please see Wikipedia’s comprehensive list. Common File Formats Explained File Extension Name Purpose Application Notes .htm/.html HyperText Markup Language Universal format for web pages. A language of tags and code allows the web page author to [...]

Hello Bloggers. I’ve set up a secret email address for posting to my WordPress blog (not for WordPress.com uses) so I can send my blog updates a cellphone or web mail, for times when I’m not available to login to my site. Since I’m hosting my site with a paid host company, I set up [...]

Here are steps to take to save / export a database, and then to import it to copy or restore a database: Export to a text file Save as a .sql file Go to PHPMyAdmin Click on the ‘Import’ tab Browse for your .sql file If you have latin1 encoding, make sure to select that [...]

Document the site for long-term quality Examples OSU Guidelines are a good model for other companies: Web Identity Guidelines Central Web Services Web Accessibility Multimedia Accessibility During and after the design and production phases of site development, I recommend documenting the following to guide the client, programmers, and web authors after the project launches. All [...]

Readings Comprehensive guide to .htaccess Write error pages, track logins, and support SSI. .htaccess files allow you to update default web server actions. Learn more at the Comprehensive Guide site: Error Documents Password protection Enabling SSI via htaccess Blocking users by IP Blocking users/ sites by referrer Blocking bad bots and site rippers (aka offline [...]

Add any location map iframe tag to a sidebar widget For widget-enabled themes only. Add the Text widget to the sidebar of your choice. Edit the Text widget. Copy the iframe text provided by Google into the editing box. For example: <iframe width=”425″ height=”350″ frameborder=”0″ scrolling=”no” marginheight=”0″ marginwidth=”0″ src=”http://maps.google.com/maps…”></iframe> <br /><small> <a href=”http://maps.google.com/maps…” style=”color:#0000FF;text-align:left”>View Larger [...]

WordPress allows you to embed hosted movies using only the <object> tag. It works and is compliant in IE7, FireFox and Safari. Here is an example of the embed code and URL provided by YouTube: Copy the URL from the embed code provided, up to the first ampersand (&): Add the following code to your [...]

A. Use the Add Media icons on the toolbar to upload files or link to images online. On the Editing toolbar in a Post or Page editing screen, do the following: Click the Add Media icon for Add an image. Use the Choose files to upload button to add files from your hard drive. Or [...]

After completing the initial WordPress installation and configuration, I recommend making these additions to add important functionality to your site. Spam checker/eliminator Akismet; sign up for an API Key. Contact forms cForms II Contact Form 7 Drop down menus dTabs Uses CSS 3.0 options which do not currently validate with w3.org Multi-level Navigation Plugins Uses [...]

Basic steps to updating a WordPress installation Most parts of the WordPress site can be edited within the Dashboard. If you want to update styles, however, it is possibly faster to do it inside an external editor such as Dreamweaver or TextWrangler rather than doing it in the Theme editing screens in the Dashboard. Update [...]