I'm used to old school absolute positioning
so I thought I'd run this responsive HEADER by you.
Just a test so no seo / links or anything yet...
Test Header

The thing for me is the white space between text | text | logo on desktops
Do you think that's okay, just something that comes with responsive?
Or do you have a suggestion on closing that spacing.

By the way thanks to Bill G on the help with the push / pulls

Hi Alter Eagle,

For me there isn't anything wrong with "White Space"and your header looks pretty cool and striking. If there was just one small thing - thats the sort of balance between the elements on desktop, it is sort of out a little bit. The left text could do with being a little bit more to the left, the middle text more central, and the logo stays where it is. (Thats actually putting a little bit more white space between )

Without knowing what or how the make up of the elements is difficult to say how you would achieve this, especially as it seems you have used the old fashioned push and pull,- much more easy to control using flex positioning and limiting the size of the column/container/subgrid (whatever you have used) to centralise the header texts and logo.

Anyway all in all a nice looking design

I have made a quick mock up of yr header to see an example of it working with flex positioning
please excuse me for that but I thought you might like to see it better than trying to imagine it

I have had to use images for the text |text| logo so the middle text I can't change from the colum layour, but if you used text within RSD for that easy to make it go from column to row where you has it break before

have a look see http://balismartproperty.coffeecup.com/blank.html If of any interest for you in as such as the sort of thing you are wanting I can send you the project file so you can see how it is done using flex positioning

Wayan

Wayanjaya

nice! I'd like to have that file for my own records to see how its done. Can you post it here in the forum?
MJ

Here is basic layout for the style, you can put your own colours/text/header sizes as you need

Hope that helps

Yeah, it's a bit of a different animal to design for.
I used to go from the absolute desktop to a jQuery mobile layout with a script call.
Neat how coffee cup revamped the RSD so hopped onboard the full responsive train.

That does use flex as well as a push/pull for the 3 layouts, can't do the 3 images
as you know important seo info top of fold especially local.
That's the effect I was going for with the css viewport units though.

Thanks for the input, not too funky with the spacing I guess.

You don't need use images Use headers & text & logo image as in the basic example - shown in later post for Mark. I just used images to keep the style. Your design looks ok and works (except for that little bit of in-balance which should be adjusted especially with white space around.

SEO has evolved and has changed dramatically these past couple of years, and will continue to evolve, To be honest I haven't actually seen much difference in SERP for sites that have a full length image with all information required, to others where the top row is headers. It's the content and relevance and accuracy nowadays that is important. Some of the sites that I have done and manage the SEO for are up there in the top 3 or 4 on the SERP with just an Image in the First row.

I think its OK, just that the elements need to be realigned. Personally, I am not a fan of having things at extreme opposite sides, so maybe even bump them in a little.

What I would be worried about is listing those cities. REMOVE THEM. Only keep the main area. The only thing you are doing is diluting the keyword-city or geographic area for what people will be doing the most searches for. If you find each of those cities relevant and needed for searches, than you create a Landing Page for each city (and ideally a landing page for any keyword/keyword group used to search your business). A Landing page if you are not familiar is really simple - its a page that is created for a search term basically - or a page that an Adwords account sends a search term click to (Google score you advertising keywords on how well the landing page ranks with that keyword). The landing page is basically a call to action page: here we are, this is what we do - click to learn more / fill a form type page - then you can link it to yoru main content pages of your website. So you can write a small landing page for those cities - just make the content a little unique, and link them back to your main pages. I run a small business - where I have two types of clients for two different sorts of - but similar services, and each type of client - would not care about what the other does. So I need a landing pages just for each of the services. Where I live, there are basically 4-5 big cities, so I am goign to rebuild my landing pages, so each type of service, has a landing page for each larger area where people would be doing searches (I live in a suburb - and I know to search for the main city for better results, and I think most people do that as well). So - I need 8-10 landing pages. And a set of 4-5 for each service I add to the site.

Wikipedia says there are 6 major cities for the North Bay area, so maybe that's all you need to care about. If you just have an account with Google adwords and just a google analytics account (still free I believe) you'll be able to see what search terms are used to find your page and where those people visit from. If an Adwords account, you can set keywords to each landing page and see how many views you get to see of those cities are relevant for a landing page for each one. But you know your customers best. I don't live in such a densely populated area, so maybe you would benefit from a landing page for each of the cities you listed.

When you do your scheme markup, you can markup for multiple areas:
https://www.odddogmedia.com/seo-blog/us … locations/

thanks for sharing

Yeah, that's what the layout has been bothering me on the desktop I don't like that spacing either. I'll see what I can do to get that at least closed up a bit. It's really tricky to get those text working right in RSD. Might have to re-think it from the absolute design I did originally to something that works better but I kind of like that look.

I don't want to simplify it down to those generic centered responsive you see everywhere or with the large image. My take on responsive originally was to reduce the load time on the index. So I'm trying to avoid the large image load you need for a cover or initial slide and use mid-size optimized images on the index with targeted keyword text. Try to keep the CSS bloat to a minimum, then load in my jQuery stuff on the back pages using the same lighter header/footer... that's kind of the basic plan.

Most of my sites hit the serp 1st page, and I rank top in locals so I don't think I'll mess with my panda/penguin seo too much. The landing page for me mainly is back page for the longtail searches for what I do, I find the scrape uses the local city for good results. I tried the landing page local thing a few years ago and got higher results this way. I stick with the old school top H1 though too with main keywords that I change on those back pages, then use H2/H3 for longtail searches.

On the schema I haven't used that as much as I should but on this re-build I'm thinking I'll add those links into the footer HTML see how those results go. Got that code worked out just have to implement it in a new site. Didn't see the multiple area schema so I may be able to use that if the links don't get too long. Going to be a bear to get the mobile scroll down to a manageable size.

Thanks for the feedback it's appreciated.