Thought I’d try out Hyphens
On 27 Nov 2012 what should appear in Google Reader but a post called Hyphenation works! by PPK. I'm trying a little experiment here in that I set text-align: justify and turned on hyphenation. It's pretty easy, you tell the browser which language to use with a lang attribute. I'm declaring the language on the html element.
<html lang="en">
Next you add the CSS.
text-align: justify; /* optional */ -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto;
I believe hyphenation makes justified text work on the web. Tell me what you think.
IE Only in this Day and Age
In this day, it is hard to believe that there are still sites that only work with IE. It doesn't really look like they want people to look at their claim information.
When I tried to access the site with IE 8 the site said that it couldn't validate my information. The reason is because my last name contains an apostrophe. The system does not allow apostrophes in a last name. An apostrophe is a valid name character!
Self Optimizing AJAX Object
In 2007 I wrote a self contained AJAX object that supports asynchronous and synchronous access with PUT and GET methods, text and XML and XSL tranforms. The impetous for making certain methods of the object self optimizing came from an blog post by Peter-Paul Koch on @media Ajax 2007 Day 2. The example used by Dan Webb is the following addEvent function.
function addEvent(obj,evt,fn) {
if (document.addEventListener) {
addEvent = function (obj,evt,fn) {
obj.addEventListener(evt,fn,false);
}
}
else if (document.attachEvent) {
addEvent = function (obj,evt,fn) {
obj.attachEvent('on'+evt,fn);
}
}
addEvent(obj,evt,fn);
}
Rewriting a function at runtime is a wonderful way to avoid object detection and improve performance. From Peter-Paul Koch's blog post:
Basically, what happens is that the first timeaddEventis called, the function determines whether the browser supportsaddEventListenerorattachEvent. It then rewrites itself to a new function that uses the detected method to add the event. As a result, we only have to do the object detection once, which is much more elegant than doing it every time.
I realized that an AJAX object was a perfect place to use runtime function optimization. Consider the following createXMLHTTPObject function.
I took the 2008 Web Design survey, have you?
A List Apart is taking another survey.
Calling all designers, developers, information architects, project managers, writers, editors, marketers, and everyone else who makes websites. It is time once again to pool our information so as to begin sketching a true picture of the way our profession is practiced worldwide.
Take a few minutes and take the survey.
JSMin and JavaScript Conditional Comments
In Robert Nyman's post Conditional Compilation in JavaScript he noted that “Unfortunately, JSMin removes conditional compilation comments, but I believe this is due to not having been updated in a while, and not up to speed with modern web development practices”. So I took that on as a project. I took Franck Marcia's javascript implementation of JS Minifier and modified the javascript code to not take out Microsoft javascript conditional comments.
Continue Reading "JSMin and JavaScript Conditional Comments..."
Domino Directory Type Ahead
Update: 2009 Jan 22 - Added link to dirlookup.css.
Around December 2006 I read a tip on Julian Robichaux's site about Google Suggest-type Lookups In Notes code he had written. I downloaded the code and thought that I could make a few improvements. I changed the code to:
- Use Object Literal Notation.
- Added highlighting/auto complete support.
- Changed to code to dynamically create script elements for data instead of using the XML HTTP request object. Using script files gets rid of cross domain scripting security issues.
- Supports multiple input fields instead of one field.
- Supports the ($VIMPeopleAndGroups), ($VIMGroups) and ("Servers") views in addition to the ($VIMPeople) view.
I'm sorry it's taken a year and a half to publish.
DOMContentLoaded for Browsers, Part V
For those of you that don't know what the DOMContentLoaded event can do for you, here's a brief description.
The DOMContentLoaded event allows you to add behavior or change the HTML of a page after the HTML has loaded and before the onload event which happens after the complete page, including images has loaded. This allows you to add menu, tree behavior, AJAX functionality or anything else without having to wait for all items on a page to load. You may have experienced the need for a DOMContentLoaded event on a page that includes drop down menus or a tabbed interface which doesn't work until all images have loaded. Using the DOMContentLoaded event allows you to add the behavior before images and objects have loaded.
When I originally added the DOMContentLoaded event handler to Dean Edwards' addEvent function, I wanted it to be just another addEvent type. Since then I've changed my mind and created a domReady() function. By separating domReady in its own module, it can used with most frameworks.
WebSession Agent Class
Back in August 2007, Jake Howlett introduced a Web Session class for Domino Agents. I liked it a lot and saw the potential for reducing the amount of time to create web query open, web query save and web agents. I write a lot of web agents and often need to get query string, cookie and even form data. These items were missing from Jake's Web Session class. Also, the Web Session class required the programmer to instantiate the class when you wanted to use it. I thought that if you include the class in your agent you will want to use it. With that in mind, the Initialize function in the script library now instantiates a global web variable. I've added methods to get query string, cookie and form data items. With the advice of a co-worker I also protected the class variables by making them private and adding get methods for each variable. The only variables that I couldn't do this with were the lists that store query, cookie and form data information.
DOMContentLoaded for Browsers, Part IV
Update: 2008 June 13 - DOMContentLoaded for Browsers, Part V has been created that provides a domReady function without the overhead of the Dean Edwards' events code. If you're a prototype user you should check out Prototype JavaScript framework: document.observe which in version 1.6.0 gives you a dom:loaded event. If you don't have 1.6.0 or above of prototype or don't like their solution, check out domready.js in DOMContentLoaded for Browsers, Part V.
Update: 2008 Feb 14 - Added support for Vista 64 per Goran Miskovic's comment.
For those of you that don't know what the DOMContentLoaded event can do for you, here's a brief description.
The DOMContentLoaded event allows you to add behavior or change the HTML of a page after the HTML has loaded and before the onload event which happens after the complete page, including images has loaded. This allows you to add menu, tree behavior, AJAX functionality or anything else without having to wait for all items on a page to load. You may have experienced the need for a DOMContentLoaded event on a page that includes drop down menus or a tabbed interface which doesn't work until all images have loaded. Using the DOMContentLoaded event allows you to add the behavior before images and objects have loaded.
When I originally added the DOMContentLoaded event handler to Dean Edwards' addEvent function, I didn't provide a way to handle calls to it after the DOMContentLoaded event handler ran. If a developer called addEvent(window, "DOMContentLoaded", myFunction) after the DOMConentLoaded event ran, the passed function would never run. This version fixes the problem so that even if you call addEvent for the DOMContentLoaded event and the DOMContentLoaded event handler has already run, it will run your function.
The previous addDOMLoadEvent function would simply add the passed function to an array of functions which would be handled by the DOMContentLoadedInit function on the DOMConentLoaded event.
Continue Reading "DOMContentLoaded for Browsers, Part IV..."
DOMContentLoaded for Browsers, Part III
Update: 2008 June 13 - DOMContentLoaded for Browsers, Part V has been created that provides a domReady function without the overhead of the Dean Edwards' events code. If you're a prototype user you should check out Prototype JavaScript framework: document.observe which in version 1.6.0 gives you a dom:loaded event. If you don't have 1.6.0 or above of prototype or don't like their solution, check out domready.js in DOMContentLoaded for Browsers, Part V.
Update: 2007 Oct 25 - DOMContentLoaded Event for Browsers, Part IV has been created that adds a fix for calling DOMContentLoaded after the DOMContentLoaded event has occurred. Please check it out.
The DOMContentLoaded event allows you to add behavior or change the HTML of a page after the HTML has loaded and before the onload event which happens after the complete page, including images has loaded. This allows you to add menu, tree behavior, AJAX functionality or anything else without having to wait for all items on a page to load. You may have experienced the need for a DOMContentLoaded event on a page that includes drop down menus or a tabbed interface which doesn't work until all images have loaded. Using the DOMContentLoaded event allows you to add the behavior before images and objects have loaded.
Continue Reading "DOMContentLoaded for Browsers, Part III..."
Has IE7 Broken CSS Filters?
I've noticed that text becomes difficult to read when I apply opacity or a drop shadow using a filter in IE7. Here's an image of a menu without opacity applied in IE7.
Notice that because of clear type, the text is nicely rounded and readable. Here's an image of the same menu with opacity applied in IE7.
You can see that the text is pixilated and less easy to read. It seems that if an opacity filter is applied to an element, the element's text is not displayed using clear type, even if the OS is set to use clear type. Here's an image of a div with a drop shadow applied.
The OS is set to use clear type and has been tuned. Firefox on the left uses the OS settings to display the text, yet with IE7 on the right, the the text is very hard to read. IE6 with all its problems at least doesn't mess up text when a filter is applied to an element. I have an open ticket with Microsoft and the support person sent me an email message that told me the way to fix the problem is to not use the drop shadow filter. I don't believe that's a good solution. Has anyone else had problems with filters in IE7?
It’s Ocean a Redesign
Welcome to Ocean, a design I've been working on for about a month. I started out by going to Layout Gala for the structure. I chose a design with two columns on the right and a content column on the left.
Tabbed Interface
Update 18 Aug 2008: Added an openTabOfElement method and now check for the hash of the url and open the tab that contains the hash item. Try opening the Contact tab. This also works for form validation routines when you want to set focus back to a field that contains an error. If the tab is closed you will get an error. To open the tab pass the element to the tabs.openTabOfElement method before setting focus to the form element.
I liked the tabs created in Sliding Doors of CSS, Part II by Douglas Bowman. Please read the article so that you will understand how to modify the CSS of the tabs. The tabs are very nice for site navigation, but I wanted to use it in a tabbed interface within a page so that a user could click on each tab without reloading the page. First I started with the markup for the tabs.
XMLHttpRequest Permission Denied Error
Update: I'm now using xmlDocument instead of the div since the div does not support XSL transforms. You can find the new code with sample usage at the end at xmlreq.js
When I upgraded Firefox (I don't remember which version), the call I was using to XMLHttpRequest stopped working. I would get a "Permission denied to call method XMLDocument.getElementsByTagName" error when accessing the XML document. Yet, it worked in IE. The problem might be that I'm using a synchronous call instead of an asynchronous call. I have to use a syncronous call because the call is made from the onsubmit event handler. I have to wait for an answser so that I can continue checking the form or return a false to stop the submit. Or maybe it's that the javascript file is in a different directory. All I know is that is stopped working.
A few days ago I looked at the problem. I don't remember where I got the code I had modified to use a synchronous call. Here is the code I was using.
Continue Reading "XMLHttpRequest Permission Denied Error..."
Time Parser/Dropdown Combo
Update 18 Apr 2007 - Added Radix parameter to each instance of parseInt() pre John's comment.
Here it is, all 468 lines of code to create a dropdown list time parser combo box for the web. I don't have much time to document, so here's what you need to use it.
Pink for October 2006
My grandma Ethel contracted breast cancer in the 1970's. She decided that she wanted to use natural healing methods to cure the cancer and went to Mexico to get Laitril treatments. When she finally came home it was too late because the cancer had spread throughout her body. I visited her three weeks before she died. She faded in and out of consciousness while I talked with her. The problem is that she could have lived longer if she had surgery instead of going to Mexico.
With that in mind, I'm taking Natalie Jost's encouragement to go Pink for October. In October this site will be very pink. I decided that I wanted to retain the current theme, but change the color to pink.
Live Comment Preview Added
I've been to a few sites lately that have live comment preview and found that it helped me write better comments. These implementations use a textarea element to input your comment and displayed an HTML comment below the textarea element. Not as nice as a full WYSIWYG editor, but much lighter in weight and easier to implement in a wide variety of browsers. With that in mind I thought that it would be a good idea to implement live comment preview on my site.
The first thing I did is determined what DominoBlog, my blogging system does with a comment. I found out that it converts < symbols to <, > symbols to >, [b] into <b>, [/b] to </b>, [i] to <i>, [/i] to </i> and anything that starts with http:// to { Link } with the word link an href to the URL. When parsing the URL, DominoBlog looks for a space character or the end of the line to determine the end of the URL. Each line is turned into a paragraph.
Select tag overlap in IE, Part III
Update 15 Sep 2006: Added check to see if target element is contained in the li before removing the sfhover class to avoid flickering over select elements with a size greater then one.
I've modified iehover-fix.js to use DOM methods to create the iframe shim instead of innerHTML. When using innerHTML the iframe, menus and sub menus were added, which in cases with a large menu tree could take some time. I usually use innerHTML to add a number of elements to the DOM because it is faster. In this case using DOM methods should improve performance since we are only adding one element for each dropdown or flyout menu and not recreating the menu list. I've also added code suggested by Alistair Potts that should work with https pages.
DOMContentLoaded for Browsers, Part II
Update: 2008 June 13 - DOMContentLoaded for Browsers, Part V has been created that provides a domReady function without the overhead of the Dean Edwards' events code. If you're a prototype user you should check out Prototype JavaScript framework: document.observe which in version 1.6.0 gives you a dom:loaded event. If you don't have 1.6.0 or above of prototype or don't like their solution, check out domready.js in DOMContentLoaded for Browsers, Part V.
Update: 2006 Jul 10 - Fixed Firefox 2.0 problem and added ability to add a custom content ready function, DOMContentLoaded for Browsers, Part III
Update: 2006 Nov 28 - Changed code to support IE and https.
Update: 2006 Nov 21 - Added code to support IE and https.
Update: 2006 Jul 4 - Added Safari and KHTML specific code to load DOMContentLoaded events.
Update: 2006 Jun 26 - Code works in Opera 9. Now you can speed up onload events in most grade A browsers by using DOMContentLoaded/ContentReady events.
Dean Edwards has done it again. Thanks to work done by Matthias Miller, Dean has written a solution that removes the requirement of an external JavaScript file for Internet Explorer. My previous article, DOMContentLoaded for Browsers, used two external JavaScript files, ie_domload.js and events.js file to add DOMContentLoaded events. After adding Dean's new code to allow events.js to run the DOMContentLoadedInit function without an external JavaScript file for IE, I cleaned up the code that calls the DOMContentLoadedInit function to allow for browsers that will, or have added the DOMContentLoaded event. I believe that Opera 9 has added the DOMContentLoaded event. If anyone could test the sample page Opera 9, I would appreciate it.
Continue Reading "DOMContentLoaded for Browsers, Part II..."
Select tag overlap in IE, Part II
Update: Added conditional comment so that IE 7 is bypassed.
Only ten months late, but here is how to use iehover-fix.js. First a little history. Some have used the Suckerfish dropdowns menu written at A LIST apart way back in November 07, 2003. The dropdowns work great until select elements (dropdown list boxes) are added to a form. The menus go under the select elements when viewed in IE. Several years ago I found a fix for this problem and wrote about it in my Select tag overlap in IE article. Since then things have changed and multi-nested menus are now supported which you can read about in the excellent Son of Suckerfish Dropdowns article written by Patrick Griffiths and Dan Webb.
Using the iframe technique, Ilya I. Gerasimenko wrote the Cascading Menu: Vertical (IE <select> bug fix) solution. The only problem is that it didn't work with the Son of Suckerfish Dropdowns and didn't take IE 5.0 into account. IE 5.0 doesn't support the iframe method.
Taking Ilya's solution, I modified iehover-fix.js to support IE 5.0 and Son of Suckerfish Dropdowns.
DOMContentLoaded Event for Browsers
Update: 2008 June 13 - DOMContentLoaded for Browsers, Part V has been created that provides a domReady function without the overhead of the Dean Edwards' events code. If you're a prototype user you should check out Prototype JavaScript framework: document.observe which in version 1.6.0 gives you a dom:loaded event. If you don't have 1.6.0 or above of prototype or don't like their solution, check out domready.js in DOMContentLoaded for Browsers, Part V.
Update: 2006 June 22 - DOMContentLoaded Event for Browsers, Part II has been created that doesn't require the ie_domload.js external JavaScript file. Please check it out.
After learning of the DOMContentLoaded event in Mozilla browsers I knew it had to be added for other browsers. I wanted to add behavior to pages after the DOM had loaded and before the onload event. Some pages have images that take a long time to load, a DOMContentLoaded event allows a developer to add behavior after the DOM has loaded but before images have loaded.
The Calendar popup Goes Over Select Elements in IE
Notice in the example page for the calendar popup that when using Microsoft Internet Explorer 5.5 and above, the calendar does not go under the drop down list but goes over the drop down list.
If you look at Lea Smart's calendar popup, which is what I used as a basis for the Calendar popup, the calendar goes under the drop down list when using IE.
All you have to do to make an element go over instead of under a select element in IE is add an iframe in the containing element, absolute positioned, the same size as your element with a z-index less than your element.
Check out the code in calpopup.js to see how it works.
Date Input and Calendar Popup Instructions
As promised in my Date input and calendar popup article, here are instructions.
In the head section of your page add the following lines.
<link type="text/css" href="calpopup.css" media="screen" rel="stylesheet">
<type="text/javascript"script src="events.js"></script>
<type="text/javascript"script src="calpopup.js"></script>
<type="text/javascript"script src="dateparse.js"></script>
<script type="text/javascript">
// Optionally change the date format.
// g_Calendar.setDateFormat('dd-mm-yyyy');
</script>
Because of a Safari bug with onclick events in elements that are created using createElement and insertBefore DOM methods, if you want this to work in Safari, add the following div right after the body tag. It does not affect other browsers to add this here, it just means that you have to add HTML to your page that should be created with javascript.
<body> <div id="calcontainer"></div>
Add an input field to your form with a class of "dateparse".
<input type="text" size="10" id="dateField" class="dateparse">
Add a button or an image with an onclick event to access the calendar popup.
<a href="javascript:void(0);" onclick="g_Calendar.show(event, 'dateField')" title="Show popup calendar"> <img src="calendar.gif" class="cp_img" alt="Open popup calendar"> </a>
The only required items for the show method are event and the id of the date input field.
Here's the sample date parser and calendar popup.
Update: 3 May 2006 Forgot to check for mdyyyy when parsing a date from an input field. Fixed now.
Update: 22 Jul 2006 Added ability to set the drop down year menu to any start at any year.
Update: 3 Aug 2006 Added instructions on how to make click events work in Safari.
Day of week in relation to last, this and next
When researching adding next day of week to the date parser I had trouble with the ambiguity of the word next. I consulted a friend who is a college English professor and here's the result.
- last <day of week>
- The closest day previous to yesterday. If today is Wednesday, last Tuesday would not be yesterday but eight days ago. Last Monday would be two days ago.
- this <day of week>
- The closest day following today. It could be said that this is equal to this coming. If today is Wednesday, this Tuesday would be the six days from today and this Thursday would be tomorrow.
- next <day of week>
- The day of the week in the week following this week, but not tomorrow. If today is Saturday, next Sunday would not be tomorrow but eight days from today. If today is Wednesday, next Thursday would not be in this week but in next week which would be eight days from today.
Date input and calendar popup
I have created a date input and javascript calendar popup. First, I modified Simon Willison's A better way of entering dates to fix a few bugs and to allow more date output formats. If you don't have the message div, date-parse will display an alert instead of throwing an error.
I've also heavily modified Lea Smart's calendar popup so that it doesn't use document.write and adds the calendar container to the body element instead of the head element. While I was at it I cleaned up the html code that is used for the calendar.
Here's the combined sample.
If you want to change the output format of the date parser, change the global dp_dateFormat variable to:
- dd/mmm/yyyy
- dd-mmm-yyyy
- dd mmm yyyy
- d/mmm/yyyy
- d-mmm-yyyy
- d mmm yyyy
- dd/mm/yyyy
- dd-mm-yyyy
- dd mm yyyy
- d/mm/yyyy
- d-mm-yyyy
- d mm yyyy
- mm/dd/yyyy
- mm-dd-yyyy
- mm dd yyyy
- m/dd/yyyy
- m-dd-yyyy
- m dd yyyy
- m/d/yyyy
- m-d-yyyy
- m d yyyy
- yyyy-mm-dd
The default format is m/d/yyyy. The code has been modified to allow date entry in dmy format for formatting strings that start with a "d". You can find the source files at:
- caldown.gif - left arrow image for calendar popup
- calendar.gif - calendar button
- calpopup.css
- calpopup.htm - example page for calendar popup
- calpopup.js
- calup.gif - right arrow image for calendar popup
- dateparse.js
- date-parser.htm - example page with combined input field date parser and calendar popup
- events.js - addEvent() that supports DOMContentLoaded that adds the date parsing behavior to the date input field.
For now you'll have to look at the example pages for the syntax.
Update: fixed a few bugs.
- Added click event to calendar container that stops the click event from bubbling.
- Added logic to close the month and year menus.
- Changed logic that calculates to see if the calendar will drop below the bottom of the screen.
- Changed page onclick handler to not calculate if the user clicked the mouse on the calendar. It now closes the calendar only since the calendar traps mouse click events and stops the click event at the calendar.
- Removed preload images since images are called from the CSS.
Update:
- Added setDateFormat() method.
- Syncronized calendar date format with date parser date format.
Update: 31 Mar 2006 - Fixed problem with date input if the month you were entering the had more days then the month you entered. The resulting date would be one month after the date you input. If you entered 1 Feb 2006 you would get 1 Mar 2006. It is now fixed, many thanks to ML for finding the problem.
Update: 22 Jul 2006
- Added holiday and day of week blockout masking. See source of date-parser.htm for an example of how to use holiday and day masking.
- Added an addEvent() call to add date parsing behavior to an input field with a class of "dateparse"
- Added the ability to set the start date of the drop down year menu.
Update: 31 Aug 2006
- Changed getFirstDOM function to set the day to 1 first then set the month and finally the year. This fixed a problem with the current day moving the month up to the next month and return the wrong first day of the month.
Update: 10 Sep 2006
- Changed table footer of calendar popup to display "Today is: Month Day, Year" or "Today is: Day Month Year" depending on the date format, with the date as a link.
- Changed title text of footer link from "Go to today's date" to "Go to current month".
- Modified calpopup.css to set the width of the footer td so that IE would not word wrap the text.
Microsoft Came Bearing Gifts
I arrived at work today and as I was walking by a cubicle I found a gift from Microsoft
The basket included the following software:
- WindowsXP Professional with Service Pack 2
- Microsoft Digital Image Suite10
- Microsoft Money Premium 2005
- Plus! Superpack
- Office Professional 2003
- Encarta 2005 Deluxe
The basket also included the following books:
- Windows XP Inside Out
- Office XP Step by Step
Why don't other companies like IBM do things like this? For instance, the company I work for wanted replace our custom built employee portal and asked several companies for help testing their products. When the person in charge told Microsoft that they'd like to try Sharepoint, Microsoft said, "sure, we'll send out two people to help you set it up." However when IBM was approached we were told that it would take three months to setup Websphere Portal Server and cost us a million dollars! All we wanted was a proof of concept so that we could make an informed decision!
When we originally looked at Blackberrys we did not have coverage at the building were I worked. We said "give us coverage and we'll take a look at them", they said, "buy 400 and we'll give you coverage." We did not purchase any Blackberrys until years later, when we had coverage. If we had been given coverage in the first place without the requirement to purchase we most likely would have purchased earlier.
UPDATE: I found out that Microsoft gave the basket to us to give to the Red Cross as a raffle. Still very nice of them. I really believe that Microsoft has marketing to large corporations down. I think that the position is, if they give me products to try out and I like a product then I will recommend it to others and they will purchase the product. Over my lifetime in the company I work for I have received many products to test and of course I have only recommended products that I found to be usefull, after all it is my reputation on the line. If companies had never given or lent me products in the first place it may never have found a voice to promote them in the company.
Select tag overlap in IE
Update: I have a new article that supports nested menus with instructions on use at Select tag overlap in IE, Part II. Please go to the new article as it give you information that is not available in this article.
Sometime ago I was asked if I knew of an IE fix to hide select elements when postitioning other elements over them.
Does anybody know of any javascript that will disable or hide the select element tag?
The problem only occurs in IE when the dropdown menu overlaps a select tag in form. It appears that nother will override the z-index of the select tag in IE exept to hide it.
This is a problem with IE in that select elements do not honor the z-index and will display over any other position element, like a dropdown menu. You can eliminate the problem by inserting an iframe shim underneath the drop down. It's not an original idea, I don't know where I found the solution. I modified the suckerfish drop downs javascript file to add an iframe shim. Unfortunately IE 5.0 does not support this method, so I simply hide select elements when using IE 5.0.
You can download it at topnav.js and see a sample with opacity of a single drop down menu here and a cascading vertical menu solution written by another author here.
UPDATE: The unknown author is Ilya I. Gerasimenko and a few fine sandbox experiments can be found at DOM Studies.
UPDATE: You see a temporary sample with opacity of a single drop down menu here.
Check out the latest SimpleQuiz
SimpleQuiz › Part XV: Numbered List Pairs
I like answer "C" for the reasons stated so eloquently by sgd in comment 25. What do you think?
Oops, David Allen’s Blog
Last night I was talking with my good friend and brother in the Lord, Eric Mack. He liked what I had done for both his and this site and wondered if I could do a proof of concept for one of his clients, David Allen. After working into the night with a lot of testing, Eric and I had a prototype up and running. I added comments to the template, and a lot of CSS to control the content management portion of the Blog. I'm very happy with the result. Well, as always there are a few more things that could be done, but over all I'm pretty happy with the site.
Eric and I tested all the links, one of which is a link to Buzz Bruggeman's Blog. Buzz looked at his Blog's referer log and discovered the URL to the Blog we were working on for David Allen. Buzz made a post, Robert Scoble made a post, and now the David Allen Blog is live! The last time I looked, in a few short hours there had been 1038 hits!
If you have a Domino environment, I really suggest that you use Steve Castledine's DominoBlog database template. It is very easy to use and allows the developer a lot of latitude in creating the look and feel of your blog.
Tooting my own horn - Eric Mack Online
I have been helping my good friend Eric Mack with his blog over the last few days. Like my blog, Eric's blog uses the ProjectDX Domino database created by Steve Castledine and used by Ed Brill.
Unlike the design used on this blog, which is elastic based on the text size (IE users can change the text size by selecting the menu item View, then Text size), Eric's blog is based on a fixed design. An elastic design helps the designer keep an optimum line length for easier reading and better comprehension.
We actually did the design last year and it was one of the first Web Standards designs that I helped create. At first we got it working with IE (which I no longer do, I try Mozilla Firefox first, then make it work in IE), then we have attempted to make it work across other browsers. Safari is still problematic and I don't even want to test it in IE Mac which has so many float bugs its almost impossible to create a good Web Standards/CSS design. It seems to work pretty good in IE 5.01, 5.5, 6.0 and Mozilla.
Eric and I also worked on a print style sheet. If you look at this blog in Print Preview you will see that the navigation on the side and bottom are gone and the two background images used on the page are also gone. However even though I've turned off letter-spacing, IE still carries it over from the screen style sheet to the print style sheet. :( We were running out of time when I decided to create a print style sheet for Eric and I really should have done it as a standalone style sheet like I did with my blog. It really does work better this way. As it is the main style sheet works with all media and the print style sheet tries to turn things off.
I'm pretty happy with the design and more importantly Eric likes it too.
Web Standards and this template
I'm committed to Web Standards, though sometimes it can be frustrating to create a reliable layout. Tables make it so easy but I really like the benefits of Web Standards.
- Structural HTML
- Smaller file sizes
- Ease of design change through CSS
- Flexiblity
However it is very difficult to create a page that follows Web Standards when the Domino template I'm using doesn't support it. I really believe that Web Standards is the future for Web Designers. See CSS Zen Garden
IE 5, 5.5, and 6 on the same PC.
While developing a project I needed to test using different versions of IE. It was difficult finding computers with older versions of IE on them to use for testing. I went to friends and a few old boxes but I was never able to test with IE 5.01. After reading an article at Chicago Web Design, I found a way to install different versions of IE on the same PC and run them concurrently. Here's a screen shot of IE 5, 5.5, and 6 running concurrently on one PC. You can tell that it is running each idividual version of IE because there are specific CSS bugs that only each version of the browser will render.
This seems like it would be a great tool for a developer to validate that a Web project works with specific versions of IE. Ryan Parman has created downloadable files with just the files needed to create multiple versions of IE. Just download the zip files. This site also has some very good information on the process. I created a directory called "ieold" and extracted the zip files into it. The zip files created an IE501SP2_NT and an IE555SP2_NT directory. Just run IEXPLORE.EXE in each directory and you get the respective versions. There are some caveats, so read the whole article.
It works great! I'm now able to test new code with older versions of IE on one PC. If you're brave, it looks like you can even run IE 3.0 and 4.01.
First test entry
Well here is my first entry. I really don't have anything to talk about, I just needed an entry to help me design this site.