Upcoming Book Review: Joomla! Social Networking with JomSocial
Over the past several months, I have been in communication with several people
Packt Publishing, a company that specializes in technical and IT texts. An executive there recently contacted me about a new title
Joomla! Social Networking with JomSocial, asking me to review it. Keep your eyes out for an upcoming post covering the book.
If you are interested, you can
view details and order the book from Packt online.
Note: Packt Publishing has not compensated me monetarily for writing this review. However, I have received a copy of the text for my time, and to allow me to read the title in order to review it.Labels: book review, cms, joomla
posted by Jake Kronika, Owner, Gridline Design at
1 Comments
Links to this post
Pure CSS Shapes
Most designers wouldn't think twice about using an image when it comes to rendering complex shapes on a website. Circles, squares, triangles, and some other polygons, however, are actually possible to produce using pure CSS and minor additions in non-semantic HTML. For an HTML purist such as myself, the latter requirement is less than ideal, but the possibilities afforded by a pure CSS solution, particularly in terms of maintainability and flexibility, seem to outweigh this cost in certain cases.
Credit where Credit is Due
The credit for this entire idea of using cascading stylesheets to render shapes truly should go to
David DeSandro, a graphic and web designer from Arlington, VA. His articles about
CSS Speech Bubbles and an impressive
Curtis CSS Typeface opened my eyes to a number of possibilities that would never otherwise have occurred to me.
Simple Shapes
Lets break things down to the ability to create simple shapes first, then extend and combine those to make more complex forms. Since kindergarten, everyone has been able to recognize shapes such as the square, circle, and triangle, so we'll start with those.
Squares
The square (or rectangle) is obviously the most simple shape that can be produced using CSS, as any block-level element is already a square in and of itself. That being said, all that is needed to create a square shape is to give the element a background color, width, and height.
In the case of the above, very simple example, the width and height are the same, thereby creating a square. A rectangle, obviously, only has different width and height values.
Circles
Though not entirely obvious at first, all that a circle would be, at least from a pure CSS perspective, is a special case of a square with rounded corners, built in such a way that the rounding of the corners completely removes the straight edges between the curves. The following shows a progression from square to circle by adjusting the rounding:
Triangles
Triangles are a bit more tricky to create than either squares or circles. To do this, we need first to understand the way that borders work in CSS. Most of the time, borders are either not used, or are applied in such a way that their individual structure is not clear. To make this structure more transparent, take a look at the square below:
This square illustrates perfectly how each of the borders is created as a straight line, with one feature of particular interest – in each of the corners of the element, the border becomes diagonal, with its edge abutting the adjacent border from the corner of the element inside to the outer corner of the borders. It is by using this angled edge that we can create a triangle. The first step is to set the width and height of the element to zero, which results in the following:
As we can see, we now have four triangles simply by removing the width and height. By adjusting the border widths and colors, the triangles can be manipulated to create virtually infinite variations.
Possibilities are (Practically) Endless
While this post doesn't go into full detail about all of the shapes that can be created using these methods, nor every method available using CSS rules alone to create shapes, it is obvious that there is quite a bit of power in the pattern. Beyond simply making individual shapes, imagine what can be created by combining two, three, or even ten of these shapes? Although the use of as many as ten or more elements to create a form is hardly a real-world use of CSS shapes, the fact that this sort of thing is possible is quite impressive in and of itself.
Labels: CSS, Web
posted by Jake Kronika, Owner, Gridline Design at
0 Comments
Links to this post
RIP GeoCities
Originally posted as a comment in response to the related blog by Arthur Kay -- another Chicago Web developer and former colleague at Imaginary Landscape, LLC – the following is in memory of the long-running and ubiquitous GeoCities, recently discontinued by owner Yahoo!, Inc.
Art,
Yours is not the only story to begin like this. My first encounters with the Internet followed a very similar grain – AOL chatrooms, slow-loading images, and GeoCities Web sites. In my case, the transformation from a kid fascinated with dinosaurs to an entrepreneur building Web sites came even earlier – at age 10.
My best friend had stumbled, much as you had, onto GeoCities one day while surfing the net, and when he told me about having the ability to build our own Web sites, we were so excited we didn't know what to do first. The immediate step was to just put something out there. Within a week we had a very crude Atlanta Braves fan site up.
The main thing I found was that GeoCities' interface was just not quite what I wanted. A year or so after our first attempts I moved on to AngelFire, the next in the line of big “do it yourself” Web site creators. By the time I was 11 I had read an 800-page book about HTML 4, Java 1.2, and XML from front to back and struck out on the path of becoming a Web developer.
The first “job” I took was in 1997 (age 14), when I put together the first incarnation of an online gallery of my sister's artwork. Several iterations later (and in the process of a major overhaul), it lives on at www.flyngypsyarts.com, and now is a PHP/MySQL database-driven application, complete with administration editors for the pieces.
As you so aptly have mentioned, GeoCities has &ndashp; at least for us Web nerds – been a major driving force in the development of our lives and careers. No doubt you are correct also in asserting that the Internet’s growth and identity owe themselves partially to the influences of such amazing tools as it was.
RIP GeoCities, indeed.
posted by Jake Kronika, Owner, Gridline Design at
0 Comments
Links to this post
A Word about Standards
Anyone working in the Web development arena today should know the power of
Web standards. If they don't already, it is time to learn. Though standards were long seen as a dream that could not be fulfilled, or a joke that just wasn't funny, now the technologies are finally available to make these tools a staple in everyday implementations.
Thanks to a number of recent upgrades for browsers of all types, it has become possible to use completely valid
XHTML and
CSS to build cross-browser compatible Web sites. It is even possible to, at the same time, make those sites
usable and
accessible to people of every walk of life. Whether you use
Internet Explorer,
Firefox or
Safari,
Windows or
Macintosh or
Linux... Regardless of whether you are colorblind, have poor vision, or are completely blind... Anyone can see anything from anywhere...
If the developers take the time, and make the effort.
Going even farther than that, a Web programming language that was long thought of as the biggest "no-no" a person could use on their sites is now moving ahead to the forefront of every major innovation in Web technologies --
JavaScript (also known, in terms of Web standards, as ECMAScript). Long held as the destroyer of the common Web,
JS is gaining wide acceptance as the language of choice for improved user interaction. Using frameworks such as
jQuery,
extJS,
Prototype, and many others, developers can quickly write unobtrusive code that improves the experience for those who can use it, but does nothing to interrupt the experiences of those who cannot.
Even more amazing has been the rise of AJAX in recent years. Applications of all kinds, many of which are professional enough to seem like full-fledged desktop programs rather than Web-based scripts, are forging ahead.
Google Calendar,
GMail, and
Google Maps are three of these that are both highly visible, and greatly loved.
Those same three examples help to disprove an idea that has often been used as an excuse for avoiding standards compliance: lack of aesthetics. Web standards often are made into a scapegoat for unexciting, even terribly boring, design. The primary cause for this concern is that the sites that most often discuss standards usage are intended to be informational rather than entertaining.
To help reverse that mode of thinking, and to provide a "pretty" discussion of standards, keep in mind that this site is entirely Web-standards compliant, written with thoroughly valid XHTML and CSS, enhanced by unobtrusive JavaScript, and it looks and works perfectly in every browser I have had ever tested it in.
Regardless of how many people read this, or how many change their mind about Web standards because of it, I know that I have been thoroughly impressed with everything I have ever built that put into practice the tenets of standards-compliant design. As we move further into the ever-shifting future and Web development continues to evolve, my eye will always be on what the next standard is, so as to ingest it, learn from it, and adopt it. The use of Web standards can do nothing but improve output, usability, accessibility, stability, and ultimately, satisfaction across the board.
Labels: Accessibility, Standards, Usability, Web
posted by Jake Kronika, Owner, Gridline Design at
0 Comments
Links to this post
