{"id":3494,"date":"2013-09-14T10:07:37","date_gmt":"2013-09-14T10:07:37","guid":{"rendered":"http:\/\/www.crimsondesigns.com\/blog\/?p=3494"},"modified":"2023-11-15T16:19:39","modified_gmt":"2023-11-15T16:19:39","slug":"responsive-web-design-along-the-maine-seacoast","status":"publish","type":"post","link":"https:\/\/www.crimsondesigns.com\/blog\/responsive-web-design-along-the-maine-seacoast\/","title":{"rendered":"Responsive Web Design along the Maine Seacoast"},"content":{"rendered":"

In 2013 people are starting to talk about mobile friendly web design. Business owners are wondering if their websites are mobile friendly. They want their visitors to have a great experience on their website regardless of whether they are using a cell phone, an iPad<\/strong> or a computer.<\/p>\n

\"mobile<\/a><\/p>\n

“Is my website mobile friendly?” “Can you make my website a mobile one?” They ask.<\/p>\n

Unfortunately, in 2013, most business websites have been designed with only a desktop or laptop computer in mind. When you view a typical business website in the browser of a mobile device, it usually requires pinching, zooming and scrolling with your fingertips to see what’s on the page. And interacting with the website is often awkward and clumsy.<\/p>\n

What most business owners are really looking for is not a mobile design.<\/p>\n

What is a mobile design?<\/h3>\n

A mobile design<\/strong> is a web design that creates a mobile website usually in addition to the desktop\u00a0version. It is designed specifically for mobile devices. A business owner with a mobile design often has two websites to maintain.<\/p>\n

Most business owners are really looking for a mobile friendly responsive web design.<\/p>\n

What is a responsive design?<\/h3>\n

A responsive design<\/strong> approach\u00a0utilizes\u00a0one website across multiple devices\u00a0instead\u00a0of creating a\u00a0separate\u00a0mobile site. The website automatically orientates itself based on the screen size of the device it is being viewed on. For instance, a three-column website layout on an iPad might become a two-column layout when the iPad is rotated, and a one-column width when viewed on a smartphone screen. Images scale and columns\u00a0disappear.<\/p>\n

A responsive web design utilizes CSS3 Media Queries, Fluid Images,<\/a> Elastic Videos,<\/a> Flexible Layouts and\u00a0Responsive Navigation Features<\/a> that can be easily manipulated on a touch screen.<\/p>\n

You can often spot a Responsive Website by examining its Navigation Menu.<\/strong><\/p>\n

Navigation menus in responsive websites are designed to be user friendly. They must work for those who click or tap on their screens. Larger navigation elements with big bold buttons are becoming more popular, while multi-level dropdown hover menus<\/a> are losing their popularity. Touch devices are driving this trend because big bold buttons are most comfortable for users tapping on their mobile devices. If you see BIG ROUND BUTTONS, like in the example below, you are probably visiting a responsive website.<\/p>\n

\"Responsive<\/a><\/p>\n

Let’s explore some great responsive Maine websites.<\/h3>\n

\"responsive<\/a><\/p>\n

Lobster Shack in Perkins Cove<\/a>\u00a0in Ogunquit Maine
\nCast-Away Fishing Charters<\/a> in Kennebunkport, Maine<\/p>\n

Traveling along the Maine Seacoast with a Smartphone<\/h3>\n

First Stop: Lunch<\/h4>\n

\"Lobster<\/a>Let’s say that you’re driving along the coast of Ogunquit, Maine,<\/strong> smelling the salty air, and feeling some hunger pangs.\u00a0 You decide right then and there that you want a\u00a0 MAINE LOBSTER ROLL on a toasted bun with mayo. Luckily, you have your cell phone handy so you use it to access a search engine on the internet. You click on a link, finding your way to the Lobster Shack in Perkins Cove.<\/a><\/p>\n

The very first thing you’ll notice is how easy it is to navigate through the website. The phone number is displayed in big numbers at the top of the screen, the Navigation Menu can be tapped open or closed, the LOBSTER ROLL is easy to locate and the directions to the restaurant are right there too. You’ve just spent 5 minutes enjoying a great experience on a Maine website with a responsive design. And a half hour later, you’ve just finished your lunch.<\/p>\n

You continue to travel north, taking in all the wonderful scenery that Maine has to offer.<\/p>\n

Next Stop: Fishing<\/h4>\n

\"Fishing<\/a>Spur of the moment, you decide to go on a half-day chartered fishing trip. You grab your smartphone again. You’re in luck! Right up the road, you’ll find Cast-Away Fishing Charters<\/a> in Kennebunkport, Maine.<\/strong> They offer a 4-hour charter from noon to 4pm. You can fish the coastal Maine waters for Striped Bass, Bluefish and Mackerel. You also learn through the website that\u00a0Cast-Away Fishing Charters<\/strong> practices catch-and release fishing and encourages anglers to maintain a sustainable approach to sport fishing.<\/p>\n

But did you also notice that the website has one of those Responsive Navigation Bars that you can tap open or closed? Did you notice how easy it was to explore the website and go from page to page? You’ve just experienced another great Maine responsive web design.<\/p>\n

Last Stop: Place to Sleep<\/h4>\n

After spending hours on the ocean, you hop back into your car. You then make an impulsive decision to stay overnight at a Bed and Breakfast. You now realize that a Responsive Website is what you hope to find again.<\/p>\n

This time you reach\u00a0Whiting Bay Bed and Breakfast<\/a> way up north in Whiting, Maine.<\/strong><\/p>\n

Looking at the website, you can see how quaint and affordable the guest rooms are. You learn that you will be able to eat breakfast outside on the deck, where you may hear the call of a LOON from the bay. And free Wi-Fi<\/strong> is available.<\/p>\n

The Bed and Breakfast website’s navigation is a little different from the other 2 websites you visited on your trip. There is no “open” and “close” navigation button that you tap on. Instead, the 6 links on the navigation bar are flexible. On smaller screens, the 6 links can be seen in two or three rows, instead of stretching out to one long row, like they do on a big screen. They work beautifully for this website. Using your smartphone, you make your way quickly to the “Rooms”<\/strong> page where you decide on the “BLUE”<\/strong> room after seeing the price and photo.<\/p>\n

\"Bed\"Bed
\nThe next morning, you wake to the sound of LOONS on the bay and enjoy a wonderful breakfast. You feel refreshed and ready to get back to work. You decide to check your own business website<\/strong> with your smartphone. And that’s when you realize that your website is not so mobile friendly. You’re frustrated because you have to pinch, zoom and scroll with your fingertips to see what’s on the page. And you are finding the experience awkward and clumsy.<\/p>\n

But now you know that you can’t blame your smartphone. You need to redesign your website.<\/p>\n

More Responsive Websites Spotted in Maine<\/h3>\n

I Love Bar Harbor <\/a>in Bar Harbor, Maine
\nPenobscot Marine Museum<\/a> in Searsport, Maine
\nAnimal Refuge League of Greater Portland<\/a> in Portland, Maine
\nThe Art of Michael Ranucci<\/a><\/p>\n

\"Responsive<\/a><\/p>\n

You may also be interested in: Responsive Web Design Trickles into New Hampshire.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Unfortunately, in 2013, most business websites have been designed with only a desktop or laptop computer in mind. When you view a typical business website on the browser of mobile device, it usually requires pinching, zooming and scrolling with your fingertips to see what’s on the page. And interacting with the website is often awkward and clumsy. What most business owners are really looking for is not a mobile design. Most business owners are really looking for a mobile friendly responsive web design.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,9],"tags":[113,139,141,197],"class_list":{"0":"post-3494","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-small-business","7":"category-web-design","8":"tag-ipad","9":"tag-mobile-friendly-web-design","10":"tag-mobile-phone","11":"tag-smartphone","12":"cat-3-id","13":"cat-9-id"},"_links":{"self":[{"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/posts\/3494","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/comments?post=3494"}],"version-history":[{"count":1,"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/posts\/3494\/revisions"}],"predecessor-version":[{"id":7729,"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/posts\/3494\/revisions\/7729"}],"wp:attachment":[{"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/media?parent=3494"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/categories?post=3494"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.crimsondesigns.com\/blog\/wp-json\/wp\/v2\/tags?post=3494"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}