Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2009-11-19 02:34:40

lifeJam
New Member
From: Canada
Registered: 2009-11-19
Posts: 7
Website

MobileWarp - 1-st done ... to go

Hi,

First post, first site.

Kind of a side obsession project (I’m a techie, not a web designer) – information and review site about mobile broadband.

Fluid design, Txp 4.0.8, jQuery, and jQuery Tools

http://mobilewarp.com

Plugins:

  • zem_contact_reborn-4.0.3.20, z
  • wet_article_thumb-0.4m,
  • smd_gallery-0.51,
  • chh_if_data-0.10,
  • adi_gps-0.1,
  • soo_toc-0.1.4,
  • smd_pullquote-0.1a,
  • ako_social-0.4,
  • rss_unlimited_categories-0.7.4p13b,
  • rss_admin_show_adv_opts-0.3,
  • sed_packed_custom_fields-0.2,
  • soo_image-1.0.b.2,

Will accept constructive criticism :)


‘innocence is no excuse’ – Saxon
mobileWarp | cureAnxietyPanic

Offline

#2 2009-11-19 10:11:40

pieman
Member
From: Bristol, UK
Registered: 2005-09-22
Posts: 491
Website

Re: MobileWarp - 1-st done ... to go

Nice work! Seems like you made the right choice of CMS ;-)

Some compliments:
  • generally feels easy to navigate and browse
  • putting your sitemap into a fruitless search results page is a great idea – might have to steal that one
  • the soo_toc / smd_pullquote combos work really well on long articles
Some small (hopefully constructive) criticisms:
  • the Wishlist link seems dead
  • articles have the excerpt in there twice – not sure if this is planned, but it doesn’t really make sense to me
  • <ol>s for the toc lists would seem a better choice – you have bullets and numbers together at the mo (I’ve not used soo_toc so it might not be possible)
  • the “FREE” links in the BEST VALUE TODAY panels don’t do anything
  • the Compare section is empty (you know this though, right?)
And one question: in Modem articles, how did you create all that structured data? I can see
  • title
  • strapline
  • summary
  • body text
  • Features / Specs / Where to Buy

Are the extra bits done with custom fields? If so, I’d love to hear how you did it.

Offline

#3 2009-11-19 20:34:59

lifeJam
New Member
From: Canada
Registered: 2009-11-19
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

Thanks Pieman!

Yeah, you are right, the wishlist and compare are not done yet – need to comment them out.

For the choice of CMS – you are very right.

I played with Wordpress first, but it just breaks very fast if you add more than 5 plugins or need to hack the core (and break the install in the process). Also good luck modifying/customizing themes!

While at it I got hooked up on textile and decided to check out the source (TXP). Then I realized that what in WP required a separate plugin (e.g. to output a list of related articles in the article body, you would need a plugin, and then you would insert a tag in the article body lile [output_related_category_xxx] or somesuch), was actually a core functionality in TXP!

I also tried very briefly the pivotlog and even bought a book on drupal, but never even installed it (looked very complicated and heavy) :)))

After looking at TXP I realized it was doing this stuff in the core!
So I bought the book, read it, and took the plunge. Love it.

For the modems articles – I really decided that I would love TXP (and jQuery tools ) forever after I tried and it worked.

So, I use a combination of custom fields (with sed_packed_custom_fields) with jQuery tools tabs.

First I pull out the title, excerpt (summary), article image, and a bunch of custom fields (strapline, price, etc.),
then I pull the article body, where I have a bunch of predefined divs (overview, expert opinion, features, specs, where to buy), then I use jQuery tools to initiate the tabs, and push some of the divs (features, specs, where to buy) into the righside “panes” div.

Another approach that I’ve tried and it works, just not on the live site – is to kinda emulate the db. You can have your product specs in one article, and product review in another article. Then have a custom field in both (e.g.“product_id”). Then in the article form you can call one of the (e.g. review), pull it’s “product_id” custom field, and then pull the other article via (txp:article_custom custom_field=‘product_id_value’).

Hope this helps…

Last edited by lifeJam (2009-11-19 20:36:34)


‘innocence is no excuse’ – Saxon
mobileWarp | cureAnxietyPanic

Offline

#4 2009-12-01 16:55:01

davidlaakso
New Member
From: Boston
Registered: 2009-11-27
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

Nice job.

By “fluid design” I assume you mean <wink> within the range of 940/1200 (rather than, let’s say, 620/1200). Looks fine in IE/8 and IE/7 and degrades well in IE/6 (with the xception of a little vertical jump on hovering the left col-links in 6.0).

Some might argue (probably, in vain) that your font- stack might be better for both Mac and PC if reset to: “Helvetica Neue”, Arial, sans-serif;. You do need to be a “little careful” with declaring 62.5% on the body as that method can sometimes cause problems for users who set a minimum font-size preference— check your page at pref 16px min font-size in FF, for example…

Incidentally, screen.css appears twice, and print.css is a no-show.

Offline

#5 2009-12-01 17:13:45

jstubbs
Moderator
From: Hong Kong
Registered: 2004-12-13
Posts: 2,395
Website

Re: MobileWarp - 1-st done ... to go

Sorry to be off topic – @davidlaasko: What method do you think is wise for the body font size?

Richard Rutter (who I believe came up with the 62.5% technique) recommends font-size:100%; line-height:1.125em; for sizing text although I see very little use of it in sites today.

Offline

#6 2009-12-01 18:52:34

davidlaakso
New Member
From: Boston
Registered: 2009-11-27
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

@jstubbs

We are in the wilderness of matters of /personal opinion/, if not the triumph of mediocrity, when it comes to Web typography and sizing it.

Note that in Rutter’s font-size:100%; iterations, he then substantially reduces the font-size of the content-text p to far less than user default. To each his own.

Me, I prefer to declare user default in percent (100%) on the body and use percent throughout the style sheet with line-height set as a unit-less raw number. Primary content p inherits default: secondary content and navigation at 95%; and, tertiary content at 90%. In other words the range is 100 to 90 percent with nothing set smaller than 90 percent.

The proliferation of laptops and their sometimes extremely hign dpi settings makes it even more apparent now, then ever, that flirting with user preference is a dangerous game…

Best,

~d

“Typography exists to honor content”
— Robert Bringhurst
The Elements of Typographic Style

Offline

#7 2009-12-01 19:04:40

lifeJam
New Member
From: Canada
Registered: 2009-11-19
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

@davidlaakso

Thanks for the feedback.

screen.css appears twice

How the hell did it happen? Probably played too much with meta. Will fix, promise.

print.css is a no-show

hmm… don’t see it. Print preview seems to be working in both FF and IE7.0 for me.

Thanks for the typography thoughts. Just used sensible technique from a book.


‘innocence is no excuse’ – Saxon
mobileWarp | cureAnxietyPanic

Offline

#8 2009-12-01 19:55:13

jstubbs
Moderator
From: Hong Kong
Registered: 2004-12-13
Posts: 2,395
Website

Re: MobileWarp - 1-st done ... to go

David, very interesting. Not sure I follow what you mean by “unit-less raw number”?

Do you have a link for further investigation of your technique? I should create a new thread for this..

Offline

#9 2009-12-02 00:27:37

davidlaakso
New Member
From: Boston
Registered: 2009-11-27
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

@jstubbs

For example, line-height: 1.4; is a valid “unit-less raw number.”

You asked “What method do you think is wise for the body font size?” I replied with the method I prefer. Honoring user default is not “my technique.” It is simply one of many methods one may use to set fonts for the Web.

Set the fonts as you prefer. Or, set the fonts as your users prefer. Either way, it is your call. Or, is it?

~d

“Typography exists to honor content”
— Robert Bringhurst
The Elements of Typographic Style

Offline

#10 2009-12-02 05:26:40

davidlaakso
New Member
From: Boston
Registered: 2009-11-27
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

@lifeJam

In the head of the document are you not calling this exact same style sheet twice: screen.css???

Offline

#11 2009-12-05 15:10:44

lifeJam
New Member
From: Canada
Registered: 2009-11-19
Posts: 7
Website

Re: MobileWarp - 1-st done ... to go

bug – fixed, thanks!

When clicking “Print article” link in articles – I force print.css for screen media. Inserted condition, but forgot to clean up old screen.css call…


‘innocence is no excuse’ – Saxon
mobileWarp | cureAnxietyPanic

Offline

Board footer

Powered by FluxBB