Archive for Code

Microformats are the way of the present, and most certainly the way of the future. This is simply an approach to HTML that allows you to markup information on your site in a way that allows humans and devices to use the text/data on the page in new ways.

We use microformats at theaterchurch.com to markup our contact information and events schedule. Visitors to our site can take that information from a page and into their address books or calendars in one simple click. It is also easy to work microformats into dynamic content by inserting them into the markup of your content management system. I have crafted our content management system to microformat our data at strategic places, like the small group directory, where visitors can add the small group leader’s contact information right to their address book. It’s completely hands-off, once a system is in place to produce the proper markup.

While it’s hard to gauge how well microformats are utilized, I think it’s clear that it has been valuable for us to offer this feature. It’s so simple to implement that the ROI is strong on the return side. And yet, as the popularity of microformats increases, we’ll be strategically prepared to deliver in the coming years.

I have several projects in which I’ve implemented microformats and I will continue to endorse microformats among my web developer peers. If you are not in a position to personally add microformats to a site you control, talk to your web administrator about getting it rolling!

If you are interested in discovering and using microformats on the Web, I recommend the Operator extension for Firefox. There are other options available. Some sites may make hCard or hCal content available through tools like Technorati Contacts or Events and tie the service into microformatted content on the host site. This is an approach I regularly take in making microformats accessible without the need for a third-party tool. Firefox 3 should support microformats natively, and I would not be surprised if other browsers followed suit.

Obviously, I think that creating content online is important. But adding value and meaning to that content through semantic markup, including microformats, is a great step in creating content that is accessible, modular and re-usable!

If you are interested in microformats, be sure to check out microformats.org. There is also an excellent book/blog on the subject called Microformats: Empowering Your Markup for Web 2.0 from web expert John Allsop. I highly recommend it both as a great read on microformats as well as a technical resource.

Technorati Tags: microformats, html, semantic, markup, accessibility, content, open, operator

The World Wide Web Consortium (W3C) has recently improved the markup validation service in both design and function. While I lean on the Tidy HTML Validator plugin for Firefox for most of my markup checkups, the only official way to scan for flawed markup is to use the W3C Validator.

In recent years, the Validator has worked well, but was often slow and was never easy on the eyes. The new design is a vast improvement and there is a noticeable pick up in speed.

If you are a web developer who has yet to wise up to web standards, I’d encourage a visit to the W3C. Test your markup using the Validator and improve it until it validates against a modern DOCTYPE.

HT: Justin Thorp

Technorati Tags: w3, w3c, validator, service, html, markup, design

Two packages are arriving soon. FedEx is helping me track it.

Everyone except Dave Clark is welcome to an educated guess based on all present clues.

Technorati Tags: fedex, track, package, guess

Over the past several months, I’ve received many emails about Web design and development. Some of the questions are simple and have complex answers, while other complex questions have quite simple answers. There have also been plenty of questions that I did not have the answer to and those questions inspired me to research. Over the next several weeks, I’ll answer many of the questions that have been frequently asked. This will centralize my responses and save valuable time when replying to a frequently asked question. Ultimately, all the questions will be gathered on a static page of this site for archival and easy access.

I started tinkering with Web design and development in 1996 after discovering the World Wide Web and the Yahoo! search engine. At first, I learned HTML and hand-coded (or copy/pasted code¹) to build single pages. They were gray with horizontals rules and quite ugly. I discovered Microsoft FrontPage around the same time and decided to fully rely on WYSIWIG creation of sites and abandon the process of hand-coding. After a couple of years of mild interest, I gave up the hobby and concentrated on music and school.

In 2003, my interest was renewed and I was quite surprised by how much the Web evolved since I had last been involved deeply in it. Specifically, there was so much discussion (perhaps heated argumentation is the best description) amongst Web developers regarding the issue of Web standards. I was amazed at what I discovered, but never really practiced standards-based coding. In fact, I spent the first year of my renewal doing simple WYSIWIG-created sites using Macromedia Studio MX (now Adobe CS3 Web), honing my design skills in Fireworks and allowing Dreamweaver to create the layout based on “slices” from Fireworks. The right tools. The wrong approach. It’s embarrassing now, but that’s what I knew to do. Soon after, I really began to buy in to the Web standards movement and slid back into HTML with relative ease. I also began learning CSS and voraciously consumed as many tutorials at the W3 Schools as possible. At the same time, I was carefully researching information about the World Wide Web Consortium (W3C) and the Web Standards Project (WaSP).

My professional career in Web design and development began in April 2005 as I was employed by the Alabama State Bar. Not only did I increase my skill in HTML and CSS, but I learned so much about server administration, managing Apache, analytics and security. Most importantly, I started working in programming languages, namely ColdFusion on the job (I learned a ton from our resident programmer) and PHP at home. I collected and installed many open source applications like PunBB and WordPress and just opened the hood and started learning the ins and outs of each system. I love the power and flexibility of these applications and the way the content just flows out of the MySQL database and into the markup with such ease. Needless to say, I was hooked on what could be accomplished with the power of the dynamic Web. And I developed a deep appreciation for content management systems. My whole idea of Web development took a radical shift into developing Web sites using these powerful systems as a means to publish content. I started this site around that time and began to chronicle my experiences in the profession.

Working a full-time job in the industry was probably one of the most enriching things that could have happened to my craft. Since then, I have continued to learn both fundamental and bleeding edge techniques in the art. Even today, I learn something new with each project.

Feel free to comment here. If you are a Web designer/developer, when did you start? What’s your story?

Technorati Tags: web, design, development, html, css, w3c, standards, adobe, macromedia

¹I do not recommend copying and pasting code as a means of web developing.

The framework-turned-system is ready for public consumption—or perhaps cautious public consumption. At any rate, you can peruse version 0.1 alpha of the ModLite CMS if you’re ready to dive in.

One catch. For the time being, I have decided not to release a public link to the system until I’m fairly certain that it is a secure product. Actually, I’m certain it is fairly secure now, or I wouldn’t even consider delivering it. But I want to be most certain that it’s all locked down.

With that said, I must also add an up-front disclaimer: use this CMS at your own risk. I discourage using ModLite on any live site as it is in a very infant development stage and as with any alpha-level product, you should exercise extreme caution. I will say that I am using an even earlier iteration of this system (version 0.01, I guess) for a live site right now, so I believe in the product enough for my own data. I simply cannot take responsibility for yours, thus my recommendation to keep things local.

If you are a PHP developer with an eye for security, please get in touch with me if you’d like to work to improve ModLite.

If you are a creative person and you think the name ModLite—which is short for “Modular, Lightweight”—is terrible, please get in touch with me if you’d like to rename the project.

To download this version, or leave a comment below.

ModLite Official Site

ModLite Documentation

Technorati Tags: modlite, cms, php, xhtml, css, framework, web, design, development, tools

Recently, NCC launched Chase the Lion, a microsite built for a seven-week series based on a new book from our pastor. While developing this site, I determined that the data management needs weren’t quite so heavy that we needed to implement a full CMS, like ExpressionEngine or WordPress. And even though it isn’t difficult to build a site with a full CMS backend, it does take enough extra effort that it isn’t worth the time in certain scenarios—e.g., in very time-sensitive operating environments like ours.

For Chase the Lion, I built a very simple CMS by hand. During the last few months, I’ve tweaked a small framework that I use when starting a new project. (I’ll write up a bit more on my framework and may even post it for public consumption if enough folks want to see it.) In this project, I upped the ante even further to create a very rudimentary PHP-based CMS that can be used to power small, mostly static sites. It is simple for the site to extend, but the tool can only be leveraged by me (or anyone with basic web development skills). There is no admin CP, no WYSIWYG editor and no file organizer. It’s barebone, but I think that’s the beauty of it. Sure, I could build the CP, add support for data storage in a MySQL database, add that pretty WYSIWYG editor and let an administrative assistant go wild, but why should I? Sometimes the site content changes very slowly (or never) and can’t really merit adding weight by integrating that full-featured CMS.

Yes. At least, I’ve begun to believe so.

Yet it is still a question in mind, even though I feel I’ve derived an answer. Perhaps my answer can’t be definitive by nature. And certainly there are times when code is simply code, lacking what most people would define as design. But I think in its inherent nature, code is design. And, much like design, code is either good or bad. The developers of WordPress have a nice mantra: “Code is Poetry.” I believe it is—or, at least, that it can be. Thomas Fuchs thinks programming and design are actually one thing, not exclusive of each other. I’m beginning to see why he feels that way.

Lately, I’ve been involved in a few projects that have really opened me up on the programming side of this business. I’ve enjoyed developing the front-end for years, but I’ve always been most intrigued by data manipulation. To me, it’s incredible what can be achieved through good code. In my admiration of the function of code, I’ve discovered the beauty in code. It may sound strange to some, but good code is only good if it’s well designed. And I love looking at examples of good code. I see the design in it. I see the beauty in it.

There is also a unique relationship between what happens behind the scenes and what is visible to the user. More often than not, a well-coded application has a beautiful interface as well. It seems that there is some shift amongst the old left-brain programmers—a shift toward producing from the right-brain for elements of the project that are end-user-interactive (the UI) and for elements that are interactive with systems and programmers or produce function (the code). I don’t think any coder can give up on the technical, because it’s that left side that gives us the power to create function. But there is power in the form as well. And I’m stoked to see this emerging trend amongst developers. It means we’ll have friendlier apps with sharper function adhering to best practices and standards in code construction.

Technorati Tags: code, design, theory, trends