Jon Duckett’s HTML & CSS: Design and Build Websites

I finished what was simultaneously the driest and most useful book I may have ever read: Jon Duckett’s HTML & CSS: Design and Build Websites. That I had a tough time getting through it was was actually a surprise to me, as I generally enjoyed the HTML and CSS section of the Flatiron curriculum (this was before the great CSS Wars to come). After the more conceptual section on GitHub, front-end code seemed concrete–you could actually see the immediate results of what you were doing. Suddenly, from art to wine to a reading club, ideas for websites abounded in my head. Because you know, if you build it, they will come.

Field of Dreams baseball players walking out of field

like I said, Duckett’s work was useful. In retrospect, I think I wouldn’t read it cover-to-cover like I did, but use it as a reference. It has a ton of tips and a nice troubleshooting guide in the back with solutions for fixing some of the most common HTML/CSS problems. Attractively laid out, it exposed me to older elements of HTML code (this book was written when the transition to HTML5 wasn’t quite complete), basic design theory, SEO and keywords, and integrating Flash into HTML (not really an issue now). Now granted it wasn’t quite as up-to-speed as Flatiron’s HTML & CSS lessons (there was nothing mentioned about .clearfix, for instance, although Duckett did reference it), but it does provide a group of handy-dandy websites for use when designing and implementing a website. What follows is an abbreviated list of those links that seemed most promising for getting a website up and, you know, read by someone other than your mom. Note: I haven’t tried all these guys out, but when I do, I’ll be sure to update

BBedit: an HTML and text editor for Mac OSX users that looks like it has some wonderful tools for text control

Pixlr: an online photo editor with free fonts and graphics, as well as a mobile version

iPiccy: another online photo editor that has an easy-to-use interface for collages and basic graphic design

Blueprint: CSS framework that reminds me of Bootstrap Twitter. I love that the Department of Commerce uses it.

960 Grid Systems: I’m old school, and I love that I can actually print out the grid system to physically sketch on. All the templates and grids are based on the 960px width of a browser window and are available in 16 column or 12 column format.

Keyword Discovery: SEO stuff. Look up a keyword and find related ones people are looking for. Google has a similar product with Adwords, but this one seems to be free (I think at some point Adwords makes you pay to appear higher up in search listings).

← Previous Post Next Post →