Sneak Preview of a PARALLAX template

In this section you can share templates you've created with other users of WYSIWYG Web Builder.
User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Sneak Preview of a PARALLAX template

Post by Adendum » Wed Feb 19, 2014 7:11 pm

Rather than hijack rivieremagog's thread (see : viewtopic.php?f=19&t=60560 ) I thought it best to start this one.

Here is a sneak preview.

Still very much a work in progress and a great deal to do and to test, so it's early days.

Feel free to test in a variety of browsers and devices and let me know. For the record - it wont work on an iPad and maybe not on smartphones. I have yet to find any parallax sites that do....maybe someone else knows better?

And just to be clear - this will be a paid template not a free one. But at £10 I think it's worth every penny!!
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

User avatar
zinc
 
 
Posts: 1566
Joined: Sat Dec 08, 2007 3:06 pm
Location: London, United Kingdom

Re: Sneak Preview of a PARALLAX template

Post by zinc » Wed Feb 19, 2014 7:44 pm

Paul
This is by far one of the coolest things that I have seen on this forum, a breath of fresh air in terms of design and as I said to you before, this is taking WWB to another level. Well done! Def worth that £10.00!!!!
Z

User avatar
ColinM
 
 
Posts: 1060
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia
Contact:

Re: Sneak Preview of a PARALLAX template

Post by ColinM » Wed Feb 19, 2014 9:50 pm

Excuse my ignorance Paul - what is parrallax?
Yours truly
Colin M
Western Australia
FORUM MODERATOR
Please think before you post, be polite, don't hijack threads and above all please respect Pablo's huge effort!
My Website

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Wed Feb 19, 2014 10:03 pm

Take a look at the 'sneak preview' link and you'll see!
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

googledat
 
 
Posts: 43
Joined: Sun Sep 18, 2011 11:40 pm
Location: Arizona
Contact:

Re: Sneak Preview of a PARALLAX template

Post by googledat » Thu Feb 20, 2014 2:02 am

Paul,

How about load time? Parallax is cool but with Google's recent algorithm updates they've made it clear that pages/sites that load quickly are favored over ones that load slowly. I'm speaking strictly about SEO. I do agree that what you are working on is cool.

Thanks,
Steve

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Thu Feb 20, 2014 11:15 am

Page load speed will depend entirely on how the end user applies images to the parallax page. If they dump loads of large unoptimised images on the page the load speed will suffer. However if the think about it first and optimse their images speeds will improve.

The template allows 4 x foreground images, 5 x mid-ground images and 4 x background images but that doesn't mean they have to use all 13 images. In fact most times I foresee that the mid-ground and background images are likely to be repeats of one or two images.

So you are right to mention it but the same is true of any page built with WWB.
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Thu Feb 20, 2014 9:53 pm

I am close to completing this template and have just uploaded a new demo (but not the final demo).

It now validates pretty well, for an HTML5 page and even the CSS is clean even though there's some CSS3 in there.
I've added an an animated pre-loader, just in case someone stuffs some big images in their site.
Navigation now optional and offers skins in 16 colours and 2 styles (circles and squares).
Navigational Labels and Next/Prev buttons in 16 colours.

One thing I do need to investigate is how to handle a potential SERP issue. Maybe someone can offer a suggestion? The issue is that the template is a one page site but is made up of 5 other pages that are embedded in the index page. This is necessary to make it easy for the user to create their content.

So once published and the site gets crawled it will find 6 pages in total. If Google reports back on a search and offers up one of the pages (that is embedded) and that page is clicked, the visitor will get a page with no navigation to the rest of the site. So I am looking for a method that ensures if one of the 5 pages is accessed (by any method) that the browser takes them to index.html. Ideas?
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

User avatar
Pascal-Gilles
 
 
Posts: 123
Joined: Tue Apr 05, 2011 8:06 pm
Location: France
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Pascal-Gilles » Fri Feb 21, 2014 6:56 am

Hi,

Nice (very nice!) one Paul.

An idea (at first sight) would be to add this code to each of the 5 sub-page:

Code: Select all

<script>
window.location.href ='./index.html';
</script>
Cheers!

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Fri Feb 21, 2014 12:33 pm

Pascal,

the window.location.href sounds like a solution - will test that and report back!! :)
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

User avatar
Pascal-Gilles
 
 
Posts: 123
Joined: Tue Apr 05, 2011 8:06 pm
Location: France
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Pascal-Gilles » Fri Feb 21, 2014 12:47 pm

OK!

By the way, the safest way would be a redirection in the htacces file (see viewtopic.php?f=28&t=60630), so that Google can't see any (false) duplicate.

Cheers!
8)

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Fri Feb 21, 2014 12:52 pm

Pascal,

True but I can't risk using that route when I release this as a template. Imagine the havoc I could create from the less experienced users out there!

When I am back on the PC I am going to try using anchors, so I'll add anchors to the html that the template generates and then use window.location.href='index.html#section-1'. So that should help :)
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

haakoo
 
 
Posts: 319
Joined: Fri Apr 25, 2008 8:02 am
Location: Groningen/NL

Re: Sneak Preview of a PARALLAX template

Post by haakoo » Fri Feb 21, 2014 1:56 pm

You could always add a hash or search at the end of that script to point to the right section.

Hans

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Fri Feb 21, 2014 2:14 pm

Nope - that kinda killed the page!

Each of the 5 pages that are called in are called in using the object statement e.g.:-

Code: Select all

<object width="1000" height="550" data="./section-2.html" type="text/html"></object>
And when I add the location script each of the calls to the 5 pages tries to load the index page as well. So the page dies.

Shame....I have a way to deal with this but it's ugly, so if anyone can suggest an automated method I'd appreciate it...but remember the solution can only be invoked if/when the page is clicked or opened manually. So if someone opens the page ./section-2.html they actually get to index.html.

:(
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

haakoo
 
 
Posts: 319
Joined: Fri Apr 25, 2008 8:02 am
Location: Groningen/NL

Re: Sneak Preview of a PARALLAX template

Post by haakoo » Fri Feb 21, 2014 2:22 pm

Maybe jQuery works instead of object use a #div

Code: Select all

$(document).ready( function() {
    $("#wb_Shape1").on("click", function() {
        $("#wb_content").load("page1.html");
    });
 $("#wb_Shape2").on("click", function() {
        $("#wb_content").load("content.html");

    });
});

User avatar
Adendum
 
 
Posts: 933
Joined: Fri Apr 22, 2011 4:50 pm
Location: London, UK
Contact:

Re: Sneak Preview of a PARALLAX template

Post by Adendum » Fri Feb 21, 2014 2:22 pm

I think the answer is a two fold approach - as I said, ugly, but I think effective...

1. Add a link in the called in pages that is not seen in the index page.

2. Add a canonical link to the index page, so search engines treat each called in page as duplicates and refer all links back to index.html.

Or can someone think of something neater/safer/better?
Aditerum - No longer supporting WWB extensions - refer to CJS.
Aditerum - No longer supporting WWB templates - refer to CJS.


WWB 9.4; Ext Builder 4.2; Windows 10 64bit; Intel Core i7-3770 Processor 3.40Ghz; 16.0Gb RAM
Death to Internet Explorer!

Post Reply

Who is online

Users browsing this forum: No registered users and 3 guests