What is the effect on SEO with a Meteor application? - html

Looking at the rendered HTML source code for the todos list example, there is zero code in the body tag. How does this affect SEO?

EDIT: Meteor now supports serving static HTML to spiders.
From: http://docs.meteor.com/#spiderable
Can Meteor serve static HTML? Can Meteor sites be indexed by Google?
Yes. Add the "spiderable" smart package to include support for emitting static HTML to search engines, complete with valid links. The spiderable package implements Google's AJAX Crawling Specification. See the spiderable documentation for details.
This version of spiderable is specifically for search engines. A future version of Meteor will also send HTML to web browsers on inital page load. The Meteor templating system was designed specifically to support this use case.
Old and now wrong answer:
From: http://meteor.com/faq/can-meteor-serve-static-html
Can Meteor serve static HTML? Does Meteor work with JavaScript disabled on the client? Can Meteor sites be indexed by Google?
Meteor has been carefully designed to support this important use case, but it's not in the current Meteor builds. It will be part of our upcoming Routing release, which will make it easy to build Meteor sites that are aware of the current URL.
Briefly, the way server-side rendering works is that the Meteor app is started on the server and allowed to render the page. Then the session state is serialized (using the same migration technology behind Hot Code Push) and the app is frozen and pushed down to the browser, where it can optionally be restarted if the browser supports JavaScript. Since Meteor templating is based on HTML strings, not DOM manipulation, it's not necessary to run a DOM emulation package on the server.

since spiders have no js execution that would mean they would only get any info in the head about the page which wouldn't really be good, however it looks like looking at their site that you can still have static content as well as streaming in other content which would be fine for SEO if your static content was talking about key phrases, had links to other site etc that are relevant to your desired keywords

Related

How to internationalize html pages

Is there a way to internationalization html pages based on user locale?
I had a website developed using html pages but now I am asked to internationalize that website in 4 different languages.
I know how to do it using Spring Framework via resource bundles but I wanted to know if there is a way to do something similar using HTML pages so that you just have to write the code considering internationalization and just keep adding the resource bundles to be picked based on user locale when a user accesses the website?
I've just developed a solution a little bit lighter, using CSS content property :
https://github.com/k-yak/stati18n
Take a look, all informations are available in the readme file.
How about this?
http://code.google.com/p/jquery-i18n-properties/
Or How about this?
How does internationalization work in JavaScript?
If you can't do Javascript you'll have to use some form of templating or dispatching. That is either respectively:
Use JSP and Spring's Message taglib (or any other templating language that supports i18n)
For each locale you would copy all the HTML pages in a locale directory and then dispatch to the directory based on the locale (I don't recommend this).
What I personally do is use jMustache which is barely a templating language and then for each page (or many pages) I will have request controller that will load all the translations for the request locale into a Map object which I feed to jMustache (see Option 2 of my answer here: https://stackoverflow.com/a/10004113/318174).
If you keep your site static, you'll end up having multiple copies of your site, unless you can dynamically modify the page using javascript. But, you'll also want the URL's to have the language code in them to save state and be good for SEO.
I developed this free solution. http://www.sitetran.com/

Can I "pre-generate" all possible static-html pages of my "dynamic" website?

Some websites like for example http://www.idealo.co.uk seem to serve only static html, although their content is dynamic.
For example if I navigate through a certain category, I get a link to a static html page:
http://www.idealo.co.uk/cat/5666/electric-guitars.html
Now if I apply a custom filter, again I get a link to something that seems to be static html:
http://www.idealo.co.uk/cat/5666F456496-735760-1502100/electric-guitars.html
How is this achieved? Are there any frameworks out there that help to "pre-generate" all possible dynamic pages, in such way that whenever a new input is given, the page already exists (i.e. the static html is already available)?
Background: we run a small search engine for real estate offers. Offers are updated by our scraper once a day (the content is static through the day). The content is searchable on a Ruby-on-Rails website.
As the traffic increases, performance is becoming an issue. I'm wondering if there is any framework / tool that could batch-generate all our searches so that we could serve static html.
Their site isn't dynamic. They're using URL rewriting (e.g. mod_rewrite) to translate the input URLs into a request that can be satisfied by a script.
For example:
/cat/5666/electric-guitars.html
Might be rewritten to:
/cat.php?id=5666
A quick trick to test this is to go to /cat/5666/foo.html
The use of .html in this case is probably to hide what kind of scripting is used on their site, as a weak security-through-obscurity measure.
In response to your problem - no, there's no (easy) way to generate all possible results into static HTML files. You're looking at potentially billions of permutations. If you're having performance issues, look into performance profiling, caching, query optimisation, etc.
What you're describing is, in a sense, caching. With caching your application will generate pages (and even parts of pages) only when their content has changed. Rails has a lot of cache functionality built in, which you can tune to fit your needs. Start by reading the Rails Guide on caching which describes the Rails' capabilities as well as common add-ons. Google around for "Rails 3 caching"—there's tons of information out there. Finally, you can add software to your server stack that does additional caching, such as Squid and Varnish. With the right tools (and research) you can get 95% of the benefit of a static site without the effort of turning your site into a quasi-static Frankenapp by hand.
I finally found this blog post, which points to a few tools that do what I was looking for. I'm adding it here just for future reference:
Hyde
"Hyde is a static website generator powered by Python & Django. Hyde supports all the Django template tags & filters and even has a few of its own. The built-in web server + auto-generator provide instant refresh and unlimited flexibility..."
Jekyll
"Jekyll is a simple, blog-aware, static site generator. It takes a template directory containing raw text files in various formats, runs it through Markdown (or Textile) and Liquid converters, and spits out a complete, ready-to-publish static website suitable for serving with your favorite web server..."
blatter
"Blatter is a tiny tool for creating and publishing static web sites
built from dynamic templates..."

ExtJs and Sencha Touch Search Engine Optimization

I've started learning ExtJS 4 and Sencha Touch 2, and i really like it.
The main difference between Sencha products and jQuery(& others) is that instead of enhancing preexisting HTML, it generates its own DOM based on objects created in JavaScript.
Apps developed like this are great as intranet apps, but can you create a consumer oriented website using Sencha?(like an online store)
I see that you don't write any HTML code in ExtJS or Sencha Touch so i am wondering how can fully generated Javascript page be indexed by Search Engines like Google. As i know, the Google Bot only sees the plain HTML code.
Is there anyway to SEO a Sencha WebApp?
Kind Regards,
Dan Cearnau
Nothing is impossible. You just need to do some work.
1. Generate standard static page using PHP or smth else. The page should look like the page of your ExtJS app. But all links must have GET params in URL. Also PHP should aggregate input GET params.
2. Add your ExtJS app to the page. In the app you have to take into an account GET params and make proper request.
2a. If a real user opens your page: PHP generates the output, then ExtJS app starts and hides the static page and generates the dynamic output.
2b. If a crawler opens your page so JS is disabled, PHP aggregates the request according to GET params and generates the output.
You can add params to URL like #param1&param2&param3 in ExtJS when clicking on links, so real users will be able to share their links. Just learn the router on PHP-side to understand URLs like this.
There is no way to make SEO-friendly pages using JavaScript only.
Using a full blown app it would be close to impossible to SEO. They are far too dynamic. Search engines work of indexing pages. They can deal with some Ajax stuff by supporting pages with #s but imagine how many pages a fully functional app will have. Every view you have has 100s of options that would constitute a new page, which also has 100s of options. All these virtual pages would most likely be just slight variations from other pages. different sort order, different filter, moved panel, search option.
If you use ExtJs to enhance a website like jQuery is often used, then that's a different story. You will have html for the spiders to read and then you enhance how the content works via javascript (see progressive enhancement).
Actually in Touch 2 you can define paths and use history support. This will treat sections of your app as actual pages in the browser w/ standard functionality like going back in the browser etc... this will be your best bet when working with mobile SEO
Getting any kind of SEO out of a Sencha app is impossible since it builds everything on the fly. Even if you use the history support in Sencha Touch, thats also done on the fly and has no effect on SEO.
For consumer-facing websites, Sencha is not the answer. For back-end (for maybe managing the shopping cart), its a different story.

Are all web pages HTML?

I see all these tools for web page creation. (Java, PHP , ASP.NET , CSS, WordPress...) When I save a web page, it's always HTML. Does that mean that all these tools are platforms for creating HTML web pages? Or are they alternatives to HTML altogether?
Also, if they are all HTML, why do web hosts advertise they have Linux / Windows? What does it matter?
HTML is a markup language which your browser (Firefox, Chrome, Internet Explorer, etc.) can read to render what people usually call a webpage. However, your browser can also render image files (try opening a photo with it), XML files and many other file formats.
When you try to access a URL (let's say http://www.stackoverflow.com), your computer sends a request to the server which hosts the site. Any technology can be running on the server (Java, PHP, etc.) to process your request. The server is a physical machine which can be running any OS (Windows, Linux, etc.) and software. Eventually, the server returns a response to your browser (oftentimes the response will contain an HTML page for the browser to display).
Wordpress which you mentioned is a content management system which helps people making PHP websites.
CSS is a markup language which is used to decorate HTML pages. Most HTML pages refer to a CSS stylesheet which your browser retrieves and then interprets.
For a web page, HTML is always the "end product" sent to the browser (in addition to any images, stylesheets, script files, etc which the HTML links to).
Java, PHP, ASP.Net are server-side languages you can use to generate HTML dynamically on the server (in comparison to just serving static HTML files)
CSS is styling for your HTML. You either write it in the HTML page itself, or in a separate CSS file which you then link to from the HTML.
WordPress is a complete CMS (Content Management System) built on PHP and MySQL.
They use HTML just for the basic layout. You can do Websites which don't use any HTML. The OS of the server is just a usage/performance question for the hoster. Also I think there proprietary Windows-standards that Linux servers can't handle, but I'm not sure on that one.
Basically, the client-side output is HTML in the most cases although it cannot be only that, but that is the standard. The PHP, ASP, etc. are running server-side and you cannot see them. Only exception is JavaScript, which runs clientside so you can see it if you're viewing the source, but finally, the page output will be HTML.
Note: CSS is a formatting system. WordPress is a blogsystem (or now a CMS) written in PHP. So you're mixing some basic points.
you mentioned two different thing:
First HTML:
this is basic language for showing data on web. All pages are sent as HTML page and your browser renders HTML and shows you images and links and ...
The other thing is web programing languages like php,asp,java... . they are languages that process data like verifying user name and password and send its result as HTML to user.
the other thing you've mentioned about hosting:
every programing languagehas its own requirements for example if you want to write a program in ASP.NET, so you have to use windows server.
so it depents on your need to choose one.

Updating display of elements on the web page without refreshing the whole page

Last time I coded a web application was almost 10 years ago. I used Java/JSP/HTML/CSS etc. I've been coding non-web applications only ever since.
When I look at modern sites now (like this one), I realize how my web development skills are obsolete. Maybe the most obvious "feature" that I wouldn't know how to implement now is the update of elements on the page after user input without having to refresh the whole page (e.g. the voting/downvoting here updates the vote count without reloading the whole page). What are the basic technologies behind this?
The techniques come under the umbrella of AJAX:
Ajax (shorthand for asynchronous JavaScript and XML) is a group of interrelated web development techniques used on the client-side to create interactive web applications. With Ajax, web applications can retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. The use of Ajax techniques has led to an increase in interactive or dynamic interfaces on web pages. Data is usually retrieved using the XMLHttpRequest object. Despite the name, the use of XML is not actually required, nor do the requests need to be asynchronous.
Something you should know:
DHTML : HTML Document
structure,document event;
JAVASCRIPT: use javascript to operate the HTML document;
AJAX: use javascript to communicate with the server.