HTML Help

varocketry · Joined: 21 Oct 2009 Posts: 5

All:
My son has created a neat site for a business he'd like to start while in school.
http://www.techcheckuva.comHis website

He has a great design eye and created the site in Photoshop including text and all was output as IMAGE slices. So it's pretty but not readable by search engines (all text is actually small jpg files).

I've spent some time and rearranged the Photoshop file's slices and found how to make some SLICES work as editable text areas for the site's content. My table built to structure the text is stretching BEYOND the original text box size so there are now GAPS in the shadowed border images.

http://www.techcheckuva.com/ComputerTips/indexsliced_V2.htmlMy edited version with 'border image gaps

My son is working to embed the correct font into the site but I hoped someone might have an easy solution to the Stretchy text box and border image problem. Aren't there techniques for tiny slices to fill the stretched border space seamlessly?

Many thanks for any assistance.
Jim

PS Great site I found you tonight, much to learn here.

PayneLess Designs · Joined: 28 Feb 2007 Posts: 4289 Location: MS

Oh, I really hated to see you were using tables, :P. You are using a XHTML 1.0 document type which takes very strict coding compared to HTML 4.01. You have to be syntactically correct with XHTML 1.0.

Can you attack the HTML errors first? Might read:

Images, Tables, and Mysterious Gaps

Tableless Web Design

varocketry · Joined: 21 Oct 2009 Posts: 5

I can Re-SLICE the Photoshop image into HTML slices vice Xhtml.

Also, I'm reading how to SLICE into CSS layers. The code is generated by the PHOTOSHOP SLICE WEB OUTPUT process.

J

varocketry · Joined: 21 Oct 2009 Posts: 5

Please try this link now:

http://www.techcheckuva.com/ComputerTips/indexsliced_V4.html WEBSITE

Interesting how the CSS renders the problem of the underlying HTML code being larger/longer than the image slices.

Ideas?

PayneLess Designs · Joined: 28 Feb 2007 Posts: 4289 Location: MS

OK. The URI of the doctype is missing. Full one is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

That absolute positioning is going to be a killer on the flexibility of your pages in different browser window sizes.

Will try to take a closer look at code ASAP.

varocketry · Joined: 21 Oct 2009 Posts: 5

I believe the fixed width was to be able to present the same, albeit limited screen real restate, browser presentation to all. The site width is less than 800.

If this comment doesn't fully address your concern, it's due to my lack of knowledge of browser rendering differences.

Thanks so much for the offer to help.

PayneLess Designs · Joined: 28 Feb 2007 Posts: 4289 Location: MS

OK. Not referring to a fixed WIDTH. Referring to the absolute positioning. Even the fixed width will have a problem with browser window widths less than 800px as that kicks in an horizontal scroll bar as normal.

The fixed positioning is relative to the window size of the browser. Not the window size of the monitor which indirectly will affect the overall browser display size, i.e., 22-inch monitor versus a 10-inch Notebook screen.

Use of percents can help make pages flexible as long as all other elements are set to work with that flexibility. Some people like fixed, others like flexibility. Absolute positioning is pure rigid and page falls apart quickly at small browser window sizes.

Will be gone part of day, so can not get to your code yet. Maybe if Sticks drops by, he can give a hand.

varocketry · Joined: 21 Oct 2009 Posts: 5

Well, I'm open to all suggestions.

THanks Ron