MedleyWeb.com

Mr.Frog Restaurant Free Website PSD Template

Justin He — Wed, 03 Oct 2012 13:44:32 +0000

This is a little fun website PSD for restaurants or bake shops called Mr. Frog. It comes with customised social buttons, sliders, sketches, etc., and a cute Mr. Frog logo. You can use this free template on personal and commercial projects.

Preview

Download

*Please Do Not Distribute this PSD on you website. Links to this Post are appreciated. Please note that the cupcake picture is from Ribbon&Bows Cakes, which is not for commercial usage.

10 Great jQuery Notification Plugins to Increase User Experience

Justin He — Fri, 28 Sep 2012 12:32:13 +0000

Popup forms are relatively intrusive and people hate it. A little notification box to notify users a successful event or an error would be simply better. With the following powerful and dead easy to use jQuery notification plugins, this job is fairly easy to do by one or two lines of code. There are tons of customisations you could do to suit the real case. Either an alert, success, error, warning notification, or sticky, non-sticky, auto-close, etc, etc. You name it. They are definitely worth a try. You May Find Following Plugins Useful As Well:

1. Pines Notify

Pines Notify is a JavaScript notification plugin that is designed to provide an unparalleled level of flexibility, while still being very easy to implement and use. It has tons of customisations for you to choose and it's themeable through Bootstrap or jQuery UI.

2. Noty

Noty is a jQuery plugin that makes it easy to create alert, success, error, warning, information, confirmation messages as an alternative the standard alert dialog. Like Pine Notify, there are many options as well and the placement is very flexible.

3. jNotify

jNotify is a notification plugin to display animated (informations, errors, success) boxes in just one line of code.

4. Notify

Notify is a lightwieght notification plugin, and its easy to use. Its structure a little diffently then most plugins, its really more like a extension, to give you absolute control over the notifications.

5. Notify!

Notify! is a jQuery Notification Plugin which adds simple notifications bars that you can use on your website and application to assist users while they fill in forms, navigate through pages or interact with interface.

6. Sticky

Sticky allows you to send such messages with ease, and class. Quickly notify a user of software updates, process completions, or annoy them with registration reminders.

7. MiniJS Notification

MiniJS notification is a very simple yet useful plugin to just place a little note on top of the page.

8. jQuery Toast Message

jQuery Toast Message is a jQuery plugin which provides android-like notification messages. It's a quite nice way to report info or error to the user.

9. Gritter for jQuery

Gritter is a very nice growl-like notification plugin to use on website, which creates a beautiful notification box like the ones in Mac OS X.

10. jQuery Notification Plugin

jQuery notification plugin helps better and enrich message notification system for your web application. This plugin contains four types of notification systems such as Success, Error, Warning and Information with rich user interface.

Beautiful Websites that Embrace Responsiveness At Its Best

Jamie Cody — Wed, 26 Sep 2012 12:53:07 +0000

Responsive website design is selling like freshly baked breads in the web development industry, and it is not difficult to see why. One of the reasons behind the popularity of responsive web design is its compatibility to mobile devices through high speed Internet. The remote accessibility can be accounted for the 10% average increase in the conversion rates of various e-commerce websites. The spike in the number of WordPress themes tailored after this raging trend also contributed greatly to the buzz. Ultimately, responsive web design is currently meeting maximum demands for its voluminous advantages both to webmasters and users. Creators are spared from the arduous task of organizing too many elements in the web page for easy navigation. Through this specific structure, they also gain more flexibility in implementing designs. Users, on the other hand, benefit from the ease of finding contents. The integration of buttons and links that can lead them directly to relevant web pages facilitates a wiser use of time on the Internet. Here are some of the websites that managed to embrace the responsive web design at its best.

Breaking News

Housing some of the hottest news, this website maximized the “responsiveness” and created a form of action. It wowed many critics for its modern and advanced way of displaying live and aggregating news takes from different sources. Breaking news’ web page comprises three main sections, two of which are earmarked for news consumption. The ‘Popular’ section is the basket for photographs and snippets of information. ‘Latest’ area, on the other hand, includes the most recent hot-of-the-grill reports. Conventional users may not take notice, but tech savvies are highly appreciative of the crisp and smooth motion in navigating. Thanks to the layout of the page that adapts well to the decreasing width.

Fork

Fork is a website built with a CMS platform, and is a known epitome on how a responsive design can be showcased elegantly. Simple and chic, the slogan in the homepage is stationary in the layout of every web page. The way at which the icons are utilized to display extensions is remarkable. As the screen scales down, the number of icons is reduced. Nonetheless, there is an option to view “more extensions.” This works well for mobile devices, and to companies who strive to convert the design principles applied for bigger screens on default browsers to make their page friendlier to smart phones.

Hiut Denim

Web developers from this company apparently put loads of efforts in taking advantage of responsive web design in a method that is not seen elsewhere. The website is laden with sharp photography that concur with the theme and overall appeal of the website. The high-resolution pictures breathtakingly display the fabulous fashion pieces. And just when you think this is another high-end designer, webmasters left everyone at awe on how they laid out the elements to make the site compatible to smaller screens. The technique worked well in garnering online order placements from fashionistas on the run. Over the time period that this design was implemented, the company gained a significant spike in the number of their sales. Jamie Cody is a writer of various topics in web technology. He also writes reviews on hosting companies like GoDaddy, BlueHost and FatCow. Feel free to check out Centernetworks.com reviews before purchasing any hosting for your site.

20 Examples of Timeline in Web Design

Justin He — Fri, 21 Sep 2012 12:04:48 +0000

Timeline style is being adopted in many ways these days because its clearness in displaying chronological events and great looking at the same time. We've seen Facebook page or apps like Path that utilise timelines. The impact on business of doing this timeline thing is probably still in doubt. But clearly it can be used in events page or at lease a company story, etc. We've come across a couple of timeline based web pages and some nice dribbble shots recently, so it's time to post a web design showcase article today. And don't forget to check out these ones:

Mixpanel

DesignWeekPortland

GetFelix

DanielMall

Rodania

RailRoadRevival

TL by Anh Vu Hoang

TL by Felipe Luize

TL by Wouter

TL by Hendra Gunawan

TL by Joshua Hynes

TL by Matthew Martin

TL by Daniela Alves

TL by James

TL by Evan Stremke

TL by Victor Erixon

TL by Tyler Thompson

TL by Jeremy Sallée

TL by Lukas Majzlan

TL by Jesse Dodds

Have you seen any other great examples of timeline design? Share with us in the comments!

All Things Sticky: 15 Useful Tutorials and Plugins

Justin He — Wed, 19 Sep 2012 11:51:03 +0000

Sticky is to describe something on a website is in fixed position while scrolling within certain range. Intuitive but not intrusive sticky content could improve impressions on important content or make it easy to navigate. We all know there is a simple "fixed" positioned element in CSS. But in reality, for example, the sidebar will overlap elements such as footer or content. So in today's article, you'll find 20 useful tutorials and plugins for sticky header, footer, sidebar, side widget, section header, etc. Layout of a website can be tricky. If you are interested in making websites responsive or parallax, don't forget to check out our previous articles about responsive web design and parallax scrolling.

1. Sticky.js

Live Demo More Info

2. StickyMojo Sticky Sidebar Plugin

Live Demo More Info

3. jQuery-Stick'em

Live Demo More Info

4. jSticky

Live Demo More Info

5. jQuery Sticky Header 1

Live Demo More Info

6. jQuery Sticky Header 2

Live Demo More Info

7. How To Create A Fixed (Sticky) Header

Live Demo More Info

8. Persistent Headers: Section Header Sticky

Live Demo More Info

9. Sticky Sidebar jQuery plugin

Live Demo More Info

10. jQuery stickySectionHeaders

Live Demo More Info

11. Create a Sticky Navigation Header Using jQuery Waypoints

Live Demo More Info

12. Create a Sticky Footer in WordPress

Live Demo More Info

13. Wordpress Widgetized Stickybar (Premium Plugin)

Live Demo More Info

14. Sticky Side Panel WordPress Plugin (Premium Plugin)

Live Demo More Info

15. Sticky Footer (Premium Plugin)

Live Demo More Info

12 Practical jQuery Accordion Menus and Sliders

Justin He — Thu, 13 Sep 2012 13:37:31 +0000

Lengthy and unordered content would pose a bad impression to visitors. jQuery Accordion menus or sliders make it possible to hide unnecessary sections while focusing on the most important one when it's active. It also displays all the available content rather than one slide by one slide. Purely from interactive point of view, accordion seems to be more functional. But personally I prefer the sleek looking of the original sliders. As for the accordion menus, they are best for some blog post or web page that, say, is too long to scroll. Or category section you want to save space. Anyway, normally we have vertical accordion menu or horizontal content slider but it doesn't has to be this way though. In today's article, we selected a few accordion plugins (some available for Wordpress already) to recommend for you.

MedleyWeb.com

Mr.Frog Restaurant Free Website PSD Template

Preview

10 Great jQuery Notification Plugins to Increase User Experience

1. Pines Notify

2. Noty

3. jNotify

4. Notify

5. Notify!

6. Sticky

7. MiniJS Notification

8. jQuery Toast Message

9. Gritter for jQuery

10. jQuery Notification Plugin

Beautiful Websites that Embrace Responsiveness At Its Best

20 Examples of Timeline in Web Design

TL by Anh Vu Hoang

TL by Felipe Luize

TL by Wouter

TL by Hendra Gunawan

TL by Joshua Hynes

TL by Matthew Martin

TL by Daniela Alves

TL by James

TL by Evan Stremke

TL by Victor Erixon

TL by Tyler Thompson

TL by Jeremy Sallée

TL by Lukas Majzlan

TL by Jesse Dodds

All Things Sticky: 15 Useful Tutorials and Plugins

1. Sticky.js

2. StickyMojo Sticky Sidebar Plugin

3. jQuery-Stick'em

4. jSticky

5. jQuery Sticky Header 1

6. jQuery Sticky Header 2

7. How To Create A Fixed (Sticky) Header

8. Persistent Headers: Section Header Sticky

9. Sticky Sidebar jQuery plugin

10. jQuery stickySectionHeaders

11. Create a Sticky Navigation Header Using jQuery Waypoints

12. Create a Sticky Footer in WordPress

13. Wordpress Widgetized Stickybar (Premium Plugin)

14. Sticky Side Panel WordPress Plugin (Premium Plugin)

15. Sticky Footer (Premium Plugin)

12 Practical jQuery Accordion Menus and Sliders

1. Slidorion (Demo)

2. liteAccordion (Demo)

3. Accordion With CSS3 (Demo)

4. Akordeon (Demo)

5. zAccordion (Demo)

6. Flexible Slide-To-Top Accordion (Demo)

7. Vertical Sliding Accordion With jQuery (Demo)

8. jQuery Accordion Menu (Demo)

9. Evo Slider (Demo)

10. jQuery Accordion Menu Widget for Wordpress (Demo)

11. WP UI - Tabs, Accordions, Sliders for Wordpress (Demo)

12. jQuery Accordion Slideshow for Wordpress (Demo)