Tuesday December 02 2008

Tabs vs Blocks

I’ve been working on a client site and am happy with the progress, and more importantly the client is very happy. The original front page design had the logo and nav on top with three large picts on the left sidebar. The main content section had a highlighted box with for other boxes that load random content. I was happy with this and so was the client, but I decided to put together an alternate index page.

image

The alternate index takes the four boxes and turns them into tabs using the jQuery idTabs plugin. I added two more optional boxes below the tabs. I felt that this allowed my client to get more info on the front page without being cluttered or too busy.

image

Client liked them both but with a slight preference for the original. My preference is for the tabs. I posted links to both pages on twitter and the consensus was for the original. The main reason being offered that the tabs faded into obscurity. After discussion with the client we went with the original, but the tabs are a possibility in the future.

I’m not sure if I agree with the fade into obscurity because it’s not true or because I like the tabs due to a “cool” factor - first time I did that on a web site.


Sean. inscribed these words of wisdom on Tuesday Dec 2, 2008 at 06:58 PM
Javascript | (0) comment | Permalink | tags: clients, code, jquery, tabs |

Wednesday November 26 2008

Vote for Leevi Graham


Sean. inscribed these words of wisdom on Wednesday Nov 26, 2008 at 12:47 PM
Expression Engine | General | (0) comment | Permalink | tags: |

Thursday November 13 2008

Review: Everything You Know about CSS is Wrong

I heard some buzz about Everything You Know about CSS is Wrong, by Rachel Andrew & Kevin Yank and decided to order the book through Sitepoint. I ordered the hard copy as I don’t like reading on screen. Upon recieving the book my initial reaction was; this book is small. The page size is small and there are only 111 pages many of those with screenshots.

it is now up to designers to move the web forward. The opening chapter breifly discusses the history of browsers, design for layout, the implementation of CSS and issues designers have had with Internet Explorer and ends with the good news that IE 8 is coming and has passed the Acid2 test. According to the authors this means that it is now up to designers to move the web forward.

Chapter two looks at current techniques for layout in CSS and the hacks used to achieve the desired look, including floats, faux columns and absolute position. It then looks at the flaws of each approach. Finally the same sample web site is built using CSS tables. The authors discuss the display properties used to turn elements into tables - table-row, table-cell, table-row-group, table-header-group, table-footer-group, table-caption, table-column, table-column-group and anonymous table elements. I find the anonymous table elements particularly intriguing as they will potentially reduce markup.

The authors also clarify the difference between CSS tables and HTML tables. CSS tables are about controlling how elements display whereas HTML tables are about organizing tabular data.

Chapter three looks at practical applications including flexible layouts, nested tables, and positioning inside a cellChapter three looks at practical applications including flexible layouts, nested tables, and positioning inside a cell.  The reader is also introduced to a way to simulate colspan and rowspan. Might one call this a hack? Not sure, since I’ve never done any tables based development.  Source order is looked at - it’s not possible to reorder elements as everything needs to be placed in the order columns are displayed. The exceptions are table-footer-group & table-header-group which can be placed anywhere and will display correctly.

Chapter four addresses older browsers. The basic recommendation is that developers should say “To Hell with Bad Browsers”. That is to say we should design with modern CSS specifications and allow older browsers (IE 6 & 7) display as they will. The authors do offer some solutions including providing a simplified layout for IE6 & 7 using conditional comments. The final option would be to reproduce the layout using current methods in an IE only stylesheet. The benefits according to the authors are greater ease of development and stability. Instead of having to deal with browswer inconsistencies due to hacking CSS to display the grid with floats everything just works (except with IE7 and earlier).

At the begining of this chapter the reader is informed that History Repeats. That is developers should do what was done in 2001 and advocate that users upgrade their browsers by giving them a reason to upgrade - a better internet experience. Save the Developers is recommended for the modern movement - interestingly this site now redirects to a microsoft Internet Explorer page.

The final chapter was very intersting to read about forthcoming CSS3 specifications. However it’s nothing to get overly excited about since it’s not going to be a practical reality for some time to come.

final thoughts

Everything you Know about CSS is Wrong is an engaging read and provides insight into using CSS tables. I’m determined to try this on a couple of personal sites, but am pretty sure I won’t be moving towards CSS tables for client sites until the market shows it’s a more viable option. Anyhow we’ll see what happens - according to wikipedia IE8 final version is slated to be released late 2008. With only seven weeks left in 2008 that should be really soon.

At $29.95 plus shipping I do not think this book was worth the money. It’s far too short - it only took me 90 minutes to read the whole book. If you can read on a screen then I would recommend getting the pdf version.


Sean. inscribed these words of wisdom on Thursday Nov 13, 2008 at 06:47 PM
General | (0) comment | Permalink | tags: css, book review |

Tuesday November 11 2008

My Home Office

Living in an apartment with my wife and two children doesn’t leave me much space for my home office. I’ve got the smallest room with all the walls lined with books and small desk that barely holds my two 22” monitors.  The printer on the left is actually a 4-in-1 combo printer, scanner, fax, copier and the continuous ink mod that is added means I can print in color all the time and spend almost no money.

My day job is a teacher and I print ALOT of copies off at home in color and in the year since I bought this printer I’ve spent $5 on ink.

image


Sean. inscribed these words of wisdom on Tuesday Nov 11, 2008 at 09:02 PM
(1) comment | Permalink | tags: personal, home |

Friday November 07 2008

Forms

I’ve been busy this week with my teaching job and other personal interferences and haven’t been able to get much coding done.

Today I finally got back to work and jumped into forms as my current client has three relatively large forms needed for the site. I’ve heard many good things about the FreeForm Module for ExpressionEngine, but hadn’t tried it out until now. I had it installed, but didn’t really know where to begin - partly due to poor documentation and partly due to never having made a form.

Via twitter gexla, a.k.a John Fuller, offered some help and we chatted for about 10 minutes on MSN and suddenly the lightbulb went off. I’ve since got my first form installed and it’s working for the most part. on submit it redirects to the “We’ve recieved your submission” page, but no email is sent and there is no entry in the module admin page.

I’ve posted on the Solspace Forums and am awaiting a response. I’m sure things will get worked out strait away as I’ve always gotten very helpful support there.

Client site is actually about 85% done - a little styling to go, have to finish the forms, fix the superfish bug in IE and decide how to implement one section of the site so that it has drop down menu as well as a flyout from several of the dropdowns. Not sure how to proceed yet. Fortunately for me, the client is in not in a rush at this point.


Sean. inscribed these words of wisdom on Friday Nov 7, 2008 at 06:17 PM
(0) comment | Permalink | tags: expressionengine, freeform, module, solspace |
Page 1 of 13 pages  1 2 3 >  Last »
logo subscribe to rss

About Me

This blog is my journey to professional web design and development. Here I will write about code and things I learn about xhtml, css, javascript, jquery, Expression Engine, Wordpress and any other CMS I need to use in my new career.

I will be adding links to the sidebar as I find useful resources and blogs. I'm also looking forward to getting feedback from other designers and developers. Thanks for dropping by.

Web Design Blogs

Tutorials

Online Resources

Find Work

Stock Imagery

Validators

CMSs

Recently Bookmarked

Tag Cloud

Reading List

Categories

subscribe to rss