Design Harbor
On Thursday, March 4, Designharbor went down. This was an event of great sadness for me, since it was my first business. I'm still trying to figure out what went wrong and find backups, but it might take a while. In the meantime, I have finally given into my fears about losing data and have begun to transfer some of my old articles over to this website.
Other of my writings can be found at the first incarnation of Design Harbor, Abscissa Tech, one of the most personally-influential things I have ever done.
Review -- HTML: The Definitive Guide
Saturday, 6 Mar 2004 :-: ["Permalink"]
by Chuck Musciano and Bill Kennedy, O'Reilly Press
O'Reilly Press consistently provides today's professionals with high quality reference and learning tools. HTML: The Definitive Guide, by Chuck Musciano and Bill Kennedy, does not disappoint. Not only does it provide a good foundation for beginners in the basics of writing and creating web pages, but it also includes in-depth information for those wanting more. Musciano and Kennedy begin the book by explaining the history of the Internet and its underlying structure, giving a solid foundation for readers to build upon in their study. They continue to extensively explain every HTML construct and tag, stating pros, cons, and current browser support for each HTML 4.0 tag and element. A full HTML 4.0 reference, character entity list, color name list, and HTML 4.0 DTD (document type definition) finish off the book, making it the truly definitive guide to HTML 4.0.
Musciano's and Kennedy's delightful writing style makes a potentially boring subject like HTML 4.0 interesting to read about. Throughout the book, they provide humorous examples out of a fictitious Kumquat fan site. Thus, the book's educational tone is balanced by the authors' entertaining writing style, making this tome an essential part of any developer's library.
Review -- PHP Pocket Reference
Saturday, 6 Mar 2004 :-: ["Permalink"]
by Rasmus Lerdorf, O'Reilly Press
114 Pages
The PHP Pocket Reference begins with 29 useful pages of introductory and explanatory information on PHP such as declaring variables, using operators, and even creating a data-driven site. The remainder of this book's 114 pages list all of PHP's functions, providing a scaled-down version of the PHP documentation. Lerdorf include extra commentary before each group of functions, explaining concepts and including opinions on the functions listed.
Lerdorf includes valuable, instructional, and also very opinionated commentary on each group of PHP functions. Here's an example of his informative, helpful style:
Unlike SQL databases, once a dBase file is created, the database definition is fixed. There are no indexes that speed searching or otherwise organize your data. Because of these limitations, I don't recommend using dBase files as your production database. Choose a real SQL server, such as MySQL or Postgres, instead.
Unfortunately, an inherent problem in pocket references is that the entire volume has to fit in a pocket. This doesn't yield enough flexibility for a complete explanation of each PHP function (as in the PHP documentation), and the PHP Pocket Reference is limited to a single sentence-fragment explanation of each function. For a beginner, using this book to learn PHP could be very frustrating, because there is not even enough information given for one to know the essential details of passing data between functions. However, this book is a useful partner to the PHP documentation, including Lerdorf's comments on function groups. It also would be useful to seasoned PHP developers who just need a a quick reference to jog their memory.
Review -- mSQL and mySQL
Saturday, 6 Mar 2004 :-: ["Permalink"]
by Randy Jay Yarger, George Reese, and Tom King
O'Reilly Press, 467 Pages
Databases are an essential part of the daily operation of many businesses and web sites. MySQL, & mSQL, by Rany Jay Yarger, George Reese, and Tim King, attempts to fill the vacuum of information on mid-sized databases. It explains the history, usage, and functionality of today's most popular "free" midrange databases, MySQL and mSQL, along with a description of proper relational database design. It includes instructions for database administration, and provides useful references on using both mSQL and MySQL with programming languages. In short, it includes everything needed to effectively implement MySQL and mSQL databases.
Unfortunately, though the book contains a great amount of helpful information, it is not very easy to read. Concepts are presented in a factual and efficient manner, but the concepts themselves are not organized very logically or sequentially. This tends to make it difficult to read from beginning to end.
Still, the has the trademark O'Reilly quality level of technical information. It can best be used when searching for a specific topic or problem, and the SQL reference it contains as well as the programming language guides to database integration make this book an invaluable tool.
Review -- Paint Shop Pro 6
Saturday, 6 Mar 2004 :-: ["Permalink"]
A good image editor is the swiss army knife of web design. In the hands of a McGuyver designer, it can do anything. It needs to be highly functional with plenty of gadgets, but it also needs to be lightweight and efficient. No one needs a fifty-pound pocket tool. Multi-purpose knives can be used for building things, fixing things, opening things, and for plain old fun. But what makes them able to do this is their arsenal of gadgets.
JASC's Paint Shop Pro 6 is the essential image editing tool for the frugal web designer. At $99, it may cost a fraction of the competition's price, but it often surpasses programs like Adobe Photoshop in functionality.
Like any good swiss army knife, JASC's Paint Shop Pro 6 includes many useful tools and gadgets. It utilizes image-editing essentials like raster layers, selections, and masking layers. It also includes basic pen, fill clone and other other drawing tools. But Paint Shop Pro goes way beyond the "two blades and a toothpick" scarcity of other professional image editors.
Paint Shop Pro's raster drawing capabilities make image creation easy while leaving room for creative genius. The artist can select brush shape, size, transparency, density, and edge fade transparency. Brushes can also be given textures that make realistic image creation possible.
Paint Shop pro also includes vector graphics support that excels for text placement and modification. Creating text to a bezier curve, angle, or any vector line, a task that could be disastrous in other image editors, is easy with Paint Shop Pro. Just define a vector line with one of the draw tools; bring up a text dialog through a right-click context menu; choose font and color; and you have instant text-to-vector. For other programs, like Adobe Photoshop, adding this capability requires expensive third-party plugins, but Paint Shop Pro natively includes many things missing in more expensive image editors while still retaining plugin compatibility.
Paint Shop Pro's image touch-up and composition features are outstanding. Its support for advanced raster and vector layer interaction as well as masks allows for near-perfection in image modification and composition. Advanced anti-aliasing, feathering, and selection modification options take the "ugh" out of image-composition.
However, Paint Shop Pro 6, like any knife, has a few mostly un-noticed mars. First, its color depth conversion, though very good, is easily surpassed by programs like The GIMP and Adobe Photoshop. Although I like to do much of my image editing with Paint Shop Pro when in Windows, I tend to do go into another program when I optimize gif images for the web. Secondly, the text insertion tool, although it is unmatched with its multiple-font-and-color support, tends to be finicky when utilizing those extra features. It for some odd reason remembers old font/color combinations and tries to re-implement them at the most annoying times. My third gripe about Paint Shop Pro is its display of the marquee around selections. Most image editors place the marquee(the dotted line around a selection) at its absolute position, but Paint Shop Pro places it at the outermost boundary of the selection when it is antialiased. This makes accurate shape selections difficult to create. Usually, I get around this by using the freehand tool or antialiasing after making the selection, but it has annoyed me to no end on some occasions.
The few weaknesses that Paint Shop Pro does have are greatly outweighed by the benefits of this fine program. Its many gadgets and superb capabilities make this a great choice for both the McGuyvers and McGuyvers-in-training of the web design world.
Review -- Running Linux
Saturday, 6 Mar 2004 :-: ["Permalink"]
by Matt Welsh, Matthias Kalle Dalheimer, and Lar Kaufman
O'Reilly Press
Using Linux isn't hard; it just takes a little bit of persistence and some good documentation. Fortunately, you don't have to scour the 'net to find the details you need, for Matt Welsh, Matthias Kalle Dalheimer, and Lar Kaufman, Linux experts extrordinaire, have written Running Linux, the one stop shopping guide to Linux.
The book, written for beginners and alpha geeks alike, begins with an instillation guide, explaining the steps needed to install a successful Linux distribution. The next proceeds to use simple explanations to the most common Linux commands. Once the Authors have familiarized you with the basics, they move on to other extremely useful topics, like rebooting and shutting down, managing user accounts and file-systems, and using compression utilities like gunzip and tar. Once the authors bring the reader to a working knowledge of Linux, they spread out into more complex topics, such as installing and upgrading software, compiling a new kernel, making backups, fixing emergencies, using text editors, running a window environment, networking with a LAN or the 'net, running a web server, running Windows programs, and even programming. The information is accurate, easy to understand, and all highly useful.
Not only is the information useful, but it is presented in an easily understood manner. Here's an example:
Running a Linux system is not unlike riding and taking care of a motorcycle. Many motorcycle hobbyists prefer caring for their own equipment, cleaning the points, replacing worn out parts, and so forth. Linux gives you the opportunity to experience the same kind of "hands on" maintenance with a complex operating system.
However, when the time comes to be totally clear and succinct, the authors are not afraid to simply list a block of commands, explaining them in detail, of course. This style combination of a hands-on guide with a reference book makes Running Linux the ideal handbook for everyday Linux use.
What can I say but Three Thumbs up to a book that was instrumental in helping my own transition from dual booting with Windows to running a Linux only desktop machine. I am confident that you will come to love this book like I do, never keeping its valuable pages more than an arm's reach away.
Review -- Build Your Own Database Driven Website Using PHP & MySQL
Saturday, 6 Mar 2004 :-: ["Permalink"]
by Kevin Yank, Sitepoint.com, 231 pages.
When Sarah Pride, Jonathan Brownell, and I started Design Harbor, we decided to use PHP and MySQL for our back-end code. At that time, there was one book on PHP. It did not say much about MySQL. It certainly did not explain how to make a database-backed publishing system with advanced SQL features. Since that time, PHP has gained momentum as a website scripting language, and MySQL usually goes alongside it. This interest in PHP spawned several books, including an O'Reilly Pocket Reference. However, most of these concentrated on either PHP or on the database system. In fact, for a while, the PHP documentation was the best source for those interested in learning about advanced application of PHP and MySQL. Not any more. A new book out by tech writer Kevin Yank called Build Your Own Database Driven Website Using PHP & MySQL fills the gap and provides a practical guide to these two critical web design areas.
Last year, Yank wrote a summer-long series of tutorials on the PHP/MySQL duo for Sitepoint.com, whom he now works for as technical content director. This highly-acclaimed series stepped the reader through every part of creating a dynamic web site, from software installation to the finishing touches. The book expands on this great series to provide even more information than is available online. In fact, it provides eight chapters and an appendix more than is available online. The book starts with step-by-step instructions on how to install PHP and MySQL on Windows and Unixes in the first chapter. The next several sections deal with basic PHP and MySQL, proper database design, and publishing database data to the web. Yank then explains content management systems, but he doesn't stop there. Further chapters explain templating systems, advanced database topics, working with binary data, and even session systems. A handy appendix at the end of the book lists MySQL commands. All code examples are available from a special web site listed in the book.
Most technical books aren't easy reading. But Yank, who has years of technical writing experience, doesn't waste dead trees with extra verbosity. He states things simply and plainly, making his book very readable. His relaxed but concise writing style also adds to this book's value as a handy reference (although that is not its main intent), despite the lack of a glossary. In this text, unlike many other computer books, the code blocks are very readable and stand out from the page. The book also includes many helpful diagrams, especially in the advanced database chapters.
The tech world needs more books like this one. Yank's writing style combined with the universality of his topic have allowed him to create a rare example of the perfect balance between those big boring documentation volumes and the too-specific, show-the-code-without-explanation "by-example" books. Yank has created a rare masterpiece. His book satisfies the needs of beginners and experts alike in only 231 pages, a feat I would not have thought possible before seeing this book. Although the usefulness of the book as a daily reference is diminished slightly by the lack of an index, Build Your Own Database Driven Website Using PHP & MySQL is by far the best website back-end book I have ever read. I'm keeping it within close reach and suggest you do too.
Review -- HTML Pocket Reference
Saturday, 6 Mar 2004 :-: ["Permalink"]
Have you ever forgotten a particular nuance of a tag? Or maybe you've had to look an attribute up in an online HTML reference just because you just couldn't remember if it was target or action? Or maybe you've gotten stuck by those Hexadecimal Color Codes. What about escape values for special characters, like © or ¡. Sooner or later, all of us get stuck by some arcane fact or detail about HTML. Fortunately, we have the HTML Pocket Reference by Jennifer Niederst.
This handy booklet, only 92 pages, contains almost everything one needs to know about HTML. Like O'Reilly's other pocket references, it is not for beginners, but is rather targeted towards experienced developers who need their minds jogged once in a while to help them remember those pesky details. Terse and to the point, it contains no more (and no less) information than is necessary. In fact, the colophon and index, things customary in most O'Reilly books, are left out to further reduce the size. The book is arranged first by alphabetical order then by tag type, making hasty searches for arcane details quick and easy.
I am constantly amazed by how much information is crammed into the 92 pages of this reference book. Everything from tag usage; browser implementation; attribute lists; and clear, concise, and understandable explanations for each tag and attribute is included in this one-size-fits-all wonder.
The most useful parts of the book, in my humble opinion, are the last three sections. The first is a thorough list of all the HTML character entities. Then comes the decimal-to-hexadecimal chart, always useful for converting rgb color values to hex colors. Then comes the final portion of the book, a listing of each of the 140 color names and their corresponding hexadecimal values, rgb color value, and nearest web-safe pallete hex value. This list has been incredibly useful to me when designing sites' color schemes and working with graphics editors.
The HTML Pocket Reference is another of those fine books I keep only an arm's reach away. It provides quick and accurate information for any on-the-spot HTML-related questions. The accuracy, portability, and low price of this excellent book by Jennifer Niederst make it a must-have for any web designer.
Review -- Programming Perl, 3rd Edition
Saturday, 6 Mar 2004 :-: ["Permalink"]
by Larry Wall, Tom Christiansen, and Jon Orwant
O'Reilly Press, 1092 Pages
When you're programming with Perl, there's more than one way to do it. This feature is often helpful, but it can often be equally confusing. Programming Perl, by Larry Wall, Tom Christiansen, and Jon Orwant, provides an extensive guide through the vast jungles of opportunity that Perl provides the programmer. This Almost-All-You-Need-To-Know book on the worlds first post-modern programming language is almost a necessity for those who would master this ever-useful programming language.
Wall, Christiansen, and Orwant have created a book that's both useful as a learning tool and as a reference. The first chapter gives an overview of Perl's features for the beginner, explaining Perl basics through simple explanation and demonstration. The book then moves on to explaining almost everything there is to know about Perl, starting with the simplest things, "atoms", moving to "molecules", then expanding the explanation of Perl programming as each concept builds upon the previous ones. However, the book is not merely a tutorial to Perl; its 1063 pages are also designed to be used as a definitive reference book. Like the Perl programming language itself, there's more than one way to use the book that best describes it.
Programming Perl is truly worthy of the O'Reilly publishing label it comes under. It combines an informative and informal style, creating a book that truly accomplishes the goal of presenting a Perl learning guide and reference tool in one book. Ever serious and scholarly, the authors somehow manage to combine that with a undercurrent of humor and just-have-fun attitudes. A good example of this would be the sections in Chapter 24 on code efficiency and what they call "fluent Perl" (an obfuscator's dream come true). At the same time, it's not a book I would recommend reading the whole way through in one sitting. Just the first 649 pages, after which comes a whopping amount of normal reference material.
This book has been particularly helpful to me in my web programming development. Since Perl encompasses a wide range of technologies, I have often used the book to help me learn the basics of non-Perl technology, such as regular expressions, unicode, and others. The "Camel" book, well known and well loved by many is the book to have if you're going to be doing any Perl programming at all. A well-written guide that contains a wealth of knowledge worthy of Croesus himself, Programming Perl is the definitive book on this great language.
Introduction to Cascading Style Sheets
Saturday, 6 Mar 2004 :-: ["Permalink"]
Have you ever wished that you didn't have to bother with the font tag? Would you like to be able to make change to a single definition and have the style of all of your pages change instantly? Would you like more control over the formatting of your page than is allowed with normal HTML? Cascading Style Sheets(CSS) are the solution to all of these. How can you learn about them? Read on.
Including Styles int HTML
There are three ways of including style definitions. The first way is to them as the style attribute in a tag as follows:
< FOO STYLE="foo" >
The second way is to use the < STYLE > tag inside the < HEAD > area.
< HEAD >
< TITLE >Title< /TITLE >
< STYLE >
styles go here
< /STYLE >
< /HEAD >
The third and most useful way of including styles is to create a file with style definitions and include the style sheet into the HTML document as follows:
< HEAD >
< TITLE >FOO< /TITLE >
< LINK REL="StyleSheet" HREF="foo.css" TYPE="text/css" MEDIA="screen" >
The HREF attribute points to the URL of the style sheet file. This final method is the most useful because it allows the author to use one style definition for many pages. If the author of the site wants to make a change to something like font color or background images, the author only has to change the style file.
style definitions within a tag
Defining styles is much different from writing HTML, and it takes a little getting used to. To begin, we will experiment with the style attribute of a tag. CSS definitions use two values called "properties" and "values". Here's a mock example.
< DIV STYLE="property:value; property1:value1 value2 value3 value4; property2:value; property3: value('stringvalue');" >
The punctuation used in CSS is extremely important. There is a colon in-between each property and value set. After each property:value set is a semicolon. The last semicolon is optional, but I like to include them just in case I want to add more styles to the end later.
Some properties can have more than one value as did property1 in the previous example. Each value should be seperated by a space. An example of this would be font: 4pt #800080 bold;. That particular style would assign the font to be 4pt, maroon, and bold.
Some values have a text argument as in property3. The most common string value is the "url" value. It must be followed by a parenthesis and the url(in single quotes) of the value in question. Url values can be used to give HTML elements background images as in: background: url('foo.gif').
Let's look at a real life example now:
< DIV STYLE="font: arial 18pt #000000 oblique; background: #FFFFFF; left: 40px;" >SOMETEXT< /DIV >
In this example, "SOMETEXT" will be displayed in a black, 18pt italicized arial font. Its background will be white and the word will be displaced 40 pixels to the right of what would ordinarily be its normal, linear position in the document.
That last property, left:, is part of something called CSS-P. CSS-P is useful in DHTML and pixel-perfect positioning, but it has only been implemented in newer browser versions such as Netscape 4 and Internet Explorer 4 and up, making its usefullness is limited.
defining styles with < style >
The syntax used within the < style > tags is slightly more complex. It is logical, however, and not difficult to learn. Let's look at an example:
< HEAD >
< TITLE >SOMETITLE< /TITLE >
< STYLE >
/*this is a comment that doesn't affect
the style definition*/
/*the following sets the font size and color
for all < P > elements*/
p {font: 12pt #000000}
b.foo { text-decoration: strikethrough}
.FOO {color:#800080}
#someID {
text-align:right; width:400px;
background:url('something.gif')
}
a:link, a:active {
text-decoration:none
}
p:first-line{color: #532850}
p: first-letter { font-weight:bold}
< /STYLE >
< /HEAD >
The first style definition inside of the style tag uses a tag selector. A selector is the part of the definition before the left curly bracket. The tag selector is the most basic of these. It defines a style to affect all instances of that tag in the document. For example, a person could define styles for the < p > to assign all < p > tags a specific font, color, or other CSS property.
Each seperate style must be encased within the curly brackets. There is no limit to how many you may use in a document. In fact, you can give a single tag more than one style. We'll learn about that in a few minutes.
The second style definition in our example uses the tag and class selectors. A class selector limits the number of tags the style will affect. It looks like this: tag.classname{style here}.Tags qualify for styles that use the class selector by having their class attribute set to the name of the class as in: < P CLASS="foo" >.
Notice that the class selector can be used by itself as in .someClass, allowing the editor to apply the style to apply to more than one type of tag. This would prove useful if the programmer wanted to make both bold and italics words the same color from time to time. Both the < b > and < i >tags could have their color set by the same style definition if they were given a class attribute. Then the programmer would only have to define one color, working less in the long run.
The third type of selector is the ID selector, which is delimited by a # sign. ID styles can only be attributed to one tag in the document. Each tag must have a unique ID. ID selectors are most useful in DHTML applications where the styles of a single item must be manipulated.
The fourth selector applies only in some cases. It affects for certain subdivisions of the tag, such as active link color, visited link color, first line, and first letter. This allows easy formatting without unweildy font tags that affect small areas. For a complete listing of all selectors, properties, and attributes, check out our CSS reference in the area.
style sheet files
The greatest power of CSS becomes evident when one single style file can be used to control the styles of a multitude of documents. The syntax used in a CSS file is exactly the same as the syntax used inside the < style > tags. The only difference is that there are no < style > tags. The only contents of the file are the style definitions themselves.
You can choose to include all of your style definitions in a single file, or you may choose to have multiple files, such as color-scheme files that change the color scheme of a site depending on what style file is used. You can even have a style file for fonts, one for headings, one for tables to infinity.
To include a style file, use the following syntax:
< link rel="StyleSheet" href="foo.css" type="text/css" media="screen" >
The media attribute points to the fact that styles can be created for audio browsers, printing, and projected presentations. While these implementations are beyond the scope of this tutorial and current browsers have not yet implemented these uses, it shows us where CSS is heading in the future. Note that Netscape Navigator will reject any external styles that are not explicitly defined for media="screen" .
the cascade in style sheets
Style definitions may also be overlapped, and browsers have pre-defined rules for applying conflicting styles. That's why they're called cascading style sheets. Here are the rules:
A style that includes the property !important as in p{color: #ffffff !important} will have preference over non-important styles.
More specific styles will always win over less specific styles. For example:
p, li, DIV.foo{color:#000000; font: verdana 12pt; text-indent: 30px;}
will lose to:
p{text-indent: 30px}
The definition of specific refers to what tags it refers to, not how specific the definition is
An ID style will always wil over non-ID attributes
Class styles will always win over "blanket" styles.
If all of the rules have been applied, and both styles have equal scoring, the one farther down in the document wins.
Style sheets not only are easier to type, but they also make site maintenance more trouble-free. They are one of the three building-blocks of DHTML, and when used right, they can provide help for disabled internet surfers. Best of all, they allow the designer to get a little closer to the ideal of seperating content from physical appearance, making large sites easier to maintain and dynamic sites easier to create. Now that's an offer I can't resist.