The post Sales Strategy appeared first on mimoYmima.

The post Keepers Coffee Soda appeared first on mimoYmima.

Design Improvements

• I love this toothpaste but hate the packaging. This redesign reduces printing costs; three (or even two) color printing as opposed to what they probably need to do now (cmyk+4 colors).
• Got rid of the bad clip art photo of mint that’s faded out in the corners in an attempt to make it fit into the design.
• The new design is cleaner which is particularly important with a toothpaste – Less fonts, less clutter, easier to understand at a glance. And the best part is that if you order it online you will get it fast and safe thanks to the best ProOffice shipping labels.

The post Toms of Maine Packaging – Sacrificed appeared first on mimoYmima.

The Know Me app is a good example of a forgettable icon, it uses a typical stock smiley as their defining characteristic. We chose to keep the color, get rid of a lot of the noise – opting for flat design – got rid of the drop shadow and other design elements which clutter the icon.

The smile itself is more stylized and has just enough personality to be more distinguishable.

Hope you like it!

The post Know Me App Logo – Sacrificed appeared first on mimoYmima.

She goes into a ton of detail in this amazing post which we use as the basis of our mixin code:

There’s A LOT in this post, the section we’re most interested in is titled SVG embedded using iframes. Apparently iframes use the same technique as inline SVGs which is the method we’re using. Using SVGs inline is preferred because it gives you much more control with CSS.

Take some time to understand how it works before blindly pasting the code below into your site.

// apply the mixin to the div that surrounds your svg
// get the svg width and height from the viewbox attribute of the SVG
// see: http://mimoymima.com/sass-mixin-responsive-svgs/
@mixin responsive-svg($svgwidth, $svgheight, $containerwidth){
    width: $containerwidth; // sizes the svg
    margin: 0 auto; // centers the svg
   	height: 0;
    padding-top: #{($svgheight/$svgwidth)*$containerwidth};
    position: relative;
    svg {
    	position: absolute;
    	top: 0;
    	left: 0;
	}
}

You need to have a container around your SVG (as outlined in Sara’s post). You call the mixin within the container in your SASS, so if your container had a class of “svg-container” you’d do something like this:

.svg-container {
  @include responsive-svg(45, 72, 3em); // arguments are ($svgwidth, $svgheight, $containerwidth)
}

It took me a while to get this working so hopefully this snippet saves someone else some time.

Happy coding ya’ll

The post SASS mixin for responsive SVGs appeared first on mimoYmima.

My attitude toward punctuation is that it ought to be as conventional as possible. The game of golf would loose a good deal if croquet mallets and billiard cues were allowed on the putting green. You ought to be able to show that you can do it a good deal better than anyone else with the regular tools before you have a license to bring in your own improvements.

The post importance of punctuation appeared first on mimoYmima.

A lot of your users are going to be using mobile devices; A new company – Ipswich Computer Repairs released an article on the current use of computers. According to them currently around 30-40% of users will be using a mobile device instead of a computer, depending on your site and it’s growing at a very fast rate Web Traffic From Mobile Devices Up 78% Year Over Year

Reason 2: It’s a good excuse for re-thinking your content strategy

One of the main things we do when creating a responsive design is we come up with ways to get your ideas across quicker. This means getting rid of visual clutter, re-thinking your navigation, content structure, and making your site load faster. We’ll take what’s working well and make it the focus, then take what’s not working and throw it out. With a good management company as SponsoredLinX Review yo can make a new website, and together you will come to the conclusion that you could take your results even further by collaborating together on a new website to get the most out of our SEO strategies.

Reason 3: Desktop sites are already feeling dated

When browsing on a tablet or a smartphone it’s really nice to have a site look and feel like it was designed for the device you are using. When you take a desktop design and shrink it down it sends the message that you should be looking at the site on a desktop computer and alienates the user.

Users want type to be legible, they want to be able to find what they’re looking for and they get frustrated when the can’t. That all looks bad for your business, you wouldn’t want to make someone crawl through a ridiculously small door to get into your business, or fill out forms where the type was barely visible for this you can use an optimizing company from sites as https://the-indexer.com/seo-companies/ that are experts in compatibility with all devices.

To see some examples of what’s possible check out this site that has a compilation of responsive web designs: mediaqueri.es

The post Why You Need a Responsive Re-Design appeared first on mimoYmima.

When we started the design it was clear that we needed to be modular. One of our biggest design challenge was to make the deck in a way that any piece of it could be liftable and worked on by a skinny nerd. We decided on creating 4×4 pallets and planter boxes that were small enough to be lifted, but big enough to sustain large plants like trees.

(( click photos to enlarge ))

(( more photos coming soon ))

The post Brooklyn Roofdeck Design appeared first on mimoYmima.

Here’s what it does

• First, check to see if you are on one of the following and create a class if so: home, 404, category, search, tag.
• We then make a class prefixed by page_ that has the name of the page or post in it.
• Then we check to see if the page has a parent, if so, we create a class prefixed by parent_ and put the parent name there.
• Finally we make a class with the prefix template_ and put the name of the template used there.

The PHP

Add this stuff to your functions.php file, or just use our html5 shell and it’s built in.

// Add to the body_class function
function condensed_body_class($classes) {
    global $post;

    // add a class for the name of the page - later might want to remove the auto generated pageid class which isn't very useful
    if( is_page()) {
        $pn = $post->post_name;
        $classes[] = "page_".$pn;
    }

    // add a class for the parent page name
    if ( is_page() && $post->post_parent ) {
        $post_parent = get_post($post->post_parent);
        $parentSlug = $post_parent->post_name;
        $classes[] = "parent_".$parentSlug;
    }

    // add class for the name of the custom template used (if any)
    $temp = get_page_template();
    if ( $temp != null ) {
        $path = pathinfo($temp);
        $tmp = $path['filename'] . "." . $path['extension'];
        $tn= str_replace(".php", "", $tmp);
        $classes[] = "template_".$tn;
    }

    return $classes;

}

add_filter('body_class', 'condensed_body_class');

The HTML

<body class="<?php body_class(); ?>">

Your Help

Let us know if you see ways to make it better, probably more conditions could be added to the beginning to take into consideration more template types.

The post A better body-class function for WordPress appeared first on mimoYmima.

We put it on CodePen to make it easy to see it working:

See the Pen SUPER SIMPLE FULL PAGE PRELOADER by Brent Lagerman (@mimoYmima) on CodePen.

http://codepen.io/mimoYmima/pen/fisgL

The post SUPER SIMPLE FULL PAGE PRELOADER appeared first on mimoYmima.