This post is here for discussing WordPress theme development, what would you like to see added to the Stallion Responsive theme?
Continue Reading Performance WordPress Theme Development
Stallion Responsive
The best responsive WordPress SEO theme, guaranteed!
WordPress SEO Theme Development
» This post is here for discussing WordPress theme development, what would you like to see...
PageSpeed Insights Tool
» Since the release of the free Google PageSpeed Insights Tool I’ve spent a LOT of...- Nofollow Deletes Link Benefit!
- Increase Your Blog Comments
- WordPress Remove Actions
- Phentermine Comment Spam
- WordPress Theme Features
- All In One SEO Plugin Noindex SEO Damage
3 Column Talian WordPress Theme Layouts
I have some thoughts of changing the layout of the 3 column Talian theme wanting the right sidebar to be located 400-600 pixels down its current position while the central column takes this location (post-content / left post / post entry ).
Two reasons for doing this –
1. Giving the central column, where the content located, more space especially at the beginning of the post.
2. Putting one of the best performing context ad – 728×90 Adsense ad under the post title.
It makes the central column having variable lengths – Starting wider and then narrowing down the scroll.
I know this query is way beyond the scope of this template, but any initial direction from you is appreciated.
3 Column Talian WordPress Theme Layouts
Stallion Theme Staggered 3 Column WordPress Layout
When I first read the comment (via email) thought it was for the Stallion Theme which has a Talian colour scheme and the 3 column layout and answered the question for Stallion, Doh!
As you’ll read below it’s not easy for Stallion which has multiple column layouts (Talian has one layout) which gives many more starting points for customization. Not sure how you’d achieve what you want with Talian, but since I wrote the comment (in a text editor, keep an offline copy of everything I write) before realising it was for Talian I’ve included it below.
Stallion Theme Staggered 3 Column WordPress Layout
Think I understand your layout idea, that would be a difficult layout to code.
If you understand CSS really well I’d make a starting point with one of the left sidebar layouts (200 px for example) and using some interesting CSS coding have one of the two sidebars (both left and right sidebars exist in all layouts) float on the right over the main content X pixels from the top and add a ‘CSS square’ on the right within the main content so main content doesn’t go under the sidebar (think that’s possible).
So the right side of the screen would be main content and using CSS have a square that doesn’t load content and over that blank square float/position (using CSS) one of the sidebars.
I think I could code this, but would take me a few hours to get right, it’s a tricky one. Wouldn’t be possible to provide code examples to point you in the right direction, I’d have to research how to do some of the above (reasonably sure it’s possible :-)).
I would consider adding it to Stallion, but I think it would not work in all possible Stallion setups so would mean it would only work under some situations, can’t add a layout that won’t work with all settings.
Interesting idea for a layout.
If you just want the 728px wide AdSense ad there’s the ad area that’s below the header area.
Under Stallion AdSense Options
Movable Content Ad Unit – set to – Below Navigation links
This will put an ad between the top navigation links and main content.
David
Stallion Theme Staggered 3 Column WordPress Layout
Talian Theme Staggered 3 Column WordPress Layout
Hi David,
Just some words before –
I know how to put the 728 ad under the top navigation and main content area. That’s easy. It doesn’t perform like putting it under the post title – I have already checked it.
The key reason for my initiative, above what I said, is that the 328×280 or 300×250 under title have a real negative impact on the user experience – People leave the site earlier, while 728 doesn’t create such an impact.
I see it like that – 328 and 300 are good for the incomes but less good for the site’s long run success.
The new text style of 728, the horizontal texting, is what makes it so good for content based websites.
BTW: This type of a column, with variable lengths, can be seen in the online New York Times and some other online magazines – They employ the best designers and there’s a good reason they selected this layout for their main content column..
So, with your inputs above, I am going to put some time on it.
My CSS knowledge is limited as an autodidact but I’ve manage to work through/around many styling challenges till now.
[[3 years ago, when buying the Tallian, my English and my web knowledge was close to zero. I am improving :-) ]]
Cheers
Talian Theme Staggered 3 Column WordPress Layout
Talian 5 SEO Theme vs Stallion SEO Theme CSS Layouts
If you bought Talian three years ago you were automatically upgraded to Stallion when I was looking for feedback on Stallion 6.0: basically when Stallion 6 was in beta release gave all Talian 5 users Stallion for free. Info about this at Talian 5 Theme Support (Stallion 7.1.1 zip file download link on the right as well).
I won’t be taking the Talian 5 code as it currently is any further (will fix major bugs of course), I plan to use the Stallion 7 core code minus non-Talian colour schemes as the next Talian update because Stallion is so much better in all aspects (next Stallion update adding Google Panda Busting SEO features you won’t find anywhere else), but haven’t figured out how to do the Talian 5 to Talian 7 (using Stallion code) yet without a massive amount of work. Since you probably already have a Stallion ID would make sense to update to Stallion 7 which will give you dozens of new features that’s not part of Talian 5: Stallion includes the Talian 5 colour schemes and Talian layout.
It would be a LOT more CSS code changes to get Talian to do what you want than Stallion, Stallion includes 12 layout CSS files for the different layouts, one of the left sidebar layouts (there’s 3 of them) would be a much easier starting point than the Talian 5 css file. I personally wouldn’t attempt it with Talian 5.
Regarding the layout you propose I took a look at the New York Times and didn’t see it in action, example link?
If I’ve understood what you want it would be a cool layout and I’m thinking about trying to add it to Stallion even if it is a pain to get the code working with all Stallion features.
David
Talian 5 SEO Theme vs Stallion SEO Theme CSS Layouts
New WordPress Theme CSS SEO Layouts?
see:
Look at the two divs: articleInline runaroundLeft and shareTools where the div called articleBody wrapping these two.
I am still working on it.
Mobile Responsive WordPress Theme
Converting the Stallion theme to mobile responsive code, for those not familiar with what Mobile Responsive means it’s changing the layout on the fly to match the screen size.
Currently Stallion 7.* lacks responsive code, it’s best viewed in a device with 1000px and above screen sizes (Desktop). When viewed in smaller windows like a tablet or mobile phone you have to zoom in and scroll to the right to view everything. When Stallion goes responsive everything will fit in the screen no matter what the devices screen size (within reason).
What will happen is if you have a mobile phone with a screen size of 480px for example the header area of a Stallion driven site will reduce in size to 480px (the header images will be 480px in size: for the older Stallion header image it will crop (you’ll see the 480px in the middle), for the Stallion 2011 header images they’ll scale down (you’ll see the entire image, but it will be smaller)). Below this will be the content at 480px width (large images will scale to fit), followed by the comments area (480px width), the right sidebar (480px width), the left sidebar (480px width), footer widget areas 1 to 5 (480px width), the Footer area (480px width), below this the entire header navigation window (480px width) will be just the menu links (so no drop down feature).
Currently planning to add responsive settings for these device screen sizes:
1000px+
720px
480px
320px
240px
These are the most commonly used screen sizes for various devices, other sizes include 800, 640, 600, 400, 360 so it might increase in number of device sizes supported.
The basic concept is quite easy to code, but Stallion has so many features and layouts I’m hitting problems with the dropdown navigation menu, Featured slideshow and the Photonavigation menu. Currently going to drop the navigation window to below the footer for screen sizes below 1000px, not sure what to do with the featured slideshow and photonavigation features, might have to hide them on smaller screens.
David
Mobile Responsive WordPress Theme
WordPress Theme Featured Slider Mobile Responsive
Managed to make the Stallion Featured slider mobile responsive, in Stallion 8 won’t matter which Stallion layout or colour scheme used the Stallion featured slider will scale to fit the smaller mobile and tablet windows.
When viewed in a 480px screen for example the slider loads between the header and the main content with a width of around 460px and the height auto scaled.
Let’s see if I can do the same for the Stallion Photonavigation menu.
David
WordPress Theme Featured Slider Mobile Responsive
Mobile Responsive SEO Ranking Signals
The work you are doing now will affect direct and indirect ranking signals. I think indirect are as important as the rocket scientists at Google creating their algorithm are not simplistic, linear and Newtonian.
When the SEO community reads the tea leaves of Googlers they often miss the point. For example, when John Mueller said something like ‘Google does not use ‘the Google Analytics’ bounce rate in their algorithm; it does not mean they do not use bounce rate. It means they do not use ‘the Google Analytics’ bounce rate. They use some other internal measure of bounce that is more complex and even more meaningful.
Similarly when John Mueller said something like ‘responsiveness’ does not give you a rank boast, it was in comparison to a site that uses the three accepted approaches to smartphone optimized sites. However, non-mobile optimized sites are demoted. You will fall in ranking if you are not mobile optimized. The equations are complex with a lot of indirect signals.
Further, as mobile site optimization evolves and mobile surpasses desktop, I think this will change further. Matt Cutts often qualities his statements with “yet’. Yet becomes reality in the next years. Cutts has conveyed what the user does is pretty much synonymous with SEO of the future if not today.
It is known that Google is segregating their searches. That is ranking displayed for mobile phones are different than a tablet or desktop. If you have a poor load time or high bounce on a mobile, you will rank lower, for mobile searches but on desktop users might have a different experience and different ranking.
Google is about A/B testing and ranking pages on how users use something from one top ten result compared to another. If you are responsive I think you will see some nice boast and get more free traffic with the Searches if your content is good.
Mobile Responsive SEO Ranking Signals
WordPress Theme CSS Color Switcher
Working on a new feature to add CSS color overrides.
Just started on the feature, so far added the ability to change the background colors independent of the Stallion color scheme selection. Using a color selector wheel, so easy to choose different colors without needing to know color codes.
Included the gradient color options which means you can have a main outer background with a gradient between two colors like red and blue, starts at red at the top and slowly changes to blue at the bottom.
When complete will have each page area have the option of gradient colors (or solid), will pretty much be able to change all theme font colors etc… from the dashboard. Only just started on the feature and the offline test site looks like a rainbow vomited on the page :-)
David
WordPress Theme CSS Color Switcher
Encouraging Human Behavior the New SEO Paradigm
With great interest I am anticipating the development of Stallion 8. Do you have any more updates about the development?
I think forward thinking about SEO is about encouraging human behavior and SEO tools might be techniques provided that help influence users in a positive way.
I have been watching John Mueller a lot on Google +. He again has conveyed that direct signals (User analytics type) and indirect signals (mentions, conversation about and links) all come into play with ranking.
The reason I think they do not use exactly Google Analytics numbers for ranking is I think it might be against their terms and conditions. That is why they have their own set of user analytics which are more complex. But I would say the general categorizes are the same, such as bounce time, time on site, mobile readiness, the way users interact with the search, i.e. do they click back and revise their search, the percentage of direct traffic and people searching your brand.
For indirect signals, I speculate links have been devalued as a signal and with all the talk of disavow files, that is smoke and mirrors. I think it comes down to most except really trusted links are dampened in important. Conversation about your site on people’s personal accounts are more important. Google has a backdoor to so many social sites and browsers that they have a pretty good ideas how people act and interact on a website and talk about your site.
So when Jill Whalen is getting out of the business after 20 years, of SEO because she said her work is done, just make quality site, hmm. I think SEO is still alive and well; just shifted from relevancy and links to behavior on and off sites. Google wants to model the collective unconsciousness of humanity :). There seems to be more of a convergence of SEO and techniques to get people to behave in a way you want them. Stay on your site and talk about it.
This is where real SEO begins and there is a lot and I mean a lot that can be done, perhaps more than ever. It just takes a change in paradigm – thinking.
I think tools that direct people around your site and convince them to talk about it beyond offering them FaceBook buttons (arrows with images (I use this on one of my sites to encourage FaceBook likes and it seems to work), are a simplistic example or a mobile phone call link button). I do not know what they are, but I am 100% sure you can help the process with proper tools. All though we have free will human behavior can be influenced.
Encouraging Human Behavior the New SEO Paradigm
WordPress SEO and Google PageSpeed Insights
Have spent a LOT of time in development and have solved most onsite issues.
Currently working on performance issues (the sort you get from Google PageSpeed Insights), have added a new Performance options page to Stallion with advice and tools. For example added the ability to cache widgets individually which can improve performance because each widget requires accessing the database to grab the relevant data. By caching a widget (as a HTML snippet: like a template file) there’s less strain on a server. Works in conjunction with other caching plugins like WP Super Cache and W3 Total Cache, they cache entire pages, if a page hasn’t already been cached at least the widgets have.
Added Gravatar caching (just finished it), when you run a WordPress site through various performance measuring tools they show Gravatar images as an issue because the expire headers are set to just 5 mins (might as well not be cached) and they have variables in the URL. I guess it’s because your average Gravatar user when adding a new image for their email address would think it’s broken if the cache was say 7 days and would contact Gravatar for support, so they set the cache to 5 mins. Just finished the feature, so not tested rigorously yet, but looks perfect. By caching locally your server takes control of caching and compression, as long as the server is setup correctly it will improve performance.
Ran all Stallion built in images through an image optimizer, so they won’t be flagged by performance tools as not fully compressed in future. Timthumb though after it resizes images (for the thumbnails) didn’t appear to be caching them to the same amount, so trying to fix that (not sure if it’s possible). Timthumb images also have queries in the URL, so for your average users (I’ve found a solution for me, see below) I might have to find an alternative to Timthumb (found a few possibilities).
Tried out the Google PageSpeed Apache module (yes, Google has an Apache server module for speed) on one of my servers, you can see the results at seo-consultant-services.co.uk. The module isn’t part of Stallion (basically advanced server stuff) when you view source you can see some strange code like images are turned into data: (images starting: src=”data:image/jpeg……), the PageSpeed module fixes a lot of things like removing queries from URLs. When I run seo-consultant-services.co.uk (which is on a server with the PageSpeed module installed and W3 Total Cache Plugin and latest development version of Stallion) through the FireFox PageSpeed Insights Addon a rating of 95/100 with all but one issue being off site issues (AdSense, Analytics, Stumbleupon…), only onsite issue is minify HTMl and it’s only a 352byte improvement. Through the Chrome version of the plugin it scores 88/100 with all but two issues not offsite, onsite improvements are one Timthumb image could be better compressed and there’s a few small bits of inline CSS. In the browser versions scores Mobile 88 and Desktop 93 with two issues onsite (CSS file is render blocking and the thumbnail images are listed as not fully compressed). These are very good results, but I want better.
Basically got that site and server running about as good as it gets, to get better numbers will take finding an alternative to Timthumb and improving off site resources which we have no direct control of (though figured out Gravatars by caching locally, so you never know :-)).
This site seo-gold.com is running the same Stallion code and main caching plugin (W3 Total Cache: great plugin for caching) server settings other than the Google PageSpeed Apache module. Running the same tests give similar results: Mobile 88 and Desktop 93 and with the plugins Firefox 97/100 and Chrome 94/100.
The numbers vary depending on what the AdSense ads are loading, so you can loose 10 points sometimes with some ads because the analysis includes the ad output.
Not thought to test with AdSense off :-)
So it’s going really well, considering I’m not testing with a CDN or anything fancy server wise on the second test site the results are great. I will say W3 Total Cache is far better than WP Super Cache, the former adds the relevant server rules to your .htaccess file so headers expire correctly (important for caching), WP Super Cache completely lacks the feature. My test sites are running development version of Stallion, W3 Total Cache (big help on adding the right .htaccess rules and improving javascript and css delivery- combining and minifying them) and WP Optimize (doubt that has any major performance improvement, though does optimize the database so maybe).
David
WordPress SEO and Google PageSpeed Insights