Creative LEON

Latest Post

Showing posts with label Web-Design. Show all posts

Wednesday 6 July 2016

There might be numerous SEO tools out there and though nobody disputes their role, one of the easiest and most accessible ways to optimize your WordPress site is with the help of WordPress SEO plugins. Fortunately, there are quite a lot of WordPress SEO plugins for you to choose from. While you can't say there is a WordPress plugin for every type of SEO tool you can think of, there are some SEO plugins for WordPress you really must try (if you haven't already done it). Here is a list of the most important ones.

WordPress SEO by Yoast - WordPress SEO by Yoast is rightfully considered one of the top SEO plugins for WordPress. It's a complete suite that covers almost any aspect of SEO. With WordPress SEO by Yoast you can analyze onpage and offpage factors, create XML sitemaps, optimize meta and link elements, as well as RSS and breadcrumbs, edit .htaccess and robots.txt file, enjoy integration with social media, use it on multiple sites and many more. In a sense, if you get this plugin, you might not need anything else.

All in One SEO Pack

All in One SEO Pack is another really popular and comprehensive SEO suite for WordPress. Similarly to WordPress SEO by Yoast, you can use this one to handle all your SEO tasks. All in One SEO Pack offers XML sitemaps, optimization of titles and metatags, advanced canonical URLs, and what not. One of its uniques features is the ability to eliminate duplicate content issues. Additionally, it's a plugin you can use on e-commerce sites.

Google XML Maps

If you are not looking for a complete SEO suite, such as WordPress SEO by Yoast or All in One SEO Pack that among their numerous features come with XML sitemap generation functionality but would like a simple plugin especially for this, then Google XML Maps is your best choice. This plugin doesn't come with bells and whistles and it doesn't offer tons of functionality but it is really fast and reliable for XML sitemap generation, even if your site is pretty large and there are thousands of pages.

HTML Sitemap for WordPress

Here is another plugin (or more precisely a template) from Yoast de Valk HTML Sitemap for WordPress. While XML sitemaps are no doubt useful for search engines, an HTML sitemap is definitely more useful for your human visitors. HTML sitemap generation is not part of the WordPress SEO by Yoast it's provided separately. The template in the link is special because it gives you a lot of flexibility when you decide what to include in your HTML sitemap and what to skip.

SEO Friendly Images
We all know how important it is to optimize images and how much time this could take. This is why it really makes a difference when you have a reliable ally on your site. With the SEO Friendly Images plugin for WordPress, it gets so much easier to optimize your images. This plugin automatically adds alt and title attributes to all your images. Of course, if you are not pleased with its suggestions, you can always modify the automatically added alt and title attributes to something you like more.

Share This

You might have mind-blowing content but if it doesn't get traffic, then it's useless. Out of the many ways to drive traffic to your site, social sites are among the best. With the Share This plugin for WordPress, content sharing is much easier. The plugin not only allows you and your readers to share your content on sites such as Facebook, Twitter, and 120 others but it also comes with analytics features, too.

Broken Link Checker

There is hardly a SEO expert who doesn't know how bad broken links are. Checking broken links one by one is not physically possible, even for a small site. While there are numerous free and paid tools that check for broken links, if you don't want to leave WordPress, you can get the Broken Link Checker plugin and monitor the health of your links with it. When a broken link is found, you are notified about this.

SEO Links Checker

While the previous plugin is great with broken links detection, if you want more power in dealing with your links, then you need SEO Links Checker. The purpose of this plugin is to automatically create links (i.e. affiliate links) and make them nofollow, if you like. If you are running a big site with a lot of affiliate links tied to a particular keyword, this plugin is a valuable assistant. Just remember to use links wisely i.e. don't stuff your posts with links simply because it's so easy to do.

SEO Plugin By Squirrly

The last plugin on this list SEO Plugin by Squirrly is again a full SEO suite but the difference is that it's for NON-SEO experts. This said, the plugin is by no means inferior to the rest, it simply doesn't offer that may opportunities to mess directly with code. SEO by Squirrly deals with all aspects of SEO customization from content marketing, to keyword research, to SEO analytics, to onpage optimization.

Why should you learn SEO?

Statistics reveal that 40% of customer enquiries to any business comes through Google & other search engines. If a customer wants a service or a product, he/she immediately looks for it in the web, & the top ranking websites get their attention, which converts into sales later. Most companies have realized the huge potential of SEO, the process by which a website is brought to the top, & hence the demand for professionals with good SEO skills is on the rise. So, if you are looking for an exciting career with exceptional growth, SEO can be it.

SEO Master course @ Web D School

Our SEO training program has been designed in such a holistic manner that it makes those students taking the course a thorough professional by the end of it. The SEO course explains how to use the perfect keywords, blog posts, social media, videos, image optimization techniques etc on the website pages, apart from teaching other off page SEO strategies.

We allow the students to learn the art of SEO through some real time projects, where they are guided through the entire process gradually by our expert trainer. These are the steps that we take our students through, as the course proceeds –

Research
Reporting & Goal Setting
Content Building
Page Optimization
Social & Link Building
Follow-up Reporting & Analysis

Tuesday 5 July 2016

Websites are the calling cards of every online venture that you should be proud of! It should provide relevant information along with pleasant viewing to all its users, achieved through quality web development and designing services. With advancements in the field of internet marketing and web technologies, now the market is over-flooded with avowedly best web design company. Therefore, selection of a good web designing company has become a tricky task. However, there are many determinants based on which a probable decision is reasonable as well as worth the value of your hard earned money. if you want to reach to any worthy decision, consider these following points before finally venturing out on any web design company:-

• Experience- this factor plays a very important factor while looking for the best web design company. A web design company with years of experience is undoubtedly competent in understanding customer needs and requirements, rendering relevant solutions. Experience helps in honing expertise that directly impacts productivity. A web design company rendering services like Application development, SEO, brand building, etc for years should be kept on top of the list.

• Service portfolio- always make sure to check a web design company’s service portfolio. Go through the range of service packages provided by the company along with their expertise level in every domain of web designing. The richer the service portfolio of the company, the better the chances of receiving multifarious web design solutions under a single roof.

• Methods of working- checking on the workflow as well as the work procedures followed by an apparently best web design company will save you from the unnecessary worries and troubles. Those companies following unorganized and complicated workflow will demand your presence, delaying web designing and development projects unnecessarily. Talk about their working methods and go with systematic and simplified one. This will save your time and money, ensuring timely submission of assigned projects.

• Reputation- gauging out the reputation of a web design company is probably one of the trickiest tasks. Get ready to do a thorough research on the selected companies to know more about their company profile along with their market reputation to reach to a decision. Go through the company website, check their clientele and accomplishments and don’t miss out on their client’s feedback. Or simply search over the internet to find information about the company through online forums, communities and groups. Never trust a web design company without checking its credibility.

• Cost effectiveness- this is another important factor that goes into selecting the best web development company. It is vital to measure the cost effectiveness of the company’s web design solutions. Check whether your investment is worthy or not and for that you can even ask for quotes. Compare your needs with the company quote to get cost effective web design solutions at competitive rates.

The above mentioned points surely would help you to find the best web design company. But you should also invest your foresightedness to determine the suitability of a web design and development company that will build your dream website.

Wednesday 8 June 2016

Thursday 18 February 2016

Your landing page design is key to your site's success. Here's how to get it right.

There are plenty of rules and principles of great design but when it comes to a website's landing page, it is almost an exact science. It's about 'conversion-centred design', or using the design of the landing page to persuade a user towards a particular action.

The first, and arguably most important, task is to find a clear USP (unique selling point) for the product or service in question, and then use the landing page design to focus everything on one primary call to action (CTA). This might be getting the visitor to register their details, say, or make a purchase there and then. Whatever the goal, it's up to the design of the page to channel the user towards it – whether through use of white space, contrasting colours or more explicit directional cues.

Clear, succinct headers and sub-headers and punchy, easily scanned bullet points are the order of the day. The landing page should be prominently branded, often incorporate a 'hero' image to communicate the product or service at a glance, and cut straight to the point to avoid users' attention drifting. With all of that in mind, we've pulled together eight particularly effective examples of landing page design from across the web to show how this theory has been applied in practice.

01. Monotype

Like the company itself, Monotype's landing page is about the power of typography

"We are the company behind type," states Monotype's landing page, and its understated yet smart design goes hand-in-hand with this confident statement. Suitably for a company that works in type, its' main landing page is entirely text-based, but with a clever twist; through a dialogue at the bottom of the page you can change the view the mission statement in an assortment of fonts (and in various weights and styles) to get a taste of what Monotype does.

It's all gloriously restrained, encouraging you to click on the text links that take you to four more detailed landing pages – Fonts, Technology, Expertise and Company – providing much more depth regarding Monotype's business and services, and of course getting you to the all-important fonts.

02. LS Productions

LS Productions lures you in with cavalcade of gorgeous Scottish locations

LS Productions – a stills and motion service production company based in Scotland – knows what its biggest asset is, and that's what you're presented with when you go to its site. A window-filling looping video showcases a selection of the beautiful Scottish locations that it can offer for your film or print project. Scroll down and you'll learn of its three main services: motion, stills and locations.

By this point the landing page has already done its job; everything below – the gorgeous location of the week, the 'meet the team' section – is just window dressing. If you're looking to hire LS Productions then you'll have already moved on to one of the main service pages, where you'll find a wealth of relevant, well-presented information convincing you of the company's suitability.

03. O'Neill

O'Neill's photo-heavy page sells the surf and snow dream perfectly

American lifestyle brand O'Neill is largely focused on two things, surf and snow, and its US site makes that perfectly clear with an image-led landing page that sells you its clothing ranges and sports gear through stunning photography of big waves and snow-covered mountains.

A set of drop-down links at the top of the landing page can take you straight to what you want if you know what you're after, but beneath that the landing page sets out to seduce you, first with a hero carousel and then a secondary carousel showcasing recommended products, then follows with a responsive two-column image gallery selling its various departments. With an Instagram gallery at the bottom, it's all quite enough to get you dashing to the beach – or the top of the nearest mountain – but not before stocking up on O'Neill gear first, and if you're in a rush you'll find a handy dealer locator at the bottom of the page.

04. Bear CSS

You can't miss the call to action on the Bear CSS landing page

Bear CSS is a tool to help web designers generate CSS more quickly and easily based on their existing HTML. This simple layout follows all the key rules of landing page design: a clear, simple strap ("helping you build a solid stylesheet foundation based on your markup") and simple, no-nonsense information.

The primary call to action, 'upload HTML', is an unmissably large orange button on a pale grey background, underneath three punchy bullets explaining the process. And just in case you miss it, Bear CSS's mascot is pointing his paw directly at it from the other side of the screen.

05. Squarespace

Squarespace knows its main customers and has built its landing page accordingly

Immensely popular with creatives, Squarespace provides high quality website templates on a subscription basis. Acknowledging that users will respond to different touchpoints, its website presents several landing pages showcasing different aspects of a Squarespace site (including landing pages), as well as pages targeted at photographers, bloggers, artists, musicians, restaurants and weddings.

Each features a full-screen 'hero' image, a large header in the centre, and the call to action, 'Get started', placed directly underneath. Each landing page also includes a gallery of inspiring sites and a tour of the benefits of going with Squarespace. But all ultimately lead to the same place: pick one of the templates, and start a free trial.

06. GiftRocket

The eye-catching gold of GiftRocket's call to action draws instant attention

Another best practice example of how to use exploit a simple 'header plus bullet-points plus call-to-action' formula, GiftRocket's beautifully designed landing page features an illustrated 'hero' image, which is surrounded by icons of all the different products and services that are available for purchase.

But it's that single, prominent 'Send a GiftRocket' button, in eye-catching gold out of a pale beige background, that draws the attention as a single-purpose entry point, provided the bullet points convince you to do so, of course. If not, you can always scroll down the page for more information, testimonials and more.

07. Hipstamatic

Hipstamatic's landing page shows what the app has to offer

For retro analogue photography app Hipstamatic, it's all about demonstrating the cool features, as well as the look, feel and intuitive navigation of the app, in as engaging a fashion as possible to draw users in.

At the top of the page, a scrolling gallery strip showcases the 'Hipstamatic aesthetic' in practice, while an enormous iPhone showcases the latest version of the app, with its old-skool ClassicMode and new ProMode, with more up-to-date features.

Beneath that a new strapline sums up what Hipstamatic is now all about: "Make beautiful photography", with a big yellow button inviting you to install the app on your iPhone.

08. Square

No need for trinkets - now Square leads with its POS software

Square's landing page used to lure users in with a free card reader in return for signing up for its POS software; now it's confident enough in Square Register, its flagship package, that it doesn't feel the need to dangle trinkets in front of you. The result is a focused single landing page that gets straight to the point with the headline: "The POS software that’s simple, powerful, and free.”

Beneath the headline and hero image (plus a link to a video rather than distracting embedded media) the page is split into three no-nonsense sections: Overview, Features and Testimonials, all designed to steer you towards 'Download the app' link floating at the top of the screen. Should you manage to reach the bottom without clicking, you'll find an equally eye-catching Get Started link at the bottom; if you can resist that then you probably don't even need Square's products.

09. Apple

Landing page design - Apple — Apple's landing page centres around beautifully shot product photography

It's no surprise that the undisputed masters of industrial designcan knock together a decent website, and the effortless simplicity of Apple.com helped scoop it a D&AD Black Pencil in 2010.

Depending on the hot product(s) of the moment, the homepage slices through the company's extensive product range and zeroes in on just one. Besides the simple navigation bar across the top, it's just beautifully shot product photography, a line of clean type and two links: 'Learn more' goes deeper into features and functionality, while a video link showcases it in true Apple keynote style. It's a true masterclass in landing page design.

10. Pinterest

Pinterest is so well known, its landing page doesn't need to work hard to sell itself

Pinterest knows what it wants, and is in no mood to beat about the bush getting it: it's sign up, or nothing. The popular online scrapbook is confident enough in its brand and burgeoning reputation not to worry too hard about selling itself, or giving users an opportunity to browse around some pinboards and risk getting sidetracked.

Interestingly, there are different browser-specific straplines: Firefox tells of "a few (million) of your favorite things", Chrome has the more perfunctory line "plan projects, start collections and more", while Safari implores you to "collect and organize the things you love". But the only place to click on any of them is that all-important 'sign up' button.

This is an updated version of an article that previously appeared on Creative Bloq. Let us know what we should add in a future update in the comments below!

Source Link : creativebloq.com

Thursday 4 February 2016

Clicking on a broken link is a pain, but a witty and well-designed error page at least sweetens the pill. Here are some designs to inspire you.

If you're working on how to start a blog or website, don't forget the all-important 404 page – a standard response code in HTTP telling the user, in effect, that they've clicked on a broken link.

It's traditionally been an immense source of frustration, but in recent years, creatives have taken up the challenge of designing bespoke 404 pages that at least sweeten the pill of finding you're in the wrong place.

01. Bluegg

This noisy chap provides a hilarious notification that you're in the wrong place

The 404 page of creative and digital design agency is simple, but so effective. Upon loading, you're greeted by a goat, who lets out the most almighty high-pitched scream, alerting you that the page doesn't exist. The inner child in us emerged and we must admit to playing this repeatedly, while crying a little with laughter. Bravo, guys.

02. Hot Dot Production

Hot Dog's 404 page is seriously addictive

Hot Dot Productions has applied it's 'where design meets technology' tagline to its impressive 404 page, which features the three numbers made up of hundreds of tiny dots that change direction in response to mouse movements. Seriously cool.

03. Airbnb

If you drop ice cream on the floor, clean it up, right?

This 404 page from couch-surfing behemoth Airbnb features a delightful animation that holds lessons for us all about ice cream and the inadvisability of dropping your ice cream. It also brings to mind press stories about people who rented out their homes on Airbnb, only to come back to a disaster area. Look, if you drop ice cream on the floor, clean it up, right?

04. Lego

Lego can do no wrong in our eyes – we love this cute little tableau for its website's 404 page

In general, Lego can do no wrong in our eyes, and we love this cute little tableau for its website's 404 page, which proves that you don't need a lot of technical-sounding text to get your error message across.

05. Magnt

Magnt's clever 404 page demonstrates both a keen sense of wit, and a clear call to action

Magnt enables you to create a business card themed web page in minutes. Its clever 404 page demonstrates both a keen sense of wit, and a clear call to action to take you where you need to be.

06. GitHub

Coding website GitHub is the home of geeks, and what better way to appeal to geeks than a simple Star Wars parody with parallax effect when you move your mouse? GitHub also has a nice 500 page for when the server breaks.

07. Blue Fountain Media

Wanna play doubles, mate?

It's hard to get over the inevitable disappointment of coming up against a 404 page, but Blue Fountain Media has something that might just cheer you up in the form of a game of Pac-Man played out in a 404-shaped maze. We'll be honest, the 404 shape doesn't work that well (although it's no worse than Google's Pac-Man doodle), but it didn't stop us from giving this a thorough researching.

08. CSS Ninjas

Another example of the web design world's love of ninjas, this 404 page features a nice simple illustration that reflects the site's general approach to design.

09. Daniel Karcher Film Design Studios

This site makes excellent use of animation including sound, and its 404 page employs a beautifully rendered subway station complete with empty train that rolls in. As with many of the examples here, the page diverges from the overall site aesthetic to great effect.

10. MailChimp

Don't make the monkey angry...

The designers at ultra-hip email newsletter service MailChimp have morphed the company's well-known monkey into a Hulk-type character, complete with animated smoke, to signify a broken link. The style of the 404 page fits the rest of the site design nicely, reflecting the same lighthearted approach that makes an otherwise boring task into something fun and endearing.

11. Hakim El Hattab

A 404 page designed for .net magazine, this time by Hakin El Hattab, this HTML5 experiment features creepy eyes that follow your cursor around the page with occasional blinking and narrowing of the iris. Brilliantly executed and nicely interactive.

12. Tin Sanity

Tin Sanity features an incredible animation, involving a dancing cup and straw, that screams its way across the page around the text: "You just got 404'd". The screaming is accentuated with a drumroll and funky bass soundtrack, all of which leaves an excellent impression (although the website itself is currently empty).

13. Audiko

The free ringtone-making service's 404 page features a beautifully rendered illustration of London, including the obligatory red bus and telephone box, as well as Big Ben's Tower, Sherlock Holmes and a hint of Tower Bridge. The site's worth a visit just for the artwork!

14. Bret Victor

Bret Victor's 404 page, inspired of course by René Magritte's iconic painting, 'The Treachery of Images', confronts the viewer with some challenging philosophical questions. If this is not a page, then what is it? What constitutes a 'page'? Is it a thing that can be truly said to exist? What is the 'this' that this apparent non-page is referring to? Is anything truly real? Makes you think, no?

15. Home Star Runner

Audio can be very effective when combined with visuals on a web page, especially as we're still in the early days of reliable audio-in-a-page. This error page for Home Star Runner, which features amusing characters, downloads, and games, shouts "404'd" at you when you first arrive on the page. And the hand-drawn illustration fits the rest of the site well in terms of style and theme.

16. Duoh!

Duoh is the collaborative partnership between illustrator Veerle Pieters and partner Geert Leyseele. Their business is based on strong design principles, and so you'd expect a well-realised 404 page and they don't disappoint. In characteristic bright colours and negative space, this page looks and feels in keeping with the rest of the site.

17. Bit.ly

Link shortening service Bit.ly needs a special URL for its 404 page as bit.ly.com/404 has already been used as a shortened link! The page itself features a cute little creature bobbing up and down in an interactive sea that responds to your mouse movements.

18. ApartmentHomeLiving

This letting agent website's 404 page features a strange interior shot with a fading sheep sitting on the lavatory. Creative and wacky at the same time, it's a great (if abstract) example of how to do it well.

19. DropBox

Drop Box has a very simple but effective 404 page featuring an Escher-esque impossible box. You can take this at face value, or see it as signifying the inside-out nature of having navigated to a non-existent page. A nice simple hand-drawn illustration that gets the message across well.

20. Wufoo

Wufoo's 404 page is a simple static affair that uses the branding effectively to convey the message

Form building tool Wufoo's 404 page is a simple static affair that uses the branding effectively to convey the message. A good example of a clean approach to handling errors.

21. Mike Kus

Leading designer and illustrator Mike Kus's 404 page uses the classic Space Invaders as a motif for his 404 page. He has previously adopted similarly retro TV static for the error page with an animated GIF set as the background graphic.

22. eHarmony

The last thing you want to find when you're looking for love is that it can't be found, but eHarmony's 404 page softens the blow with this adorable image and a suggestion that you sign up for its dating service. Or maybe it's suggesting that you should just get plastered? That works for us too.

23. Dailymotion Cloud

This interactive 404 page make a nice play on the name of the site with animated rain and clouds. The effect is simple yet effective, and is one of the better examples of a sign being used as a visual metaphor.

24. Walk with You

This simple illustrative design for a site promoting life coaching uses existing assets from the overall site design, including the waterfall, to convey the 404 message. Bold typography makes this page work well.

25. LimpFish

One of the best examples of a newspaper metaphor, Dave Barton's personal site manages to inject a little humour into its error message.

26. Starbucks

Starbucks, like Heinz, makes good use of its primary product to illustrate the 404 message. In this instance the tell-tales signs of a missing coffee cup are used to tell the story.

27. Huwshimi

Some of the nicest 404 pages aren't interactive at all; they simply feature beautiful illustration that acts as a nice surprise when you've arrived at a dead link. This example from Sydney based interface designer Huwshimi features a simple yet effective sketch that tells a story while conveying the 404 message.

Creative LEON

Labels

ADS

Latest Post

Wednesday 6 July 2016

The Best SEO Plugins For WordPress

Tuesday 5 July 2016

Things to Consider When Looking For the Best Web Design Company

Wednesday 8 June 2016

Flipkart Website Layout JPG

Thursday 18 February 2016

10 great landing page designs

01. Monotype

02. LS Productions

03. O'Neill

04. Bear CSS

05. Squarespace

06. GiftRocket

07. Hipstamatic

08. Square

09. Apple

10. Pinterest

Thursday 4 February 2016

30 brilliantly designed 404 error pages

01. Bluegg

02. Hot Dot Production

03. Airbnb

04. Lego

05. Magnt

06. GitHub

07. Blue Fountain Media

08. CSS Ninjas

09. Daniel Karcher Film Design Studios

10. MailChimp

11. Hakim El Hattab

12. Tin Sanity

13. Audiko

14. Bret Victor

15. Home Star Runner

16. Duoh!

17. Bit.ly

18. ApartmentHomeLiving

19. DropBox

20. Wufoo

21. Mike Kus

22. eHarmony

23. Dailymotion Cloud

24. Walk with You

25. LimpFish

26. Starbucks

27. Huwshimi

source link : creativebloq.com

Play Free Online Games

Popular Posts

Labels

Popular Posts

Labels