How do you make web text the “Right” size?

You can't tell from bibleicio.us but i've been (re-)learning all the in’s and outs of web design. A lot has changed since the HTML 1.0 days when I got started and while I did geeky backend enterprise database number crunching stuff I lost my edge for the latest greatest in design.

While working on my day job a wonderful fundraising e-store. I've known for a while that my font sizes were different between firefox, ie, and safari. Now my layouts fairly flexible so I haven't worried about it. Now I'm trying to take things up another notch so I went to the web in search of the BEST WAY TO DO THINGS.

Here is what I found and what I decided. I hope it helps those aspiring web designers out there wired Christians and those horrible heathen webmasters as well (sarcasim for the humor impared - just a disclaimer for the bible all the time crowd this is a tech post)

Here's a quick summary of what I know about specifing font-size using CSS.

Problems. Reasons why one size doesn't fit all.

1. Browser inconsistency.
   All of the top browsers Safari, IE 5/6/7, Firefox – not to mention the others Opera, Konqueror, etc, have different default sizes for body and header text
   
2. Operating System differences. Mac, Windows, Linux handle fonts differently and make different assumptions about computer screen resolutions.
   
   Windows makes the assumption that users have 96dpi resolution and also has a Large font size setting for 120dpi screens. I used to use the Large Setting but it was auto-scaling all of my graphics while web surfing making for some really jagged and pixilated garbage (especially for graphics as text at small point sizes)
   
   Mac pretends that everything is at 72dpi and converts to the actual screen resolution behind the scenes. Users have an option to set their actual resolution under preferences.
   
3. Actual Screen Resolutions are all over the map.Visitors to my side have 50% at 1024X768 with 15-20% on 800X600 and the rest on high resolution some of them wide screen all the way to 1680X1050
   
4. Users can change the default font size. Browsers allow users to specify thier preferred size and scale it up or down depending on their preference. Of course how this actually works varies slightly from browser to browser.

CSS Options. Our choices for sorting this out

• Points - This is what we think in, use in word processing 10-12pt for body, 9pt for fine print. Problem: you never know what they will be on a given browser, OS
  
• Pixels - Usually the number of dots on screen. (IE7 and opera have a zoom feature). Firefox allows user settings to scale text. Problem: IE Users can’t adjust size for their high-resolution monitors
  
• Percentages - Relative measure to the default font size. Problem: The default font size can be all over the map.
  
• Em and Ex - Relative measure based on the size of the characters of the container element (or the default font). Works very similarly on all browsers. Problem: this can get very confusing with a complex layout and require many more style sheet rules – one to size headers inside a certain div and one to size headers outside the div.
  
• Keywords - xx-small, x-small, small, large, x-large. Relative sizes that the user can scale up or down. Problem: only a few sizes and most of them are too large. "Like being slapped by an eye chart"

Conclusion {font-size: 12px} {font-size:75%}

This is far from the definitive answer as web design has been and is a moving target. But I can say this is what works for me.

Pixels for fixed portions of layouts. If you specify the width in pixels you should probably specify the font in pixels as well. This would be most commonly used in sidebars, headers, ect. This allows tight layouts with the text to match the size of your graphical elements.

Percentages for elastic or fluid portions of layouts. There are other portions of your layout that flex. Elastic layouts use em’s as the measurement to allow adjustment if the user changes their font sizes. Liquid layouts allow users to resize their window and allow for wide screen and narrow window viewing – they generally use floats or percentages to specify widths. Using percentage font sizes for these layouts will give you the most consistency across browsers, allow the user to adjust their font size, and eliminate any confusing inheritance or nesting issues.

Also check out the eye chart method at ALA especially if you are dealing with older browsers.

Bringing the bible up to date - Bible Web Services

Bringing the bible up to date. A Listing of Bible Web Services

Web 2.0 is the rubber meeting the road of all of the "web services" work that has been going on the last decade.

A brief explaination of web services:
A web page/web application is a way for a person to interact with a computer to buy something or search a database, etc.

A web service is a way for one computer to talk to another computer to buy something or search a database, or retrieve information on a particular topic, etc.

Web services got early traction in intranets and "extranets" linking up the computer systems from one company to their suppliers and even wiring together applications between departments in big companies but really didn't make a dent on the internet until recently.

Then came RSS
The syndication technology that allowed people to subscribe to someones blog. So now my blog or news reader can talk to your blog. Google and Amazon were some of the first large companies to start offering an "API" or web service interface to their information. All kinds of startups started offering api's along with actual pages to do things like bookmarking/tagging, photo sharing, calendars, etc.

So what does that mean about the word of God? Sadly, not much.
Almost all of the good Bible websites are still under the come visit my webpage and I'll sell you more "Jesus junk" model. A true bible web service could be a way for the Christian community to extend the reach of the word of God out of the Bible websites where is locked right now.

Fortunatly there are a few notible exceptions -

There are some notable exceptions - the ESV was the first major publisher to offer a web service. You can make 500 requests per day for free or get expanded use for $100 a year.

Several other hobbiest/companies have put together bible web services using public domain translations, such as the old standby KJV or the WEB bible.

Including -
WebserviceX.NET
Biblewebservice
Francis Shanahan's Bible Webservice

The ESV definately sets the bar while Michael Sumerano's Biblewebservice contribution takes a 2nd place.

So what does this mean? Cheap, easy to use bible web services are the necessary plumbing for really cool Web 2.0 applications. Bibleicio.us for instance needs full text searching and proper paragraph breaks and line breaks in it's display. To do that "right" and easily, I should use a web service, or if none is available solve that problem and make it available as a service.

That way the programmers out there could easily do cool things like make a hover over on your blog that poped up the full text of any bible references you post. A web service could allow you to easily switch to different translations/languages.

Putting my money where my mouth is.

I'm a plumbing guy, so I guess I'll start tackling this problem. I want to swich Bibleicious over to use ESV or possibly Sumerano's service (doing SOAP in php will be new territory for me). If I go the ESV route, the next step will be to create a WEB version with the same API so you can easily switch between them. With Sumerano someone needs to pay the bills - so I either need to help him pay for hosting or port his solution over to php so I can host it myself.

Random Update

Just wanted to give a little heart beat as to what is going on.

I am starting up a new local small group on the Holy Spirit, I wrote about in on my church's blog the scoop.

I am helping a friend start up a blog for his ongoing ministry http://www.realdisciple.com/
Exciting coming soon page right now. But expect good things to come.

But you are probably wanting to know what about the future of Web 2.0 Christianity. For bibleicio.us I am going to do the following:

Opensource the current code on sourceforge or somewhere equivalent.
Immediately branch that and start a new version thats a good deal more structured.

I need the following people with the following giftings.

1) People who will make bible tags. required skills Read Bible and surf the web can relate the two. Perhaps some of the one year bible bloggers could step in.

2) A PHP developer who would like to help me on the real version (the current is just an alpha proof of concept)

3) A graphics designer who can help with the extremely minimalist look of the current site.

I really don't want this to just be my pet project. The goal is and will always be to help build a community of wired delicious christians. Thanks for all of you who have stopped by caught the vision and encouraged me.

BTW I do know there are several other similar sites. Does anyone out there know of any that are open source / community developed. We might be better suited to merging our efforts rather than building several semi-functional sites.

Mmm... Delicious Christians

I got a comment from Neil that really encouraged me. He is working on finding and connecting "Delicious Christians" - christians that tag. His note was simple - let me know your thoughts about synergies. I posted back a few rough thoughts and suggested that we blog about it back and forth.

First my goal and I believe Neil's too is to support the body of believers in the online arena.
So building up a network's of Christians such as Delicious Christians and venue's such as Bibleicious are just ways of making opportunities. Opportunities for the Holy Spirit to do what He wants through the lives and thoughts of believers.

Christains who Tag - I'm one and DeliciousChristians is a whole network of them. If you look at my posts, you'll notice that I most often tag for work and there are a lot of links to php and web development topics, things that are not necessarily Christain but a big part of my life. Looking at the overall list I see a strong general bent to spiritual topics with the geek sprinkled in.

What I don't see - myself included are a ton of bible tags. I think this is because as much as we talk about the importance of scripture, in reality it's not the lens that we use to view the world. The challenge I issue to Delicious Christians is simple, try relating everything you view online to scripture and share with us some of those 'links' and see how it changes you and changes others.

Looking at Bibleicious in it's current form things are very impersonal - it's easy to find a verse but not to find one that has a current comment, or get a feeds of the latests commentaries/links. Looking over the path to beta, I had some plans to help address those weaknesses. It appears to me that Delicious Christains solves some of those issues for me.

• Recruit 20-50 regular users/community members who are intentionally tagging links

See my Challenge above and consider yourself hereby recruited ;) But seriously, I see Delicious Christains - those early adopters of tagging, to be the core group. Sharing our interaction with the God of Scripture could (should?) be one of the main ways that we hang out, interact, and learn from each other. Bibleicious should make it fun

We need Profiles, -

• User home pages - link to blog, list of bible tags, personal info etc.
• List of Users - link to homepages, etc

We need a full tag cloud, -

Delicious Christians is currently a lists of delicious posts by dates (with links by poster). Bibleicious is a list of delicious posts indexed by bible verse

• We need a cloud that aggregates all of the tags used by Delicious Christains and/or used in conjunction with the bible verse tags

We need a standard -

• Okay this is semi-optional but I've proposed a tagging standard for bible verses Eventually, I hope to get more sophisticated and add folksonomy equivalents. This is what I'm using to drive Bibleicious and I can think of a dozen other reasons why this is a good thing.

What do you think Neil? I want to build the profiles, clouds, and standard that should facilitate all kinds of interactions and feeds. I want those to be sharable (stored on delicious, available via rss,atom,javascript badge, etc.) between bibleicious.com, deliciouschristians.com, and the individuals and their blogs that make up our community.

What do you guys think. If you aren't already a Delicious Christain, you should be. Get saved if you need to and then go bug Neil on his blog or add Indychristian to your network in delicious.

Back from Vacation

I just made it back from Vacation. In agreement with my wife, I did not spend any of it blogging. I'll get some pictures up here soon or in one of the other blogs, (We went to the island of Kauai in Hawaii.)

That was in celebration after we finished a few things. As I am now a VLI (Vineyard Leadership Institute) graduate and have completed the re-write of our Church website.

The good news for you is that my focus has shifted back to Bibleicio.us and I only have 2 major projects (not 4 that I'm working on).

Quiet.. Too.. Quiet

It's been quite on my blog - but there has been a lot going on with bibleicio.us.

First off, Tim Bednar is doing some design work for us. Besides the creator of e-church, he has his own web design company, so the site will get a much needed face lift.

The Bibleicio.us community is also growing organtically. I just started a new web group at my church, we started up a blog over at grapepress.wordpress.com Several of them are being introduced to the world of blogging for the first time. I am excited about having some of the same people online and offline to participate in this project.

Techno Babble -

I have started working with a great new php framework called CakePHP . It's like Ruby on Rails but you still get to keep the number one web development language and it's massive online library of example code and scripts - ie php. Several of the things that I'm learning, using there will be a huge help over at Bibleicio.us.

Why Tag the Bible?

When emailing back in forth I got this question -

I still can not figure out why I'd spend time tagging the bible?

Good question, there are plenty of online and offline commentaries, software products, studies, etc. For the non-professor, scholar, average joe what value is there in tagging the bible?

Much in every way!

While those discussions of exegesis and hermeneutics are valuable, it's you who has to live out your spirituality.

Instead of describing the bible as a scholarly exercise, try linking biblical truth to your online life such as -

"This happened yesterday to me and I'm blogging about it / I read about it in another blog / I read it on the news / I read an article." ....

"It was good/bad/sad/interesting/hard" ...

"It Reminded me about Psalm X or Proverb B or Book Chapter Q"

"How it's really comforting / challenging / useful / true / difficult "

The Benefit is this: You learn to look to the scriptures to help you understand you're everyday existence - you're relationship with God and his universe.

The Jewish way was to meditate on the scriptures day and night, in the midst of everyday life and use them to frame their perspective of the world around them.

Benefit two - blessing others

Next when someone is reading Psalm X or Proverb B and say's what does this mean? How is this relevant? They have a page full of links including yours that act as examples to help them engage the God of the bible in their everyday life and figure out how that particular scripture is useful.

My hope is that a community tagging the Bible in this way will be transformed by a deeper understanding and engagement of God and the Bible in their everyday life.