THE LOGO

MARKETING MATERIALS

Business Cards

I wanted to keep the design simple yet eye catching by emphasizing the bull mascot as much as possible; however, I did not want the copy to become lost so I coordinated the same typefaces from the logo with clean typography for increased legibility.

Flyer

Keep in mind these guys are from Jersey so I wanted to give them a clean / industrial look. A little though around the edges if you will but without sacrificing great design. At the same time I made sure to incorporate the diagonal stripes we used on the business cards to help tie the branding together without being boring

TShirt

I don’t know that I can take full credit for this one, Patrick & Franco knew exactly what they wanted and where able to communicate clearly so all I had to do was execute and deliver. I think we ended up with a really cool TShirt!

Window Graphic

The Window graphic needed to be simple yet eye catching, something that would be fast and easy to read. Since people could walk up to it I implemented a Contact Info QR Code.

ONLINE PRESENCE

Facebook Cover

I really wanted to do something special with the bull on this one and used the new Timeline Cover combined with the placement of the avatar graphic to give it unique look and integrate both into one.

CrossFitSteam.com Website

Finally the mother of all my CrossFit Affiliate Packages…The Website…Patrick and Franco wanted something really clean from the very begging, so I thought to use the business cards as inspiration for their website. Clean, industrial, a bit edgy, with big emphasis on typography. I LOVED the way this website came out. In addition we integrated their WordPress Blog with Facebook so that both posts and comments sync with both platforms through the use of a custom app.

Hope you enjoyed my post, any comments or feedback are always welcomed. I had a lot of fun designing CrossFit Steam and I hope I can continue to work with them in the future!

Before you go into actually trying to write web pages, you should know what HTML is, what it can do, and most importantly, what it can not do.

HTML Stands for Hypertext Markup Language, it is a language for describing the structure of a document, not its actual presentation. The idea is that most documents have common elements — for instance; titles, lists, paragraphs, etc.

HTML defines a set of common elements for web pages such as headings, paragraphs, lists, and tables. These styles are indicated inside HTML documents using tags, and each tag has a specific name and purpose.

In short, HTML is the structural foundation for our web pages, and using the proper tags for each type of content can make a big difference when search engines such as Google index your content.

HTML Does Not Equal Page Layout:

For the most part, HTML does not say anything about how a page looks when it is viwed. HTML tags simply indicate whether an element is a headline, a pragraph, a list, a hyperlink; however, it does not say anything about how that heading is to be formatted.

A Brief History of HTML:

The base form of HTML is referred to as HTML 2.0. In 1996 HTML 3.2 specification was developed by the W3C (World Wide Web Consortium) and included features such as tables, applets, and text flow around images.

HTML 4.0 was first introduced in 1997, and, it incorporated may new features that gave designers greater control over page layout with the increased integration of style sheets.

The latest edition HTML 5.0 is not yet fully supported by most browsers; however, some of its exiting new additions involve native HTML video support allowing web-sites to display video with out the need of plug-ins such as Adobe Flash.

HTML Introduction:

HTML Stands for Hyper Text Markup Language, made up of markup tags which are then used to describe web pages. HTML markup tags are often called HTML tags and they are surrounded by angled brackets <>, most HTML tags normally come in pairs comprised of an opening <p> and closing </p> tag.

Browsers such as Opera, Safari, Chrome, Internet Explorer, and Firefox read the HTML documetns and display them as webpages, they do not display the tags themeselves but use them to interpret to content of the document.

HTML Basics

An HTML Element is everything from the opening tag to the closing tag and the HTML Content is everything between.
Example: <p>(opening tag) THIS IS THE HTML CONTENT </p>(closing tag)

Some HTML elements have empty content and are “closed” in the opening tag. An example of this would be the <img> (or image) tag.

HTML Attributes provide additional information about an element and are always defined withing the opening tag. Attributes always come in name=”value” pairs

HTML Headings are defined by the <h1> to <h6> tags, with the <h1> tag defining the first (and usually largest) heading while the <h6> tag would be the last (and usually smallest) heading.
Example: <h1>This is a first heading</h1>

HTML Paragraphs are defined by the <p> tag, each paragraph must be defined by the opening <p> and closing </p> tag in order for the browser to accurately display proper spacing between paragraphs.

HTML Links are defined by the <a> tag; however, in order to properly apply a link you must include the href attribute.
Example: <a href=”http://www.avantmg.com”>THIS IS A LINK</a>)

HTML Images are defined with the <img> tag and its common attribues are “src”, “width”, and “height”, the src attribute stands for “source” and it refers to the location of the image itself while the width and height attributes define the dimensions of the image that will be displayed in the browser:
Example: <img src=”/image-sample.jpg” width=”100″ height=”100″ /> Please note that the <img> tag does not require a closing tag because it has “empty content” and therefore it is closed “/” within the opening tag.

HTML Line Breaks <br />are used to start a new line with out starting a new paragraph.
Example: <p>This is a paragraph <br />line break</p>

Our newest design. If you are intersted in purchasing the art for your gym we will customize with your logo for free.

Meet our newest team member Bruce Lugli. Bruce is a top notch illustrator who’s skills with a pencil and pen are equally matched by his technical knowledge of Adobe Illustrator.

At AVANT Marketing Graphics we are very excited to invite him to our team and we look forward to provide top quality original works for all of you to enjoy.

TAKE A SNEAK PEEK

We are currently working on a CrossFit Illustration series that we will soon be releasing for purchase as stock free graphics or apparel art. After the huge success we had with the Fitness Elevated Hero T-Shirts we wanted to really showcase Bruce’s talent with this new project.!

The T-Shirts

This year we created a Male and Female version of the T-Shirts, both where designed in one color format to keep production costs to a minimum but with out impacting quality.

The Website:

Look for a snazzy re-designed Fitness Elevated website comming soon. The design was done by AVANT Marketing Graphics and the site is powered by WoodClub.

Design Phase:

Because their colors are Orange, Silver, and Black we really wanted to make use of the splash of color by adding a “movable” rotating banner on the home page mixed with some grunge paint splatter and typography elements. The logo, navigation bar, and call to action buttons where kept black for maximum contrast; however, I really wanted the content area to be legible so I framed it in withe with a hint of silver. Custom Google Web Fonts were used to add a little more customization to the site.

Content Implementation:

Brandy at CrossFit Utah Valley did an awesome job at getting content together for me, everything was organized and delivered on time which made my job a lot easier when plugging in their content and formatting it for optimal display. To keep things simple proper heading tags where used for all titles and call out boxes and toggles where implemented to keep the content clean, legible, and more importantly uncluttered.

SEO (Search Engine Optimization):

Last but not least an SEO boost was launched once the site went live and I am so proud to report that in only 3 days they obtained top ranking on their regional searches!!! That is an unprecedented boost from the second page on Google to the top of the first page and it was all accomplished with 100% White Hat SEO tactics (that means legal and fair SEO policies that adhere to search engines rules and regulations).

In short, I had a lot of fun with this website and I hope the entire CrossFit Utah Valley community enjoys their new portal. You can visit the site at CrossFitUV.com.