MBlogMBlog - The Mightybytes Blog2013-05-20T21:00:18ZCopyright (c) 2013 Mightybytes, Inc.tag:mightybytes.com,2013:05:20WordPressRecycling in Chicago: Overview On What and How to Recycletag:mightybytes.com,2013:blog/13.27772013-05-20T21:00:18Z2013-05-20T21:51:54Zjeff-livorsi
Did you know that you can recycle paper bags in a blue bin but not plastic ones? Or that #5 plastic is okay but #6 is not? Jeff explains where and how to recycle in Chicago.
When I first started working at Mightybytes we had just become a certified B Corporation. At first, the idea of a B Corporation, a company that has a triple bottom line of people, planet and prosperity, was a little confusing to me. Neither my parents or I had ever worked for a company that prioritized solving social and environmental issues.
But after two years of working here, despite never really thinking about the environment or recycling prior to this, I have definitely seen a change in my behavior in how I think about the environment. The most important change that I have notices is in my desire to recycle.CHICAGO RECYCLINGAs some of you may know, recycling scene in Chicago hasn’t always been the greatest over the years. Recycling in Chicago has been confusing at best, and inaccessible at its worst. But it seems like we, as a city, are headed in the right direction. The two websites that helped me find important information about recycling were, the Chicago Recycling Coalition (CRC) and the City of Chicago’s Official Website under "Environment and Sustainability".Recycling is more complex than one might think. I've always known the basics: that you should recycle glass, aluminum cans and paper. But what I didn't realize that many more items are accepted and that there are certain restrictions on certain items (i.e. plastic products, which are numbered with a resin identification code). On the CRC and City of Chicago's websites hundreds of items are listed in the Chicago Recycling Guide: A to Z. For items that are not accepted by the city, the A to Z guide lists alternative places to drop those items off (for example, Goodwill for appliances or Best Buy for cell phones).
When scouring the internet I found a list of all materials that are accepted which can be found in the Chicago Recycling Guide: A to Z. There are a few no-brainers in there, but there were a few interesting and important things I found out that Chicago accepts and doesn’t accept.Things you CAN recycle in blue bins
Plastics #1-5, 7
Aluminum, including Aerosol cans
Cardboard/Brown Paper Bags
Paperback Books
Glass Bottles and Jars
Anything Paper (i.e. Magazines, Newspapers, Notebooks, etc.)
Things you CANNOT recycle in blue bins
Plastic #6
Used Paper Towels
Plastic bags
Hard Cover Books
Glasses (drinkware and dishes)
Batteries, CDs, DVDs, Cell Phones
Plastic Silverware
There are a lot of items, such as electronics items, that can be recycled, just not in the blue bins you might find outside your apartment building, or at city drop-off locations. Finally, in Chicago, you don't have to separate your recycling. Everything can go into the same bin. Even though recycling in Chicago can take a bit of effort, it's good to know that there are resources out there that can help you figure out where and how to recycle. ]]>Office Warming Party & Climate Ride Fundraiser Recaptag:mightybytes.com,2013:blog/13.27252013-05-03T18:30:16Z2013-05-07T18:12:20Zjeff-livorsi
One month after moving in to our new office we welcomed over 70 guests into our new space for an Officewarming Party and Fundraiser for Climate Ride. Here's a recap.
Thanks to all of our guests and new neighbors who came out to toast our new space! Together, we raised $1400 for Climate Ride and our beneficiaries Active Transportation Alliance and B Lab, the nonprofit behind B Corporations! Read about Tim’s Ride and check out our B Corporation blog posts. We enjoyed a keg of Krankshaft donated by Metropolitan Brewing, enjoyed delicious boozy snow cones from the lovely ladies at Jo Snow Syrups and Koval Distillery. We enjoyed a ton of delicious food by Not A Thin Chef, and all of the leftover veggie pizzas, flatbreads and chicken salad were donated to First Slice to feed the homeless through their community outreach program. Thanks as well go out to Into the Woods Chicago who bedecked our new office with snazzy linens and flowers.Enjoy some photos from the event. ]]>Image Optimization for Sustainable Web Designtag:mightybytes.com,2013:blog/13.25322013-04-19T22:13:06Z2013-05-03T20:02:02Zjeff-livorsi
One quick and easy step that you can take to minimize a website's carbon footprint is to optimize images, making them smaller and faster to load.
Images can make the stuff we read online easier to read. They can help customers feel a strong emotion or get a clear impression of a brand. People are also more likely to share blog posts with images rather than text. But images that aren't optimized for publication on the web, can increase the carbon footprint of you website.Simply put, pixels need power to appear on your screen. Both the web servers that deliver content to customers and the devices that consumers use to browse the web use electricity. Billions of watts of electricity. And a lot of that electricity is generated by sources that aren't clean or renewable. In this post we're going to look at some basic techniques for optimizing your images for performance and for sustainability.
When you create an image and then save it, some compression happens, which means that your file gets smallers. Different file types take different approaches to reducing your file size. Selecting the correct type of file for a particular image will often result in a smaller file size.
Use JPEGs for photographs and illustrations that have a lot of shading in them.
For line art and fonts, a GIF is often the correct file type.
For images that need to support partial transparency while retaining some of the crispness of a JPG, such as a company logo, a PNG is often the correct file type.
Let's look at some examples. If you use Adobe products such as Photoshop, you can use the "Save for the Web" interface to preview your image saved as different file types. The screenshot below was created by selecting the "4 up" tab in the Save for the Web dialogue box, which allows us to look at four versions of the image at once.[caption id="attachment_2666" align="aligncenter" width="560"] By selecting the JPEG file type you can often make the file sizes of your images smaller. In this example you can see that by selecting the JPEG file type we were able to save 398.57 kb in comparison to the original file.[/caption]
Playing with Image Quality in Photoshop
In the example below, we have selected a JPEG file type for a photograph of cyclists on Climate Ride. After you select a file type for an image, you can adjust the quality of the JPEG. You're looking for the smallest file size that is visually acceptable in the proper file format.[caption id="attachment_2667" align="aligncenter" width="560"] The goal of Image Optimization is to reduce your file size without reducing the quality of the image. This example from Photoshop shows the differences between the original image (top left) and the image saved at three quality levels: low, medium and high.[/caption]In the above example, in the low quality version of the JPEG (top right) you can see digital artifacts on the yellow sign that compromise the quality of the image. The artifacts in the medium quality image (bottom left) are less noticeable, but still present. The maximum quality image has no artifacts, but is half the size of the original image. A next step might be to find a happy medium between medium and high quality. Keep in mind, that if you are targeting devices with retina displays, a higher resolution photo might be desirable.
3 Tools for Image Optimization
Alternatively, there are a few tools and plug-ins that help automate this process. The three tools I've used to help optimize images are:
Yahoo! Smush.it seems to be really easy to use, but I ran into a few issues when I tried it. I found it hard to "smush" certain images. I'm not sure why, but from time to time the application wouldn't recognize an image that I attempted to upload and compress.
Image Optimizer
This tool was really easy to use and I didn't run into as many issues as I did with Smushi.it. What I liked about this application was that it gives you the ability to crop the image as you please with a "max-width" and "max-height" option. This allows the application to compress your image to it's full potential.
Photoshop
This is the method that we described above. With Photoshop you're able to crop any image to any size you need, and from there you can click file then "Save for Web and Devices".If you have Photoshop this is probably the option that I would recommend, but for those of you that don't I believe that Image Optimizer is the next best option.Here are some other alternatives to the tools I've listed above.
See how green your website is with EcoGrader. ]]>How Error Pages and Redirects Make Your Website More Sustainabletag:mightybytes.com,2013:blog/13.26402013-04-19T21:35:45Z2013-05-03T19:56:02Zsarahbest
Make your content more findable by using customer friendly error page and appropriate redirects. It's an SEO best practice, that will also make your website greener.
Findability is a term that describes how easy or difficult it is for a person to find content they are looking for, both through search engines and for those searching within a website. The more findable information is, the less unnecessary steps a person has to go through to find what they need.Fewer pages browsed means that fewer server requests are being made, fewer photos and multimedia files are being loaded. You end up with happy customers who are using less energy because they are browsing a website efficiently. That matters because it takes a lot of electricity to power the web—both the servers that deliver content and the devices that we surf the web on—and because most electricity comes from sources that aren't renewable, or clean.
Create CUSTOMER Friendly 404 Error Pages And use Permanent 301 Redirects
Two ways to improve the findability of content on your website is to make customer friendly 404 error pages, and to use appropriate redirects. Both help create a positive experience for your customers, and sure that you don't waste any of your website's finite SEO budget—or any extra energy—on broken or useless pages.
404 Error Pages
404 Error Pages are displayed when a customer tries to access a page that doesn’t exist on a website. This may be because they have clicked on a broken or bad link. A best practice for 404 error pages is to create a page that is both friendly, and which helps direct the user to an appropriate resource.[caption id="attachment_2691" align="aligncenter" width="535"] A great 404 error page helps direct people to find the content they need. This example from Foursquare.com includes a friendly message, cute graphic, and a search box that helps you find what you were looking for.[/caption]
Broken Links
On a monthly basis, use Google or Bing Webmaster tools or another link-checking tool, to check for broken links. Correct any broken links to minimize 404 status code errors on your site.
Avoid 302 Temporary Redirects to Serve Error Pages
On a technical note, you should avoid using 302 temporary redirects to serve up a 404 error page. The correct approach to serving an error is to immediately serve the 404 error page. For a more detailed explanation of different types of redirects and what they mean, read SEO Moz's guide to Redirection for SEO.
Use 301 Permanent Redirects
A 301 redirect is a permanent redirect from one URL to a different URL. It's important to take the time to create 301 permanent redirects when you change a URL. This is handy in a variety of situations including:
I hope that this discussion of error pages and redirects helps you make your content more findable, more SEO-friendly, and a little more energy efficient. Make sure you leave your best tips for error pages and redirects in our comments below.Check out our newest product EcoGrader. ]]>How to Use Keywords for SEO and Web Sustainabilitytag:mightybytes.com,2013:blog/13.26452013-04-19T21:00:23Z2013-05-03T19:56:17Zsarahbest
Learn how to add keywords to pages for SEO, to increase the findability of your content and to reduce your website's carbon footprint.
Keyword optimization is a well-known strategy for helping people find your content, both through search engines and for those searching within a website. But did you know that by following SEO best practices you could also be making your website greener? That's because web servers and devices that consumers use to browse the internet both use electricity. A lot of electricity. And most electricity is generated by sources that are not renewable or clean.
The more findable content is, the less irrelevant content a person needs to go through to find what they are looking for. Fewer pages loaded means fewer server requests are being made, and that fewer photos and videos are being loaded. In some cases, the customer may also end up spending a little less time on their phone, tablet or computer. All of that results in tiny energy savings, and those savings add up.
Now that you understand the connection between findability and sustainability, let's take a detailed look at how to improve the findability of content through page level keyword optimization, a popular SEO technique.
KEYWORD OPTIMIZATION: WHERE TO PLACE FOCUS KEYWORDS
In order to optimize a page for a focus keyword, you need to place it in a number of different places on a page. With the exception of your homepage or landing pages where you may need to optimize for several keywords related to your products and service offerings, in general, you want to optimize a page for a single keyword or keyword phrase.After you've selected a focus keyword for a page, here is where you need to place it:
In the Title Tag of each page
The first place that you want to put your focus keyword or keywords is in the title tag of each page.Examples of an optimized title for a homepage:
Electronics, Cars, Fashion, Collectibles, Coupons and More Online Shopping | eBay
Shoes, Clothing, and More | Zappos.com
Shop clothes for women, men, maternity, baby, and kids | Gap
Examples of an optimized title for a subpage:
Electronics | eBay
Popular Men's Shoe Styles | Zappos.com
Womens Clothes: jeans, tops, skirts, dresses, pants | Gap
Optimized title tag have certain characteristics:
Avoid the use of duplicate title tags: Every page should have a unique title so that your pages are not competing with each other for relevance.
Optimized titles should be 70 characters or less.
Put company name at the end of your title tag to help build brand awareness.
Use consistent punctuation across all page titles in between your keyword and company name.
Balance keyword usage with usability, considering what language would be most compelling to the reader.
In the Description Tag of each page
The next place that you want to put your focus keyword(s) is in the description tag of each page. This is the brief description that shows up in search results, or when you share a page on Facebook or LinkedIn. While this description should be written for humans and not for search engines, you should include your keyword at least once. Write your descriptions in plain English, using compelling language that would make a customer want to click on a link. Optimized page descriptions should be 150 characters or less. Longer descriptions will be truncated in Google with an ellipses (...).
In the main body of your content
Include your focus keyword 2-3 times, including once in the first paragraph of the page. In general, search engines are going to read things that appear first in order first and they may or may not get around to reading things that appear lower on a page. It's recommended that copy on each page should be a minimum of 300 words for SEO purposes.
In a heading within the article
Headings, which are often labeled "Heading 1, Heading 2, Heading 3", etc. or "H1, H2, H3" in a content management system, help summarize a page's contents. Headings should be written to both include focus keywords, and to summarize what comes next. This helps people, and spiders, scan a page quickly to see what's most relevant to them. It's also an accessibility best practice, because screen readers enable visually impaired people to jump from heading to heading so that they can quickly get to the section that's most relevant to them. When you think about it, the spiders that crawl websites also can't see: they can't see photos, multimedia content, or fancy font styles on a page. So it makes a lot of sense that SEO best practices are also often accessibility best practices.[caption id="attachment_2684" align="aligncenter" width="445"] This example from the Gap shows headings that help customers navigate to the style of jeans that they're looking for.[/caption]Within your page URLAnother place that you should put your focus keyword is within the URL of your page. Here's an example from this post:[caption id="attachment_2680" align="aligncenter" width="486"] In this example, we've optimized the URL for the terms SEO keywords and sustainability.[/caption]Sometimes it's not practical to include your keyword in the URL of each page. That's okay. Your URLs should be short, descriptive and human-friendly, helping the reader (and spider) accurately predict what's on that page. I recommend using hyphens to separate words instead of underscores. Avoid special characters (such as smart quotes or ampersands), which can break URLs. For that reason, whenever possible, try to configure your content management system so that you can manually edit your URLs instead of having them generated automatically from the headline of the page.Within image alt tagsAs I mentioned above, search engines cannot "see" photos or multimedia content, so a number of accessibility best practices are also SEO best practices. When writing an alt tag for an image you should write a short sentence that describes the content of the photo, both for people and for spiders. Whenever it is practical and appropriate to your human readers, you should also include focus keywords in your alt text.Note that when an image contains text, the alt tag should include a copy of that text so that visually impaired individuals and spiders can read the text. Put your keyword phrase as close to the beginning of your alt tag as possible. Similarly, videos should also be labeled with appropriate meta information such as a clearly written title and description (if not a transcript of the video) in order to be understood by a search engine.
KEYWORD OPTIMIZATION: Put it into practice
I hope that this article has given you a practical understanding of how to do page level keyword optimization. By following these best practices you will yield a number of benefits: driving traffic to your site, making your content more findable, improving accessibility and reducing your website's carbon footprint.Check out EcoGrader and see how green your website is. ]]>EcoGrader, Google PageSpeed and Web Consumers Need for Speedtag:mightybytes.com,2013:blog/13.25962013-04-12T17:29:54Z2013-05-03T19:56:29Zpeter
In this post, we take a look at Google PageSpeed and how it relates to customer satisfaction and sustainability.
Mightybytes recently announced the launch of EcoGrader, a free tool that grades websites on sustainability. One of the metrics that we’ve used to determine how much energy that your website is consuming is your Google PageSpeed score. In this post, we’ll take a look at what that score means and how it relates to internet sustainability.
What is Google PageSpeed?
Google PageSpeed is a tool for measuring how fast a website loads. It gives you a score and suggestions on how to make a site load faster without compromising your customer’s user experience. Much has been written on the topic and all you really need to do to know more is, well, Google it.
Six Ways to Make Your Site More Speedy
Here’s an overview of the six categories of best practices that Google PageSpeed checks for:
Optimizing Caching: By adding a cache to your site, you can minimize the number of requests made through your site for resources that stay the same, such as your site’s main style sheets, JavaScript files, images that appear on most pages of your site, etc. Less requests means less processing resources used, which means that your page loads faster.
Minimizing Round-Trip Times: This set of best practices is related to the number of requests that your website makes for content. Some of the ways that you can minimize round-trip times are by using CSS Sprites, minimizing redirects, removing broken links from your site, and combining CSS and Javascript files.
Minimizing Request Overhead: This set of best practices is related to cookies and HTTP requests, how they’re created and how they are served. For more information on reducing HTTP requests, read our blog post “What Fast Food Can Teach Us About Making Fast Websites.”
Minimizing payload size: This means minimizing your code and optimizing your images, taking out things that you don’t need, so that you don’t have a lot of unnecessary junk in your site that slows your page load time down. For more information on minimizing code, see our blog post “To Minify or Munge? That is the Question”.
Optimizing browser rendering: This means using code, images and character sets efficiently and effectively as possible.
Google PageSpeed checks the site that you entered against these best practices, then gives you a cumulative score out of 100 possible points. The tool then provides tips, which are also prioritized as high, medium and low priority, so that you can see which improvements will have the biggest impact on both your score and your website’s performance.
Why PageSpeed Matters
According to a recent article in the New York Times, globally, the data centers that are powering the internet use "30 billion watts of electricity", which is "roughly equivalent to the output of 30 nuclear power plants." The content guzzling United States accounts for "one-quarter to one-third" of that energy usage. Because a lot of this energy used to power these servers is anything but clean, this activity is also significantly contributing to global CO₂ emissions.[caption id="attachment_2627" align="aligncenter" width="527"] Source: Financial Sense[/caption]The more efficiently your website runs, the less energy and processing power you use, which means that your site will have a lower carbon footprint. At the same time your customers, who expect to get the content they want instantaneously, will get what they need quickly, reducing your site’s bounce rate and keeping your customers engaged and satisfied. For more information on this topic, take a look at the results of this National Consumer Survey on Website and Mobile Performance Expecations.When customers find what they need quickly, they’ll also stop looking around for the content they were hoping to find, which reduces the number of pages they need to load to get where they’re going, and the amount of energy needed to power their visit to your site.EcoGrader also awards points for using green web hosting that is powered by renewable energy. That helps on the server side, but not on the client side. And much hosting is still powered by dirty power. Fossil fuel based electricity generation will be around for quite some time and until we are rid of it, we need to conserve. In other words, we need to minimize and optimize and serve our websites as fast as possible.Take a look at our latest product EcoGrader and see how sustainable your website is. ]]>What Fast Food Drive-Throughs Can Teach Us About Making Fast Websitestag:mightybytes.com,2013:blog/13.25232013-04-08T21:32:22Z2013-05-03T19:56:44Zbryan
HTTP requests and fast food drive-throughs have a lot in common: learn how to avoid long queues and improve your website's performance.
In an age of near-ubiquitous high-speed internet in developed countries, loading a website can seem like a trivial matter. But currently, 50 million computer servers contribute nearly 5% of the earth’s greenhouse gases. Improving your website's performance by reducing the number of HTTP requests made on a page is an important way of making your website more sustainable.Sites render so quickly that it is easy to forget that for every image, video, CSS file, or Javascript file the page loads, your browser and server perform the following sequence of tasks:
Your browser makes a HTTP request to a web server for digital assets such as images, CSS files, Javascript and Flash content.
The web server validates the HTTP request and assembles the appropriate headers and content to complete the response.
The web server responds to the browser's HTTP request.
Web servers can respond to several requests at the same time. Once all of the web server's available HTTP request handlers are occupied processing requests, subsequent requests are queued up behind them and served in the order in which they were placed. If a web page loads so many assets that the server has to queue some of them, that affects the load time of the page.[caption id="attachment_2571" align="aligncenter" width="450"] Twitter's Fail Whale appears when site visitors have made too many requests to Twitter at the same time. Source: Wikipedia.[/caption]It's hard not to see this same paradigm at work at your favorite fast food restaurant's drive-through window:
The customer makes a request to the restaurant for food.
The restaurant confirms the request and assembles the appropriate items to complete the order.
The restaurant passes the completed order to the customer.
The same problem that plagues web pages that make a lot of requests is problematic for drive-through restaurants as well: If there are more requests than can be handled, a queue of requests forms and everyone has to wait. If someone ahead of you in the queue is ordering food for 10 people, you're going to wait longer for your small coffee.As a web developer, there are some very simple things that you can do for your site to keep the number and size of your HTTP requests down and improve the speed at which your visitors can load your website.
Order a value meal, not the individual menu items: USE CSS Sprites
Why would you order fries, a drink and a burger as individual items when they come as a package deal? CSS Sprites are the value meal of the CSS world. CSS sprites work by aggregating all your background images into a single image, then using background image positioning to display the appropriate background image for that element. This will reduce all your requests for background images into a single request. For more information, see our blog post "How CSS Sprites Improve Speed And Sustainability". When you’re ready to use CSS sprites on your site, SpriteMe.org will automatically generate a sprite image from your existing website.
Get your order together first: Aggregate and minify
Have you ever gone through the drive-through with a group of friends who aren’t quite sure what they want yet? One person wants no pickles. Another person wants to know if you can substitute a pie for french fries. Someone else wants to beg the restaurant to make a seasonal item that is no longer available. You end up relaying a series of questions and orders between your friends and the order taker, and chaos and confusion ensue.Wouldn’t it be great if you had your order figured out before you got to the window? This is the basic principle behind aggregating and minifying your Javascript and CSS files. If your page includes multiple CSS or Javascript files, you can reduce the number and size of your requests by aggregating them into one single CSS or Javascript file. The size of the combined files can be further reduced by eliminating the syntactically irrelevant portions of the file (such as spaces, line returns and comments). This process is called “minifying”. For more information on this topic, see our blog post "To Munge or Minify? That is the Question." Mike Horn has graciously provided the world an online tool to aggregate and minify your Javascript and CSS.
Get Your food delivered: Alternative methods for displaying images
If your culinary playbook doesn’t include quick take out, delivery is another option. Similarly, there are some alternative image delivery methods that can help you lower your HTTP request overhead. You can use the Scalable Vector Graphics (SVG) format to display vector images, which has the added benefit of automatically scaling up on high-resolution displays. In addition, background images can be encoded and embedded as text into your CSS file.Reducing the number of HTTP requests is one of the most significant methods of improving your page load time. After all, if your site visitors have to wait in the drive-through queue, they may just pull away and go to a different restaurant.How sustainable is your website? Have EcoGrader give you the answer. ]]>To Munge or Minify? That is the Questiontag:mightybytes.com,2013:blog/13.25272013-04-05T22:07:10Z2013-05-03T19:56:57Ztimfrick
Want to make your website more sustainable? Minify its scripts.
When it comes to building sustainable websites, optimizing performance is key. Simply put, the faster a web page downloads to your laptop or mobile device, the less energy it uses. There are dozens of techniques for speeding up website performance. In this post, we're going to talk about two of those techniques: minifying code and obfuscation, which works through a process called munging.
SUSTAINABLE WEB DESIGN: Minifying Code
The average amount of JavaScript and CSS on web pages increased 44.7% and 25% respectively in a one year period from November 2010 to November 2011, according to a blog post on Pingdom.Here is a recent comparison of the average bytes per page by content type for all websites in the Alexa Top 1,000,000 Sites from HTTP Archive. These snapshots were taken on April 1, 2012 and April 1, 2013.[caption id="attachment_2556" align="aligncenter" width="423"] Average bytes per page by content type for April 2012[/caption][caption id="attachment_2557" align="aligncenter" width="424"] Average bytes per page by content type for April 2013[/caption]As you can see, the amount of these two content types on web pages is on the rise with scripts increasing by an average of 50kb per page just over the past year.In their resource "Best Practices for Speeding up Your Website", Yahoo! advises developers that minification, the practice of removing unnecessary characters and white-space from source code without changing functionality, can offer significant performance enhancements because it reduces the size of a script file.These unnecessary characters usually include white space characters, new line characters, comments, and sometimes block delimiters, which are used to make the code more readable by human programmers but not required for the script to run.
To use these tools, you copy and paste your scripts into the appropriate field, then press a button, and optimized scripts are returned to you to re-incorporate to your website. Though file sizes are smaller, none of the source code is actually changed.
Obfuscation: Munging Code
Similar to minification, another practice for increasing script performance is obfuscation, which, unlike minification, actually alters the code through a process called munging. Munged code is typically harder to reverse engineer because function and variable names are converted into smaller strings, making the code more compact (and harder to read by humans). Dojo Compressor’s ShrinkSafe is a tool that can be used to obfuscate scripts.Both minification and obfuscation pertain to external scripts and inline script blocks. So which technique is better? It depends on your needs. According to one of Steve Souders’ post on the Yahoo! Developer Network blog, “In a survey of ten top U.S. web sites, minification achieved a 21% size reduction versus 25% for obfuscation.”Now that you've minimized or obfuscated your scripts, you're well on your way to making your website a little greener. Check out other posts in our sustainable web design series. For information on how minification can also be part of a time-saving front end development framework, see Tai's blog post "E-Z Bake Websites: Save Development Time by Creating a Front End Framework that Works for You."See how green your website is with EcoGrader. ]]>Mightybytes Moves into a New Office in Ravenswoodtag:mightybytes.com,2013:blog/13.25082013-04-01T21:09:38Z2013-04-01T21:21:42Zmightybytes
Mightybytes is on the move! Read about some of the green and productivity features in our new office space on Ravenswood Avenue.
As sad as we were to leave our cozy office in Andersonville, the Mightycrew is excited to put down roots in an expanded, sunny new space at 4001 N. Ravenswood Avenue. The new office space, which has more than twice the square footage of our old space and many more spaces for conversation and collaboration, will better meet the needs of our growing team."Beside the fact that we simply outgrew our old space," Tim explains, "the new office provides many features that will help us be a more productive and more environmentally-friendly company."
Howdy neighbor! Jill Pollack, who runs StoryStudio Chicago in our new neighborhood, enjoys one of our new conversation spaces with Tim Frick.
In building out our new space, we were able to include a number of green and eco-friendly features, from partially recycled drywall and an energy-efficient HVAC system, to Energy Star compliant appliances and kitchen countertops custom-made with recycled cement and other materials.URL (pronounced "Earl"), our vermicomposting worms, has found a comfortable new home just off to the side of our new kitchen. We'll also continue the practice of offering full recycling, as we did in our old office.Our new office is close to both the CTA Brown Line (we're conveniently located next to the Irving Park 'L' stop if you'd like to pop by) and the METRA, and a bike room in the basement will help us continue to encourage employees to bike to work.As a Certified B Corporation, our people have also always been one third of our triple bottom line of people, planet and prosperity. Our new office has comfortable 'living' spaces with plants, rugs and comfy chairs, not to mention a faster internet connection, that will help our team to be more comfortable at work and more productive. The green walls that will soon be installed in our space will help us take a deep breath and say "Ahhhhh....".
Stephanie and Joy get to work in our new office space, which has many new features to enhance the productivity of our team.
As you may already know, brewing beer as a team is something that we do at Mightybytes to welcome new people onto our team, to encourage brainstorming, and to give something back to our clients—tasty, tasty beer! We're happy to report that this traditional will continue in our new office, which will have a built-in brewery with kegging equipment that's slightly greener, in that it will cut down on the number of bottles that we use. A new built in water filter will purify what we drink on a daily basis, and the water that goes into our brews.We can't wait for you to come over and enjoy our new communal spaces! Our new office has a larger conference table and multiple conference rooms with a big monitor for workshops and seminars, Lunch-n-Learns, beer-brewing demonstrations and more. There will be lots of opportunities for us to gather as a team and to have people over. Follow us on Twitter or Facebook to get information on an officewarming party and fundraiser for Climate Ride happening in our new space later this month! ]]>6 Ways to Reduce Your Carbon Footprint While Surfing the Webtag:mightybytes.com,2013:blog/13.25002013-03-29T18:36:12Z2013-05-03T19:57:09Zjames
In our next Sustainable Web Design post, James considers ways to save energy while surfing the web.
At Mightybytes our designers and developers are always looking for new ways to create sustainable web design and code, but we also strive to reduce our carbon footprint at home. Every bit of content you consume on the internet has a carbon footprint, and small amounts add up quickly. Here are a few quick and easy tips for folks who want to become more ecologically conscious consumers of content on the web.
Shut it down
The US Department of Energy recommends that you power down your machine if you’re going to be away from it for more than two hours. If you have trouble prying yourself away from your screen, set a reminder on your computer or device to power it down and take a break. You may find you have more time to do other things! Yes, there are other things outside of browsing the internet.
Go to Sleep?
There is a running debate about the environmental impact of a sleeping computer. Even in sleep mode, your computer continues to burn energy. The average energy efficient laptop burns between 15-60 watts of energy while in use, and 2-5 watts of energy while in sleep mode. Set your computer to go into sleep mode after a certain number of minutes so that it can run more efficiently while you’re away from it for shorter periods of time.Don’t be a VampireGenerally speaking, if a device or adapter is plugged in even while it is powered down, it is drawing at least 0.5 to 2 watts of energy. This is known as “vampire power”. Some devices (televisions) are worse than others (mobile phones) at leeching power while they’re powered down, and some companies are making power adapters that prevent your charger from leeching power if it’s not connected to a device, and prevent your devices from leeching power once they are fully charged. But to prevent “vampire power” entirely, unplug chargers that aren’t in use or use an energy-efficient power strip.
Use a Tablet
Simply put, tablets use far less energy than laptops or desktops. Consider your task and if you don’t need to use a desktop or laptop, use a tablet instead. In some cases, watching a movie or show on a tablet may also be greener than watching it on a television.Browse YourselfAlthough Microsoft argues that Internet Explorer 9 is the most efficient of the five major browsers, there isn’t a definitive choice for green consumers here. Browsers use resources and drain your battery. Some use more than others and constant updates make it difficult to tell which browser might help you save a little energy. This is a game of he said, she said.
The Elephant in the Room
Now, there is another element to consider here. The elephant in the room if you will. If consumers go electronic to save the trees, but electronic devices that become obsolete the day they enter the market, you have a nightmare e-waste problem on your hands. Currently, 54% of all e-waste goes into a landfill. Apple alone emits 10.2 metric tons of greenhouse gas annually. At what point does the amount of lead, arsenic and mercury entering the environment via discarded electronic devices surpass the impact of destroying trees? If we cannot decrease the waste generated by electronic manufacturing, and don’t have a solid recycling strategy for e-waste, we are likely to continue to destroy the planet at an alarming rate.I hope this post gives you the information you need in order to use energy efficient devices while online and to save energy offline. Please leave a comment with any tips we may have missed below.Check out our newest product EcoGrader. ]]>
This example from the Gap shows headings that help customers navigate to the style of jeans that they're looking for.[/caption]
