B4J: ABMaterial Public 1.05/Donators 1.06 now released

The public version 1.05 of ABMaterial is now available from the B4J website!  Three new controls:

ABMSlider: Add a slider for values with a wide range.

Range

ABMRange: Add a range slider for values with two handlers.

Slider

ABMCustomControl: add your own components to the ABMaterial framework.

CustomComponent

Some more highlights on this release:

  • Complete rewrite of the Refresh system
  • Material Icon Fonts are now loaded locally
  • Disable the back button in the browser
  • ABMModalSheet FULL size option
  • LocalStorage support
  • ABMPlatform object containing basic info on the users browser and device
  • Integrate variables for SEO-optimization
  • Responsive tables

Read the README1.05.TXT for the full release notes.

Download ABMaterial Public version 1.05

Donators will receive an email with the download link to ABMaterial 1.06 containing two new controls, ABMDataTimeScroller and ABMDateTimePicker.

Happy programming!

Alwaysbusy

Click here to Donation if you like my work

B4J: ABMaterial WebApps and SEO (Search Engine Optimization)

SEO

A feedback case I got from one of the users of ABMaterial, Herbert, was the question how ABMaterial for B4X coped with SEO-optimization. To be perfectly honest, I hadn’t really though about it. I  had a couple of things already, like headers, bold text, a page title and description.

As any good programmer,  if it looks nice, is user friendly and works as expected, my work is done and users will find and like it. No?

And it kept me thinking.  So this morning, lying awake at 4  o’clock (sleeping is highly overrated IMHO and an invention of the Bed Consortium, but I’m sidetracking), I decided to learn more about SEO and how it could be implemented in ABMaterial for B4X.

Herbert gave me some links, so I started reading up.

Looked like I had some things right already, but ABMaterial could use some polishing.

For starters, I added some extra properties to the ABMaterial page object that will be saved in the generated html file:

pageTitle: very important, pick good keywords
pageDescription: keep it around 140 to 160 chars
pageKeywords: a comma delimited string containing your page keywords
pageHTMLName: it is always index.html in ABMaterial, but it’s better to give it some name using keywords, like ‘abmaterial-custom-component.html’, use hyphens (-) between words to improve readability
pageSiteMapPriority: a value between 0.00 and 1.00, see further
pageSiteMapFrequency: how frequently the page is updated (never, none, always, hourly, weekly, yearly, …), see further

Headers:

Covered!  ABMaterials labels can have headers like <h1>, <h2> so we’re ok.  Tip: create only one <h1>!

<h1>Most Important</h1>
<h2>Second Most Important</h2>
<h3>Third Most Important</h3>

Bold:

Got it: You can use markers like {B}{/B} in labels to set text in bold/strong.

Use tag in a image:

Ah, needed some changes.  I misused it.  Thinking ‘who the #?@! can’t show images anymore these days‘, I used it as an image toggle property.  Changed it now so it can be used properly.

Hyperlinks:

Added some extra markers {AS}{/AS} in the ABMLabel Component so you can add a title.

{AL}http://www.website.com/page.html{AS}keyword{/AS}{AT}my visible text{/A}

will result in:

<a rel=”nofollow” target=”_black” href=”http://www.website.com/page.html” title=”keyword”>my visible text</a>

sitemap.xml and robots.txt:

The Sitemaps protocol allows a webmaster to inform search engines about URLs on a website that are available for crawling. ABMaterial has the possibility to generate a sitemap.xml file and a robots.txt file (for sites like Ask.com).

What does it look like Alwaysbusy, I hear you ask. Well, something like this:

<?xml version=”1.0″ encoding=”UTF-8″?>
</pre>
<urlset
xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9”
xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance”
xsi:schemaLocation=”http://www.sitemaps.org/schemas/sitemap/0.9
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd”&gt;
<!– created with ABMaterial and B4J –>
<url>
<loc>https://alwaysbusycorner.com/index.html</loc&gt;
<lastmod>2016-01-16T11:11:16+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>1.00</priority>
</url>
<url>
<loc>https://alwaysbusycorner.com/alwaysbusy-abmaterial-introduction.html</loc&gt;
<lastmod>2016-01-16T11:11:16+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>0.50</priority>
</url>
<url>
<loc>https://alwaysbusycorner.com/alwaysbusy-abmaterial-customcomponent.html</loc&gt;
<lastmod>2016-01-16T11:11:16+00:00</lastmod>
<changefreq>yearly</changefreq>
<priority>0.50</priority>
</url>
</urlset>

To generate this is easy in ABMaterial, and needs just a couple of things:

  1. In ABMShared, add a property  public AppPublishedStartUrl as String = “http://yoururl.com”.

  2. In the initalize() method of ABMApplication, add ‘ABM.AppPublishedStartUrl=ABMShared.AppPublishedStartUrl.

  3. In the BuildPage() method of each page, set page.PageHTMLName=”your-good-keywords.html”

  4. Also in BuildPage(), add page.PageSiteMapPriority = “0.50” (number between 0.00 and 1.00, and don’t set them all to 1.00, that makes them equally important)

  5. Also add page.PageSiteMapFrequency = ABM.SITEMAP_FREQ_MONTHLY (use one of the contstants)

  6. If you use a ABMNavigationBar, update the url of each sidebar item in ABMShared, e.g. page.NavigationBar.AddSideBarItem(“Contacten”, “Contacten”, “mdi-action-dashboard”, “../StartPage/your-good-keywords.html”)

  7. In ABMApplication, also change your InitialPage=”your-good-keywords.html”

  8. In ABMApplication, change ‘index.html’ in the AddPage() method to Page.PageHTMLName

When you start your app, the sitemap.xml and robots.txt files will be generated next to your apps html file. After publishing it to your final site, you let the search engines know you want to submit your site.

You should be able to use these sitemap-submission URLS. Put the full URL to your sitemap, including http://, after the = sign:

http://www.google.com/ping?sitemap=

http://www.google.com/webmasters/sitemaps/ping?sitemap=

http://www.bing.com/webmaster/ping.aspx?sitemap=

http://submissions.ask.com/ping?sitemap=

http://www.didikle.com/ping?sitemap=

So, you’re already one step ahead of many other tools when you use B4J and ABMaterial!

Of course, your content will be the most important part to atract users and get high rankings in the search engines, but it never hurts giving them some help.

If any SEO expert reading this article has some other ideas, please post them.

ABMaterial 1.05, supporting all this, will be send to the donators early next week. Quite some goodies included in this release!

Head to the B4X website, download your free copy of B4J and go to the forum to download the ABMaterial framework.

Alwaysbusy

Some good rerading on SEO:

https://moz.com/beginners-guide-to-seo

http://webdesign.about.com/od/seo/tp/seo_tips_and_tricks.htm

SEO Heading Tags

What are Meta Descriptions

Click here to Donation if you like my work

B4J: 4.0 now supports HTTP/2, perfect tool for my ABMaterial framework

ABMaterial

You all know me as a Xojo fanatic, but lately I lost a bit of interest because the focus of the last year was so much about Apple, and Windows/Linux was a bit forgotten.

So I got back to my other favorite, B4X.  And what a pleasant ride it has been so far! It truly is a far to little known gem with so much power under the hood. Creating apps for Android, iOS, Desktop and Server apps is a blast.

Being able to share code between devices, having a simple but powerful (free) IDE, a very active community and a developer that really listens was quite refreshing.

My next project was writing a Material Design framework for Web Apps, without having to write a single line of HTML, CSS or JavaScript.  And quickly, it became obvious B4J was the one tool that could do it. ABMaterial was born.

Using very little code, you’re able to write beautiful (based on Material CSS) and powerful (B4J really stands out here) WebApps.  The enthusiastic crowd at the forum has pushed me through several nights continuing to write on the framework and has made me, although some polishing is still needed, a very happy camper.

It will be very useful to write WebApps (automatically adapting to the screen size of your device), and I even see it to be great to write nice interfaces for your Raspberry Pi projects. It consists of 25+ ‘themeable’ controls and some easy-to-use helpers to design your layouts.

To prove B4J is really on edge with the latest technologies, Erels latest release 4.0 for Christmas now supports HTTP/2. Benchmarks showed a big difference in speed and will undoubtedly be very useful for mobile devices.

I’ve set up a live demo of ABMaterial on my modest media center computer here. So, be gentle with her…

Or if you want to try it out yourself, head to the B4X website, download your free copy of B4J and go to the forum to download the ABMaterial framework.  The current ‘public’ version is 1.03.  Donators get updates (1.04 as at time of writing) about 2 to 3 weeks beforehand so I’m able to better control questions/feature requests or bugs (aaarrhh!).

I wish you all some very happy Holidays and I hope I’ll see you all next year for some more fun programming projects!

Alwaysbusy

Click here to Donation if you like my work