Details, Details…
Once I upgraded my iPAQ h5455 to Windows Mobile 2003 for Pocket PC (a.k.a. Pocket PC 2003,) I decided to modify my Start Page to use Cascading Style Sheets instead of directly formatting each page. Now if I want to make a change to something, I can just edit the style sheet and the change is reflected on all the pages automatically. CSS rocks and I’m happy that Pocket IE now supports it! Using styles, I can finally turn off hyperlink underlines on the page, too! 
I wish PIE supported CSS positioning so I could eliminate tables entirely.
My goal was to make the content of all the pages fit without any scrollbars, but with the Address Bar turned on. many of the pages don’t meet this goal. This is fine with me as I never keep the Address Bar on when not in use. The page is designed to work only in portrait orientation. If you were to use it in landscape mode in its current form, the menu and header would probably not work too well. This is because of the way Pocket IE compresses images when set to “Fit to Screen” mode. This is another thing that I will have to address when Windows Mobile 2003 Second Editon comes out since that release includes native landscape mode support, as well as support for VGA LCDs. I also used the HTML meta tag which enables ClearType in Pocket IE, but doesn’t always look good in landscape modes due to pixel orientation. (ClearType meta tag: <meta http-equiv="ClearType" content="true">)
This set of pages was entirely hand coded to make them as small and efficient as possible. Since Pocket IE isn’t known for its speed, I didn’t want a bloated HTML file created in something like FrontPage making things load any slower than is necessary. In the previous version, layout was done using a mix of tables and a 1×1 transparent GIF file resized to whatever dimensions were required to get spacing correct. The new version uses CSS properties to define spacing of elements on the screen. This makes for smaller and cleaner-looking HTML files, and consolidates formatting into a single style sheet. It has the somewhat unfortunate side effect of making the page unusable with Pocket PC 2002 since its IE version doesn’t support CSS at all.
The tab bar on the left side of the pages is made up of a total of nine GIF images with transparent backgrounds; four for the “not selected tab” state, four for the “currently selected tab” state indicated by the white box around the word, and one for the separator line. I suppose I could have reduced that to four images total by using an image map… maybe in a future revision.
I designed the menu bar to be as wide as the Start menu’s Windows logo button (twenty-five pixels wide, plus one pixel for the white line), and extended the white divider line down. It’s unfortunate that there is no way to tell Pocket IE to render text rotated vertically, as that would greatly simplify adding to or changing the menu. As it is, any changes require modifying the menu graphics by hand.
The background of the page is a single PNG file that contains the white background, menu bar background, and the page header background. Each element of this background is a separate layer in a Photoshop file, making color changes or addition of textures or gradients to individual sections very simple. The drop shadow is courtesy of a Photoshop layer effect and added because I like the sense of depth that this gives the page. This layered setup lets me easily create a different color scheme for IE to match the Today theme that I’m using at the time. (Note the alternating colors which match the Start menu button and title bar.)
Continue to page three for a gallery of themes included with the download.
Rock on.
What a nice start page.
Is it possible to add a page with rss feeds inbedded in it?
I’m not entirely sure what you mean. If you want to actually display RSS feeds within the page, I don’t know if that’s possible. If you just wanted to link to some RSS feeds for whatever reason, you could certainly do that using regular HTML hyperlinks.
I am not a PPC geek by any stretch of the imagination and I was a little cowed by the thought of copying files all over the place. NOT at all hard and the result is a stunner. So much better than the start page out of the box. Great work – thanks a lot
Great work. I think the next step now is to make an internal webserver to offer some really dynamic driven start page. That’s something I plan to do so let me know if you’re interested.
Great piece of work…keep it up!
Dave, you mention this in your review, but I’ll point it out anyway: looks like the PIE that comes with WM2K3SE doesn’t do CSS the way your pages require. Still, though, nice work.
That’s not entirely surprising, though it is a bit disappointing. Since PIE in WM2003SE changes the way it renders pages, I figured some tweaks would be needed. I have an hx4700 on the way so I’ll see what’s needed to make it work on a VGA screen. Unfortunately, I no longer have a QVGA Pocket PC so I may make two versions of the Start Page available; one the way it is now optimized for 240×320 Pocket PCs running WM2003 and another for WM2003SE devices. I’m hoping that tweaks for VGA will also work okay for QVGA.
It’ll also be interesting to see how the thing works in landscape modes and when running in “true VGA” mode with SE_VGA. If anyone wants to send screenshots of the page on their new device, please e-mail them to me at “comments” at this site’s domain.
I cant tell you how much I like your Start Page. I made some changes based on my favorite links and it was great.
But two days ago I installed HP Print 4.0 and Pocket Informant update to version 5.5.
Since then when I start the PI explorer the screen goes wild. It looks like Stop/Refresh button gets stuck and the screen is trying to refresh endlessly. The only way to stop it is to close the program.
I tryed to uninstall both programs but it did not help.
I am wondering if you have heard about this issue?
I have never seen that problem before. I can’t imagine it’s related to my Start Page, though, since it’s just simple HTML and style sheets. I also use Pocket Informant v5.5, but haven’t installed the new HP Mobile Printing software yet. Mobile Printing v2 is in ROM on my hx4700 and it works fine for the rare occasion that I need to print from my Pocket PC.
Do any of the menus work in Pocket IE? Can you reset the home page to the default? If not, and you have a Pocket PC registry editor, you can edit “HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main\Start Page” and set it to about:home then start PIE again.
Now I know for sure that it is HP Mobile Printing 4.0 that causes the problem. After I restored from my back up file and installed PI 5.5 everything worked fine, but after installing HP Mobile Printing 4.0 the same problem with PIE Start Page repeated itself again. Please let us know if you’ll find the solution.
There isn’t really all that much I can do to fix the problem. I can’t believe the problem would be caused by anything I did, but I guess anything is possible. Since it happens after you install HP’s Mobile Printing app, I’d recommend contacting HP about the problem since they are more likely to have the time and resources to track down the source of the problem.
I can confirm Alex’s findings as they match mine exactly. It is important to note that this effects the Start Pages loaded off of the device (h2215 in my case) file system, but the pages work fine if you put them on a web server and access them via the web. You can test a web installation at http://www.drealm.com/archive/PIE/.
Progress. If I remove the top line of each index file it will work. I removed < !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Not sure why, discovered via trial and error.
Correction: You need to remove the comments to make it work. The DOCTYPE line can remain, but the line must come immediately after the DOCTYPE line.
That is just really strange — especially the fact that the same page loads fine from an online location. Thanks for troubleshooting this, Chris! On your Pocket PC, does the path to the Start Page files contain any spaces or unusual characters? I’m just trying to comprehend why it works online but not on your local copy. Even more frustrating is why HP’s printing software causes such a bizarre symptom.
Glad someone else was having the wild PIE_Start_Page opening after installing HP Mobile Printing. I will apply the fix that you guys have figured out.
Thanks everyone
Hi there,
I got the same refreshing problem. I also have HP print 4 installed. I would like to have this PIE Start work but I don’t realy understand the workarounds for this problem from Chris Hanley. How can I change the Index file?
Wouter
Hi guys. I got the same problem with my MDA II and this program and HP print 4. I would like to have this work but I don’t understand the workaround from Chris Hanley. How can I change the Index file? Who can help me out here?
Wouter
Hi, does anybody have figured out a way to develop drop down menu in Pocket Internet Explorer? I tried Java script, it does not work. My os is Windows Mobile 2003 on Axim X30.
The mobile version of PPCW.net uses drop-down menus quite well. Have a look at the code used there to see if that helps.
I’m anxious to use your progi on my WM 2003 SE, please let me know if/when you update it to work with this release. Thanks!
It actually works great as far as I can tell. Everything looks pretty much the same on my VGA hx4700 as it did on my old h5455. I do know that it won’t look right if you run in “true VGA” mode through the use of a program like SE_VGA, but in the regular high-res mode provided by Windows Mobile 2003 SE on VGA devices, it looks fine. I’ll be revising this page soon to include updated information and a screenshot or two from a VGA device.
Do you have a VGA or QVGA device, Drew? Please go ahead and give it a try and let me know if it doesn’t look right for you.
Pingback: The voice of pdaclub » Blog Archive » ê¹”ë”í•œ PDAìš©(ì˜ë¬¸) 스타트페ì´ì§€
Google to the rescue. Google’s beta Korean-to-English translator allowed me to get the gist of what the previous comment was about.
I love your Pocket IE template…. but just wondering if you can assist…. In Windows Mobile 2003SE, I excclusively use the “One Column” Layout of pocket IE. That just plays havoc with your template. My question thus is there an ‘easy’ way to change the html code in your template to get it to display properly using the one column layout format? (I’ve played around with html before but not to that extent)
Thanks
Wow… never noticed that before. (I very rarely use one-column mode.) The problem is that I still have to use a table for some layout since Pocket IE still doesn’t support positioning with style sheets.
The “tab bar” along the left side of the page isn’t actually text — it’s a group of GIF images — so PIE can’t really do much with it when shifting content around in one-column mode. Moving the tabs to the top of the page would resolve that problem.
Actually, that would eliminate the need for the table, and I could use text instead of GIFs, too… hmm… Maybe in the next version. I’m hoping Windows Mobile 5 doesn’t completely break it.
Dear Dave,
I own an Anextek SP230 PDA Phone. It runs on Microsoft PPC 2003. I connected a Sandisk SD Wifi card on it. The card works fine. Link Quality and Signal Strengths are good. Pinging it shows no data loss.
However, I can never get the Internet Explorer to work. I alwas get an error ” The page you are looking for cannot be found”. I have installed your new start page, but it doesn’t help.
Anyone out there who can help me?
Robert
You might get a lot more help by posting your question in the forums at a Pocket PC site like Pocket PC Thoughts. My initial guess, however, would be that when you setup the wireless LAN connection, you selected the wrong connection type. Options are “Work” and “Internet.” Whatever it’s set to now, change to the other and see if it works then.