[geeklog-devel] New Theme Progress

[=MF=Geiss]

Hi all,

Mark and I have been hard at work lately, and at least I'm at a point 
where I feel its time for more feedback from the dev community.  The 
theme has been re-tooled somewhat. I feel its now lighter, brighter, and 
cleaner. To recap, this theme which is up for potential inclusion as the 
default theme in the 1.5 release, ( I believe we will still include the 
Professional theme as well, but it won't be default, if everyone agrees 
) features the following:

-Tableless layout structure. Everything is DIV and CSS based.

-SEO (Search Engine Optimization where the center "story" column comes 
first in the code, followed by the leftblocks and rightblocks).

-Modular CSS files. CSS is separated by global layout, menu styling, 
color (soon to be anyways Wink), and general style.css. (stay tuned for 
more info from gllabs.org on why this is sooooo cool!)

-100% backwards compatible with GL 1.4.1 ( see for yourself at 
http://geiss.getmyip.com/gl141/ )

-and some /super secret mojo/ from the minds at gllabs.org!

Dirk, I worked on the things you mentioned below in your earlier reply. 
I've added comments interspersed below. Everyone, please let us know 
what you think! :-)

http://geiss.getmyip.com/gl15/

Thx!

Eric

Dirk Haun wrote:
>> http://geiss.getmyip.com/gl15/
>> Anyway, a few things I noticed, in no particular order:
>>
>> - My browser window is something like 720 pixels wide (canvas size) and
>> I get a horizontal scrollbar even though there's nothing apparent on the
>> front page that would need that much space. How good does this theme scale?
>>
>>     
All fixed now. The theme scales very well. I still need to tweak table 
sizes that have fixed widths for things like the calendar at 800x600, etc.
>> I see, for example, that on the calendar index page, the column for
>> Saturday is partially hidden by the right side block while the colum
>> heading and the mini calendar above it are overlapping the right side
>> block (screenshots on request).
>>
>>     
I never saw that issue before, but looking at it now (and at 800x600) I 
don't see anything being cut off. Double check it and please let me know 
if it looks better for you now. :-)
>> - I always thought the Professional theme had too many horizontal lines
>> thrown in. Have you tried leaving out the horizontal lines between side
>> blocks and between stories?
>>
>>     
They're history.
>> - Speaking of side blocks: To me it looks odd that the light grey
>> background of the left side blocks just ends somewhere in the middle of
>> the page. Likewise on the right side, only that there are more blocks
>> there so it's not as obvious. Shouldn't the grey background end flush
>> with the footer, like it does with the header?
>>
>>     
I haven't found a CSS layout that will do that *and* be SEO with the 
content placed first in the code. You can have one or the other, not 
both. I've chosen SEO over blocks going all the way to the bottom. If 
you know of a layout that will serve both masters, please share! :-)
>> Alternatively, the side blocks could have a proper border at the bottom,
>> like they do on their right and left side (where they border with the
>> content area), respectively.
>>
>>     
Done.
>> - Looking at the site in Lynx (/me can hear the groans ...) I notice
>> that the content of both the left and the right side blocks comes first
>> before you get to the actual site content, e.g. the articles. That could
>> have some impact with search engines.
>>
>>     
Fixed. We are now SEO friendly, with content first, *then* leftblocks 
and rightblocks in appearance in the code. Mark Evans gets a hearty slap 
on the back for figuring out that dilemma. (/me high fives Mark).
>> This is also something visually impaired users would have to struggle
>> with. There's an old feature request for this, actually, from which I'm
>> quoting some portions below:
>>
>> --- snip ---
>> Geeklog with professional theme is not very accessible for blind
>> computer users.
>> ( I am self blind and to use computer I use screenreader JAWS, http://
>> www.freedomscientific.com)
>>
>> suggestions:
>> 1. add to header.thtml between <body> and start of content (menu, search
>> form or ...) 
>>     <a href="#content_start"><img src="{site_url}/images/speck.gif"
>>     width="1" height="0" alt="skip navigation"></a>
>> and to the end of header.thtml
>>     <a name="content_start" id="content_start"></a>
>> this modification creates top of the page link with very litle picture
>> (heigth/width 1:0) and alt text (alt text is visible to the screenreader
>> users) and anchortag to jump directly to the content area.
>> string "skip navigation/jump to the content... must be in language file.
>>
>> (...)
>>
>> 3.
>> problem with search field (simple search) 
>> search field don't have descriptive text
>> possible solution: add to input tag (<input type="text" ... 
>> title atribute with descriptive text
>> descriptive tekst from language file
>> --- snip ---
>>
>> bye, Dirk
>>
>>     
Added all the above code for screenreaders. :-)