Communication is a strange and wondrous thing. I’m amazed at the ways it works and the ways it fails. Some days, I’m amazed it works at all. We seem to have a handle on the basics, but it’s when we stray from some accepted vocabulary that we start to have trouble. Idiomatic speech is interesting--a guy can talk about a hot car and another guy can talk about a cool car and they’re both talking about the same car.
My first holiday dinner with my wife’s family amazed me. All of the sisters talking at once, saying “Oh! Remember that time…?” “With the…?” “No, the other time.” “Oh, at the place with…?” “Yeah!”
It kind of untidied my understanding of discourse, and what I knew of subjects and predicates and adverbs and so on. These people were sparking-off ideas and sending memories around the table without any of that stuff. I still marvel at it, twenty years on, every time all of the sisters get together.
Every group seems to develop its own language. That’s probably be one of the definitions of Group. Surfers have difficulty talking with networking geeks, who can’t understand musicians who can’t discuss Big Ideas with MBA types. All of us born here in the Big PX. All of us products of the public schools system. All of us, nominally, speaking English.
I was in conversation with a friend a few weeks ago when we were interrupted by someone with a Web problem. This happens to me a lot. Everyone in my little corner of the world knows I am The Web Guy, wise in the ways of HTML, Dreamweaver and so on. He had a problem with a .pdf file he was trying to get into a Web page. But he wanted to be seen as a cut above the great unwashed. He told me he was trying to hook it up on the page, inline.
Constant Lurker will know there are two types of HTML tags that display elements in the body of any page; block-level tags, and inline tags. Block level tags include headers and paragraphs, which start new lines and extend from sea-to-shining-sea across the entire available area, or across the entire restricted area if a page has been divided into, say, columns. Inline tags affect only a subset of the entire block. <em> turns on emphasis for some fraction of the greater paragraph. Link text is set off by <a> tags, anchor tags, but it’s very rare that an entire paragraph is clickable text.
Now, stir into this the idea that we have recently added a class for anchor tags that displays the Adobe Acrobat icon after a clickable link to a .pdf file, and confusion starts. As we have just covered, Anchor Tags are inline tags. “You mean you want the pdf link inline, with the new little icon?” “Uh, yeah” comes the reply. So I (quickly) showed him how to create an anchor tag that pointed not to a Web page, but to a .pdf file, and how to indicate this to the page visitor by means of this new application-pdf class in the style sheet for anchor tags. Kewl, right?
“No, I wanted it to display inline”.
“It is inline. All anchor tags are inline.”
What he wanted, it turned out, was a way to turn the information on the .pdf file into something someone would see when they came to that page. I suggested he make a screenshot of the .pdf, trim it a little with Photoshop, and put that up. “But then they wouldn’t be able to select parts of the text, right?” Right.
It was never made clear to me why the information was a .pdf in the first place, but eventually we got him hooked up.
I ended up showing him Dreamweaver’s Table wizard, and how to create a table with as many rows and columns as he needed, and then transcribed the .pdf information into the various cells, matching as best I could the fonts and colors used, and so forth.
It ended up being about an hour’s job, instead of about three minutes. But it could have gone much better if he hadn’t insisted on using the word inline the way he did.
Imagine how life must be at the UN, huh?
Wednesday, December 16, 2009
Wednesday, December 2, 2009
The Healthy
If you seek Web-osity this week, look elsewhere. I’m all about the health, today. Just a couple of hours ago, my wife and I were in the presence of an orthopedic surgeon, as he said the words nobody wants to hear, “You’ll likely have this the rest of your life”.
There was no comfort in him saying this to Kathie, and not me. We are in this together, after all. This was almost as much my ankle, as hers. There is a high degree of finality to this one, I fear. We could continue to work out in some fashion and lose weight. That would help. It would take a great deal of strain off of her ankle, which has basically been ground down to sawdust. But it won’t get better. We are used to seeing and hearing that kind of resolution, generally just before the last commercial. And every week someone has built an artificial chin or elbow or something and we see reporters talking with folks in lab coats while wounded vets relearn walking skills in the background. But there will be no new ankle.
Twenty years ago, Kathie used to walk nearly everywhere. She lived close to her job, and walked there-and-back every day, sometimes twice a day if she came home for lunch. I used to catch her on one or another trip from time to time, with a stately gait full of poise and posture, generally with a hat.
In the early-middle ‘90s, Kathie fell in the bathroom of a motel. We had gone to Omaha, to go to the zoo and see the big new exhibit of the day. She slipped coming out of the shower and was never the same. We had an HMO back then, and they were famous for not wanting to see you unless you were bloody or on fire. They told her it was “a bad sprain” and gave her some pain killers. Over time she became almost accustomed to it and would only occasionally bring it up. They would nod and say that yeah, oftentimes those bad sprains heal slower than a broken bone. We motored on.
And over time, she slowed down. She lost that poise and precision, the dignity and the grace in her stride. We stopped walking downtown to dinner and movies and attractions, which was once one of the drawing cards of our apartment. Over time we both started gaining weight, which only makes matters worse. They told us today that forces and stresses in the feet are routinely three to four times our body weight, so every pound meant three or four in the sneakers. Things got worse.
The spiral continued for several years and honestly, I stopped hearing the little grunts and complaints getting into and out of chairs and cars after a while. But in the last year it has gotten much worse and we found ourselves finally thinking of taking the New Home money and using it to get a car she could get into and out of easier.
I really enjoy this time of year, from the standpoint of measuring progress on goals. This year we joined a health club when it finally became obvious even to us that we were out of control. But it became easy to skip going when every time we went it hurt. Now she’s looking at mostly swimming for a while, and we both wonder about the stairs at home.
This isn’t a death sentence. There isn’t any cornball homily stitched above our sofa about how we are living with devastated joint pain instead of dying from it. We have a lot of years ahead of us, and most of them promise to be good ones. But this is probably the day we changed from being “the kids” to being Old People. It should be noted that this is way different from being grown ups.
Neither of us have had anything like this in our lives, before. You get a cold on the third, it’s better by the seventh of the month. You wake up with a headache, it’s usually gone by the afternoon. I have seasonal allergies, but I have some really good days in July and November and March. Even Kathie’s diabetes is controlled through medication, and we have seen any number of stories of people who lost weight and became active enough that they needed no medication whatsoever. But this is the first thing either of us have had that will never go away.
I don’t know what the future brings, but I suspect there’ll be more salads in it.
There was no comfort in him saying this to Kathie, and not me. We are in this together, after all. This was almost as much my ankle, as hers. There is a high degree of finality to this one, I fear. We could continue to work out in some fashion and lose weight. That would help. It would take a great deal of strain off of her ankle, which has basically been ground down to sawdust. But it won’t get better. We are used to seeing and hearing that kind of resolution, generally just before the last commercial. And every week someone has built an artificial chin or elbow or something and we see reporters talking with folks in lab coats while wounded vets relearn walking skills in the background. But there will be no new ankle.
Twenty years ago, Kathie used to walk nearly everywhere. She lived close to her job, and walked there-and-back every day, sometimes twice a day if she came home for lunch. I used to catch her on one or another trip from time to time, with a stately gait full of poise and posture, generally with a hat.
In the early-middle ‘90s, Kathie fell in the bathroom of a motel. We had gone to Omaha, to go to the zoo and see the big new exhibit of the day. She slipped coming out of the shower and was never the same. We had an HMO back then, and they were famous for not wanting to see you unless you were bloody or on fire. They told her it was “a bad sprain” and gave her some pain killers. Over time she became almost accustomed to it and would only occasionally bring it up. They would nod and say that yeah, oftentimes those bad sprains heal slower than a broken bone. We motored on.
And over time, she slowed down. She lost that poise and precision, the dignity and the grace in her stride. We stopped walking downtown to dinner and movies and attractions, which was once one of the drawing cards of our apartment. Over time we both started gaining weight, which only makes matters worse. They told us today that forces and stresses in the feet are routinely three to four times our body weight, so every pound meant three or four in the sneakers. Things got worse.
The spiral continued for several years and honestly, I stopped hearing the little grunts and complaints getting into and out of chairs and cars after a while. But in the last year it has gotten much worse and we found ourselves finally thinking of taking the New Home money and using it to get a car she could get into and out of easier.
I really enjoy this time of year, from the standpoint of measuring progress on goals. This year we joined a health club when it finally became obvious even to us that we were out of control. But it became easy to skip going when every time we went it hurt. Now she’s looking at mostly swimming for a while, and we both wonder about the stairs at home.
This isn’t a death sentence. There isn’t any cornball homily stitched above our sofa about how we are living with devastated joint pain instead of dying from it. We have a lot of years ahead of us, and most of them promise to be good ones. But this is probably the day we changed from being “the kids” to being Old People. It should be noted that this is way different from being grown ups.
Neither of us have had anything like this in our lives, before. You get a cold on the third, it’s better by the seventh of the month. You wake up with a headache, it’s usually gone by the afternoon. I have seasonal allergies, but I have some really good days in July and November and March. Even Kathie’s diabetes is controlled through medication, and we have seen any number of stories of people who lost weight and became active enough that they needed no medication whatsoever. But this is the first thing either of us have had that will never go away.
I don’t know what the future brings, but I suspect there’ll be more salads in it.
Wednesday, November 25, 2009
The Thanking
It almost seems cruel, but the wheel has turned and it is once again Thanksgiving. A time to inventory our blessings, show a little gratitude, meet family we haven’t seen for a year, eat to excess and then gird our loins for battle in the morning, as dawn breaks over Black Friday.
I say cruel because a lot of us are worried about our jobs, again. This has become a regular feature of employment. We get dental and eye care and the constant question of Am I Going Have A Job Here Next Year?
In a lot of businesses you can see this kind of thing coming. I sold $X last year, but only $Y this year, and I don’t think they are going to be happy with that. Maybe you could have worked the angles a little better, been a little more clever, managed your time differently and made some difference. But it’s not a surprise—here’s the line, and this is you down here, under it.
Our situation is different. Money comes in, gets divvied-up however it does, by whoever does that sort of thing, and it turns out that we have come up short. The TV news announces we are a skillion dollars behind last years’ numbers.
Wow. That’s more than I make in a whole year. It’s more than I will make in a lifetime. Hell, I don’t know—it could be more than all of the Hiatts have ever earned.
After that dryness in the mouth goes away, someone comes up with some context. Yeah, it’s a skillion dollars, but that turns out to be less than two percent of year-ago fundage. Well, okay… that’s a lot, still. But it isn’t an insurmountable problem, right? Well, here’s where it gets interesting.
Some would say let’s take something out of reserve, give everyone a two percent haircut and wait for the Good Times to roll, again. News stories now tend to indicate the economic storm is over in many parts of the nation or in some key parts of the economy. See? Things will be better soon. We can all hold our breath for twenty-six weeks, if we know that’s as long as it will be.
But it doesn’t work like that. Instead, here, historically, the cap’n will throw someone out of the lifeboat, to make things better and easier for those who remain. We’ll motor along, Doing What We Do until the word comes down and then we will just decide that we don’t need to teach Principles of Elevator Operation any more, and that entire program is cut.
There are all manner of solutions to this. We could all take a tiny pay cut. We could all take a free day off every so often. We could use our current chairs and computers and copiers for an extra year, or two. We could cut back on travel. But for some reason it has been seen in the past as better to do it this way. Instead of everyone suffering a little, a few will suffer a lot.
From a strictly numbers point of view, I’m in good shape. So is my wife. The two of us together make a much wider target, but still, we are only two of hundreds and hundreds. So numerically the risk is probably greater walking to lunch or driving downtown. I teach people how to put information on the Internet. The Internet is more popular now than it was when you started reading this, and more information is moving from printed page to online, with a corresponding need for more people to know how to do that. It isn’t like I am teaching people how to operate an elevator.
But I have friends here, who work in shaky fields of shaky departments, doing work that probably won’t be missed the way, say, teaching Calculus or History would be. I hate the thought of missing them almost as much as the thought that the bullet hits me.
It doesn’t matter how good a job you do, this way. It isn’t about how long you’ve done it. If it is seen as a surplus line, the whole crew goes away. *Poof!* Like fish swimming in a school, with a fisherman overhead. What happened to Bob? Don’t ask, just keep swimming.
So yeah, I am thankful that I have a job. But I already wonder what next years’ Thanksgiving may be like.
I say cruel because a lot of us are worried about our jobs, again. This has become a regular feature of employment. We get dental and eye care and the constant question of Am I Going Have A Job Here Next Year?
In a lot of businesses you can see this kind of thing coming. I sold $X last year, but only $Y this year, and I don’t think they are going to be happy with that. Maybe you could have worked the angles a little better, been a little more clever, managed your time differently and made some difference. But it’s not a surprise—here’s the line, and this is you down here, under it.
Our situation is different. Money comes in, gets divvied-up however it does, by whoever does that sort of thing, and it turns out that we have come up short. The TV news announces we are a skillion dollars behind last years’ numbers.
Wow. That’s more than I make in a whole year. It’s more than I will make in a lifetime. Hell, I don’t know—it could be more than all of the Hiatts have ever earned.
After that dryness in the mouth goes away, someone comes up with some context. Yeah, it’s a skillion dollars, but that turns out to be less than two percent of year-ago fundage. Well, okay… that’s a lot, still. But it isn’t an insurmountable problem, right? Well, here’s where it gets interesting.
Some would say let’s take something out of reserve, give everyone a two percent haircut and wait for the Good Times to roll, again. News stories now tend to indicate the economic storm is over in many parts of the nation or in some key parts of the economy. See? Things will be better soon. We can all hold our breath for twenty-six weeks, if we know that’s as long as it will be.
But it doesn’t work like that. Instead, here, historically, the cap’n will throw someone out of the lifeboat, to make things better and easier for those who remain. We’ll motor along, Doing What We Do until the word comes down and then we will just decide that we don’t need to teach Principles of Elevator Operation any more, and that entire program is cut.
There are all manner of solutions to this. We could all take a tiny pay cut. We could all take a free day off every so often. We could use our current chairs and computers and copiers for an extra year, or two. We could cut back on travel. But for some reason it has been seen in the past as better to do it this way. Instead of everyone suffering a little, a few will suffer a lot.
From a strictly numbers point of view, I’m in good shape. So is my wife. The two of us together make a much wider target, but still, we are only two of hundreds and hundreds. So numerically the risk is probably greater walking to lunch or driving downtown. I teach people how to put information on the Internet. The Internet is more popular now than it was when you started reading this, and more information is moving from printed page to online, with a corresponding need for more people to know how to do that. It isn’t like I am teaching people how to operate an elevator.
But I have friends here, who work in shaky fields of shaky departments, doing work that probably won’t be missed the way, say, teaching Calculus or History would be. I hate the thought of missing them almost as much as the thought that the bullet hits me.
It doesn’t matter how good a job you do, this way. It isn’t about how long you’ve done it. If it is seen as a surplus line, the whole crew goes away. *Poof!* Like fish swimming in a school, with a fisherman overhead. What happened to Bob? Don’t ask, just keep swimming.
So yeah, I am thankful that I have a job. But I already wonder what next years’ Thanksgiving may be like.
Wednesday, November 18, 2009
Ping!
Shortly after the Earth cooled, and the waters receded, dinosaurs roamed the land. After an interval, the Internet and World Wide Web were developed and we came to need a way to display images online.
The old, dead, CompuServe network had already trod this path, and arrived at a marvelously clever solution for its day, the .gif file. Say “Jiff” or “Giff”, it doesn’t matter. The Graphics Interchange Format allowed for 256 colors—and one of them could even be “Invisible”. Transparency and interlacing were two of .gif’s best features, animation a powerful third reason to use it on your next page. The file format quickly became a favorite of anyone with only a few colors to display, anyone who needed to have a background image shine through around whatever was being displayed, or anyone who needed a very little motion on their page. The format was a perfect fit for most logos and graphics needs, not great at portraiture or landscape photography, though.
For that kind of richly textured image, you needed to use the other format, .jpg, from the Joint Photographic Experts Group. “Jay-Peg” files could feature as many colors as anyone needed, with correspondingly larger file sizes. But these could be slimmed-down quite a bit by means of lossy compression, by rounding-off sixteen hundred different kinds of Green to only a dozen or so. Most people don’t notice any difference at lower levels, and even when cranked up quite a bit the result is very often still Good Enough.
And, truthfully, it was a Good Enough kind of time back then. Most machines were connected, if that’s the word, via a none-too-fast modem. And quite a bit of computer output was limited to 256 colors back then, too. To see richer color required an extra expenditure for a state of the art video card, and even then the results were squirted onto only a 13” or 14” color monitor, probably. So yeah, Good Enough was good enough, for most of us.
A recurring theme of this blog is that Things Will Not Always Be Like This. And so it was in the graphics world. Video cards improved, monitors improved and online transmission speeds improved. But .gif and .jpg stayed the same. This happens in business until there is a compelling reason to move and in the middle 1990s it started to look like we might get that, when patents and lawsuits and confusion shared the world stage with rumors and no small amount of fear. The online subscription model was in trouble (I had two networks shot out from under me within a year or so, General Electric’s GEnie and Microsoft’s The Microsoft Network). Why would anyone think the people who owned the wasting asset of CompuServe would be willing to sit by and watch everyone continue to use their image format, for free?
This being the Internet, most people got most of the story wrong, of course. Unisys owned the patent for the creation of .gif, but stories floated out every week or so that one day we would all have to send a nickel to someone to display our animated Under Construction graphics. Work began on a replacement.
The fruit of that labor was the Portable Network Graphics format, .png (“Ping!”). .png files can be even smaller than .gif format files, they offer various levels of transparency and don’t suffer from generational losses the way .jpg files do. Save 20% of file size with every edit and you quickly get below 50% of the original .jpg image quality. Animating .png is not as easy as with .gif, but .png files don’t cloud up with artifacts when sharp color differences are present, as with high-contrast colors or text appearing in an image.
The .png file might be king today but for its missing the shipping deadline for the most-popular Web browser of the day, Microsoft’s Internet Explorer 6 for the PC. A lot of the gee-whizziness of .png was lost in IE6, so developers and designers had to ask themselves if it was worth going that extra mile for a file only twenty percent of visitors might even appreciate. For most, the answer was no, and so .gif and .jpg reigned supreme through another browser cycle.
Today, we even more need of high-quality images and graphics than ever before, and today we have the technology to back it up. If you are working in High Definition levels of image detail, consider breaking the old .gif or .jpg habit and trying a .png file for the task. You might surprise yourself—and your page visitors, too.
The old, dead, CompuServe network had already trod this path, and arrived at a marvelously clever solution for its day, the .gif file. Say “Jiff” or “Giff”, it doesn’t matter. The Graphics Interchange Format allowed for 256 colors—and one of them could even be “Invisible”. Transparency and interlacing were two of .gif’s best features, animation a powerful third reason to use it on your next page. The file format quickly became a favorite of anyone with only a few colors to display, anyone who needed to have a background image shine through around whatever was being displayed, or anyone who needed a very little motion on their page. The format was a perfect fit for most logos and graphics needs, not great at portraiture or landscape photography, though.
For that kind of richly textured image, you needed to use the other format, .jpg, from the Joint Photographic Experts Group. “Jay-Peg” files could feature as many colors as anyone needed, with correspondingly larger file sizes. But these could be slimmed-down quite a bit by means of lossy compression, by rounding-off sixteen hundred different kinds of Green to only a dozen or so. Most people don’t notice any difference at lower levels, and even when cranked up quite a bit the result is very often still Good Enough.
And, truthfully, it was a Good Enough kind of time back then. Most machines were connected, if that’s the word, via a none-too-fast modem. And quite a bit of computer output was limited to 256 colors back then, too. To see richer color required an extra expenditure for a state of the art video card, and even then the results were squirted onto only a 13” or 14” color monitor, probably. So yeah, Good Enough was good enough, for most of us.
A recurring theme of this blog is that Things Will Not Always Be Like This. And so it was in the graphics world. Video cards improved, monitors improved and online transmission speeds improved. But .gif and .jpg stayed the same. This happens in business until there is a compelling reason to move and in the middle 1990s it started to look like we might get that, when patents and lawsuits and confusion shared the world stage with rumors and no small amount of fear. The online subscription model was in trouble (I had two networks shot out from under me within a year or so, General Electric’s GEnie and Microsoft’s The Microsoft Network). Why would anyone think the people who owned the wasting asset of CompuServe would be willing to sit by and watch everyone continue to use their image format, for free?
This being the Internet, most people got most of the story wrong, of course. Unisys owned the patent for the creation of .gif, but stories floated out every week or so that one day we would all have to send a nickel to someone to display our animated Under Construction graphics. Work began on a replacement.
The fruit of that labor was the Portable Network Graphics format, .png (“Ping!”). .png files can be even smaller than .gif format files, they offer various levels of transparency and don’t suffer from generational losses the way .jpg files do. Save 20% of file size with every edit and you quickly get below 50% of the original .jpg image quality. Animating .png is not as easy as with .gif, but .png files don’t cloud up with artifacts when sharp color differences are present, as with high-contrast colors or text appearing in an image.
The .png file might be king today but for its missing the shipping deadline for the most-popular Web browser of the day, Microsoft’s Internet Explorer 6 for the PC. A lot of the gee-whizziness of .png was lost in IE6, so developers and designers had to ask themselves if it was worth going that extra mile for a file only twenty percent of visitors might even appreciate. For most, the answer was no, and so .gif and .jpg reigned supreme through another browser cycle.
Today, we even more need of high-quality images and graphics than ever before, and today we have the technology to back it up. If you are working in High Definition levels of image detail, consider breaking the old .gif or .jpg habit and trying a .png file for the task. You might surprise yourself—and your page visitors, too.
Wednesday, November 11, 2009
The Right Tool for the Job
Everywhere in Life, we struggle with the difference between what we can do, and what we should do.
In many cases, there is settled Law to help guide us. No matter how much an individual needs killin’, it isn’t up to us to carry out that obligation. Most often, there isn’t quite as much Black and White involved in the equation, though.
As it pertains to the Web, there seems to be no end of people who just bought a selection of fonts and are bound and determined to use them all, to get back the maximum value, I guess. Where two or three would be perfect, they need to sprinkle in six or seven. If a picture is worth a thousand words, then nineteen pictures would make a Web page worth a novella, right?
Two Olde Sayings come to mind, here. There is no accounting for Taste. And, if all you have is a hammer, everything looks like a nail.
You can write a bestselling novel in Microsoft Excel. It wouldn’t be fun, or easy, but you could do it. And just because you just learned JavaScript, you can animate your form buttons, have images slide across pages and trail a flock of geese behind every page visitor’s cursor. But that doesn’t mean that’s a good idea, either.
I always try to keep in mind the purpose of a Web page, and ask how this or that change or technology or feature might or might not fit in, given that choice.
I cannot imagine a need for Flash on a Web page for, say, a mortuary. If they are having a sale, should animated angels fly across the screen, carrying a banner saying Twenty Percent Off Cremations in January! or something similar? Maybe that’s too easy. Can I shop for caskets online—Do I really need to do that? But, if so, should the images be animated so clicking on the lid opens it up to reveal the fabrics on the inside? Should a site like that play mournful music at low volume by default?
I’ve been involved in sites where people had some idea of something they had seen elsewhere and wanted incorporated into their new site. The site they had seen was trying to sell something and was full of all kinds of razzle-dazzle effects. But their site was actually more of an informative page, barely even a brochure. Any of that would have gotten in the way of their customers finding the information they wanted.
It’s not like anyone would come back, just because the page navigation flew out from the side, tore itself off of the main menu and danced around the screen before artfully transforming itself into the newly-selected page. The people just want to know how big the gizmo is and if they can get a green one. They’re not going to tell their friends to come and check out this new Web site and even if they did, those friends aren’t interested in a new gizmo and wouldn’t come back later, either.
It’s early days, yet. A great many people making Really Important Decisions are not the ones who actually use the technology, still. Or care much about what it is and what it does. Somehow a rule is needed so one gets implemented. I was four years from my first Web page when I sat on my first committee. There, I was the most-experienced Web Guy on the panel—many people had no Web experience at all beyond clicking on the latest viral link of the day. But I was told that “Our logo needs to be somewhere on every page” and “Everything on our site needs to be accessible in three clicks or less” and several other chestnuts. Sometimes we still have to do things the way The Boss wants them done. Damnit.
Sure, you can. But should you? Is it really the best use of the time and talent and resources? Maybe step back a bit and try to see the bigger picture, and how your site fits into someone’s Webby day. Not every page needs to be Euro-design, spare and featuring acres of White space. And not every page needs to have a row of dancing piglets in ballet tutus high-kicking across the screen carrying a “Welcome!” banner to some Souza march. Choose the right tool for the job, please.
In many cases, there is settled Law to help guide us. No matter how much an individual needs killin’, it isn’t up to us to carry out that obligation. Most often, there isn’t quite as much Black and White involved in the equation, though.
As it pertains to the Web, there seems to be no end of people who just bought a selection of fonts and are bound and determined to use them all, to get back the maximum value, I guess. Where two or three would be perfect, they need to sprinkle in six or seven. If a picture is worth a thousand words, then nineteen pictures would make a Web page worth a novella, right?
Two Olde Sayings come to mind, here. There is no accounting for Taste. And, if all you have is a hammer, everything looks like a nail.
You can write a bestselling novel in Microsoft Excel. It wouldn’t be fun, or easy, but you could do it. And just because you just learned JavaScript, you can animate your form buttons, have images slide across pages and trail a flock of geese behind every page visitor’s cursor. But that doesn’t mean that’s a good idea, either.
I always try to keep in mind the purpose of a Web page, and ask how this or that change or technology or feature might or might not fit in, given that choice.
I cannot imagine a need for Flash on a Web page for, say, a mortuary. If they are having a sale, should animated angels fly across the screen, carrying a banner saying Twenty Percent Off Cremations in January! or something similar? Maybe that’s too easy. Can I shop for caskets online—Do I really need to do that? But, if so, should the images be animated so clicking on the lid opens it up to reveal the fabrics on the inside? Should a site like that play mournful music at low volume by default?
I’ve been involved in sites where people had some idea of something they had seen elsewhere and wanted incorporated into their new site. The site they had seen was trying to sell something and was full of all kinds of razzle-dazzle effects. But their site was actually more of an informative page, barely even a brochure. Any of that would have gotten in the way of their customers finding the information they wanted.
It’s not like anyone would come back, just because the page navigation flew out from the side, tore itself off of the main menu and danced around the screen before artfully transforming itself into the newly-selected page. The people just want to know how big the gizmo is and if they can get a green one. They’re not going to tell their friends to come and check out this new Web site and even if they did, those friends aren’t interested in a new gizmo and wouldn’t come back later, either.
It’s early days, yet. A great many people making Really Important Decisions are not the ones who actually use the technology, still. Or care much about what it is and what it does. Somehow a rule is needed so one gets implemented. I was four years from my first Web page when I sat on my first committee. There, I was the most-experienced Web Guy on the panel—many people had no Web experience at all beyond clicking on the latest viral link of the day. But I was told that “Our logo needs to be somewhere on every page” and “Everything on our site needs to be accessible in three clicks or less” and several other chestnuts. Sometimes we still have to do things the way The Boss wants them done. Damnit.
Sure, you can. But should you? Is it really the best use of the time and talent and resources? Maybe step back a bit and try to see the bigger picture, and how your site fits into someone’s Webby day. Not every page needs to be Euro-design, spare and featuring acres of White space. And not every page needs to have a row of dancing piglets in ballet tutus high-kicking across the screen carrying a “Welcome!” banner to some Souza march. Choose the right tool for the job, please.
Wednesday, November 4, 2009
The Bigger Picture
Have you ever stopped to think about what it is that you’re actually doing, when you mark up a new Web page? And what’s all this about markup, anyway?
Whenever there is a new technology that is similar to something current, we see a massive adoption of the terminology, even the jargon, of the Olde Ways. Even customs and lore seem to transfer over. When Man learned to fly a hundred and six years ago, the closest thing we had to describe and govern this behavior was shipboard navigation, and so a lot of nautical stuff was quickly adopted and adapted for use in aviation.
The original idea behind the Web was that we would be laying out online documents… hmm… kind of like setting type. Sure it was much easier to add color or edit words, but the basic ideas seemed to fit almost perfectly. And since the language of typesetters was called markup, we took to marking up our Web pages. We don’t have any of the cool editing symbols, though I still remember a few of them. But the basic idea is the same. You start with a document, sometimes typed but sometimes handwritten, and you start putting little symbols into it to describe how you want it to look to the typesetter, who loads everything onto a giant plate, from which you print as many copies of the document as you need. Trust me, in Mark Twain’s day, this was heady stuff, indeed.
So from all of this we get the basic structure of HTML, today. All of our tags begin with “<“ and end with “>” and most sort of describe or remind us of their action. We put a slash in front of the same symbol to indicate we are done with its behavior, whatever it was. That is, a “p-tag” (<p>) begins a paragraph, while a “slash-li-tag” (</li>) indicates the ending of a list item. We start at the very top and the very bottom, with <html> and </html>, turning on and turning off the HTML-ness of our document. “Here is where our HTML begins, and here is where our HTML ends”. HTML being, let’s remember, the HyperText Markup Language. So we have a start and an end, and everything in between is (wait for it) HTML.
A section of our document has been set aside to help describe and control the rest of it. <head> begins the head of our page, and this is where we link to any external stylesheets or JavaScript pages and put any meta data we want to include and so on. Only the <title is actually visible to our page visitors here, unless something has gone horribly wrong. The rest of it is really only useful to Web servers, Web browsers and search engines. But we describe that area, too. <head> and </head>.
The part below the head is the body, so <body> and </body> come next. Every visible thing except for the page title appears here, so the body of your document is crucial. We place a tag under the </head> to indicate the body is starting, and one right before the final </html> tag to indicate we are done with the body, in a non-forensic doctor kind of way.
The elements inside the body tags are very close to actual nineteenth-century page markup. We place paragraph tags around the text we want to be paragraphs. We place heading tags around the text we want to be headings. We build complex tag structures to describe tables and lists. In those cases we need more than just an “it-begins-here” tag and an “it-ends-here” tag. We need to indicate the beginning and the ending of a table or a list, sure. But we also need to markup the various elements within it, too. With tables, we next describe the start and end of our table rows, and then inside those we even describe the beginning and ending of each individual table data cell. For lists, we must indicate the start and end of each list item.
I’m sure that back in the day there were people renowned for their markup skills just as there are, today. I’m sure there were pages that were structurally awful, but looked okay on the page just as we suffer today from bad markup with good-enough results.
We are probably lucky things turned out this way. The dominant model for computer communication of that era was a high-level programming language that translated the ideas of the programer into the machine language that the computer understands. We could easily have ended up with a markup model that involved either compiling or interpreting machine instructions. That would have led us down a whole different path.
Whenever there is a new technology that is similar to something current, we see a massive adoption of the terminology, even the jargon, of the Olde Ways. Even customs and lore seem to transfer over. When Man learned to fly a hundred and six years ago, the closest thing we had to describe and govern this behavior was shipboard navigation, and so a lot of nautical stuff was quickly adopted and adapted for use in aviation.
The original idea behind the Web was that we would be laying out online documents… hmm… kind of like setting type. Sure it was much easier to add color or edit words, but the basic ideas seemed to fit almost perfectly. And since the language of typesetters was called markup, we took to marking up our Web pages. We don’t have any of the cool editing symbols, though I still remember a few of them. But the basic idea is the same. You start with a document, sometimes typed but sometimes handwritten, and you start putting little symbols into it to describe how you want it to look to the typesetter, who loads everything onto a giant plate, from which you print as many copies of the document as you need. Trust me, in Mark Twain’s day, this was heady stuff, indeed.
So from all of this we get the basic structure of HTML, today. All of our tags begin with “<“ and end with “>” and most sort of describe or remind us of their action. We put a slash in front of the same symbol to indicate we are done with its behavior, whatever it was. That is, a “p-tag” (<p>) begins a paragraph, while a “slash-li-tag” (</li>) indicates the ending of a list item. We start at the very top and the very bottom, with <html> and </html>, turning on and turning off the HTML-ness of our document. “Here is where our HTML begins, and here is where our HTML ends”. HTML being, let’s remember, the HyperText Markup Language. So we have a start and an end, and everything in between is (wait for it) HTML.
A section of our document has been set aside to help describe and control the rest of it. <head> begins the head of our page, and this is where we link to any external stylesheets or JavaScript pages and put any meta data we want to include and so on. Only the <title is actually visible to our page visitors here, unless something has gone horribly wrong. The rest of it is really only useful to Web servers, Web browsers and search engines. But we describe that area, too. <head> and </head>.
The part below the head is the body, so <body> and </body> come next. Every visible thing except for the page title appears here, so the body of your document is crucial. We place a tag under the </head> to indicate the body is starting, and one right before the final </html> tag to indicate we are done with the body, in a non-forensic doctor kind of way.
The elements inside the body tags are very close to actual nineteenth-century page markup. We place paragraph tags around the text we want to be paragraphs. We place heading tags around the text we want to be headings. We build complex tag structures to describe tables and lists. In those cases we need more than just an “it-begins-here” tag and an “it-ends-here” tag. We need to indicate the beginning and the ending of a table or a list, sure. But we also need to markup the various elements within it, too. With tables, we next describe the start and end of our table rows, and then inside those we even describe the beginning and ending of each individual table data cell. For lists, we must indicate the start and end of each list item.
I’m sure that back in the day there were people renowned for their markup skills just as there are, today. I’m sure there were pages that were structurally awful, but looked okay on the page just as we suffer today from bad markup with good-enough results.
We are probably lucky things turned out this way. The dominant model for computer communication of that era was a high-level programming language that translated the ideas of the programer into the machine language that the computer understands. We could easily have ended up with a markup model that involved either compiling or interpreting machine instructions. That would have led us down a whole different path.
Wednesday, October 28, 2009
Fixin's
You spill out all of your creative talent on a new Web page and after a while you just cannot stand not knowing any more. And so, with just a hint of trepidation, you hit your [F12] key to show the results in a real browser on the real Internet... and it looks awful. What do you do, at that point?
This is a question I seem to get the most. Well, this or some variation of it. How do you fix things? Okay, I took the training. I read the Google links. I looked it up in the book. Then I put down my best first effort and gave it a shot and came up short. Now what?
Validate your page first, of course. But suppose it’s not a syntax error you are hunting, but some weakness in your understanding of, say, Cascading StyleSheets?
When I was learning to fly, I had a Hell of a time learning to land, which is one of the skills you really want to become good at. I had a wonderfully patient flight instructor, though and he gave me the key: Try, as much as is possible, to always do the same things, and do them at the same time. I used to take off at 90 miles per hour the first time, and 110 miles per hour the next. Sometimes, I would climb to eight hundred feet before turning, other times, I would climb up to twelve hundred feet. Sometimes, I would turn toward the runway when I was a quarter mile from the end and other times, I would find myself half a mile away. And when I would turn onto my final approach, sometimes I would fly at 85 miles per hour and other times at 75 miles per hour. Sometimes I’d have the engine at idle and other times I’d be turning 1500rpm.
Every landing was different for me, because every landing was different. I never did the same thing the same way twice in a row, so who is surprised that each landing was a new adventure? Once I learned to always take off at 90mph and to always climb out at the same speed and always make my first turn at the same altitude and always reduce my speed abeam the same location on the runway, and so on, everything came together for me. You reduce your workload and get everything done early so you can more easily manage the fewer variables that have changed since the last time. You end up on Final approach with more or less the same “picture” out the window every time because you’re always more or less at the same place with the same airplane as you had last time. You’re not suddenly having to slow down, or account for a changing cross wind. And if you do have to account for those changes, those are the only changes you have to deal with.
Manage your variables is the lesson. Don’t change seven things and then check your pages, change one thing and check your pages. Work it out in your mind… what is it, specifically, you expect to see? And what are the differences between what you expect and what you get? Change one thing and you can immediately see the results of that change. But if you change nine things you may have a more difficult time seeing the effects of an individual adjustment. This is especially true when you are dealing with margins and paddings in CSS.
I am a big fan of putting a box around it, whatever “it” is that you’re working on, to help you to see what is actually happening on a page. Quite often there is a big difference between what you expect, what you think is happening and what is actually going on. You want to adjust the space between “this” and “that”? Draw a box around either element and then start making adjustments—just remember the border itself needs to be accounted for in that space. If you don’t declare a border, there won’t be one, of course. But if you do declare even a one-pixel border around an element, you will be placing two pixels in either the horizontal or vertical space you are working in. Remember that.
Work slowly, deliberately. Make a change, anticipate what it will do, and then check the results. Once you have the effect you wanted to achieve, or are happy with an accidental discovery, then move on to make other changes. And keep learning. Eventually, you will find that what you expect to see and what you actually get are more and more often the same. Then maybe you can back off a notch or two and only check every two or three changes. But if you’re surprised again, go back to the last time you weren’t and do the single-change thing again, stepping through the process until it all works.
This is a question I seem to get the most. Well, this or some variation of it. How do you fix things? Okay, I took the training. I read the Google links. I looked it up in the book. Then I put down my best first effort and gave it a shot and came up short. Now what?
Validate your page first, of course. But suppose it’s not a syntax error you are hunting, but some weakness in your understanding of, say, Cascading StyleSheets?
When I was learning to fly, I had a Hell of a time learning to land, which is one of the skills you really want to become good at. I had a wonderfully patient flight instructor, though and he gave me the key: Try, as much as is possible, to always do the same things, and do them at the same time. I used to take off at 90 miles per hour the first time, and 110 miles per hour the next. Sometimes, I would climb to eight hundred feet before turning, other times, I would climb up to twelve hundred feet. Sometimes, I would turn toward the runway when I was a quarter mile from the end and other times, I would find myself half a mile away. And when I would turn onto my final approach, sometimes I would fly at 85 miles per hour and other times at 75 miles per hour. Sometimes I’d have the engine at idle and other times I’d be turning 1500rpm.
Every landing was different for me, because every landing was different. I never did the same thing the same way twice in a row, so who is surprised that each landing was a new adventure? Once I learned to always take off at 90mph and to always climb out at the same speed and always make my first turn at the same altitude and always reduce my speed abeam the same location on the runway, and so on, everything came together for me. You reduce your workload and get everything done early so you can more easily manage the fewer variables that have changed since the last time. You end up on Final approach with more or less the same “picture” out the window every time because you’re always more or less at the same place with the same airplane as you had last time. You’re not suddenly having to slow down, or account for a changing cross wind. And if you do have to account for those changes, those are the only changes you have to deal with.
Manage your variables is the lesson. Don’t change seven things and then check your pages, change one thing and check your pages. Work it out in your mind… what is it, specifically, you expect to see? And what are the differences between what you expect and what you get? Change one thing and you can immediately see the results of that change. But if you change nine things you may have a more difficult time seeing the effects of an individual adjustment. This is especially true when you are dealing with margins and paddings in CSS.
I am a big fan of putting a box around it, whatever “it” is that you’re working on, to help you to see what is actually happening on a page. Quite often there is a big difference between what you expect, what you think is happening and what is actually going on. You want to adjust the space between “this” and “that”? Draw a box around either element and then start making adjustments—just remember the border itself needs to be accounted for in that space. If you don’t declare a border, there won’t be one, of course. But if you do declare even a one-pixel border around an element, you will be placing two pixels in either the horizontal or vertical space you are working in. Remember that.
Work slowly, deliberately. Make a change, anticipate what it will do, and then check the results. Once you have the effect you wanted to achieve, or are happy with an accidental discovery, then move on to make other changes. And keep learning. Eventually, you will find that what you expect to see and what you actually get are more and more often the same. Then maybe you can back off a notch or two and only check every two or three changes. But if you’re surprised again, go back to the last time you weren’t and do the single-change thing again, stepping through the process until it all works.
Wednesday, October 21, 2009
Thursday, October 15, 2009
Adobe Dreamweaver CS5?
It came up last week, during training. “When will the next version of Dreamweaver arrive, and what kinds of differences can we expect?”
It seems like only yesterday since the upgrade from CS3 to CS4, but the big wheel keeps on turning. As I tell people in my Introductory class, “The people who brought you Dreamweaver CS4 still have jobs!” There will be another new version of Dreamweaver one day, probably (but by no means guaranteed to be) named “CS5”. A new version, however it’s named, may be with us as soon as the summer of 2010.
Remember, Dreamweavers so far have been called Dreamweaver, -2, -3, -4, -5 and then Dreamweaver MX2000 and Dreamweaver MX2004, then Dreamweaver 8, -CS3 and -CS4. So, really, it’s anyone’s guess.
What kinds of changes can we expect? The developers at Macromedia and Adobe both spent some major coin pumping up the support of Web standards and Cascading Stylesheets, since the MX releases. Every version has been better than the previous one, in that regard. It is now easier to twiddle with CSS, and the twiddling results in much better markup.
The user interface has been cleaned-up a bunch. Remember we lost a whole menu in the move from CS3 to CS4 (“Text”). I would expect a few improvements here, again. I would expect a little more modernization. Dreamweaver CS4 no longer includes the Netscape Navigator “Resize Fix” JavaScript code. I expect one day soon some cub developer will be tasked with shining-up the Snippets section, improving the default dates in the drop-down menu options and maybe adding a few new ones--it’s been a good long while we saw anything happening, here.
The Mobile Web is not getting any smaller, and I would not be surprised to see more support for that in the next version. Maybe a simpler, easier way to approximate your latest page in two or three handheld devices.
Dreamweaver’s Design View now runs on the same WebKit engine behind popular browsers like Firefox and Chrome. It would be nice if we could get some kind of a real-world way to view our pages, independent of platform. Suppose I work on a Macintosh. Why should I have to boot up even a virtual Windows machine to check a Web page? Why couldn’t Dreamweaver provide me with some kind of Windows Internet Explorer emulation as part of the program?
One feature I have always disliked, that is probably unlikely to change, is the way you cannot move your cursor up a line in the column one of Text View. Click on a line of text in your markup and right-arrow to the end of the line. One more right-arrow gets you to the very beginning of the next line. Now, up-arrow to get back into the line you just left, and Dreamweaver thoughtfully moves you over about five or six characters into the line. Left-arrow as many times as you need to get back to that first column and up-arrow again and you will once again be in column four or five or six. Whatever it is, it’s annoying to me.
One area where Macromedia and Adobe have always fallen short is in the support and training and even the marketing of features and benefits in the Creative Suite. Can you tell me what “Spry” is and does and how it works and why we should care? Sprinkled throughout the Dreamweaver interface are little references to Spry, but you have to really want to learn what it is and does to get any value or benefit out of it.
What would you like to see, in the next version of Dreamweaver?
I'm on vacation, next week. Keep the lid on it!
It seems like only yesterday since the upgrade from CS3 to CS4, but the big wheel keeps on turning. As I tell people in my Introductory class, “The people who brought you Dreamweaver CS4 still have jobs!” There will be another new version of Dreamweaver one day, probably (but by no means guaranteed to be) named “CS5”. A new version, however it’s named, may be with us as soon as the summer of 2010.
Remember, Dreamweavers so far have been called Dreamweaver, -2, -3, -4, -5 and then Dreamweaver MX2000 and Dreamweaver MX2004, then Dreamweaver 8, -CS3 and -CS4. So, really, it’s anyone’s guess.
What kinds of changes can we expect? The developers at Macromedia and Adobe both spent some major coin pumping up the support of Web standards and Cascading Stylesheets, since the MX releases. Every version has been better than the previous one, in that regard. It is now easier to twiddle with CSS, and the twiddling results in much better markup.
The user interface has been cleaned-up a bunch. Remember we lost a whole menu in the move from CS3 to CS4 (“Text”). I would expect a few improvements here, again. I would expect a little more modernization. Dreamweaver CS4 no longer includes the Netscape Navigator “Resize Fix” JavaScript code. I expect one day soon some cub developer will be tasked with shining-up the Snippets section, improving the default dates in the drop-down menu options and maybe adding a few new ones--it’s been a good long while we saw anything happening, here.
The Mobile Web is not getting any smaller, and I would not be surprised to see more support for that in the next version. Maybe a simpler, easier way to approximate your latest page in two or three handheld devices.
Dreamweaver’s Design View now runs on the same WebKit engine behind popular browsers like Firefox and Chrome. It would be nice if we could get some kind of a real-world way to view our pages, independent of platform. Suppose I work on a Macintosh. Why should I have to boot up even a virtual Windows machine to check a Web page? Why couldn’t Dreamweaver provide me with some kind of Windows Internet Explorer emulation as part of the program?
One feature I have always disliked, that is probably unlikely to change, is the way you cannot move your cursor up a line in the column one of Text View. Click on a line of text in your markup and right-arrow to the end of the line. One more right-arrow gets you to the very beginning of the next line. Now, up-arrow to get back into the line you just left, and Dreamweaver thoughtfully moves you over about five or six characters into the line. Left-arrow as many times as you need to get back to that first column and up-arrow again and you will once again be in column four or five or six. Whatever it is, it’s annoying to me.
One area where Macromedia and Adobe have always fallen short is in the support and training and even the marketing of features and benefits in the Creative Suite. Can you tell me what “Spry” is and does and how it works and why we should care? Sprinkled throughout the Dreamweaver interface are little references to Spry, but you have to really want to learn what it is and does to get any value or benefit out of it.
What would you like to see, in the next version of Dreamweaver?
I'm on vacation, next week. Keep the lid on it!
Wednesday, October 7, 2009
Run Google Chrome in Internet Explorer?
Through the magic of browser augmentation, you can now run a good WebKit browser from within your copy of Microsoft Internet Explorer.
Some notes for those of you scoring this one at home:
That’s pretty much it, for Internet Explorer and especially Internet Explorer 6. Comes now the Google Chrome plug-in, which shines up IE in ways that Microsoft couldn’t, or wouldn’t, for all of those years.
Google Chrome Frame is an open-sourced Google plug-in featuring one-click installation that brings Internet Explorer up to par with other WebKit browsers. You can use it with IE6 if you have to, IE7 if you’re still using that, or IE8, and take advantage of JavaScript improvement approaching ten times better JavaScript performance, plus new support for HTML5. All of your old IE applications still work, because you are still using IE.
This comes to you from your friends at Google, remember. Not your... developers, at Microsoft. Take a deep breath, here, kids. Chrome now runs inside Internet Explorer. Just imagine if you could get Honda or Toyota quality and performance in a new Pontia—uh, Satur—uh, Buick. To all outward appearances, you’re a Good American, buying a Good American Car. But now it runs forever and doesn’t fall apart on you and doesn’t depreciate as fast. This is going to be an interesting ride, folks. Google does not destroy anything about IE6, IE7 or IE8. It does not change the browser in ways that it identifies as Google Chrome on server logs. It adds functionality to IE, just like any other plug-in.
Web developers cannot afford to ignore Internet Explorer, it’s just too big. But this new plug-in allows authors to include a single line of markup in their pages that flips the rendering of a page from Internet Explorer’s “Trident” engine to the increasingly-popular WebKit engine. Suddenly, HTML5 works, and JavaScript works much faster.
Now, quite often in life when you mix manufacturers, authors, artists, if you will, you run into troubles. The whole car is English but the engine is now Metric. That doesn’t seem to be the case in Google Chrome Frame. Internet Explorer now runs the ACID-3 test and scores… 100 out of 100. It’s amazing.
Now Microsoft, predictably, doesn’t think much of this idea. They remind people that now, you have two lines of vulnerability online, the bag of IE problems and the bag of Chome’s troubles, too. That’s certainly valid, but I suspect that Google is going to be doing whatever it can to shine up Chrome Frame.
Some notes for those of you scoring this one at home:
- Internet Explorer is far and away the internet’s most used Web browser.
- Internet Explorer 6 was born in August of 2001, and last updated in April of 2008.
- For many years, IE6’s share was something around ninety percent of the market.
- Internet Explorer 6 does not understand HTML5 tagging.
- Internet Explorer 6 features old-style (slow) JavaScript performance.
- The Web community has been asking for a better browser since long before IE6 showed up, and many responded by drifting away to Firefox, Safari and the Google Chrome browsers.
- Some IT departments thought it was cute to tie Web applications not to the underlying standard technologies of the Web, the HTML, the CSS and the JavaScript, but to the underlying technologies of Internet Explorer, including ActiveX, despite the security risks involved.
That’s pretty much it, for Internet Explorer and especially Internet Explorer 6. Comes now the Google Chrome plug-in, which shines up IE in ways that Microsoft couldn’t, or wouldn’t, for all of those years.
Google Chrome Frame is an open-sourced Google plug-in featuring one-click installation that brings Internet Explorer up to par with other WebKit browsers. You can use it with IE6 if you have to, IE7 if you’re still using that, or IE8, and take advantage of JavaScript improvement approaching ten times better JavaScript performance, plus new support for HTML5. All of your old IE applications still work, because you are still using IE.
This comes to you from your friends at Google, remember. Not your... developers, at Microsoft. Take a deep breath, here, kids. Chrome now runs inside Internet Explorer. Just imagine if you could get Honda or Toyota quality and performance in a new Pontia—uh, Satur—uh, Buick. To all outward appearances, you’re a Good American, buying a Good American Car. But now it runs forever and doesn’t fall apart on you and doesn’t depreciate as fast. This is going to be an interesting ride, folks. Google does not destroy anything about IE6, IE7 or IE8. It does not change the browser in ways that it identifies as Google Chrome on server logs. It adds functionality to IE, just like any other plug-in.
Web developers cannot afford to ignore Internet Explorer, it’s just too big. But this new plug-in allows authors to include a single line of markup in their pages that flips the rendering of a page from Internet Explorer’s “Trident” engine to the increasingly-popular WebKit engine. Suddenly, HTML5 works, and JavaScript works much faster.
Now, quite often in life when you mix manufacturers, authors, artists, if you will, you run into troubles. The whole car is English but the engine is now Metric. That doesn’t seem to be the case in Google Chrome Frame. Internet Explorer now runs the ACID-3 test and scores… 100 out of 100. It’s amazing.
Now Microsoft, predictably, doesn’t think much of this idea. They remind people that now, you have two lines of vulnerability online, the bag of IE problems and the bag of Chome’s troubles, too. That’s certainly valid, but I suspect that Google is going to be doing whatever it can to shine up Chrome Frame.
Wednesday, September 30, 2009
Add-In and Add-On, Why Doncha?
Things are getting better out there. Browsers today are still not fully in agreement as to how any particular page should look, but it’s a whole lot better than it was. I think we all owe a tremendous debt to the Firefox people at Mozilla. They have done more than anyone else to shame Microsoft into fixing their Internet Explorer, who had more to fix than anyone. IE’s still not perfect, but it’s much better than it was. And that’s upped the game for everyone.
There was a Web Standards Group who railed against substandard browsers, but they never did a particularly good job of explaining who they were, how to join them, or why anyone would want to listen. For a time they maintained a redirect page you could send people to that encouraged people to upgrade their Web browsers, but they grew timid and withdrew from that. The guys from A List Apart drew a line in the sand back at Issue 99 and said “No More!” and started making a lot of noise about how Things Should Be Better Than This By Now. That was great and it did a lot to bring a brighter light to The Cause. But Mozilla actually went about solving the problem by creating a wonderful browser with features people had been asking for that, wait for it, actually worked! And they gave it away for free.
One of the best things Mozilla did, early on, was to realize that they could not think of everything, and that they could not provide everything, that the market might want. It seems self evident, now. Nobody could imagine the Two Steves trying to write all of the programs that would ever run on the Apple II, or on the Macintosh. A big reason the Apple iPhone is so popular is not because the audio is so much better than any other telephone or that the AT&T plan is just so much better than what you can get from Verizon--it’s a wildly popular telephone because everything on it works and, “There’s an App for that!”
Mozilla Firefox has terrific support for add-ons. These range from very simple to incredibly complex. They span the range from whimsy to serious research. As you might imagine, there is a pretty comprehensive collection of Web Developer tools available at a click that will help to make your page-building better, faster and easier.
CodeBurner is an extended reference for anyone working HTML and CSS. Originally, this was itself an add-on to the Firebug extension, but now it is available as a standalone tool. Very nice, though you may prefer the books and documentation that ships with every copy of Dreamweaver (Window => Results => Reference leads you to the O’Reilly library of reference materials for HTML, CSS, PHP, JavaScript and more ).
One of my favorite extensions is HTML Validator. It generates a continuously updated report in the bottom status bar of Firefox, showing the number of validation errors found on the page you are viewing almost instantly. Click on this number and the Page Source displays, with the errors highlighted. From the Firefox add-on site, there is a warning saying that there is no Mac OSX version, but if you visit the developer’s Web site, you can download a Macintosh version there. It’s the one I depend upon, every day.
Chris Pederick’s wonderful Web Developer extension adds a menu and a toolbar full of tools you probably didn’t even know you needed. Toggle CSS on or off. Quickly re-size your browser to approximate various screen resolutions. Outline block-level elements, or deprecated elements you are still using on your pages. Disable JavaScript, Images or even Cookies on a page to see how each affects the outcome. Even validate your markup or code. It’s a nice piece of work, and so far Chris only suggests that you pay him for his efforts.
The charmingly-named ColorSuckr is not a color picker tool (there are several of those, too, though). ColorSuckr studies an image and then suggest the dozen colors represented in that image that would look best when used on your page. Kind of nice.
There are extensions entirely devoted to JavaScript, the DOM and all of those Black Arts. Similarly, there are downloads catering to the PHP developer, or ASP developer, who wants all of his or her tools in one place.
I’m finding more and more that I develop in Firefox, now, and merely check my pages in other browsers. Try a few extensions out this week, and you might begin to work that way, too.
There was a Web Standards Group who railed against substandard browsers, but they never did a particularly good job of explaining who they were, how to join them, or why anyone would want to listen. For a time they maintained a redirect page you could send people to that encouraged people to upgrade their Web browsers, but they grew timid and withdrew from that. The guys from A List Apart drew a line in the sand back at Issue 99 and said “No More!” and started making a lot of noise about how Things Should Be Better Than This By Now. That was great and it did a lot to bring a brighter light to The Cause. But Mozilla actually went about solving the problem by creating a wonderful browser with features people had been asking for that, wait for it, actually worked! And they gave it away for free.
One of the best things Mozilla did, early on, was to realize that they could not think of everything, and that they could not provide everything, that the market might want. It seems self evident, now. Nobody could imagine the Two Steves trying to write all of the programs that would ever run on the Apple II, or on the Macintosh. A big reason the Apple iPhone is so popular is not because the audio is so much better than any other telephone or that the AT&T plan is just so much better than what you can get from Verizon--it’s a wildly popular telephone because everything on it works and, “There’s an App for that!”
Mozilla Firefox has terrific support for add-ons. These range from very simple to incredibly complex. They span the range from whimsy to serious research. As you might imagine, there is a pretty comprehensive collection of Web Developer tools available at a click that will help to make your page-building better, faster and easier.
CodeBurner is an extended reference for anyone working HTML and CSS. Originally, this was itself an add-on to the Firebug extension, but now it is available as a standalone tool. Very nice, though you may prefer the books and documentation that ships with every copy of Dreamweaver (Window => Results => Reference leads you to the O’Reilly library of reference materials for HTML, CSS, PHP, JavaScript and more ).
One of my favorite extensions is HTML Validator. It generates a continuously updated report in the bottom status bar of Firefox, showing the number of validation errors found on the page you are viewing almost instantly. Click on this number and the Page Source displays, with the errors highlighted. From the Firefox add-on site, there is a warning saying that there is no Mac OSX version, but if you visit the developer’s Web site, you can download a Macintosh version there. It’s the one I depend upon, every day.
Chris Pederick’s wonderful Web Developer extension adds a menu and a toolbar full of tools you probably didn’t even know you needed. Toggle CSS on or off. Quickly re-size your browser to approximate various screen resolutions. Outline block-level elements, or deprecated elements you are still using on your pages. Disable JavaScript, Images or even Cookies on a page to see how each affects the outcome. Even validate your markup or code. It’s a nice piece of work, and so far Chris only suggests that you pay him for his efforts.
The charmingly-named ColorSuckr is not a color picker tool (there are several of those, too, though). ColorSuckr studies an image and then suggest the dozen colors represented in that image that would look best when used on your page. Kind of nice.
There are extensions entirely devoted to JavaScript, the DOM and all of those Black Arts. Similarly, there are downloads catering to the PHP developer, or ASP developer, who wants all of his or her tools in one place.
I’m finding more and more that I develop in Firefox, now, and merely check my pages in other browsers. Try a few extensions out this week, and you might begin to work that way, too.
Wednesday, September 23, 2009
HTML 5ive?
HTML 5 is coming. Maybe. Is there any reason to care? To worry? To rejoice?
One of the things that I enjoyed the most about teaching HTML over the last several years is the look in peoples’ eyes when I would explain that in all of techdom, there was at least one thing that you could learn all of and then be forever current in: HTML was done.
You spent a lot of time learning Windows 95 when it first came out. And damned if they didn’t follow it up with Windows 98. But that was okay, it was only a few new features, really. And most of it looked and worked like Windows 95 did, or tried to, so it wasn’t really a burden. Flash ahead through Windows 98SE, Windows Me, Windows 2000, Windows XP and Windows Vista. Now, Windows 7 is again hewing to the basic baked-in goodness of Windows 95. From one release to the next you have very few surprises, but there are changes. Still, you only had to absorb a dozen or so new details every several years. It was manageable, but it was still a burden.
We didn’t have that in HTML. The committee slapped one another on the back and promised to keep in touch and turned out the lights years ago, secure in the knowledge that the future belonged to some variant of XML and/or XHTML. Work on HTML had finally stopped. You could finally spend a few quiet moments every day learning One New Thing and you would eventually learn all of HTML. What a wonderful place to be, huh? Think of the guy or gal out there who knows more about HTML than any of us. You could know as much as they knew. You could know it all.
Well, those days may be drawing to a close. And, maybe, that’s not such a bad thing. Every Web page I have built in the last four or five years has had some common elements with every other Web page I have built in the last four or five years. They have all had a “header” of some kind—not the HTML document <head> area, but a visible header area of the page. They have all had some form of page navigation. They have had some kind of footer. And I have had to sketch out these areas on the page using division tags, assigning classes and IDs as necessary, then styling these divisions as needed.
Since HTML 4.01 was chiseled into stone back in the Olden Days we have seen the rise of several new technologies, many of which look like they’re going to be Keepers. It’s a multimedia world out there and we need more and better ways to accommodate that. But how about all of that vague and indistinct markup? If every page needs divisions for headers, footers and navigation then shouldn’t there be some taggage to support that? In the front-running candidate for Next New Markup Language, there is.
Now, these things have a way of taking a lot of time. The committee is working, albeit slowly, on codifying every little nuance of every new descriptor and we can probably look forward to at least one Name Brand browser ignoring some meaningful fraction of their work. We will need to learn new hacks and workarounds and we should expect a transitional period where some of it all works great in one or two obscure browsers, but no browsers gets it all right. In a way we are already there, with some spotty support for HTML 5 in several current browsers, but nobody yet handling it all.
There is a chance that this will finally be it; the end of the line. But I suspect that now that we have finally gotten away from the idea that HTML might one day find itself a dead language, we probably will see point-releases and maybe even an HTML 6 one day. And so our markup language will join the ranks of our Web page editors and our operating systems as an ongoing project that continually refreshes itself to the demands of the marketplace, and one that we must devote continuing resources to mastering.
One of the things that I enjoyed the most about teaching HTML over the last several years is the look in peoples’ eyes when I would explain that in all of techdom, there was at least one thing that you could learn all of and then be forever current in: HTML was done.
You spent a lot of time learning Windows 95 when it first came out. And damned if they didn’t follow it up with Windows 98. But that was okay, it was only a few new features, really. And most of it looked and worked like Windows 95 did, or tried to, so it wasn’t really a burden. Flash ahead through Windows 98SE, Windows Me, Windows 2000, Windows XP and Windows Vista. Now, Windows 7 is again hewing to the basic baked-in goodness of Windows 95. From one release to the next you have very few surprises, but there are changes. Still, you only had to absorb a dozen or so new details every several years. It was manageable, but it was still a burden.
We didn’t have that in HTML. The committee slapped one another on the back and promised to keep in touch and turned out the lights years ago, secure in the knowledge that the future belonged to some variant of XML and/or XHTML. Work on HTML had finally stopped. You could finally spend a few quiet moments every day learning One New Thing and you would eventually learn all of HTML. What a wonderful place to be, huh? Think of the guy or gal out there who knows more about HTML than any of us. You could know as much as they knew. You could know it all.
Well, those days may be drawing to a close. And, maybe, that’s not such a bad thing. Every Web page I have built in the last four or five years has had some common elements with every other Web page I have built in the last four or five years. They have all had a “header” of some kind—not the HTML document <head> area, but a visible header area of the page. They have all had some form of page navigation. They have had some kind of footer. And I have had to sketch out these areas on the page using division tags, assigning classes and IDs as necessary, then styling these divisions as needed.
Since HTML 4.01 was chiseled into stone back in the Olden Days we have seen the rise of several new technologies, many of which look like they’re going to be Keepers. It’s a multimedia world out there and we need more and better ways to accommodate that. But how about all of that vague and indistinct markup? If every page needs divisions for headers, footers and navigation then shouldn’t there be some taggage to support that? In the front-running candidate for Next New Markup Language, there is.
Now, these things have a way of taking a lot of time. The committee is working, albeit slowly, on codifying every little nuance of every new descriptor and we can probably look forward to at least one Name Brand browser ignoring some meaningful fraction of their work. We will need to learn new hacks and workarounds and we should expect a transitional period where some of it all works great in one or two obscure browsers, but no browsers gets it all right. In a way we are already there, with some spotty support for HTML 5 in several current browsers, but nobody yet handling it all.
There is a chance that this will finally be it; the end of the line. But I suspect that now that we have finally gotten away from the idea that HTML might one day find itself a dead language, we probably will see point-releases and maybe even an HTML 6 one day. And so our markup language will join the ranks of our Web page editors and our operating systems as an ongoing project that continually refreshes itself to the demands of the marketplace, and one that we must devote continuing resources to mastering.
Wednesday, September 9, 2009
Troubleshooting III: Return of the Bugs!
Is It Me?
It’s a question I don’t often ask myself, these days. Since somewhere around high school, I have pretty much expected it was me. That’s just the way I ended up wired, I guess. But I do have a few core competencies and within these circles, I am pretty much not worried that, if something goes wrong, it’s because of something I have done.
I made very sure I knew how to fly. I was terribly anxious when I had three flight instructors in four hours of instruction. How do they keep it all straight? What are the odds that each of them is going to think that one of the others taught me how to, say, Land A Plane? So I did a lot of reading and studying, hung out with pilots and listened to what they had to say and I made sure that I was fully in the moment, whenever I bought “an hour of dual” and actually went up to learn something. People have died doing this. I was going to make damned sure that I was not one of them.
I am slowly regaining that kind of feeling with my guitar. For thirty years I didn’t play at all and lost almost all of my musical mojo. A year ago, I assumed that if something went wrong in the band, it was something that I had done wrong. Now I am getting back to that confident place where I love playing. Wanna change tempo? I’m okay with that. Wanna change key? Let’s give it a shot. I’m good.
But for years now, I have been really confident of my markup skills. I embarked upon the journey of learning all I could about HTML years ago and the powers that be blessed me with a stagnant technology that hasn’t changed in meaningful ways for a dozen years. You can start today and learn a tag a day and how to use them and still learn as much HTML as anyone in the world knows, within a year. A month or so and I was good with XHTML, too. CSS came hard, but by biting off manageable hunks and really wailing on them I have picked up most of it by now, too. When and if a new standard of CSS or HTML is announced, I’m probably not going to have much trouble moving into it because I know the current stuff so well. Someone coming in new would have to learn everything. I’ll only have to learn the changes.
But this week, a couple of things happened and in each case, for some reason I lost half a day to self doubt.
In the first, I had been applying the new Template to my web application that does the scheduling for the various training we give at work. It used to have “this” kind of a shell around it, and now it has “that” kind of look to it. On some level, I knew that the only thing that changed was the shell. It’s like if Frank Sinatra came out in a dark blue tuxedo and sang for half an hour and then took a break and returned to the stage in a dark gray tuxedo and sang some more. In both cases, you’re listening to the same guy, only the clothes have changed. That’s how the Templates update should have worked.
But I applied the new Template to a page that adds people to a class on Thursday morning. And Thursday afternoon, someone called saying they couldn’t get logged-in. If it had happened last week, I would have gone down the Do-You-Have-The-Right-User-Name-And-Password tack, not the Oh-My-God-What-Have-I-Done tack. But because my changing the page and the complaint came so close together, I assumed one had something to do with the other. I still don’t know what caused me to see if I could add myself to the class, which worked like a champ and reset my thinking back to the account name and password, which is where the problem really was. Once I found the right information, I was able to get the guy loaded into the class quite easily, just like always.
This morning, I was working on styling a Table and could not get rules to work. I had put all of my page styles into the head of the page, and no matter how specific I made them, nothing seemed to register on the page. I could do only inline styles, where you apply a whole long list of properties and values to individual tags. I even sought help, asking what I was doing wrong and nobody could find anything, until it was noticed that the Templates files on the server were wrong. It wasn’t me, it was my server administrator! But I immediately folded-up and spent most of a morning questioning just how much of this stuff I really did know?
I wonder how long it will take me to regain my former confidence? And I wonder how doing so might one day end up biting me in the hiney?
It’s a question I don’t often ask myself, these days. Since somewhere around high school, I have pretty much expected it was me. That’s just the way I ended up wired, I guess. But I do have a few core competencies and within these circles, I am pretty much not worried that, if something goes wrong, it’s because of something I have done.
I made very sure I knew how to fly. I was terribly anxious when I had three flight instructors in four hours of instruction. How do they keep it all straight? What are the odds that each of them is going to think that one of the others taught me how to, say, Land A Plane? So I did a lot of reading and studying, hung out with pilots and listened to what they had to say and I made sure that I was fully in the moment, whenever I bought “an hour of dual” and actually went up to learn something. People have died doing this. I was going to make damned sure that I was not one of them.
I am slowly regaining that kind of feeling with my guitar. For thirty years I didn’t play at all and lost almost all of my musical mojo. A year ago, I assumed that if something went wrong in the band, it was something that I had done wrong. Now I am getting back to that confident place where I love playing. Wanna change tempo? I’m okay with that. Wanna change key? Let’s give it a shot. I’m good.
But for years now, I have been really confident of my markup skills. I embarked upon the journey of learning all I could about HTML years ago and the powers that be blessed me with a stagnant technology that hasn’t changed in meaningful ways for a dozen years. You can start today and learn a tag a day and how to use them and still learn as much HTML as anyone in the world knows, within a year. A month or so and I was good with XHTML, too. CSS came hard, but by biting off manageable hunks and really wailing on them I have picked up most of it by now, too. When and if a new standard of CSS or HTML is announced, I’m probably not going to have much trouble moving into it because I know the current stuff so well. Someone coming in new would have to learn everything. I’ll only have to learn the changes.
But this week, a couple of things happened and in each case, for some reason I lost half a day to self doubt.
In the first, I had been applying the new Template to my web application that does the scheduling for the various training we give at work. It used to have “this” kind of a shell around it, and now it has “that” kind of look to it. On some level, I knew that the only thing that changed was the shell. It’s like if Frank Sinatra came out in a dark blue tuxedo and sang for half an hour and then took a break and returned to the stage in a dark gray tuxedo and sang some more. In both cases, you’re listening to the same guy, only the clothes have changed. That’s how the Templates update should have worked.
But I applied the new Template to a page that adds people to a class on Thursday morning. And Thursday afternoon, someone called saying they couldn’t get logged-in. If it had happened last week, I would have gone down the Do-You-Have-The-Right-User-Name-And-Password tack, not the Oh-My-God-What-Have-I-Done tack. But because my changing the page and the complaint came so close together, I assumed one had something to do with the other. I still don’t know what caused me to see if I could add myself to the class, which worked like a champ and reset my thinking back to the account name and password, which is where the problem really was. Once I found the right information, I was able to get the guy loaded into the class quite easily, just like always.
This morning, I was working on styling a Table and could not get rules to work. I had put all of my page styles into the head of the page, and no matter how specific I made them, nothing seemed to register on the page. I could do only inline styles, where you apply a whole long list of properties and values to individual tags. I even sought help, asking what I was doing wrong and nobody could find anything, until it was noticed that the Templates files on the server were wrong. It wasn’t me, it was my server administrator! But I immediately folded-up and spent most of a morning questioning just how much of this stuff I really did know?
I wonder how long it will take me to regain my former confidence? And I wonder how doing so might one day end up biting me in the hiney?
Wednesday, September 2, 2009
Troubleshooting II: Son of Troubleshooting
More thoughts on What To Do When It Isn’t Working.
Those of you who have had a little experience with Cascading Stylesheets will probably already know this one, but it’s one of my favorites. You can style just about any tag to act like just about any other tag, of course. You can make all of your strong text italic, or all of your emphasized text look like H4 headings. But you can also draw a border around any visible element on your page.
This is really where CSS has it all over Tables, when it comes to design. You can add a border to your table, of course, but it places a border around everything that sketches out the table. Headings, rows, columns, cells and the outer edge of the table, itself. With CSS, you can style borders around only the fourth cell in a row.
So, td td td td { border: 1px solid green; } will place a one-pixel border around any cell that is fourth in a sequence, so remember that if your row has five boxes, it may have two “fourth boxes”, the 1-2-3-fourth box and also the 2-3-4-fifth fourth box. You have even more control. td td td td { border-bottom: 1px dotted red; } places a dotted red line at the bottom of that third box. Pretty neat, huh?
So, how does any of this help you when it comes to Stuff Not Looking Right? You can easily lose track of spans and divisions and columns and paragraphs and all of their various margins and paddings and so on. So, when it doubt, put a border around it!
I cannot begin to count the number of times I was not sure why something was not getting better as I tweaked this or that element, only to draw a box around something and discover I wasn’t even working on the right area of the page! With today’s pages full of zenboxes and columns and so on it can be easy to get off into an area where you think you are working in one part of the page, only to find that you are actually adjusting some other page element.
Again, table borders go around everything in the table. Adding { border: 1px solid blue; } to a table in CSS, however, just draws a box around the outer edges.
Where this is all really useful is in figuring out how various spatial adjustments will affect our pages. The two most-common CSS rules are probably going to be margin and padding. We remember from our HTML training that we have an image, a portrait. Surrounding that, we have padding, like the matte. Then comes the border, similar to the frame of the portrait, and finally we have the space outside of the border, like the room outside of the frame, which we call margin.
You have an image that you want flush-right against the right column of your page. If you apply padding of 1 em-unit all of the way around that image ( padding: 1em; ), you will be creating an air space equal to the size of the M character over the top, down the right side, across under the bottom and up the left side. Get used to traveling clockwise around the box. If you need help, remember that “Margins and Padding are TRouBLe”. T-R-B-L, Top, Right, Bottom and Left. Those are the order we specify margin and padding limits.
After adding some space around your photo, you may now be unhappy because all of the text on your page lines up at the edge of its container, but the right-most edge of the picture itself is back to the right a character or two, and its apparent top isn’t aligned with the first line of text, but aligns closer to the second line. The way to fix this would be to assign no padding at all to the top and the right, but keeping it in effect for the bottom and the left-side of the photo. Padding: 0 0 1em 1em; will do that for you. Remember TRouBLe. We are assigning a value of zero to the top padding, zero again to the right-side padding, 1em to the bottom and another 1em to the left side.
Some of these adjustments can be pretty subtle and depending upon the vagaries of servers and connections, you may not be able to simply refresh your browser quickly enough to see the difference. But if you draw a box around your image, it will be much clearer. In your stylesheet, img { border: 1px solid orange; } will place a one-pixel line around your image. Some people also like to color a background when using padding. Background-color: #353535; will place a dark gray background color anywhere you have visible padding.
Three things are important here. Choose a color that contrasts easily with the rest of the material on your page. If your page includes a lot of browns and greens, choose a bright yellow or pink for your border color or background-color. Secondly, if things are really tight, you may find that adding a 1-pixel border around elements destroys some of the design. Imagine a full-width container of 800 pixels for your page. Now you fill that with three boxes, one 350-pixels wide, one that’s 150-pixels wide and one that’s 300-pixels wide. There’s your 800, right? What do you suppose will happen, if you add a 1-pixel border around that middle box? Remember, you have a pixel on the left, and a pixel on the right to contend with.
Finally, remember to delete these little tricks before you walk away from your page. It may confuse your visitors if they happen upon a page with little lines drawn around various elements for no apparent reason.
Those of you who have had a little experience with Cascading Stylesheets will probably already know this one, but it’s one of my favorites. You can style just about any tag to act like just about any other tag, of course. You can make all of your strong text italic, or all of your emphasized text look like H4 headings. But you can also draw a border around any visible element on your page.
This is really where CSS has it all over Tables, when it comes to design. You can add a border to your table, of course, but it places a border around everything that sketches out the table. Headings, rows, columns, cells and the outer edge of the table, itself. With CSS, you can style borders around only the fourth cell in a row.
So, td td td td { border: 1px solid green; } will place a one-pixel border around any cell that is fourth in a sequence, so remember that if your row has five boxes, it may have two “fourth boxes”, the 1-2-3-fourth box and also the 2-3-4-fifth fourth box. You have even more control. td td td td { border-bottom: 1px dotted red; } places a dotted red line at the bottom of that third box. Pretty neat, huh?
So, how does any of this help you when it comes to Stuff Not Looking Right? You can easily lose track of spans and divisions and columns and paragraphs and all of their various margins and paddings and so on. So, when it doubt, put a border around it!
I cannot begin to count the number of times I was not sure why something was not getting better as I tweaked this or that element, only to draw a box around something and discover I wasn’t even working on the right area of the page! With today’s pages full of zenboxes and columns and so on it can be easy to get off into an area where you think you are working in one part of the page, only to find that you are actually adjusting some other page element.
Again, table borders go around everything in the table. Adding { border: 1px solid blue; } to a table in CSS, however, just draws a box around the outer edges.
Where this is all really useful is in figuring out how various spatial adjustments will affect our pages. The two most-common CSS rules are probably going to be margin and padding. We remember from our HTML training that we have an image, a portrait. Surrounding that, we have padding, like the matte. Then comes the border, similar to the frame of the portrait, and finally we have the space outside of the border, like the room outside of the frame, which we call margin.
You have an image that you want flush-right against the right column of your page. If you apply padding of 1 em-unit all of the way around that image ( padding: 1em; ), you will be creating an air space equal to the size of the M character over the top, down the right side, across under the bottom and up the left side. Get used to traveling clockwise around the box. If you need help, remember that “Margins and Padding are TRouBLe”. T-R-B-L, Top, Right, Bottom and Left. Those are the order we specify margin and padding limits.
After adding some space around your photo, you may now be unhappy because all of the text on your page lines up at the edge of its container, but the right-most edge of the picture itself is back to the right a character or two, and its apparent top isn’t aligned with the first line of text, but aligns closer to the second line. The way to fix this would be to assign no padding at all to the top and the right, but keeping it in effect for the bottom and the left-side of the photo. Padding: 0 0 1em 1em; will do that for you. Remember TRouBLe. We are assigning a value of zero to the top padding, zero again to the right-side padding, 1em to the bottom and another 1em to the left side.
Some of these adjustments can be pretty subtle and depending upon the vagaries of servers and connections, you may not be able to simply refresh your browser quickly enough to see the difference. But if you draw a box around your image, it will be much clearer. In your stylesheet, img { border: 1px solid orange; } will place a one-pixel line around your image. Some people also like to color a background when using padding. Background-color: #353535; will place a dark gray background color anywhere you have visible padding.
Three things are important here. Choose a color that contrasts easily with the rest of the material on your page. If your page includes a lot of browns and greens, choose a bright yellow or pink for your border color or background-color. Secondly, if things are really tight, you may find that adding a 1-pixel border around elements destroys some of the design. Imagine a full-width container of 800 pixels for your page. Now you fill that with three boxes, one 350-pixels wide, one that’s 150-pixels wide and one that’s 300-pixels wide. There’s your 800, right? What do you suppose will happen, if you add a 1-pixel border around that middle box? Remember, you have a pixel on the left, and a pixel on the right to contend with.
Finally, remember to delete these little tricks before you walk away from your page. It may confuse your visitors if they happen upon a page with little lines drawn around various elements for no apparent reason.
Wednesday, August 26, 2009
Troubleshooting
Troubleshooting always sounded like a Good Idea, to me. Got a problem? Take it out back and shoot it! Who could argue against that, right?
But how do you go about figuring out why a page doesn’t work the way it should? How do you find a validation error or a missing tag that’s causing everything to load up one column over from where you need it?
Let’s break it down into two cases. New Stuff and Old Stuff.
New Stuff
If you’re building page from scratch, the task is in many ways more difficult. You have nothing to go on and you have no fond memories of it ever actually working. Start with a deep breath. It’s highly unlikely that anyone is going to die as a result of your page not working right, today. First thing’s first: Validate your page. Let the validator look through it, line-by-line, scouting for simple errors in your markup. It’s easy to miss a closing double-quote or leave off a Table Row ending tag. The validator will catch things like that.
Once you have valid markup, you may find you have solved your problem. If not, work slowly and methodically, from the outside-in. Start with the framework of your page. If your divisions and tables and images aren’t where they are supposed to be, try to build a page where they are, without all of the text and linkage and so on.
The thing you don’t want to do is to start a slash-and-burn program of markup deletion. You have a lot of calories invested in your page, and there may be some Good Ideas in there that you can rescue. It is much easier to copy-and-paste than it is to think up All New Markup, after all, so comment out entire sections of your page and work with what is left. Add-back things one at a time and measure the differences. Remember that Web browsers will ignore anything between the <!-- characters and the --> characters, including text, media tags and even markup. Select the range of text you want to “delete” from your page and comment it out, instead, using the little cartoon voice bubble icon in your Code View Toolbar. Select the Apply HTML Comment option.
From here, don’t change two things. Change one thing, and then check it. Change the next and look over those results. Change a third thing, and so on. It is much easier to find the offending markup or code this way, and then much easier to seek out a solution.
Old Stuff
Working on current pages is a little easier, but totally ego-blasting. If the page works and you monkey it up, then there is no one to blame but yourself. Before modifying a working, current page, I like to make a copy of it for safekeeping. I may have a better idea, but if I can’t bring it to life, I can always at least go back to the way it was this morning, when it maybe wasn’t pretty but at least it worked.
But the basic process is the same, even including that deep breath at first. Validate your page, first. Then, work slowly, making only a change at a time, and see how these changes affect the outcome. Don’t delete anything, comment it out and then un-comment the various sections until you have a page that is complete. In this way, as above, you will be able to instantly see what markup is breaking your page, and hopefully be able to quickly and easily change it.
Remember, though, there is no glory in spending all day in a project like this. If you have spent eight hours on a page and it still doesn’t work, you have lost a whole day. ASK someone for help in a situation like that. Spending all day on a problem doesn’t make you a hero. Nobody is going to give you a medal for something like that and it’s very possible that someone in the WDN can get you an answer quickly and easily that will speed you on your way.
But how do you go about figuring out why a page doesn’t work the way it should? How do you find a validation error or a missing tag that’s causing everything to load up one column over from where you need it?
Let’s break it down into two cases. New Stuff and Old Stuff.
New Stuff
If you’re building page from scratch, the task is in many ways more difficult. You have nothing to go on and you have no fond memories of it ever actually working. Start with a deep breath. It’s highly unlikely that anyone is going to die as a result of your page not working right, today. First thing’s first: Validate your page. Let the validator look through it, line-by-line, scouting for simple errors in your markup. It’s easy to miss a closing double-quote or leave off a Table Row ending tag. The validator will catch things like that.
Once you have valid markup, you may find you have solved your problem. If not, work slowly and methodically, from the outside-in. Start with the framework of your page. If your divisions and tables and images aren’t where they are supposed to be, try to build a page where they are, without all of the text and linkage and so on.
The thing you don’t want to do is to start a slash-and-burn program of markup deletion. You have a lot of calories invested in your page, and there may be some Good Ideas in there that you can rescue. It is much easier to copy-and-paste than it is to think up All New Markup, after all, so comment out entire sections of your page and work with what is left. Add-back things one at a time and measure the differences. Remember that Web browsers will ignore anything between the <!-- characters and the --> characters, including text, media tags and even markup. Select the range of text you want to “delete” from your page and comment it out, instead, using the little cartoon voice bubble icon in your Code View Toolbar. Select the Apply HTML Comment option.
From here, don’t change two things. Change one thing, and then check it. Change the next and look over those results. Change a third thing, and so on. It is much easier to find the offending markup or code this way, and then much easier to seek out a solution.
Old Stuff
Working on current pages is a little easier, but totally ego-blasting. If the page works and you monkey it up, then there is no one to blame but yourself. Before modifying a working, current page, I like to make a copy of it for safekeeping. I may have a better idea, but if I can’t bring it to life, I can always at least go back to the way it was this morning, when it maybe wasn’t pretty but at least it worked.
But the basic process is the same, even including that deep breath at first. Validate your page, first. Then, work slowly, making only a change at a time, and see how these changes affect the outcome. Don’t delete anything, comment it out and then un-comment the various sections until you have a page that is complete. In this way, as above, you will be able to instantly see what markup is breaking your page, and hopefully be able to quickly and easily change it.
Remember, though, there is no glory in spending all day in a project like this. If you have spent eight hours on a page and it still doesn’t work, you have lost a whole day. ASK someone for help in a situation like that. Spending all day on a problem doesn’t make you a hero. Nobody is going to give you a medal for something like that and it’s very possible that someone in the WDN can get you an answer quickly and easily that will speed you on your way.
Wednesday, August 19, 2009
It's Over; It Begins Anew…
Or at least it has finally begun. The big Template move of 2009 is underway and pages all over the site are being renewed and reinvigorated with the New And Improved Template.
It might be worthwhile to take a moment here and actually go over what this represents. The work of Monday morning actually started about a year ago, with a regular meeting of the UNL Web Developers Network. We started thinking back then about what the new pages might end up looking like, and considering what features we wanted to have added or removed or improved and so on.
The key thing in all of this, I think, was that we had plenty of time, and we approached the whole project as a series of manageable tasks.
Tom Clancy was once asked how anyone could possibly sit down and write a novel? He allowed as how it was definitely a daunting task, and wondered himself how anyone could do it. What he did, he said, was to approach the whole book as a series of steps. Write a first sentence. Get it all shined-up and then move on to the next one. Stand up. Walk around. Get used to the idea of how these two sentences work and play together, and then add a third. At some point, you have an opening paragraph. Then, you have some idea, some guidance, as to what your next paragraph has to be, so start in on it. Two or three paragraphs and you have yourself a page. String a few pages together and you have built a serviceable chapter. Lather, rinse, repeat; and the chapters become… a book!
We did not sit down around a big table one day and decide the navigation was supposed to sit atop the page. We actually spent one a couple of days coming together with upward of a dozen navigation schemes. Some were from higher education sites. Others were from online shopping sites. Others were news outlets, government sites and more. We didn’t care where the Next Big Idea came from, we just cared about the idea. Once we settled on a top-nav situation, work began on how to make that all work, and—and this is important—how to make it all work within our current situation, with the relatedlinks and navigation and footer information we already have living in the sharedcode folder. Our navigation, remember, was (is) built from two levels of nested unordered lists. So whatever we did, it had to work with anyone’s current biplane navigation file.
We talked about color. We talked about shapes. We talked about White Space. We talked about what language to use, in marking up the pages. Remember, we were working on a design that would probably welcome the incoming class of 2017 or so. We tried to shoot current trends out into the future and make a page for the technology of summer, 2009 and the technology and the marketplace of 2012 as well. At the time, we considered HTML 5 and XHTML 2 briefly and discarded both. And that was good, because the XHTML working group imploded a short time later. We are holding with XHTML 1 for the time being, and will reexamine the situation for the next redesign.
We got a lot of input from a lot of people. Not every idea was incorporated into the site—some ideas actually conflicted with one another and we couldn’t do both. Not everyone is entirely happy with every aspect of the page today, but the general feeling I get from the feedback I have received has so far been very positive. I am interested in hearing from people today, of course, but also in hearing how people think about the pages in a year or so. Having lived with them for a year, I suspect people’s opinions may change some.
Time is your buddy in a project like this one. The more you have, the better job you can do. The big stuff comes together quickly, or can. But I always wish I had more time to shine up the little details in a project like this one. I am hoping that we will have more time for the next one.
I am already looking forward to it.
It might be worthwhile to take a moment here and actually go over what this represents. The work of Monday morning actually started about a year ago, with a regular meeting of the UNL Web Developers Network. We started thinking back then about what the new pages might end up looking like, and considering what features we wanted to have added or removed or improved and so on.
The key thing in all of this, I think, was that we had plenty of time, and we approached the whole project as a series of manageable tasks.
Tom Clancy was once asked how anyone could possibly sit down and write a novel? He allowed as how it was definitely a daunting task, and wondered himself how anyone could do it. What he did, he said, was to approach the whole book as a series of steps. Write a first sentence. Get it all shined-up and then move on to the next one. Stand up. Walk around. Get used to the idea of how these two sentences work and play together, and then add a third. At some point, you have an opening paragraph. Then, you have some idea, some guidance, as to what your next paragraph has to be, so start in on it. Two or three paragraphs and you have yourself a page. String a few pages together and you have built a serviceable chapter. Lather, rinse, repeat; and the chapters become… a book!
We did not sit down around a big table one day and decide the navigation was supposed to sit atop the page. We actually spent one a couple of days coming together with upward of a dozen navigation schemes. Some were from higher education sites. Others were from online shopping sites. Others were news outlets, government sites and more. We didn’t care where the Next Big Idea came from, we just cared about the idea. Once we settled on a top-nav situation, work began on how to make that all work, and—and this is important—how to make it all work within our current situation, with the relatedlinks and navigation and footer information we already have living in the sharedcode folder. Our navigation, remember, was (is) built from two levels of nested unordered lists. So whatever we did, it had to work with anyone’s current biplane navigation file.
We talked about color. We talked about shapes. We talked about White Space. We talked about what language to use, in marking up the pages. Remember, we were working on a design that would probably welcome the incoming class of 2017 or so. We tried to shoot current trends out into the future and make a page for the technology of summer, 2009 and the technology and the marketplace of 2012 as well. At the time, we considered HTML 5 and XHTML 2 briefly and discarded both. And that was good, because the XHTML working group imploded a short time later. We are holding with XHTML 1 for the time being, and will reexamine the situation for the next redesign.
We got a lot of input from a lot of people. Not every idea was incorporated into the site—some ideas actually conflicted with one another and we couldn’t do both. Not everyone is entirely happy with every aspect of the page today, but the general feeling I get from the feedback I have received has so far been very positive. I am interested in hearing from people today, of course, but also in hearing how people think about the pages in a year or so. Having lived with them for a year, I suspect people’s opinions may change some.
Time is your buddy in a project like this one. The more you have, the better job you can do. The big stuff comes together quickly, or can. But I always wish I had more time to shine up the little details in a project like this one. I am hoping that we will have more time for the next one.
I am already looking forward to it.
Wednesday, August 12, 2009
Keeping Up
I was talking with someone the other day about how I had spent my afternoon, describing editing screen shots and writing copy and double-checking everything and they asked me something I hadn’t considered much, lately, “How do you keep up with everything?”
There is a lot. HTML hasn’t changed much, but that itself may be changing, soon. Cascading Style Sheets have not changed much recently, but that may be about to end, too. Dreamweaver changes at regular intervals, but after Dreamweaver MX2000 only incrementally, and I am still catching up there.
The Templates we use have changed quite a bit over the summer, with tiny little changes as recently as, well, yesterday. But I have been in most of those meetings, and even had a hand in a few of the changes, so that hasn’t been difficult, aside from the communications issues.
So there’s the situation with the tools and the languages. There are (or were) lots of conferences, seminars and books and magazines and newspapers available, too.
The Computer Press has been ravaged in the last four to six years. I used to be a part of it, having been a writer for Ziff-Davis’ Computer Shopper magazine, the MacHome Journal and others. There was a time not long ago when you would walk into a B.Dalton bookstore and see several bays of computer books. At one time there were thirty titles devoted to WordPerfect, alone.
In the Macintosh slice of the pie, we had four or five monthly magazines, Macworld, MacUser, MACazine and the programmy MacTech, along with a weekly newspaper/magazine, MacWEEK. We had two trade shows every year, plus the mighty Comdex show, and various Mac user groups all dishing out How-To-Mac details, news, tips and so on. The PC side of things was even worse, of course. Just PC World, from IDG, was like getting a Sears Christmas catalog every month.
As far as I know, there are only three Web magazines, and only two you should consider. Both are from England, which makes them a little expensive, but I recommend Web Designer and .Net, if you can get them. A caution: .Net used to be available here in the USA as Practical Web Design. Elsewhere in the world it was called .Net (Dot-Net). That never quite caught on here, because everyone with a PC hears that and thinks of the Microsoft development architecture of a few years ago. There are ads enticing you to subscribe to Practical Web Design, but when you do, .Net is what shows up in your mailbox.
Today, of course, we have the Web and you need a computer to even get there, so it stands that the Computer Press would suffer first and hardest. Reading paper products is down across the board. Newspapers have folded and are struggling to reinvent themselves, bookstores have closed leaving only Barnes and Noble and Borders in many towns and the local magazine rack is about a third the size it was just a few years ago. The acre of computer books has shrunk down to about the same size as the cookbook section in my favorite book store. So, apparently, nobody has time, any more, to just sit and read. So, that leaves us Web sites and podcasts. And I use… both.
I try to check in with A List Apart at least once every couple of weeks. They generally feature three big stories and cover a lot of real, nuts-and-bolts markup and styling. These are the guys who led the charge for standards adherence and better browsers, starting with Issue 99. They are Good People.
I also listen to podcasts. I work in one of those cubicle farms that are made fun of in Dilbert comics and cheap movies. I don’t enjoy hearing my neighbors arguing with their wives, spouting the latest political propaganda or catching Hell from the boss. So, I plug my headphones or earbuds in and listen and learn throughout the day.
Paul Boag (BOW·agg) has one of the best podcasts for anyone wanting to know more about their craft. Boagworld is a weekly podcast for those who “Design, Develop or Run Web sites”. As with print magazines, both Boag and my next podcast come from the UK. The Rissington Podcast answers the question “What would a Web podcast be like if it had been done by Monty Python, just following World War II?” If you have never asked that question, perhaps you should give a listen.
One of the best ways to keep up, of course, remains the monthly meeting of the Web Developers Network. Sitting in on one of those gets you rubbing shoulders with people who are using other tools to keep up, and some of that knowledge is bound to rub off on you. And it’s the best way to find out how all of this new technology, or all of these new techniques, might find use here.
There is a lot. HTML hasn’t changed much, but that itself may be changing, soon. Cascading Style Sheets have not changed much recently, but that may be about to end, too. Dreamweaver changes at regular intervals, but after Dreamweaver MX2000 only incrementally, and I am still catching up there.
The Templates we use have changed quite a bit over the summer, with tiny little changes as recently as, well, yesterday. But I have been in most of those meetings, and even had a hand in a few of the changes, so that hasn’t been difficult, aside from the communications issues.
So there’s the situation with the tools and the languages. There are (or were) lots of conferences, seminars and books and magazines and newspapers available, too.
The Computer Press has been ravaged in the last four to six years. I used to be a part of it, having been a writer for Ziff-Davis’ Computer Shopper magazine, the MacHome Journal and others. There was a time not long ago when you would walk into a B.Dalton bookstore and see several bays of computer books. At one time there were thirty titles devoted to WordPerfect, alone.
In the Macintosh slice of the pie, we had four or five monthly magazines, Macworld, MacUser, MACazine and the programmy MacTech, along with a weekly newspaper/magazine, MacWEEK. We had two trade shows every year, plus the mighty Comdex show, and various Mac user groups all dishing out How-To-Mac details, news, tips and so on. The PC side of things was even worse, of course. Just PC World, from IDG, was like getting a Sears Christmas catalog every month.
As far as I know, there are only three Web magazines, and only two you should consider. Both are from England, which makes them a little expensive, but I recommend Web Designer and .Net, if you can get them. A caution: .Net used to be available here in the USA as Practical Web Design. Elsewhere in the world it was called .Net (Dot-Net). That never quite caught on here, because everyone with a PC hears that and thinks of the Microsoft development architecture of a few years ago. There are ads enticing you to subscribe to Practical Web Design, but when you do, .Net is what shows up in your mailbox.
Today, of course, we have the Web and you need a computer to even get there, so it stands that the Computer Press would suffer first and hardest. Reading paper products is down across the board. Newspapers have folded and are struggling to reinvent themselves, bookstores have closed leaving only Barnes and Noble and Borders in many towns and the local magazine rack is about a third the size it was just a few years ago. The acre of computer books has shrunk down to about the same size as the cookbook section in my favorite book store. So, apparently, nobody has time, any more, to just sit and read. So, that leaves us Web sites and podcasts. And I use… both.
I try to check in with A List Apart at least once every couple of weeks. They generally feature three big stories and cover a lot of real, nuts-and-bolts markup and styling. These are the guys who led the charge for standards adherence and better browsers, starting with Issue 99. They are Good People.
I also listen to podcasts. I work in one of those cubicle farms that are made fun of in Dilbert comics and cheap movies. I don’t enjoy hearing my neighbors arguing with their wives, spouting the latest political propaganda or catching Hell from the boss. So, I plug my headphones or earbuds in and listen and learn throughout the day.
Paul Boag (BOW·agg) has one of the best podcasts for anyone wanting to know more about their craft. Boagworld is a weekly podcast for those who “Design, Develop or Run Web sites”. As with print magazines, both Boag and my next podcast come from the UK. The Rissington Podcast answers the question “What would a Web podcast be like if it had been done by Monty Python, just following World War II?” If you have never asked that question, perhaps you should give a listen.
One of the best ways to keep up, of course, remains the monthly meeting of the Web Developers Network. Sitting in on one of those gets you rubbing shoulders with people who are using other tools to keep up, and some of that knowledge is bound to rub off on you. And it’s the best way to find out how all of this new technology, or all of these new techniques, might find use here.
Wednesday, August 5, 2009
The Best Laid Plans…
Burns said it, more or less. “The best laid plans of mice and men oft times go astray”. So it has been, with the move to the new Templates.
This move hasn’t been as certain as previous updates. At least in my memory, we had a very definite point at which everything stopped and we all just worked and waited and watched… and at the appointed hour we updated our pages and we went on with our lives.
This time it’s different. Economists warn that these are the most dangerous words in the English language. People are getting mortgages for $500,000 houses without even having to prove they have a job, let alone proving how much they actually earn? It’s okay, a year from now they will sell the house for $550,000 to a bigger chump with a better mortgage and everything will be fine. This time, it’s different. Right.
But the path of this month’s Template change has been different. Last month, I gave a talk, an overview, of the new design and what changes had been made and how they would affect everyone. At that meeting, it was announced that we had reached a deadline, that the Template markup Would Not Change from here on (for a while), and so we were now all safe to download the latest archive and get to work on our pages. I should point out that at that meeting, I was told that something had changed just that very morning, and a feature I had put into my presentation “would not ship” as we say. Changes were happening right up until the very end, but they were done, now.
I made a joke about it. At some point during the discussion of What Was New, I offered to bet anyone in the room that we would have at least one update before our August 17th kick-off. Sadly, there were no takers.
Since that day, I have completed Template training based on the markup I was able to get in early July. Since that day, I have given the New&Improved Templates training five times. And each time it has been new and different from the last.
So, there are changes. And these sometimes cause a cascade of other changes. Because “this” is different, now “that” needs to change, as well.
I’m trying to keep up, but the communication between the guys doing the work and myself isn’t constant, and the pages are in a state of near constant change, it seems. A piece I didn’t quite understand was removed, so good. A piece I don’t quite understand was added, and that’s bad. If I don’t understand it, I can’t teach it, effectively.
Included files that used to be a dozen lines long are now much smaller. Files we used to discuss have been removed. And the last two times we have done the training, three of the students have had their computers lock-up on them, causing them to lose all of their work. That’s frustrating, because it has happened toward the end of the class, when I have people build a new page which incorporates all of the changes made to their navigation, their footer, etc. If you don’t actually see that happen with your own eyes, then the entire exercise is little more than… theory, almost.
We are getting closer to being finished. There isn’t much left that the coders can change. Did you just hear God laughing? Maybe that was someone in the next cubicle… Anyway, things are probably approaching a stability we haven’t seen in a while. I am looking forward to the first time I give the same training, twice.
And the great wheel turns.
Big, major events have schedules that fill an entire calendar. That music festival you love? That giant, week-long airshow? That gathering of car enthusiasts that takes place every year in August? The planning for that single week is ongoing throughout the entire year. It may be time to adopt that kind of model, here. Maybe we should start working on the 2012 package in September, taking careful note of all of the responses we get to the rollout in August. If we had three years, instead of three months, I suspect we could turn out a damned fine Web page. And maybe even one that wouldn’t need to change, for a while.
This move hasn’t been as certain as previous updates. At least in my memory, we had a very definite point at which everything stopped and we all just worked and waited and watched… and at the appointed hour we updated our pages and we went on with our lives.
This time it’s different. Economists warn that these are the most dangerous words in the English language. People are getting mortgages for $500,000 houses without even having to prove they have a job, let alone proving how much they actually earn? It’s okay, a year from now they will sell the house for $550,000 to a bigger chump with a better mortgage and everything will be fine. This time, it’s different. Right.
But the path of this month’s Template change has been different. Last month, I gave a talk, an overview, of the new design and what changes had been made and how they would affect everyone. At that meeting, it was announced that we had reached a deadline, that the Template markup Would Not Change from here on (for a while), and so we were now all safe to download the latest archive and get to work on our pages. I should point out that at that meeting, I was told that something had changed just that very morning, and a feature I had put into my presentation “would not ship” as we say. Changes were happening right up until the very end, but they were done, now.
I made a joke about it. At some point during the discussion of What Was New, I offered to bet anyone in the room that we would have at least one update before our August 17th kick-off. Sadly, there were no takers.
Since that day, I have completed Template training based on the markup I was able to get in early July. Since that day, I have given the New&Improved Templates training five times. And each time it has been new and different from the last.
So, there are changes. And these sometimes cause a cascade of other changes. Because “this” is different, now “that” needs to change, as well.
I’m trying to keep up, but the communication between the guys doing the work and myself isn’t constant, and the pages are in a state of near constant change, it seems. A piece I didn’t quite understand was removed, so good. A piece I don’t quite understand was added, and that’s bad. If I don’t understand it, I can’t teach it, effectively.
Included files that used to be a dozen lines long are now much smaller. Files we used to discuss have been removed. And the last two times we have done the training, three of the students have had their computers lock-up on them, causing them to lose all of their work. That’s frustrating, because it has happened toward the end of the class, when I have people build a new page which incorporates all of the changes made to their navigation, their footer, etc. If you don’t actually see that happen with your own eyes, then the entire exercise is little more than… theory, almost.
We are getting closer to being finished. There isn’t much left that the coders can change. Did you just hear God laughing? Maybe that was someone in the next cubicle… Anyway, things are probably approaching a stability we haven’t seen in a while. I am looking forward to the first time I give the same training, twice.
And the great wheel turns.
Big, major events have schedules that fill an entire calendar. That music festival you love? That giant, week-long airshow? That gathering of car enthusiasts that takes place every year in August? The planning for that single week is ongoing throughout the entire year. It may be time to adopt that kind of model, here. Maybe we should start working on the 2012 package in September, taking careful note of all of the responses we get to the rollout in August. If we had three years, instead of three months, I suspect we could turn out a damned fine Web page. And maybe even one that wouldn’t need to change, for a while.
Wednesday, July 29, 2009
I Love It When a Plan Comes Together
I love it when a plan comes together. The Templates are about to deployed here at work, the product of a lot of people spending a lot of hours working on a lot of solutions, and then choosing one and making it the best.
Early-on, we started this knowing that whatever we ended up with, it would be the page we looked at for at least three years—maybe even longer. So, like a car designer, we had to try to peer into the future a little ways and figure out what kind of a market we would be selling into. It takes about three years to design a new car, too.
Today, the language we use to mark up our pages is XHTML. Would that be the best choice for 2012, though? We use version 1.0, Transitional. Would there be any advantage in moving to another definition, such as Strict at this point? There were two working groups when we started, one was at work on building a new XHTML, XHTML 2. The other—wonder of wonders—was hard at work building a proposed new HTML 5. If you have ever taken my HTML training, you know that for years now I have been dancing around telling people that they can learn all of HTML, because there wouldn’t be another one. HTML 4.01 was supposed to be the last.
So, how would you have bet? We hashed it out for a while and decided to stick with XHTML 1.0, Transitional. It’s been good to us, so far. People seem comfortable using it. It has good fidelity between platforms and browsers. And just a week after we made that decision, the XHTML 2 committee came apart at the seams. So it may be a long, long time before we get any new markup languages. When that day comes, we will probably examine things again, surveying the then-current landscape and trying to puzzle-out the future.
We are learning as we go, in this process. Things won’t always be as they are now, the second rule of investing, applies here. Just as we cannot know about inflation, unemployment, advances in technologies or disruptions in supply lines years ahead we don’t really know who will be building the Template of 2020, or how. I’m reminded of that every time we talk about the heading area of the page, today. The editable area is still named “titlegraphic” from the days years ago when it actually was an image file. If we only knew, then, what we know today, we could have done a much better job all along.
Still, we expect transmission speeds inside the buildings to stay about the same or improve slightly. We expect the normative screen size to stay about the same or increase, slightly. We expect that handheld devices are not going to suddenly become less popular in the years ahead and so we will soon begin looking at ways to better include them in our design considerations.
And we expect to again lead the way in validated pages and accessible design. That’s something I am really proud of. We lead the league in Good Pages, something I point out at every training session.
I’m talking here like we are done with everything for this next cycle. We are not. The work continues, fleshing out this or that deficiency and smoothing over this or that awkward feature. That kind of thing continues right up until deployment of the next Template. But for now, even though we aren’t done we have come to most visible checkpoint in the process, the one with the most rapid and convincing change. And now, looking back, it’s really amazing at what all we did. I love it when a plan comes together.
Early-on, we started this knowing that whatever we ended up with, it would be the page we looked at for at least three years—maybe even longer. So, like a car designer, we had to try to peer into the future a little ways and figure out what kind of a market we would be selling into. It takes about three years to design a new car, too.
Today, the language we use to mark up our pages is XHTML. Would that be the best choice for 2012, though? We use version 1.0, Transitional. Would there be any advantage in moving to another definition, such as Strict at this point? There were two working groups when we started, one was at work on building a new XHTML, XHTML 2. The other—wonder of wonders—was hard at work building a proposed new HTML 5. If you have ever taken my HTML training, you know that for years now I have been dancing around telling people that they can learn all of HTML, because there wouldn’t be another one. HTML 4.01 was supposed to be the last.
So, how would you have bet? We hashed it out for a while and decided to stick with XHTML 1.0, Transitional. It’s been good to us, so far. People seem comfortable using it. It has good fidelity between platforms and browsers. And just a week after we made that decision, the XHTML 2 committee came apart at the seams. So it may be a long, long time before we get any new markup languages. When that day comes, we will probably examine things again, surveying the then-current landscape and trying to puzzle-out the future.
We are learning as we go, in this process. Things won’t always be as they are now, the second rule of investing, applies here. Just as we cannot know about inflation, unemployment, advances in technologies or disruptions in supply lines years ahead we don’t really know who will be building the Template of 2020, or how. I’m reminded of that every time we talk about the heading area of the page, today. The editable area is still named “titlegraphic” from the days years ago when it actually was an image file. If we only knew, then, what we know today, we could have done a much better job all along.
Still, we expect transmission speeds inside the buildings to stay about the same or improve slightly. We expect the normative screen size to stay about the same or increase, slightly. We expect that handheld devices are not going to suddenly become less popular in the years ahead and so we will soon begin looking at ways to better include them in our design considerations.
And we expect to again lead the way in validated pages and accessible design. That’s something I am really proud of. We lead the league in Good Pages, something I point out at every training session.
I’m talking here like we are done with everything for this next cycle. We are not. The work continues, fleshing out this or that deficiency and smoothing over this or that awkward feature. That kind of thing continues right up until deployment of the next Template. But for now, even though we aren’t done we have come to most visible checkpoint in the process, the one with the most rapid and convincing change. And now, looking back, it’s really amazing at what all we did. I love it when a plan comes together.
Wednesday, July 22, 2009
Lazy Days of Summer
I have always been a weird kind of lazy. I love that feeling of accomplishment that comes from finishing a job that’s been hanging over you for a while. Love It! And I will work like a dog to get that feeling, again. But then, damnit, I want a little time to actually relax and enjoy that moment for a while.
I have found, again and again, that there is nothing like a Big Project to get me to finish a bunch of little projects. Efficiency experts discuss this kind of thing in terms like avoidance techniques. I never feel like I’m actually avoiding anything, or even really putting anything off. I mean, just spend a few minutes thinking about it and I am sure that you can draw a straight line connecting emptying out the recycling trash in my cubicle and putting together a new presentation on Web templates, right?
I need to accomplish “X” today. I would like to accomplish “Y” and it would be great if I could get around to working on “Z”, too.
So I sit down and start thinking about “X”. How long will it take me? How many people will be seeing it and who are they? Do they understand all of the various cogs and gears that go into “X” or will I have to explain that to them, too? Hmm… I wonder how other people have explained “X” before this? Wasn’t there a version of “X” a few years ago that had no calories? Do they even deal with “X” any more in the leading… “Ooooh! I need to empty out the recycling!” Okay, I can work on “X” all day, but that recycling isn’t going to empty itself. And while I’m up and on my way down the hall, I should probably stop and see if there is any inter-office mail in my inbox.
So I dump out the newsletters from the credit union and all of the stuff about upcoming concerts and speeches and source listings from pages I have already forgotten, and on my way back, I stop and check the box for any more paper that will probably go straight into the newly-empty recycling. But the whole time I am doing this stuff, I am thinking about “X”.
I cannot just sit idle. And not just because it looks bad—that is always the moment the boss walks by. I have to be doing something, and I usually am. Quite often while I am doing one thing, I am thinking about another. This can be a huge distraction and I don’t recommend it for everyone, but I have learned to build lists and to prioritize the entries there and always have something in the bag for the next big project that is a little more thinky than the kind of thing you can just sit down and crank out.
Right now, in the back of my mind, I am mulling over options for how to discuss something in the new Template training which is just going together now. I could sit down and crank out a page showing how it’s done, and then end up deleting everything and trying again after lunch. Or I could stop and bang out this week’s blog update and keep tossing the Templates training over and over in my mind until I get it all worked out, and then commit it all to hot phosphor.
As these things go, I have in fact just figured out how best to do the Next Big Thing in the Templates training, so I must close this out, for now.
And once again, I have filled what might otherwise have been time spent staring off into space with accomplishing something else that needed to get done. If anyone had walked by and seen me, it would have looked exactly like I was updating my blog. But this evening, when my wife asks me what I did this morning, I’ll tell her I was working on my Templates training.
But I’ll tell you one thing: When I get home at 5pm, it all stops and I get to relax, until it all starts up again in the morning.
I have found, again and again, that there is nothing like a Big Project to get me to finish a bunch of little projects. Efficiency experts discuss this kind of thing in terms like avoidance techniques. I never feel like I’m actually avoiding anything, or even really putting anything off. I mean, just spend a few minutes thinking about it and I am sure that you can draw a straight line connecting emptying out the recycling trash in my cubicle and putting together a new presentation on Web templates, right?
I need to accomplish “X” today. I would like to accomplish “Y” and it would be great if I could get around to working on “Z”, too.
So I sit down and start thinking about “X”. How long will it take me? How many people will be seeing it and who are they? Do they understand all of the various cogs and gears that go into “X” or will I have to explain that to them, too? Hmm… I wonder how other people have explained “X” before this? Wasn’t there a version of “X” a few years ago that had no calories? Do they even deal with “X” any more in the leading… “Ooooh! I need to empty out the recycling!” Okay, I can work on “X” all day, but that recycling isn’t going to empty itself. And while I’m up and on my way down the hall, I should probably stop and see if there is any inter-office mail in my inbox.
So I dump out the newsletters from the credit union and all of the stuff about upcoming concerts and speeches and source listings from pages I have already forgotten, and on my way back, I stop and check the box for any more paper that will probably go straight into the newly-empty recycling. But the whole time I am doing this stuff, I am thinking about “X”.
I cannot just sit idle. And not just because it looks bad—that is always the moment the boss walks by. I have to be doing something, and I usually am. Quite often while I am doing one thing, I am thinking about another. This can be a huge distraction and I don’t recommend it for everyone, but I have learned to build lists and to prioritize the entries there and always have something in the bag for the next big project that is a little more thinky than the kind of thing you can just sit down and crank out.
Right now, in the back of my mind, I am mulling over options for how to discuss something in the new Template training which is just going together now. I could sit down and crank out a page showing how it’s done, and then end up deleting everything and trying again after lunch. Or I could stop and bang out this week’s blog update and keep tossing the Templates training over and over in my mind until I get it all worked out, and then commit it all to hot phosphor.
As these things go, I have in fact just figured out how best to do the Next Big Thing in the Templates training, so I must close this out, for now.
And once again, I have filled what might otherwise have been time spent staring off into space with accomplishing something else that needed to get done. If anyone had walked by and seen me, it would have looked exactly like I was updating my blog. But this evening, when my wife asks me what I did this morning, I’ll tell her I was working on my Templates training.
But I’ll tell you one thing: When I get home at 5pm, it all stops and I get to relax, until it all starts up again in the morning.
Wednesday, July 15, 2009
New Templates; New Troubles.
I try to keep most of these posts rather generic, discussing my job and various aspects of it only as they apply to the discussion at hand. But this week, I probably should spend a few calories discussing the new Templates we are rolling out at work, and how that is going to affect a lot of people.
I really had high hopes, after checking out the Web site and reading the book that David Shea and Molly Holzschlag put together some years ago. One day, this is how all design changes would happen, right? I mean, as a proof-of-concept vehicle, the Web site proved it was not only possible, but made it look easy!
Well, of course, there’s easy and there’s easy. The task we are about to embark upon is easier than it might have been back in the Olden Days of font tags and tables. But it falls short of the dream of the one-button update by a ways.
There are things we should all be doing, now, to make our lives easier in the immediate future. First, validate page markup and CSS and get that out of the way. This is difficult enough when the markup is correct. Asking for a clean update when you start with poor markup is just asking for trouble.
I really like the idea of building a shadow site, a kind of a test site, and working on getting your pages updated in there. You can name this directory /beta2009/ or /beta/ or /incubator/ or whatever you’d like, then copy all of your page files into this new directory.
You need to point at this new directory with Dreamweaver. I copied my original site in the Manage Site box, then opened it up and changed the name and the URL strings for the Local, Remote and Testing servers. Go slowly here, and take your time and don’t do anything that you don’t fully understand, first. The goal is to end up with a site you can click on to open http://www.unl.edu/yoursite/ and one to open up http://www.unl.edu/yoursite/beta2009/. This new location features what we used to call “Security Through Obscurity”. Nobody should be visiting the pages here, because nobody will know they are there. They all reside within the unlinked directory /beta2009/ within your “real” site.
Having made the changes, consider making an archive of your site as it exists today. Name it site.zip and place this on your desktop, outside of the Dreamweaver environment. If you ever need to return to a current-template page, it will be in here.
Start slowly and deliberately and work your way through your new /beta2009/ site, document-by-document, folder-by-folder. From your Modify menu, you want to select Templates down at the bottom. Apply Template to Page... is the selection you want to make. We use the fixed-width Template, so select that one. There are elements we do not use this time, such as the college navigation area. You will want to map those to “Nowhere” and click “Use for all” and then “OK”. Your page should update into the new look. Save it and check it, remembering its new address in the /beta2009/ folder.
Remember you want to keep your own navigation and related links and footer information, so be careful when you un-pack your new Templates folder and sharedcode folder into your /beta2009/ site. Again, point and click and type slowly and make sure you understand what is expected to come up, at every point. Save often. Put often. Check your pages in a Web browser often. Check your old pages often, too, to make sure you aren’t working on the live pages.
Make whatever edits you need and consider how the extra room is going to be used in the new Template design. Maybe you have lists that could go in their own columns. Maybe you have styled certain page elements based on percentages and these are now not quite optimal, because the size of the container is bigger, now. Work your way through all of the pages in a folder before going on to the next one, starting at the documents at your root (top) level. When you are done, give yourself a day or two if you can and then come back and see how the pages look in the new design.
On the day of the rollout, drag your pages out of the /beta2009/ folder to make them live, replacing the information that is already there (and which you have safely copied into your .zip file). Then just wait for the accolades to roll in.
I suspect we will all meet somewhere the evening of the 17th and toss back a few, raising toasts to the valiant crew of the Web Developer Network. I suspect that some of us will want a few drinks by then. And some of us will probably need them.
Good luck!
I really had high hopes, after checking out the Web site and reading the book that David Shea and Molly Holzschlag put together some years ago. One day, this is how all design changes would happen, right? I mean, as a proof-of-concept vehicle, the Web site proved it was not only possible, but made it look easy!
Well, of course, there’s easy and there’s easy. The task we are about to embark upon is easier than it might have been back in the Olden Days of font tags and tables. But it falls short of the dream of the one-button update by a ways.
There are things we should all be doing, now, to make our lives easier in the immediate future. First, validate page markup and CSS and get that out of the way. This is difficult enough when the markup is correct. Asking for a clean update when you start with poor markup is just asking for trouble.
I really like the idea of building a shadow site, a kind of a test site, and working on getting your pages updated in there. You can name this directory /beta2009/ or /beta/ or /incubator/ or whatever you’d like, then copy all of your page files into this new directory.
You need to point at this new directory with Dreamweaver. I copied my original site in the Manage Site box, then opened it up and changed the name and the URL strings for the Local, Remote and Testing servers. Go slowly here, and take your time and don’t do anything that you don’t fully understand, first. The goal is to end up with a site you can click on to open http://www.unl.edu/yoursite/ and one to open up http://www.unl.edu/yoursite/beta2009/. This new location features what we used to call “Security Through Obscurity”. Nobody should be visiting the pages here, because nobody will know they are there. They all reside within the unlinked directory /beta2009/ within your “real” site.
Having made the changes, consider making an archive of your site as it exists today. Name it site.zip and place this on your desktop, outside of the Dreamweaver environment. If you ever need to return to a current-template page, it will be in here.
Start slowly and deliberately and work your way through your new /beta2009/ site, document-by-document, folder-by-folder. From your Modify menu, you want to select Templates down at the bottom. Apply Template to Page... is the selection you want to make. We use the fixed-width Template, so select that one. There are elements we do not use this time, such as the college navigation area. You will want to map those to “Nowhere” and click “Use for all” and then “OK”. Your page should update into the new look. Save it and check it, remembering its new address in the /beta2009/ folder.
Remember you want to keep your own navigation and related links and footer information, so be careful when you un-pack your new Templates folder and sharedcode folder into your /beta2009/ site. Again, point and click and type slowly and make sure you understand what is expected to come up, at every point. Save often. Put often. Check your pages in a Web browser often. Check your old pages often, too, to make sure you aren’t working on the live pages.
Make whatever edits you need and consider how the extra room is going to be used in the new Template design. Maybe you have lists that could go in their own columns. Maybe you have styled certain page elements based on percentages and these are now not quite optimal, because the size of the container is bigger, now. Work your way through all of the pages in a folder before going on to the next one, starting at the documents at your root (top) level. When you are done, give yourself a day or two if you can and then come back and see how the pages look in the new design.
On the day of the rollout, drag your pages out of the /beta2009/ folder to make them live, replacing the information that is already there (and which you have safely copied into your .zip file). Then just wait for the accolades to roll in.
I suspect we will all meet somewhere the evening of the 17th and toss back a few, raising toasts to the valiant crew of the Web Developer Network. I suspect that some of us will want a few drinks by then. And some of us will probably need them.
Good luck!
Wednesday, July 8, 2009
Sure, You CAN, but Should You?
Promise me this much: When I die, please don’t hold my memorial in the Staples Center?
Let’s talk a little about perspective and what is appropriate, and all the while, let’s dance around the issue of good taste.
You can do all kinds of things with a Web page. You can use seventeen fonts, or more, on a single page. You can use thirty colors for type and background and so on. You can have nine vertical columns, or you can have only one.
You can make all of the mistakes in Web Pages That Suck, either the book or the Web site (or both). Or you can learn from the mistakes of others.
You can argue that you prefer a single column, 24” across, of 9pt text. But deep inside, in your heart of hearts, you have to know that most people would rather have that horizontal space broken up into more manageable column sizes. That’s why we have columns in our newspapers and even in our magazines—and in our better Web pages, too.
Maybe you love Blue. You enjoy light blue text against a dark blue background, with varying shades of blue in the page headers and image borders and so on. Monochromatic sites have their place, but it may not be the way to go if you are trying to reach, and keep, a wide audience. In their way, staying entirely within a single color family can be as awful as dealing with dozens of colors in a busy, frantic page.
I can do things when I build a Web site for a band that I would never do if I was working on a page for, say, an attorney. Grunge fonts, dark shadowy images, Flash treatment of various links providing scary rollover effects? Is that what you want when you are looking for some entertainment on a Saturday night? Or is that what you look for when your dog gets loose and bites the neighbor kid and you have to go to court? Likewise, do you want solid, conservative, gravitas-laden images, graphics and design when you are deciding what band to go and see? Is there a band anywhere that tours in Grey Flannel? The early Beatles were the last band I remember performing in suits, and even those were collarless.
Even once you have settled on major themes there are still a great many other design properties that need to be settled dealing with the purpose of a page. Are you trying to provide reference material online? Are you trying to build an online brochure? You need to use a whole different toolbox if you are just presenting information than you would use if you were trying to convince someone of something, or trying to showcase what features and benefits accrue to satisfied customers of your work.
Special menu effects are interesting and fun when they don’t get in the way, but they aren’t going to help boost your traffic if your page explains how to do something. If I land on your page from a Google search because I want to lean how to set my computer to automatically wake up and go to sleep at different times every day, I’m not going to probably ever come back just to marvel at the way your navigation grows, shrinks and evolves. Money, time and other resources spent building glamorous navigation is going to be lost on that kind of a page, where again, if the page was more of a brochure, that kind of thing might be much more appropriate.
If you are building pages for a retirement community, are eight- and nine-point text sizes the best you can choose? Sure, a user should be able to adjust their browser or their computer to compensate for whatever shortcomings a designer may have left them, but older people are most likely to have problem seeing smaller text, and least likely to know how to make changes.
You have a lot of power, when you sit down to build a Web page. With great power comes great responsibility. Be sure you use it wisely.
Let’s talk a little about perspective and what is appropriate, and all the while, let’s dance around the issue of good taste.
You can do all kinds of things with a Web page. You can use seventeen fonts, or more, on a single page. You can use thirty colors for type and background and so on. You can have nine vertical columns, or you can have only one.
You can make all of the mistakes in Web Pages That Suck, either the book or the Web site (or both). Or you can learn from the mistakes of others.
You can argue that you prefer a single column, 24” across, of 9pt text. But deep inside, in your heart of hearts, you have to know that most people would rather have that horizontal space broken up into more manageable column sizes. That’s why we have columns in our newspapers and even in our magazines—and in our better Web pages, too.
Maybe you love Blue. You enjoy light blue text against a dark blue background, with varying shades of blue in the page headers and image borders and so on. Monochromatic sites have their place, but it may not be the way to go if you are trying to reach, and keep, a wide audience. In their way, staying entirely within a single color family can be as awful as dealing with dozens of colors in a busy, frantic page.
I can do things when I build a Web site for a band that I would never do if I was working on a page for, say, an attorney. Grunge fonts, dark shadowy images, Flash treatment of various links providing scary rollover effects? Is that what you want when you are looking for some entertainment on a Saturday night? Or is that what you look for when your dog gets loose and bites the neighbor kid and you have to go to court? Likewise, do you want solid, conservative, gravitas-laden images, graphics and design when you are deciding what band to go and see? Is there a band anywhere that tours in Grey Flannel? The early Beatles were the last band I remember performing in suits, and even those were collarless.
Even once you have settled on major themes there are still a great many other design properties that need to be settled dealing with the purpose of a page. Are you trying to provide reference material online? Are you trying to build an online brochure? You need to use a whole different toolbox if you are just presenting information than you would use if you were trying to convince someone of something, or trying to showcase what features and benefits accrue to satisfied customers of your work.
Special menu effects are interesting and fun when they don’t get in the way, but they aren’t going to help boost your traffic if your page explains how to do something. If I land on your page from a Google search because I want to lean how to set my computer to automatically wake up and go to sleep at different times every day, I’m not going to probably ever come back just to marvel at the way your navigation grows, shrinks and evolves. Money, time and other resources spent building glamorous navigation is going to be lost on that kind of a page, where again, if the page was more of a brochure, that kind of thing might be much more appropriate.
If you are building pages for a retirement community, are eight- and nine-point text sizes the best you can choose? Sure, a user should be able to adjust their browser or their computer to compensate for whatever shortcomings a designer may have left them, but older people are most likely to have problem seeing smaller text, and least likely to know how to make changes.
You have a lot of power, when you sit down to build a Web page. With great power comes great responsibility. Be sure you use it wisely.
Wednesday, July 1, 2009
What Can You Do With 1¢ and 5ive Minutes?
From time to time, someone comes to me in a panic because their Web site has, after careful application of time and talent, suddenly started showing up in Korean. Or the neat columns of deeply meaningful text now suddenly scroll behind the images, or appear three times their normal size.
I usually sit with them and point and click and explain, “See this? This is why we don’t do this…” and “See that? I wouldn’t recommend doing it like that” and so on. After an interval, or since I’m reading a lot of turn-of-the-last-century books lately, after a fullness of time, we get it worked out. Pages and jobs and careers are saved. Bands play, parades are organized and someone promises to name all of their children “Mark” in my honor. This gives me a nice, fuzzy, warm feeling. Really, it does. But come on—it’s not rocket science and it really isn’t all that difficult once you know what you are doing.
But that’s just it. They don’t know what they are doing. Or they are terribly unsure. They hand out the platitudes like candy—one gal used to call me an “HTML God” in an overly-exaggerated and not-cute insincere way. Rather than say something like that to me, I would have preferred she dedicate thirty minutes a week to learning. That’s really all it takes. It doesn’t even have to be thirty minutes all in one day.
At the height of the dot-bomb, there were quite a few computer book series with deceptive names like Learn ABC in 24 Hours. The hook was that most people think they will learn it all in a day, but the book was basically divided up into twenty-four hour-long lessons, each of which nearly always took me longer than an hour to complete. But the germ of the idea is perfect: Carve up the difficult task at hand into dozens of smaller portions that you can handle.
Maybe for you that means an afternoon every week; maybe it’s only an hour. Maybe, it’s only ten minutes, today. The point is that it all adds up. If there are, in fact, 4287 things to learn, and you knock off ten minutes and pick up two things, then you only have 4285 things left to learn.
Sure, it requires an investment. You have to spend, at least, some time. You probably have to spend some money, but the amount is surprisingly little. Most of my training sessions run $40 as this is written, and at least one is free! You can find very good reference and learning material at giveaway prices. For a penny, you could afford to place copies of the HTML book I recommend most often in your car, in your cubicle, in your lunchbox, in your living room and at your bedside and even get a copy for your, uh, Reading Room. You know, the one with the really great acoustics. You can’t even get gum from machines any more for a penny, but you can learn HTML to the level of the best experts out there. Such a deal!
I know a lot, sure. I have been doing this since 1993. Start today and you can learn it all, too. Remember, I didn’t learn it all in an afternoon, or over a weekend. And I didn’t learn it all from books, either. Most of it comes from building some truly awful pages, laughing, crying and starting over. Make a mistake. Try to fix it. Read-up on it and ask around, see if you can solve the problem on your own and then move on.
I am, I keep reminding people, a sweetie. But I am not a deity and I was nor born with the knowledge I have today. Look in the newspaper every day, I like to point out, and you’ll see birth announcements for little boys and little girls. I have been reading these for years and have never seen a eight-pound, four-ounce Web Designer born. Web Designers are made. Make yourself into one. Start today.
I usually sit with them and point and click and explain, “See this? This is why we don’t do this…” and “See that? I wouldn’t recommend doing it like that” and so on. After an interval, or since I’m reading a lot of turn-of-the-last-century books lately, after a fullness of time, we get it worked out. Pages and jobs and careers are saved. Bands play, parades are organized and someone promises to name all of their children “Mark” in my honor. This gives me a nice, fuzzy, warm feeling. Really, it does. But come on—it’s not rocket science and it really isn’t all that difficult once you know what you are doing.
But that’s just it. They don’t know what they are doing. Or they are terribly unsure. They hand out the platitudes like candy—one gal used to call me an “HTML God” in an overly-exaggerated and not-cute insincere way. Rather than say something like that to me, I would have preferred she dedicate thirty minutes a week to learning. That’s really all it takes. It doesn’t even have to be thirty minutes all in one day.
At the height of the dot-bomb, there were quite a few computer book series with deceptive names like Learn ABC in 24 Hours. The hook was that most people think they will learn it all in a day, but the book was basically divided up into twenty-four hour-long lessons, each of which nearly always took me longer than an hour to complete. But the germ of the idea is perfect: Carve up the difficult task at hand into dozens of smaller portions that you can handle.
Maybe for you that means an afternoon every week; maybe it’s only an hour. Maybe, it’s only ten minutes, today. The point is that it all adds up. If there are, in fact, 4287 things to learn, and you knock off ten minutes and pick up two things, then you only have 4285 things left to learn.
Sure, it requires an investment. You have to spend, at least, some time. You probably have to spend some money, but the amount is surprisingly little. Most of my training sessions run $40 as this is written, and at least one is free! You can find very good reference and learning material at giveaway prices. For a penny, you could afford to place copies of the HTML book I recommend most often in your car, in your cubicle, in your lunchbox, in your living room and at your bedside and even get a copy for your, uh, Reading Room. You know, the one with the really great acoustics. You can’t even get gum from machines any more for a penny, but you can learn HTML to the level of the best experts out there. Such a deal!
I know a lot, sure. I have been doing this since 1993. Start today and you can learn it all, too. Remember, I didn’t learn it all in an afternoon, or over a weekend. And I didn’t learn it all from books, either. Most of it comes from building some truly awful pages, laughing, crying and starting over. Make a mistake. Try to fix it. Read-up on it and ask around, see if you can solve the problem on your own and then move on.
I am, I keep reminding people, a sweetie. But I am not a deity and I was nor born with the knowledge I have today. Look in the newspaper every day, I like to point out, and you’ll see birth announcements for little boys and little girls. I have been reading these for years and have never seen a eight-pound, four-ounce Web Designer born. Web Designers are made. Make yourself into one. Start today.
Wednesday, June 24, 2009
New Machine; New Way of Looking At Things
We have talked before about how we are so susceptible to falling into the trap of thinking "everyone" lives, works, acts and reacts as we do. The most common manifestation of this in Web work happens when a developer gets a new wide screen monitor, or a faster connection, or learns some new technology like Flash.
Suddenly their Web pages only look good when displayed at a skillion-pixels by another skillion-pixels. Or suddenly every page has some Flash content (or JavaScript, or whatever). The thing to take away from this is that it is rarely a conscious decision to do this. It is rare that someone says "Well, I was the last person stuck with a 15" monitor at 800x600, so now the sky is the limit!" Rather, it is a matter of doing what they have always done: Making pages look good (to them, and at the time). As good as they can, in most cases.
But this is of course why we check our pages in other browsers. It's why we re-size browsers to see how content flows around the various fixed page elements, images and graphics, scrolls into and out of columns and so forth. Not everyone uses Firefox, no matter how cool it is. Not everyone uses Safari, no matter how impressive it's new features. Not everyone uses Internet Explorer, even though it ships as the default Web browser for most computers sold these days.
There are other more insidious examples. Not everyone knows all of the Secret Handshake jargon, abbreviations and acronyms that so many of us use every day. Does your navigation actually tell people where they end up if they click on those links? Title attributes can go a long way toward easing some of this burden, but even then we still have to depend upon the users to know or expect this feature and hover over links they are unsure of. Where does SHPS go? Student Housing and Parking Services? Student Housing and Pet Surveillance? Solstice Homeopathic Plant Scheduling? Student Health and Popular Science? Some Help Poor Senators?
Jargon and abbreviations are fine within the walls of whatever group uses and understands them, though I would still recommend using Title attributes and spelling-out the full name on first use, just for the new people. But any time you are dealing with civilians you should not just assume that because you have been online for years, "everyone" has been online for years, and will "just know" how something works. Just because you have a nice new monitor that overlaps your desk doesn't mean "everyone" can see a fixed-width wide-screen display, any more than just because you are on Twitter and understand RTs and @-signs, it doesn't mean anyone else can figure out your 140-character shorthand.
I just got new hardware. And in only a week I have already found myself unthinkingly operating as though "everyone" had at least as much display area. It is a beautiful 24" of gleaming, glossy pixels. It reminds me of the 9" screen of my first computer, and just how far we have come. But yeah, I have had to remember to download new copies of my favorite browsers, just to have them available, and re-size them (within all of that room!) to see how it affects the content. I have had to check pages on my iPhone, to see how they work there, without Flash and with only a few-dozen pixels to work with.
It can be hard to try to see your site with new eyes. But the experience can be valuable. If you can find someone who does not work in your field, someone who has never visited your pages before, and watch them try to accomplish some simple tasks, it can be very rewarding.
Suddenly their Web pages only look good when displayed at a skillion-pixels by another skillion-pixels. Or suddenly every page has some Flash content (or JavaScript, or whatever). The thing to take away from this is that it is rarely a conscious decision to do this. It is rare that someone says "Well, I was the last person stuck with a 15" monitor at 800x600, so now the sky is the limit!" Rather, it is a matter of doing what they have always done: Making pages look good (to them, and at the time). As good as they can, in most cases.
But this is of course why we check our pages in other browsers. It's why we re-size browsers to see how content flows around the various fixed page elements, images and graphics, scrolls into and out of columns and so forth. Not everyone uses Firefox, no matter how cool it is. Not everyone uses Safari, no matter how impressive it's new features. Not everyone uses Internet Explorer, even though it ships as the default Web browser for most computers sold these days.
There are other more insidious examples. Not everyone knows all of the Secret Handshake jargon, abbreviations and acronyms that so many of us use every day. Does your navigation actually tell people where they end up if they click on those links? Title attributes can go a long way toward easing some of this burden, but even then we still have to depend upon the users to know or expect this feature and hover over links they are unsure of. Where does SHPS go? Student Housing and Parking Services? Student Housing and Pet Surveillance? Solstice Homeopathic Plant Scheduling? Student Health and Popular Science? Some Help Poor Senators?
Jargon and abbreviations are fine within the walls of whatever group uses and understands them, though I would still recommend using Title attributes and spelling-out the full name on first use, just for the new people. But any time you are dealing with civilians you should not just assume that because you have been online for years, "everyone" has been online for years, and will "just know" how something works. Just because you have a nice new monitor that overlaps your desk doesn't mean "everyone" can see a fixed-width wide-screen display, any more than just because you are on Twitter and understand RTs and @-signs, it doesn't mean anyone else can figure out your 140-character shorthand.
I just got new hardware. And in only a week I have already found myself unthinkingly operating as though "everyone" had at least as much display area. It is a beautiful 24" of gleaming, glossy pixels. It reminds me of the 9" screen of my first computer, and just how far we have come. But yeah, I have had to remember to download new copies of my favorite browsers, just to have them available, and re-size them (within all of that room!) to see how it affects the content. I have had to check pages on my iPhone, to see how they work there, without Flash and with only a few-dozen pixels to work with.
It can be hard to try to see your site with new eyes. But the experience can be valuable. If you can find someone who does not work in your field, someone who has never visited your pages before, and watch them try to accomplish some simple tasks, it can be very rewarding.
Wednesday, June 17, 2009
Renewal, and Like That.
I am back into it, again, after a little vacation, and hitting the ground running these last couple of weeks, doing much that is New&Improved.
Foremost is probably the work being done on the new Templates. The UNL Web Developers' Network has been at work on a new page since last fall. Seth, Roger, Eric, Vishal, Aaron, Brett, Bob and a host of others have been hammering out details concerning navigation, color and content, but the most important thing anyone has done so far has been in service to answering the question Why?.
Why redesign our pages? Why now? Why did we place navigation here, here and there instead of putting it all here? Why would someone point at this and click instead of pointing at that and clicking? Why isn't this or that area of the page getting more traffic or interest? On and on and on, one of the most refreshing things about this redesign has been the willingness of all of the various participants to challenge one another by asking that simple question. Why?
Why, indeed. And the best part of the exercise for me has been watching it all unfold. These are very creative people, and most of them are very adept at the technical workings of not just a Web browser as we are familiar with them on desktop and laptop computers, but also with the new cell phones and other Internet Appliances appearing with some regularity. The dozen or so neurons responsible for creativity must live very close in our brains to the ones responsible for the concept of ownership, or family, because in my experience it is very difficult to challenge someone's work, someone's concept, someone's vision, without them taking it a little personally. And yet there has been almost none of that, in this entire process.
Back me up against a wall and make me defend my position and I can tell you why I made the design choices that I made. But I have a hard time doing it without getting defensive, or moody if the collective decides to go another way. It has been an inspiration, watching this group of professionals working with only one goal, producing the best Web site we can for the community we serve, wrestling with the various choices involved in going about attaining that goal. We all want the same thing; we just sometimes all want the same thing differently. But we are all still friends. It has been amazing.
I am also about knee-deep in renewing the training that I do here. And again, the question of Why keeps me on track. Why did I introduce this concept here, instead of doing it later? Why would we need to continue discussing this, when that trend kind of burned itself out about 2002? Why mention workarounds for Web browsers that have miniscule representation in our user logs these days?
So I have been going through each course, page-by-page, and making various edits and cuts and embellishments. We have new software in the Creative Suite 4 release from Adobe. That means new Photoshop and Dreamweaver, and we are deploying these on the also-new laptops in the training theater this week, so it is time that our training materials reflected the various changes in moving from CS3 to CS4, as well as all we have come to learn in the years since the original pages were set down. Again and again, I have asked myself Why and I think the new courses are going to be much better for it.
Why has led me to change the way I work quite a bit, too. I am going to cut down on the number of computers I work on, which should mean that more often than not I have the latest files with me at any given time. And I'm near finishing about a skillion different time-sinks that should mean I have time to work on some training I have had to put off for weeks.
I hope you have a good summer, too.
Foremost is probably the work being done on the new Templates. The UNL Web Developers' Network has been at work on a new page since last fall. Seth, Roger, Eric, Vishal, Aaron, Brett, Bob and a host of others have been hammering out details concerning navigation, color and content, but the most important thing anyone has done so far has been in service to answering the question Why?.
Why redesign our pages? Why now? Why did we place navigation here, here and there instead of putting it all here? Why would someone point at this and click instead of pointing at that and clicking? Why isn't this or that area of the page getting more traffic or interest? On and on and on, one of the most refreshing things about this redesign has been the willingness of all of the various participants to challenge one another by asking that simple question. Why?
Why, indeed. And the best part of the exercise for me has been watching it all unfold. These are very creative people, and most of them are very adept at the technical workings of not just a Web browser as we are familiar with them on desktop and laptop computers, but also with the new cell phones and other Internet Appliances appearing with some regularity. The dozen or so neurons responsible for creativity must live very close in our brains to the ones responsible for the concept of ownership, or family, because in my experience it is very difficult to challenge someone's work, someone's concept, someone's vision, without them taking it a little personally. And yet there has been almost none of that, in this entire process.
Back me up against a wall and make me defend my position and I can tell you why I made the design choices that I made. But I have a hard time doing it without getting defensive, or moody if the collective decides to go another way. It has been an inspiration, watching this group of professionals working with only one goal, producing the best Web site we can for the community we serve, wrestling with the various choices involved in going about attaining that goal. We all want the same thing; we just sometimes all want the same thing differently. But we are all still friends. It has been amazing.
I am also about knee-deep in renewing the training that I do here. And again, the question of Why keeps me on track. Why did I introduce this concept here, instead of doing it later? Why would we need to continue discussing this, when that trend kind of burned itself out about 2002? Why mention workarounds for Web browsers that have miniscule representation in our user logs these days?
So I have been going through each course, page-by-page, and making various edits and cuts and embellishments. We have new software in the Creative Suite 4 release from Adobe. That means new Photoshop and Dreamweaver, and we are deploying these on the also-new laptops in the training theater this week, so it is time that our training materials reflected the various changes in moving from CS3 to CS4, as well as all we have come to learn in the years since the original pages were set down. Again and again, I have asked myself Why and I think the new courses are going to be much better for it.
Why has led me to change the way I work quite a bit, too. I am going to cut down on the number of computers I work on, which should mean that more often than not I have the latest files with me at any given time. And I'm near finishing about a skillion different time-sinks that should mean I have time to work on some training I have had to put off for weeks.
I hope you have a good summer, too.
Subscribe to:
Posts (Atom)
