I am trained as a professional artist. Earlier in my career I designed CDs at SONY Music. I explored the use of decorative typography and complex design in PhotoShop and Adobe Illustrator.
Later I worked in advertising, in an environment that eschewed fancy typography in favor of classic fonts and bold copywriting.
My website development has generally followed this second style. As much as possible I design in code. As the designer/developer I have the luxury that I can draw a simple pencil sketch to determine a layout, rapidly prototype, and proceed directly to code. Sometimes I get stuck and then I make a mockup in PhotoShop or Illustrator.
When working with clients I often need to show a mockup. The quality of that mockup varies according to the conversation that we need to have.
Often I need client buy-in on a page layout, the agreed upon functions, or what content is needed on what pages. In those cases I create a simple wireframe. No style is provided that can cause a distraction in the discussion. The wireframe is essentially a contractual device to nail down the scope of project.
If instead the conversation is about style, then a complex mockup in Photoshop may be needed. Cost considerations are involved. Is it necessary to make an expensive mockup as a conversation prop or can I talk the client through it?
As responsive design has become predominate, design experts reject the photoshop mockup as irrelevant. The ability to design in code saves time.
When working on projects I make simple prototypes. These demonstrate the function of components such as forms and navigation. Prototypes, like wireframes, are without artifice. Prototypes only need to demonstrate proof of concept.
Now that I am comfortable with designing in code, I aim to incorporate art and illustration back into my design process.
The importance of Content, UX and SEO:
Websites that work without users needing to think build brand trust and gain results.
UX and SEO are complimentary. Getting a consumer to your website first is critical. Once the user arrives on the website they become the most important focus.
I assert that the copy that I write is the most important service that I provide. I research competitors to learn what services are typically offered and to build a library of searchable terms and phrases. I edit those product and service terms into concise copy. I re-edit the copy to compress the text as much as possible. Finally, I edit live on the web page for fit. Most importantly, I read the copy aloud to ensure that it sounds conversational.
I concentrate primarily on the written content and presentation within the website. Searchable terms and phrases are incorporated into the text while striving for a natural tone or voice. The text should sound natural when read aloud. Keyword phrases are worked into section headlines. I incorporate search-content into cut-lines, alt tags, link titles and meta tags, making sure that terms are not repeated.
Good content is recognized and highly ranked by Google, and is therefore both UX and SEO.
Using HTML5, semantic elements are available to contribute to UX/SEO and accessibility.
Much of the services content for Randall’s Auto Body appears on the Repair & Services Page. The content was later separated into individual pages and listed in the second tier of the top menu. We did it to make content easy to see and access through the menu, for users. The result is that important service pages appear on page One or Two, on Google.
The Icarus website Product Page currently has six articles with planning for three more. I would have separated this content onto individual pages, except that the quantity of pages is limited by the project scope. That said, the HTML5 semantic structure clearly defines each article individually so that Google can recognize each article and evaluate it’s content value. It is also easy for clients to browse and see all of the services on one page. Additional navigational aids were created to direct users and Google.
Concept, design and creative development.
Build a core identity and message tailored to your target audience.
Craig Webb Art provides all aspects of New Business Communications Development including project management, creative development, copywriting and graphic design.