Posts Tagged ‘web design’

HTML5 is Coming (and is already here)

Tuesday, April 6th, 2010

With the very recent launch of the Apple I-Pad, I have seen the phrase “HTML 5” being thrown around more than ever before. I’m thinking, “OK what’s the big deal?”. So I started to actively research the new upcoming web standard and I must say I am truly excited! This is going to be a very nice leap for the web. Websites are going to look sharper and high-def with native SVG (Scalable Vector Graphics) support. SEO has the potential to be more useful and accurate with the new semantic tags such as <header>, <footer>, <article>, <nav>, to name a few.

Pack in <video>, <svg>, and <canvas>, and multimedia and interactivity will get a huge bump that could very well topple Flash, especially if all major browsers support all HTML5 with haste.

Check out this awesome video by Google to help you get up-to-date on the emerging web standard.

Introduction to HTML 5 from Brad Neuberg on Vimeo.

Based on my brief research so far, the new semantic tags are well supported across the browser platforms, at the very least. While HTML5 is still considered bleeding edge, it is safe to start using it. I know I will.

Logo-Centric Website Design

Thursday, April 1st, 2010

Logocentric is defined as A structuralist method of analysis, especially of literary works, that focuses upon words and language to the exclusion of non-linguistic matters, such as an author’s individuality or historical context.

However, I am talking about something totally different when I refer to logo-centric design (notice the hyphen). When I design websites (and other graphical assets) I work from a logo. For me, the logo is the most important element and the foundation of your brand’s image. From the logo you can extract your brand’s color palette, font-type, look, feel, vibe, and emotions. One of the first things that I ask my clients during a consultation is “Do you have a logo?”. If they do not, I suggest that they have one designed or have me design it, depending on their budget and unique scenario.

Logos are great as a starting point and a foundation for your website design, but they can also function to tightly integrate your letterheads, business cards, social network sites, and other branding assets. Before investing in a good website, it would be wise to invest in a good logo. My advice, logo first, then the world is open to you.

Exercise, Discipline, Design

Saturday, March 20th, 2010

OK, so I am totally stealing the Dog Whisperer, Cesars Millan’s, mantra and replacing a word. Instead of exercise, discipline, affection, I will be writing about exercise, discipline, design, or if it applies to you: exercise, discipline, development. My point is if your job, no matter what it is, consists of sitting in-front of a computer monitor all day, you need to take care of your body.

Personally, when I design or develop, it makes a huge difference if I find some time to take a break and walk, preferably before the workday, and then throughout. I tend to get fatigued, frustrated, and even depressed if I am sitting at a computer for an extended period of time. A little exercise does wonders to snap me out of that mode, get my blood moving, and clear my mind creatively. I really believe that every designer, developer, or computer technician owes it to their bodies to break and exercise.

Not only will this keep you healthy and alive, it will also help your career if you think about it. When your body is exercised and you have no sluggish fatigue, tension, or depression, you work better.
Even for you unchained developers and designers who do all your work on laptops (I am jealous) are not exempt from this. Sometimes it may seem that there is no time to exercise, but as hard as it can be to fit in while living in this fast-paced world, we really cannot afford not to get regular exercise.

Web Designer Vs. Web Developer

Thursday, March 18th, 2010

What is the difference between a web designer and a web developer?

I have been asked this question by clients on numerous occasions. The short answer that I would give is a web designer is skilled at creating the visual appearance of the website. The designer creates a custom theme using sound layout practices, color theory, usability, and branding. A web developer is more involved in the actual building of the functioning website or web application using programming and scripting. So if you were building a custom car, the designer would do the body detailing and paint job, while the developer would be tinkering with all the components under the hood.

This of course is really putting the two disciplines of design and development in a vacuum. While it is true that web designers may tend to be less savvy in programming, and web developers less aesthetically-oriented, it is hardly this black and white in the real world.

Many designers and developers can both program, code, and design to varying degrees. It is very rare to find an individual who can design like Michelangelo and code back-end systems like a mad scientist. It truly is a left-brain, right-brain split.

Most people bearing the title of web designer are more on the graphic design path, creating entire layouts and themes in Photoshop. But they also have the ability to take their composition, chop it up and code it into a functioning (albeit, mostly static) web page using xhtml and css. Familiarity with JavaScript, PHP (or other) server side scripting is very important, but proficiency isn’t a must. Web designers rarely go far on the other side of the fence into heavy-duty programming realm.

As you can probably tell, this post was written by a web designer aspiring to go for the gold and dive into programming. It is tough, but very satisfying and rewarding.

CSS Reset: Level the Playing Field

Tuesday, March 16th, 2010

Whenever I develop the css code for website layouts I always start with a reset. Each Browser “imposes” its own default style sheet onto your work, so you can level the playing field by tearing down their defaults. There are many ways to do this and varying levels of detail that can really make your cross browser coding more accurate.

Personally, I stick to pixel precision in some, but not all areas. I typically let inline elements like text, do their own thing.

Here is the code that I begin with at the start of my main stylesheet:

* {

This typically gives you the most bang for your buck as far as creating a smooth surface to start building your styles on.

I also like to add this:

a img {

I get annoyed how browsers automatically put the border around images, especially if used for navigation, like a logo or button.

If you do decide to go this route and use the “*” to reset your margins and padding, that means that EVERYTHING, every element will have its margin and padding stripped bare. You will then have a relatively blank slate to work off of, but you will need to set margin and padding on all your elements. Be especially careful to set those attributes for unordered lists, list items, paragraphs, and headers.

For more on CSS Resets theory and practice, read from this article by the CSS master, Eric Meyer

Also be sure to check out this video by Nate Koechley for their YUI CSS grid. This video explains resets and so much more about css. It has changed the way I understand and code. Watch YUI CSS Foundations Video. (re)Launched

Tuesday, March 16th, 2010

Well, is officially (re)launced with a new layout, pages, and blog.

I will be working to make improvements to some of the inner-content formatting on certain pages, especially to my resume. I really want my xhtml/css resume to look like something special. I plan on making it interactive, crisp, and colorful.

Special thanks to Kristina Lynn for writing me a very warm and very awesome client testimonial

Handcrafted Website

Sunday, March 14th, 2010

At last!  I am finally taking the time and care to give my website the same quality treatment I have given to my clients’ sites.  This has been long overdue.  I am really excited to present a nice website instead of merely a bare-bones list of URLs to work samples and client sites.

It is proving to be quite a challenge for me to do a website about myself and what I do.  I decided to make my tag-line “Custom Handcrafted Websites”.  Although websites are virtual assets that are created digitally, I take pride in the craftsmanship of a unique web creation.

I am almost done slicing and dicing my Photoshop layout into xhtml/css.  Then I will integrate those digital assets into my WordPress theme.  This should be happening sometime this week.  It can’t come soon enough.