Web Design
August 30th, 2010 by Matt Haff
I start every HTML project with a CSS reset sheet. I’ve been using it for a long time and I’ve progressively added bits and pieces to it as my own personal best practices have evolved. Now that we are in the process of switching to a new coding standard, HTML5 & CSS3, it’s time to upgrade the tools.
HTML5 Boilerplate is the professional base HTML/CSS/JS template for a fast, robust and future-proof site. To download the full file you can get it here HTML 5 Reset.
I would suggest keeping your eyes out on anything that mentions HTML 5… No it’s not some new hi-tech thing, but it is the future of web development, and half our job is keeping current with standards.
Web Design
August 23rd, 2010 by Matt Haff
Hey all, a relatively short & simplistic post because the goal is more to get you to submit your designs… I’m going to be adding a section to my site for some awesome church websites. I’ll always be accepting submissions but right now I’d like for you to share this with everyone & anyone you know. Submit your favorite church website (even if it’s not your own) either through comments, or Twitter.
I’ll start off with a few…
From the readers…
Web Design
August 16th, 2010 by Matt Haff
It’s one thing not to hate people, it’s another thing altogether to hate computer software. It’s been 10 years since Internet Explorer 6 came out and it just seems like it won’t go away! Sure the percentage of IE6 visitors is becoming less and less but on a site that gets roughly 25k visitors a month almost 1,000 of them are still using IE6?! Really?
No this isn’t going to just be a rant about IE6, however I do think that every web developer has a God given right to do so about once a month…This is to challenge the people at Microsoft, or whoever it is that runs the IE dev team. Here’s a question, and it’s not rhetorical. Why do we not see people browsing with 3 earlier versions of Safari, Firefox or Chrome? It’s because anytime you start one of those browsers and they are outdated they remind you to upgrade. Internet Explorer for some unknown reason doesn’t do that, they don’t care what version you’re running…why would they?
Perhaps we as web developers can give people the hard shove that they need to get off IE6. Fastest way to do this is put conditional comments that say “If IE6 don’t show the website at all and instead show a sentence that tells them to upgrade their browser already, they’re 10 years behind”. I just don’t see that going over well when the client finds out that’s what happens when one of their customers on an older browser comes to their site. Instead, I’m suggesting that we don’t worry about hacking our beautiful CSS to make a site look good in IE6, if it’s jacked up…let it be. Only support the functionality of the site, not the design. I charge my clients extra if they want it to look decent in IE6, it’s outdated, doesn’t follow standards, full of bugs & security issues, etc.
Web Design
August 10th, 2010 by Matt Haff
I just and an interesting conversation that led to one simple but game changing thought. We all try to do our best, and once we’ve accomplished that the next phase is to go beyond that and do even greater things. That is human nature, we’re always trying to out do ourselves, always moving forward, always building bigger, better things. Now apply that to web design, every new website that we build is a leap forwards in design, functionality and usability. Here is the game changing thought…
As web developers, ALL of our work is on display for the world to see, if we do something right…people see it, if we do something wrong…people see it.
It’s very easy for people to critique our work and ask questions and give suggestions of how to do it better. Imagine if everything the spiritual formation or the accounting team did was up on the web for people to see, I’m sure they would get quite a bit of feedback as well. However it’s not like that, so that is why us as web developers and some graphic designers feel the pressure much more than others to push forward and continue to create better things!
Keep in mind, that what we do, we are doing for the Kingdom and that when we mess up it’s not the end of the world…Unless ofcourse you’ve just pressed the red button to launch an all out nuclear attack 
Web Design
July 26th, 2010 by Matt Haff
I read through “HTML5 For Web Designers” this past week, if 85 pages isn’t short enough for you then this post should help shed a little light on HTML5.
A little history fun with tongue in cheek…
In the beginning was HTML 2.0 there was no HTML 1 and it wasn’t that good… W3C saw that it wasn’t good so they created HTML 4.01… It was better but it didn’t serve the W3C well so they created XHTML 1.0 which was the same as HTML 4.01 but it followed the rules. Jump forward about 10 years and XHTML 1.0 is getting left behind and the W3C are upgrading HTML 4.01 to a much needed HTML5.
Change that you can look forward to OLD vs. NEW
No more lengthy doctype!
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict //EN” “http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<!DOCTYPE html>
No longer have to include what type of file you’re referring to.
<script type=”text/javascript” src=”file.js”></script>
<script src=”file.js”></script>
<link rel=”stylesheet” type=”text/css” href=”file.css”>
<link rel=”stylesheet” href=”file.css”>
Want to embed a media file? Very new stuff with this, I suggest getting the book to learn more!
<audio src=”file.mp3″></audio>
<video src=”file.mp4″></video>
Old elements redefined and some altogether new
- small – now has the semantic value for legalese, or terms and conditions
- b – no longer conveys extra importance, instead use strong
- i – no longer conveys extra importance or emphasis, instead use em
- cite – now means “the title of a work”
- canvas – new element for creating dynamic images (wanna know more, get the book)
- mark – no added importance only shows that it’s currently of interest
- time – can be used for dates, times, or combines both
- section – used for grouping together thematically-related content
- header – a container for a group of introductory or navigational aids
- footer – should contain information about its containing element, such as copyrights
- aside – chunk of content that you consider separate from the main content
- article – self-contained related content, such as a blog post
- nav – intended for major navigation information
Web Forms, SEO and Internet Explorer
A lot has been done with Web Forms, I won’t get too much into detail but just imagine not having to use javascript to make your forms work correctly!
The outlining algorithm of HTML documents is changing… blockquote, fieldset, and td elements are all immune to the new algorithm. For all you developers out there still using tables to create a web layout… this would be a good reason to stop, it means that your code flooded with <td> is worthless to anyone that wants some kind of SEO capability.
Ofcourse this is a very brief overview of this book, I recommend getting it and reading through all of the in depth uses for the new code. Just remember, it will be a few years before HTML5 is widely used, in Internet Explorer’s case it probably won’t be used until 10 years from now…
