Search Engines: Unterschied zwischen den Versionen

Version vom 22. Dezember 2015, 21:41 Uhr

Specific Search Enginges:

• Meta Ger: https://metager.de/

Geodata Search Engines and directories:

• HSR-Geodatenkompass (by Geometa Lab HSR): http://geodatenkompass.hsr.ch/
• Geopole (by Sourcepole): http://geopole.org/
• Search for OGC webservices: http://searchogc.com/

History:

• geometa.info
• OSGeodata_Discovery

Best Practices for Geometa Lab Webpages

These are notes about design guidelines, search enginge optimization (SEO) and best practices (Javascript) for webpages at Geometa Lab.

General Design Guidelines

• For page elements use the “official” HSR Colours found here: https://www.hsr.ch/Farben.7715.0.html
• Is a HSR logo in the header of the page it should link to http://www.hsr.ch/Informatik.1155.0.html
• Generally use following font family:

"Helvetica Neue", Arial, Helvetica, sans-serif;

Design Guidelines for Map Pages

Credentials bei Verwendung von OSM-Karte(n) und -Daten:

• Beispiel: ...
• Ev. Version anzeigen: "v0.1" (ohne Anführungszeichen)
• Falls OSM-Daten verwendet werden: "Project data © ODbL" (man beachte den Weblink)
• Falls OSM-Basiskarten verwendet werden: "Map © OpenStreetMap contributors" (man beachte den Weblink)
• "Improve this map" (d.h. mit Permalink!)
• Etwaige andere Weblink unterdrücken, wie etwa "Leaflet".

HTML and CSS

Header elements:

• Favicon (png can have any name), icon that will be displayed in the browser tabs:

<link rel="icon" type="image/png" href="favicon.png"/>

• Sometimes a current IE version is installed, but system settings force it to use legacy document modes. Add following line to your head to make IE use the most current available mode:

<meta http-equiv="X-UA-Compatible" content="IE=edge">

• With a manifest file you can add properties to your page when it gets “installed” using Chrome on Android, for example a custom home screen icon or displaying the page in full screen mode.

<link rel="manifest" href="manifest.json">

• manifest.json example:

{
  "short_name": "MyPage",
  "name": "My amazing page",

  "icons": [
    {
      "src": "favicon.png",
      "sizes": "144x144",
      "type": "image/png"
    }
    ],

  "start_url": "index.html",
  "display": "standalone"
}

Metadata for social media pages:

The following examples add site specific metadata for various social media pages. The images should be high resolution screenshots of the current page, they will be displayed under posts where your page is mentioned.

• Open Graph protocol (Facebook etc.)

<meta property="og:image" content="http://mypage.com/images/facebook_share.png"/>
<meta property="og:title" content="Do stuff with My App"/>
<meta property="og:url" content="http://MyApp.com/"/>
<meta property="og:site_name" content="My App"/>
<meta property="og:type" content="website"/>

• Twitter

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Do stuff with My App">
<meta name="twitter:description" content="You can do lots of fun things with My App">
<meta name="twitter:image" content="http://mypage.com/images/twitter-share-image.png">
<meta name=”twitter:creator" content="@MyTwitterHandle">

• Don’t use float and fixed pixel numbers for the layout. Most layout problems (including responsive design) can be solved using flexbox. See http://www.w3.org/TR/css-flexbox-1/ for more information.