One of the exciting features about Sparkle is that I was able to import my existing web site into Sparkle page by page using the import feature. I wanted my new site to look much like my old one. I have over 100 pages so it was great. I’ll share a tip that I learned. My site is very text heavy. So I first re-created the top and bottom footers that I wanted to be on each page of my Sparkle site. These were similar to what I originally had.
I kept the original menu and page names from my old site because, like magic, all of the hundreds of original internal links still worked after the import process. I replaced all of my low resolution images from the old site by dragging and dropping high resolution versions of the same pictures into Sparkle.
When Sparkle imports a page it makes every line of text into a separate text box, and these can take a while to merge manually If you want to do some major updating or editing. However if a page didn’t need much editing, this was fine because it still looked the same whether a paragraph of text was in a single text box, or in a dozen boxes.
But on some pages that I needed to do a lot of editing - I opened my original web site, copied the page text from the browser and pasted it into a new single text box on my Sparkle page and after editing there, I was all done.
Then when I created the portrait device version for each page I just increased the body text font size to be easy to read for older folks(14 in my PC device and 10 in the 320 device) and then changed the shape of text and image boxes so that they fit the scrolling portrait view dimensions(long and narrow instead of wide and rectangular). I found that a lot of text in a single box was easier to manipulate in creating a portrait 320 page version then if the text was in a lot of boxes.
So if I was building a brand new web site, I’d suggest planning ahead for the 320 device page. Choose body and header fonts and pre set the style for all pages. Remember that images that appear side by side on a PC device view will need to be stacked on top of each other on the 320 portrait view. Fewer text boxes is easier. Start with high resolution images. Sparkle gives you a small graph that tells you whether your image is high enough resolution to look good on all sizes of devices.
If you keep a smart phone and iPad close close by, you can scan the Sparkle provided SRC code and log into Sparkle’s preview local host and view your preview pages on them to make sure that everything looks good on the different devices as you work.
