Webseite bearbeiten leicht gemacht!

CMS Serie Part 1

Seine Webseite regelmässig zu aktualisieren, gehört zu einem guten Online-Auftritt dazu. Auch die Suchmaschinen stellen fest, wie oft eine Webseite aktualisiert und bespielt wird. Je aktueller eine Webseite ist, desto besser.

Das Aktualisieren deiner Webseite gelingt mit einem sogenannten Content Management System (CMS) sehr einfach. Dazu brauchst du keinerlei Programmierkenntnisse. Im ersten Teil unserer Serie erfährst du jetzt, was ein CMS eigentlich ist.

Was ist ein CMS?

Content Management System kann ganz einfach mit „Inhaltsverwaltungssystem“ übersetzt werden. Der Name beschreibt es schon gut: Ein CMS ist für das Verwalten von Inhalten zuständig. Dazu gehören Bilder, Texte, Videos und vieles mehr. Mit einem CMS kannst du also die Inhalte deiner Webseite schnell und flexibel anpassen, ohne über Programmierkenntnisse zu verfügen.

Das Bild unten zeigt die Oberfläche des CMS Grav. Es ist ein Beispiel dafür, wie ein CMS aussehen kann. Im CMS kommen die Komponenten deiner Webseite zusammen. Du kannst die einzelnen Seiten bearbeiten, die Reihenfolge des Menus beeinflussen oder vielleicht sogar nützliche Plugins installieren (wenn du dich schon etwas besser auskennst).

Grav (Dashboard): Unser bevorzugtes CMS.

Welches CMS soll ich wählen?

Bekannte CMS sind WordPress, Drupal oder Typo3. Es gibt jedoch noch ganz viele andere gute CMS. Am besten lässt du dich bei der Auswahl von einer Fachperson beraten, denn je nach Umfang oder Spezialwünschen, die du hast, kann eine gute Beratung die Kosten senken. Nicht jeder braucht ein CMS, das für Blogs ausgelegt ist (WordPress) – manchmal reicht ein schlankes CMS ohne Datenbank schon aus.

Wir bei Akazie IT arbeiten im Bereich CMS mit Grav, *leon aber auch WordPress. Hauptsächlich erstellen wir neue Webseiten mit Grav. Unser Webseitenangebot findest du hier.

Administration, Inhalt, Hosting und mehr: Das ist ein CMS.

Individuelle Webseite und Templates

Ein CMS verwendet Templates (Vorlagen), auf denen das Layout der Webseite aufbaut. Je nach CMS, das man verwendet, gibt es mehr oder weniger kostenlose Vorlagen, die du für deine Webseite verwenden kannst.

Wenn du dich von der Masse abheben möchtest, nimmst du optimalerweise nicht einfach die Vorlage und füllst sie ab. Mit 2-3 durchdachten und guten Änderungen oder einem komplett individuellen Design kannst du deiner Webseite viel Einzigartigkeit und Wiedererkennungswert verleihen.

Fazit

Mit einem CMS (Inhaltsverwaltungssystem) kannst du den Inhalt deiner Webseiten (Text, Bilder, Menu, News etc.) anpassen und bearbeiten. Dies ermöglicht dir, deine Webseite immer auf dem aktuellen Stand zu halten. Änderungen können effizient kommuniziert werden und das alles kannst du selbst machen, ohne dass Zusatzkosten anfallen.

In den nächsten Teilen dieser CMS-Serie werden unsere Inhaltsverwaltungssysteme genauer vorgestellt und du erhältst wertvolle Tipps und Tricks.

Falls du eine neue Webseite oder ein Redesign deiner aktuellen Seite planst, sind wir gerne als Ansprechpartner für dich da.

Hast du nur Bahnhof verstanden? Kein Problem – vielleicht hilft dir unser letzter Blogbeitrag zu den verschiedenen Webbegriffen weiter.


Facebooktwitterpinterestlinkedintumblr

Wichtige Begriffe für deine Webseite

Wer selbst schon Änderungen an seiner Webseite machen wollte, hat sich im Jungle von vielen unvertrauten Wörtern wiedergefunden. Oft sind es englische Fachbegriffe mit denen Entwickler, Marketing-Fachleute und Designer um sich schlagen.

Wir haben euch deshalb gerne eine kleine Liste an Begriffen zusammengestellt, die wir beim Support unserer Webkunden immer wieder brauchen. Dieser Akazie Web-Glossar erweitern wir von Zeit zu Zeit.

Mit einem Klick auf das jeweilige Wort kommt ihr direkt zur Erklärung dieses Begriffs.

Domain

Eine Domain ist beispielsweise «www.akazie.com». Sie besteht aus dem Hostnamen «www» für World Wide Web, der Second-Level-Domain «akazie» und der Top-Level-Domain .ch, .com, .org etc.

Eine Domain kann immer nur einmal vergeben werden. Unsere Domain www.akazie.com gibt es demnach nur einmal im Web. Domains können bei vielen Anbietern gekauft werden und kosten meist rund 15 Franken. Wobei die Kosten auch erheblich steigen können bei beliebten Domains.

Subdomain

Eine Subdomain ist ein weiterer Bestandteil der Domain. Dieser Blog befindet sich beispielsweise auf einer solchen Subdomain „www.blog.akazie.com“. Die Subdomain „blog“ steht also vor der Second-Level-Domain „akazie“. So ist es möglich, die „www.akazie.com“ Domain weiter zu unterteilen.

URL

Nebst der Domain gibt es die URL. Diese beiden Begriffe werden teilweise als Synonym verwendet. Es gibt einen kleinen Unterschied, aber für den Gebrauchsalltag darfst du URL und Domain als Synonyme verwenden und man wird dich verstehen.

Im Gegensatz zu einer Domain gehört zu einer URL noch das „Hypertext Transfer Protocol“, abgekürzt „http“ oder auch „https“ (wenn die SSL-Verschlüsselung aktiv ist). Dieses steht jeweils vor der Domain und sieht so aus: „https://www.akazie.com“. Im Bild unten, ist die URL nochmals aufgeschlüsselt dargestellt.


Host

Um deine Webseite online zu schalten, braucht es Speicherplatz auf einem Server. Dieser wird unter anderem von Hosting-Unternehmen (zum Beispiel Cyon) verkauft. In diesem Beispiel wäre Cyon also dein Host und du beziehst bei Ihnen den Speicherplatz, um deine Webseite online zu schalten.

Normalerweise wird dieser Speicherplatz auf dem Server verkauft – es gibt aber auch Unternehmen, die das kostenlos machen. Dann ist die Folge meist, dass Werbung des Unternehmens auf deiner gratis gehosteten Webseite angezeigt wird.

Das ist ein Teil einer sogenannten „Server-Farm“. Ein Beispiel dafür, wo Webseiten-Daten gespeichert sind, um online abgerufen zu werden.



Frontend und Backend

Das Frontend einer Webseite ist der Teil, den der Besucher sieht. Bei Akazie.com wäre das also folgender Teil:

Frontend (unsere Webseite)

Zum Backend einer Webseite gehört demnach alles, was der User (Besucher) nicht sehen kann. Alles, was im Hintergrund der Webseite passiert – man könnte es auch mit dem Begriff „Backstage“ aus dem Theater vergleichen. Teil dieses Backends ist beispielsweise das CMS (Content Management System) – dort kann definiert werden, welche Inhalte auf der Webseite wo platziert werden (siehe Bild unten).

Das CMS ist ein Teil des Backends einer Webseite

In einem nächsten Blogbeitrag werden wir etwas detaillierter darauf eingehen, was ein CMS ist und welches wir bei Akazie IT aus welchen Gründen verwenden.

Cookies

Cookies sind kleine Textdateien, die während deines Besuchs von Webseiten gespeichert werden. Es gibt verschiedene Arten von Cookies. Sie sind meist dafür da, um das Besuchererlebnis der Webseite zu unterstützen und nachzuverfolgen, welche Seiten du besucht hast.

Ein Beispiel: Du gehst auf eine Webseite um etwas zu kaufen und legst ein Produkt in den Warenkorb, ohne dich anzumelden. Aus Versehen schliesst du die Webseite und öffnest sie wieder. Wenn die Webseite Cookies benutzt, wirst du feststellen, dass dein Warenkorb immer noch mit den Artikeln, die du ausgewählt hast, gefüllt ist.

Wie dieses Beispiel zeigt, können Cookies sehr hilfreich sein. Allerdings werden durch die Cookies Daten von dir und deinem Surfverhalten aufgezeichnet. Das bringt Massnahmen mit sich, die aufgrund des Datenschutzes getroffen werden müssen. Das ist der Grund, weshalb auf vielen Webseiten Cookie-Meldungen auftauchen, die bestätigt oder abgelehnt werden müssen.

Datenschutzerklärung

In einer Datenschutzerklärung sind wichtige Informationen zum Umgang mit Daten von Nutzern/Besuchern der Webseite zu finden. Auch die genauere Definition zum Umgang mit den Cookies ist darin zu finden.
Nebst den Cookie-Informationen sind auch Angaben zur SSL-Verschlüsselung oder Log-Dateien dargelegt. Was genau in die Datenschutzerklärung gehört, ist nicht bei jeder Webseite gleich. Gleich ist nur, dass heute grundsätzlich jede Webseite über eine solche Datenschutzerklärung verfügen sollte, wie auch über ein Impressum.

Es gibt online hilfreiche Seiten, die dich bei der Erstellung einer solchen Datenschutzerklärung für deine Webseite unterstützen. Zum Beispiel: https://www.swissanwalt.ch/datenschutz-generator.aspx


SEO

SEO steht für „Search Engine Optimization“ – auf Deutsch „Suchmaschinenoptimierung“. Es geht darum, deine Webseite so zu optimieren, dass sie in Suchmaschinen wie Google, Bing und Co. gesehen und dargestellt wird.

Es gibt viele Faktoren, die eine Webseite optimaler macht für Suchmaschinen. Schnelle Ladezeiten, die Anpassung an verschiedene Bildschirmgrössen und gut geschriebene Inhalte gehören zu den Faktoren, die die Suchmaschinenoptimierung positiv beeinflussen. Dazu gehören aber noch viele andere Punkte, die beachtet werden können und sollten.

Wirklich gute Suchmaschinenoptimierung ist nicht in 1-2 Stunden erledigt. Dazu braucht es regelmässige Auseinandersetzung mit dem Thema, Erstellung von guten Inhalten und die technischen Voraussetzungen, damit die Suchmaschinen deine Webseite ernst nehmen.

Mit Google Analytics oder anderen Analyse-Webseiten kannst du die Klickzahlen deiner Webseite mitverfolgen. Das gibt einen Einblick, wie deine Seite gebraucht wird.

Meta-Tags

Meta-Tags sind Informationen, die auf einer Webseite hinterlegt werden und den Suchmaschinen wichtiges Hintergrundwissen zur Webseite geben.
Wichtige Meta-Tags für Webseiten sind vor allem die Meta-Description und die Meta-Keywords. Das wird im Folgenden noch genauer erläutert.

Description-Tag

Die Meta-Description ist eine kurze Beschreibung deiner Webseite oder deines Unternehmens. Sie ist normalerweise ca. 150 Zeichen lang.

Die Seitenbeschreibung ist vor allem wichtig, weil die Suchmaschine diese Beschreibung unterhalb des Seitentitels in der Suche anzeigt (siehe Bild). Ist bei deiner Webseite keine Seitenbeschreibung hinterlegt, dann wertet die Suchmaschine das negativ und wählt einfach den erstbesten Text deiner Seite aus und stellt ihn dar.

Der Titel deiner Webseite kannst du auch mit Meta-Tags anpassen.

Optimalerweise sind deine Keywords Teil der Seitenbeschreibung. Was Keywords sind, das wird gleich im Anschluss erklärt.

Keywords

Keywords (Schlüsselwörter) sind wichtige Wörter, die du für dich, dein Unternehmen und deine Webseite definierst. Es sind Wörter, mit denen du identifiziert und in den Suchmaschinen oder auch im echten Leben gefunden werden möchtest.

Diese Wörter verwendest du dann jeweils in deinen Seitenbeschreibungen, in den Texten deiner Webseite, aber auch sonst in deiner Kommunikation. Achte darauf, dass du die Keywords massvoll einsetzt und trotzdem noch auf eine gute Sprache achtest. Möglichst oft dein Keyword zu benutzen, das zählt heute nicht mehr. Vor allem nicht, wenn der Text dadurch unangenehm zu lesen wird.

Alt-Tags

Es ist wichtig, dass deine Webseite barrierefrei bedienbar ist. Auch Personen mit beispielsweise einer Sehbehinderung sollen deine Seite nutzen können.

Eine Komponente einer barrierefreien Webseite sind die Alt-Tags. Alt-Tags werden dann wichtig, wenn der Inhalt sonst nicht gesehen wird. Hat jemand eine Sehbehinderung, dann kann er sich eine Webseite vorlesen lassen vom Sprachroboter. Die Bilder werden dann so beschrieben, wie es im Alt-Tag des Bildes vorgegeben wird. Steht nichts im Alt-Tag oder nur 123, dann kann sich die sehbehinderte Person nichts unter diesem Bild vorstellen.

Es ist wichtig, bei Bildern Alt-Tags zu hinterlegen, die beschreiben, was zu sehen ist. Die Webseite barrierefrei zu gestalten ist übrigens auch ein Faktor, der die Suchmaschinenoptimierung positiv beeinflusst.

Mobile First

Das Smartphone ist mittlerweile das beliebteste Gerät, um auf Webseiten zuzugreifen. Der grössere Teil der Suchanfragen findet von mobilen Geräten aus statt. 1 Es ist selbstverständlich, dass eine moderne Webseite für mobile Geräte optimiert sein sollte (Responsive).

Mobile First geht noch einen Schritt weiter. Es heisst, dass die Webseite nicht nur für mobile Geräte optimiert ist, sondern dass beim Designprozess der Webseite die mobile Version zuerst beachtet wird. Das vereinfacht den Prozess, weil Funktionen und Animationen, die für eine Desktopseite gemacht werden, würden evtl. auf dem Handy gar nicht funktionieren oder nicht gut aussehen. So kann dieser Aufwand gespart werden.

Responsive

Eine responsive Webseite passt sich automatisch den verschiedenen Screengrössen an. Sie wird sowohl auf einem Tablet als auch auf einem grossen oder kleinen Smartphone schön dargestellt. Egal ob ein grosser Fernsehbildschirm die Webseite aufruft oder ein Laptop – die Webseite ist immer nutzbar und alle Funktionen verfügbar.

Wer heute eine Webseite hat, die nicht Responsive ist, macht viele Minuspunkte bei den Nutzern, aber auch bei den Suchmaschinen.

Das wars für heute mit unserem kleinen Akazie Web-Glossar. Wir hoffen, dass die eine oder andere Information hilft, dich mit deiner Webseite besser vertraut zu machen.

Selbstverständlich dürft ihr euch aber auch jederzeit bei uns melden, wenn ihr den Durchblick nicht habt und wir helfen bei den Lösungen und Anpassungen weiter.

Quellenverzeichnis

Facebooktwitterpinterestlinkedintumblr

Warum du trotz Bildrechten nicht immer selber fotografieren musst

Seit ein paar Monaten gilt ein neues Gesetz für Bilder im Internet. Warum jetzt sogar dein überbelichteter Schnappschuss von den Ferien oder dein unscharfes Selfie mit deiner Familie urheberrechtlich geschützt ist, erfährst du in diesem Blogbeitrag.

Seit dem 1. April 2020 gilt das revidierte Urheberrechtsgesetz in der Schweiz. Neu sind alle Fotos urheberrechtlich geschützt, nicht nur solche mit Werkcharakter. Fotos sind nach dem neuen Artikel Art. 2 Abs. 3 bis URG auch dann geschützt, wenn sie nicht professionell erstellt wurden wie beispielsweise bei Selfies oder Aufnahmen von Familienangehörigen oder dreidimensionalen Gegenständen. Auch die Qualität des Bildes spielt keine Rolle mehr, jetzt sind auch Porträts mit abgeschnittenen Köpfen oder überbelichtete, verwackelte oder verschwommene Aufnahmen geschützt.

Jedes Foto, das dreidimensionale Objekte zeigt, ist geschützt

Um dein eigenes Bild zu schützen, muss man grundsätzlich nichts tun. Ein Foto ist ab dem Zeitpunkt, als es aufgenommen wird, automatisch geschützt, und alle Rechte gehören dem Urheber. Das neue Gesetz schützt jedoch nur Fotos, die dreidimensionale Objekte abbilden. Sämtliche Fotos mit zweidimensionalen Objekten zum Beispiel: Gemälden, Zeichnungen, Pläne und Schriftstücke sind somit grundsätzlich von der Regelung ausgeschlossen und die Urheberrechte gehören somit nicht dem Fotografen.

Achtung: Copyright ist nicht gleich Urheberrecht. Ziel des Vermerks ist es, nach aussen deutlich zu machen und dadurch letztlich den Nachweis zu erbringen, Urheber eines Fotos oder eines Beitrags zu sein. Grafik: Freepik.com

Der Gebrauch von Bildern aus dem Internet

Oft werden Bilder in der Googlesuche kopiert und für die gewünschten Zwecke gebraucht. Das ist jedoch verboten und kann bestraft werden, da grundsätzlich für Bilder, die über die Google-Bildersuche gefunden werden, das gleiche Urheberrecht gilt. Bilder, die über Google erreicht werden, dürfen in dem Fall nicht kopiert und beispielsweise auf der eigenen Website eingebunden werden. Google bietet jedoch die Funktion, Bilder nach Nutzungsrechten zu filtern. Dies Funktion werden wir in einem kommenden Blogbeitrag erklären.

Falls trotzdem Bilder aus dem Internet genutzt werden möchten, ist dies heutzutage mit dem nötigen Wissen möglich. Hier kommen die Lizenzen ins Spiel und die Anbieter, die diese zur Verfügung stellen. Urheberinnen und Urheber können die Lizenz für ihr Werk auch verkaufen oder gratis zur Verfügung stellen. In dem Fall kann man bei dem Urheber die Lizenz für das Bild kaufen oder gratis erwerben und das Bild danach für die gewünschten Zwecke verwenden. Mittlerweile werden viele Bilder auch gratis angeboten im Internet. Die Lizenz für diese Bilder kann kostenlos erworben und das Bild auch für private wie kommerzielle Zwecke verwendet werden.

Mehr Infos zu Plattformen, die Fotos für kommerzielle Zwecke – sowohl kostenlos als auch kostenpflichtig – bieten, gibt es im nächsten Blogbeitrag.

Fazit

Nicht jedes Bild aus dem Internet darf ohne Weiteres für die eigene Webseite oder die Social Media Seite wiederverwendet werden. Wichtig ist es, zu wissen, dass jedes Foto von dreidimensionalen Objekten einen Urheber hat und dieser gefragt werden muss, wenn das Bild gebraucht werden möchte.

Damit trotzdem nicht für jeden Beitrag eigene Fotos geschossen werden müssen, was ziemlich zeitaufwendig und teuer ist, gibt es unterschiedliche Plattformen, um gute oder sehr gute Bilder zu beziehen. Diese können dann gegen einen kleinen Betrag oder teilweise auch kostenlos ohne Nennung des Urhebers benutzt werden.

Wo sogenannte Stock-Bilder gefunden werden können, das erfahrt ihr im nächsten Blogbeitrag.

Quellen:

Eidgenössischer Datenschutz- und Öffentlichkeitsbeauftragter (EDÖB):
https://www.edoeb.admin.ch/edoeb/de/home/datenschutz/Internet_und_Computer/veroeffentlichung-von-fotos.html

Facebooktwitterpinterestlinkedintumblr

Tools zur Bildoptimierung fürs Web

Gute Bilder und eine schnelle Webseite – diese beiden Aspekte stehen oft im Widerspruch. Damit Sie sich nicht für das eine oder andere entscheiden müssen, werden Bilder für Webseiten optimiert. Wie Sie das selbst tun können, erfahren Sie in diesem Blogpost. 

Diese Webseite erscheint mehrmals im Blogartikel und gehört zu Suli Photography

Damit eine Webseite schnell ist, brauchen wir so kleine Bilder wie möglich. Die Seite soll jedoch eindrücklich und ansprechend wirken. Um dies zu erreichen brauchen wir oft qualitativ gute und grosse Bilder (z.B. wie im Bild oben). Um ein Gleichgewicht zwischen Bildgrösse und Qualität zu erreichen, optimieren wir die Bilder für die Webseite. Detaillierte Infos, weshalb Bilder optimiert werden, sind in unserem letzten Blogbeitrag zu lesen – nun geht es an die Praxis! 

Kostenpflichtige Tools

Im Folgenden stellen wir Ihnen zwei kostenpflichtige Programme für die Bildoptimierung vor. Die kostenlosen Möglichkeiten erklären wir unter Gratis Tools.

Photoshop

Photoshop ist ein Programm aus der Palette der Adobe Creative Cloud. Wer Photoshop als Einzelprogramm nutzt, zahlt momentan knapp 24 Franken im Monat. Für die gesamte Creative Cloud sind es knapp 60 Franken im Monat. Für den Preis bietet das Tool umfangreiche Funktionen an, mit welchen sich Bilder optimieren lassen.

Über die Tastenkombination Umschalt+Ctrl+Alt+S oder Datei -> Exportieren -> Für Web speichern. Hier lassen sich Bildgrösse, Bildformat, Komprimierungsstufe usw. manuell einstellen.

Alternativen bieten Photoshop-Erweiterungen wie das Web Sharpener Panel. Das ist eine Photoshop-Erweiterung, die es beispielsweise ermöglicht, mehrere Bilder auf einmal zu optimieren – so sparen Sie viel Zeit ein.

Affinity

Eine preiswerte Alternative zu Photoshop ist Affinity Photo. Dieses Programm wird kontinuierlich weiterentwickelt und hat eine breite Akzeptanz. Aktuell kostet es einmalig 48 Franken. Für jemanden mit kleinem Budget eine wesentlich günstigere Variante.

Bei Affinity Photo können Bilder in Grösse, Format und Komprimierungsstufe optimiert werden.

Gratis Tools

Nicht jeder hat das Budget, für seine Bildoptimierung zu bezahlen. Es gibt gratis Tools im Internet, welche die Komprimierung der Bilder übernehmen. Der grösste Teil hat kaum individuelle Einstellungsmöglichkeiten, für eine schnelle und simple Komprimierung reicht es jedoch allemal.

TinyPNG

Auf TinyPNG können maximal 20 Bilder auf einmal komprimiert werden. Die Bilder dürfen nicht grösser als 5 MB sein. Möchten Sie mehr oder grössere Bilder komprimieren, wird eine Nutzungsgebühr fällig. Das Tool ist einfach bedienbar – die Bilder können Sie per Drag and Drop auf das Fenster ziehen. Nachdem die Bilder optimiert sind, werden diese zum Herunterladen bereitgestellt.

Der grosse Vorteil: PNGs und JPGs können ohne Qualitätsverlust komprimiert werden. TinyPNG gibts übrigens auch als Photoshop Erweiterung.

Squoosh

Eine zweite gratis Möglichkeit ist Squoosh. Das Tool bietet einige zusätzliche Möglichkeiten im Vergleich zu TinyPNG. Hier spielt es keine Rolle, wie gross das Bild ist. Ausserdem kann selbst ausgewählt werden, wie gross das Bild am Schluss sein soll und wie hoch die Komprimierung. Wer sich in der Bildoptimierung noch nicht wirklich zu Hause fühlt, könnte mit diesen vielen Einstellungsmöglichkeiten Mühe haben – für geübtere Nutzer kann es sich aber als nützlich erweisen.

Nachteil im Gegensatz zu TinyPNG ist, dass nicht mehrere Bilder auf einmal komprimiert werden können.

Responsive Breakpoints

Bilder für responsive Webseiten werden optimalerweise sogar in unterschiedlichen Grössen hinterlegt. So kann die Webseite je nach Bildschirmgrösse die richtige Datei laden. Das trägt zu einer noch schnelleren Webseite bei und zur besseren Einstufung in der Suchmaschine. Auch für dieses Vorgehen gibt es bereits Tools – beispielsweise Responsive Breakpoints. Es komprimiert das gewünschte Bild auf verschiedene Bildgrössen (je nach Gerät). Das Tool zeigt gleich den Code an, der in der Webseite integriert werden muss, damit die Bilder richtig laden.

Fazit

Wie sehr bei der Bildoptimierung in die Tiefe gegangen wird, kann variieren. Wichtig ist, dass Bilder überhaupt optimiert werden. Das ist heute längst nicht auf allen Webseiten der Fall. Wie sieht es mit Ihrer Webseite aus? Wenn Sie Fragen zu den Tools haben oder wir die Bildoptimierung für Sie übernehmen dürfen, sind wir gerne für Sie da.

Facebooktwitterpinterestlinkedintumblr

Bildoptimierung fürs Web

«Ich möchte ein grosses, eindrückliches Bild auf der Hauptseite» – so tönt es bei fast jeder Webseitenplanung. Bilder sind längst unabdingbar auf Webseiten – sie lösen Emotion aus, geben einen Einblick ins Unternehmen und erleichtern den Lesefluss.

Es gibt aber einen Haken für Ihre Webseite. Die Ladegeschwindigkeit der Seite wird durch zu hoch aufgelöste Bilder massiv verringert. Das mögen die Suchmaschinen gar nicht und bewerten die Webseite schlechter. Tatsächlich ist die Ladegeschwindigkeit der Webseite einer der Top-Faktoren, wenn es darum geht, ob Google Ihre Seite gut oder weniger gut einstuft. Deshalb ist es sehr wichtig, Bilder fürs Web zu optimieren.

Wie optimiere ich meine Bilder fürs Web?

Wir brauchen ein Gleichgewicht. Ein gutes Bild, das gleichzeitig schnell lädt. Wir möchten den optimalen Punkt zwischen niedrigster Dateigrösse und akzeptabler Qualität finden!
Dateiformat und Kompression spielen dabei eine wichtige Rolle. Die Bildgrösse kann um ein Vielfaches verkleinert werden, bei idealer Anwendung. Es gilt also verschiedene Schritte zu durchlaufen.

1 – Grösse anpassen

Zuerst passen wir die Grösse des Bildes an – für Bilder in einem Blog reichen 640 bis 960 Pixel auf der längeren Kante meist gut aus. Soll das Bild wirklich den ganzen Bildschirm füllen, dann muss das Bild genug gross behalten werden – eine Full HD Auflösung ist 1920 x 1080 Pixel.

Meer in Cornwall - Welle schwappt über Felsen.
zu grosses Bild – 4MB

2 – Kompressionsart/Dateiformat wählen

Danach gilt es, das richtige Dateiformat und somit auch die richtige Kompressionsart zu wählen.

  • PNG – die Kompression ist bei PNG meist verlustfrei – das ist gut für Ihr Foto, weil die Qualität nicht schlechter wird, wie beim JPEG. Die Dateigrösse hingegen, lässt sich dadurch beim PNG nicht so stark verringern, wie beim JPEG.
  • JPEG – mit JPEG lassen sich Dateigrössen von Bildern um ein Vielfaches verkleinern. Hier ist die Kompression aber verlustbehaftet, das heisst, es muss darauf geachtet werden, dass Qualität und Kompression im Gleichgewicht sind.
  • GIF – werden fast nur noch für animierte Bilder verwendet. GIFs haben einen vergleichsweise kleinen Farbraum mit nur 256 Farben, was die Qualität des Bildes verringert.

zu kleines Bild – 50 KB – Qualität ist zu schlecht

3 – Test 

Sind die Bilder verkleinert und komprimiert, werden sie in die Webseite eingefügt. Es ist wichtig, sich anzuschauen, wie die Bilder nun wirken. Wirkt die Qualität ersichtlich schlechter, dann muss die Komprimierung nochmals angepasst werden. Wenn die Qualität passt, dann sollte das Bild idealerweise nicht über 100 oder 200 KB gross sein. Zumindest für einen Blogbeitrag gilt diese Faustregel.

optimiertes Bild – 170KB – Qualität stimmt noch, Datei ist deutlich kleiner als ursprünglich

Hier folgen nun zwei Beispiele zu grossen, kleinen und mittleren Dateigrössen.  Seht ihr die Unterschiede? Wenn nicht, dann klickt auf das Bild – in der Grossansicht werden sie offensichtlich.

original – 6 MB

Das obere Bild ist zwar schön und in guter Qualität, die Dateigrösse ist aber für eine Webseite viel zu gross und macht sie langsam. Vor allem wenn mehrere solch grosser Bilder auf einer Webseite sind.

klein – 40 KB

Dieses Bild hingegen ist zu fest komprimiert. Vor allem in den unscharfen Zonen des Bildes sind die Pixel zu erkennen, was unbedingt vermieden werden sollte.

optimiert – 200 KB

Hier wurde ein Mittelweg zwischen optimaler Qualität und Dateigrösse gefunden. Die Datei ist für eine Webseite schnell ladbar und qualitativ trotzdem gut. Beim nächsten Beispiel werden die Unterschiede ebenfalls vor allem in den unscharfen Bereichen des Fotos ersichtlich

original – 8MB

klein – 25KB

optimiert – 100 KB

Fazit

Bilder sollten im Web so klein wie möglich sein und so gross wie nötig. Haben Sie Ihre Bilder auf der Webseite schon optimiert? Oder könnte es sein, dass da noch viel Potenzial wäre, um die Ladegeschwindigkeit der Seite zu optimieren?
Auf dieser Webseite können Sie herausfinden, wie es um die Optimierung ihrer Bilder steht. 

Die Bilder zu verkleinern, ist eine effiziente Art, Suchmaschinenoptimierung zu betreiben. Google sieht es gerne, wenn Webseiten schnell laden. Im nächsten Blog-Post wird erklärt, mit welchen Hilfsmitteln Sie Bilder optimieren können. Falls Sie heute schon Hilfe brauchen, unterstützen wir Sie gerne!Facebooktwitterpinterestlinkedintumblr

Texte fürs Web schreiben

Viele unserer Kunden bearbeiten die Texte für ihre Website im CMS selber. Die Texte beinhalten die wichtigsten Informationen einer Website und es lohnt sich, in gute Texte Zeit zu investieren.

Wie lesen die Nutzer im Internet?

Studien, die sich mit dem Leseverhalten im Internet beschäftigen kommen alle zu folgenden Schlüssen:

  • Leser überfliegen die Texte.
  • Leser haben mehrere Fenster nebeneinander offen und springen von der einen Website zur nächsten.
  • Leser lesen im Internet rund 25% langsamer, dies wegen der schlechteren Auflösung als bei einem gedruckten Produkt.
  • Leser verlieren schnell das Interesse. Gründe für einen raschen Absprung sind Unglaubwürdigkeit, schlechtes Design, fehlende oder unauffindbare Informationen.

Wie schreibt man für diese unaufmerksamen und ungeduldigen Leser?

Den Leser packen: Spannende und interessante Überschriften und Einleitungen suchen.

Kurz und knapp: Kurze Abschnitte, kurze Sätze, kurze Wörter.

Wichtige Informationen bieten: Schnell auf den Punkt kommen, überlegen was der Nutzer suchen könnte und diese Information kurz und prägnant schreiben.

Texte visuell gestalten: Mit Abschnitten, Aufzählungen, Überschriften oder fetten Schriftstärken den Text auflockern und das Auge leiten.

Originalität: Allerweltstexte wie „Willkommen auf unserer Homepage!“ vermeiden. Eigene Text zu Produkten oder der Firma formulieren. Inspirieren – nicht kopieren; Texte anderer Websites sind urheberrechtlich geschützt.

Schlüsselwörter benutzen: Mithilfe welcher Schlüsselwörter (Keywords) soll der Nutzer die Website finden? Die Keywords in der Navigation, in Überschriften, und Links verwenden und die Texte für die Suchmaschinen optimieren – aber für den Leser schreiben.

Einfach schreiben
  • Aktive Sprache: statt „Die Texte für Ihre Website werden von uns geschrieben.“ > „Wir schreiben die Texte für Ihre Website.“
  • Fremdwörter und Abkürzungen vermeiden.
  • Direkte Ansprache: statt „Wir würden uns über Ihren Anruf freuen.“ > „Wir freuen uns über Ihren Anruf.“
  • Keine Füllwörter benutzen, wie „auch“, „eigentlich“, „zahlreich“, „weitere“. Auf der Website Schreiblabor eigene Texte auf Anzahl Füllwörter überprüfen.
Bitte auch beachten

Keine wichtigen Informationen in PDF-Dateien verstecken: Nutzer mit dem Smartphone sind gezwungen die Dateien herunterzuladen, mit einem App zu öffnen und das PDF per rein- und rauszoomen nach der Information zu durchsuchen. PDF anbieten als Zusammenfassung der Webinhalte oder mit ergänzenden Informationen aus einem Printprodukt wie einer Broschüre oder einem Katalog.

Links richtig einsetzen: Die Verlinkung von Inhalten ist einer der Vorteile einer Website. Inhalte sinnvoll verlinken und den Nutzer durch die Website führen. Das Hervorheben von Text durch Unterstreichen wird von Nutzern mit einem Link gleichgesetzt und sollte ausser für Links nicht verwendet werden.

Dynamik des Webs nutzen: Bei einer gedruckten Broschüre können keine Fehler korrigiert oder Texte ergänzt werden – im Web schon. Die Inhalte regelmässig überarbeiten.

Auf korrekte Rechtschreibung achten: Professionelle oder private Korrekturdienste in Anspruch nehmen. Texte mit vielen Fehlern wirken schlampig, unglaubwürdig und unprofessionell.

Wenn Sie diese Punkte beachten, werden Sie nicht zum Bestseller-Schriftsteller – aber Sie werden für die Besucher Ihrer Website ansprechende und inhaltlich wertvolle Text verfassen. Viel Erfolg beim Schreiben!Facebooktwitterpinterestlinkedintumblr

Alles braucht einen Namen – drei einfache Tipps für die Suchmaschinenoptimierung

Suchmaschinenpotimierung – also die bessere Platzierung auf einer Suchmaschine wie Google – scheint ein Buch mit sieben Schlüsseln zu sein. Hier drei einfach Tipps, die jedermann bei der Arbeit auf seiner Website im Alltag leicht umsetzen kann.

  1. Bilder benennen:
    Durch technische Fortschritte ist es mittlerweile einer Maschine möglich zu „sehen“ was auf einem Bild ist, trotzdem ist das Resultat viel zuverlässiger wenn die Maschine Text lesen kann. Deshalb sollten Bilder aussagekräftig benannt werden: statt img8351.jpg ist der Suchmaschine mit geschaeftsleitung-akazie-lorenz-fehr.jpg viel mehr gesagt. Die Dateinamen dürfen lang sein.
  2. Alt-Texte für Bilder:
    Alt-Texte eines Bildes sollen beschreiben was auf dem Bild zu sehen ist. Diese Beschreibung hilft Suchmaschinen zur Identifikation des Bildes. Zusätzlich sind Alt-Texte für alle wichtig, welche auf ihren Browsern keine Bilder laden oder sie nicht sehen können: eine sehbehinderten Person benutzt spezielle Browser, welche die Alt-Texte vorlesen oder in Braille-Schrift übersetzen.
    Hinweis für alle leoncms-Nutzer: das leoncms benutzt für die Alt-Texte automatisch die Dateinamen der Bilder (s. Punkt 1).
  3. Namhafte Links setzen:
    Was für Bilder gilt, zählt auch bei den Links: Der Linktext sollte einen Hinweis geben, wo der Nutzer nach dem Klick landet: „Weitere Informationen zu den Office-Produkten finden Sie bei unserem Partner Microsoft.“ funktioniert für den Nutzer wie auch für die Suchmaschine viel besser als „Weitere Informationen finden Sie hier.“ Es können mehrere Worte verwendet werden, auf ganze Abschnitte oder mehrere Sätze sollte verzichtet werden. Da Links generell für die Suchmaschinenoptimierung wichtig sind, lohnt sich hier eine saubere Arbeit doppelt.

Natürlich bewirken diese drei Tipps keine Platzierung auf dem ersten Platz, doch im komplexen Thema Suchmaschinenoptimierung sind sie ein Puzzle-Teil, das zum Erfolg beiträgt.Facebooktwitterpinterestlinkedintumblr

Google My Business

Eine Anmeldung bei Google My Business ist laut Experten ein unverzichtbarer Schritt, um Ihr Unternehmen im Netz besser sichtbar zu machen. Google wird von der Mehrheit der Nutzer verwendet und das Unternehmen bietet eine Vielzahl von kostenlosen Marketing-Tools, die als Firma verwendet werden können, z.B. My Business, Youtube, Google+, Maps. Diese Vielzahl von Anwendungen und der stete Wandel – jedes Update bringt Änderungen und Neuerungen mit sich – machen es nicht einfach, sich einzuarbeiten

Voraussetzung Google Konto
Um ein Unternehmen zu Google My Business hinzuzufügen brauchen Sie ein Google Konto. Sie können sich mit einem bereits bestehenden Konto anmelden oder ein neues Konto für das Unternehmen erstellen. Mit einem Google Konto haben Sie Zugriff auf alle Angebote von Google.

Navigation zu Google My Business
Nach der Anmeldung mit einem Google Konto finden Sie Ihre Profilinformationen oben rechts. Klicken Sie auf das Apps-Symbol, um zu My Business zu wechseln. Falls My Business nicht angezeigt wird, klicken Sie auf „Mehr“ bzw. „Noch mehr von Google“.

google_my_business_anmeldung1

google_my_business_anmeldung2

Unternehmen eintragen
Auf der Startseite von Google My Business, klicken Sie auf „Unternehmen eintragen“. Suchen Sie mittels Suchfeld nach Ihrem Unternehmen. Google findet entweder bereits vorhandene Daten zum Beispiel aus einem Branchenbuch oder Ihr Unternehmen ist noch nicht in der Datenbank vorhanden. Wählen Sie entweder Ihr Unternehmen an oder klicken Sie auf „Ich habe den Namen…“.

google_my_business_anmeldung3

google_my_business_anmeldung4

google_my_business_anmeldung6

Im Formular können Sie die wichtigsten Eckdaten Ihres Unternehmens eintragen. Diese können später nochmals überarbeitet werden. Nicht jedes Unternehmen verfügt über ein Ladenlokal oder einen öffentlichen Standort, zum Beispiel als Handwerksunternehmen fahren Sie zum Kunden. In diesem Fall setzen Sie das Häkchen bei „Ich biete Produkte und Dienstleistungen am…“. Aufgrund dieser Angabe können Sie Ihr Einzugsgebiet angeben, was wiederum die Resultate einer Suche bei Google beeinflusst.

google_my_business_anmeldung7

Unternehmen bestätigen
Google führt mehrere Bestätigungsschritte zur Absicherung durch, damit Unternehmenskonten vor Manipulation durch Dritte geschützt sind.
Per Post erhalten Sie einen Code zur Bestätigung. Erst danach sind die Eingaben Ihres My Business Kontos öffentlich sichtbar.
Zusätzlich ist bei der Erstellung eines Kontos die Eingabe eines zweiten Codes erforderlich, diesen Code erhalten Sie wahlweise über SMS oder Anruf.

google_my_business_anmeldung5

google_my_business_bestaetigung1

google_my_business_bestaetigung2

Geschafft – erster Blick in Google My Business
Nun haben Sie also Zugang zu Google My Business. Als erstes sehen Sie Ihre Startseite. Ein Teil der Funktionen sind erst nach der Bestätigung verfügbar. Trotzdem können Sie Ihre Angaben vervollständigen, am einfachsten klicken Sie dafür auf „Informationen bearbeiten“ oder „Fotos“.google_my_business_dashboard

Informationen bearbeiten
Berücksichtigen Sie bei der Angabe Ihrer Informationen folgende Punkte:
Name des Unternehmens / Adresse / Kontaktdaten (Telefon): Achten Sie darauf, dass Ihre Angaben mit den Angaben auf Ihrer Website (Kontaktseite, Impressum) übereinstimmen. Schreiben Sie Ihren Unternehmensdaten und Kontaktangaben auf den Buchstaben genau identisch, nicht „Testunternehmen“ und  „Testunternehmen GmbH“ oder Strasse und Str.
Kategorie: Suchen Sie in den Vorschlägen die passendsten und beschränken Sie sich auf eine Hauptkategorie und eine bis zwei zusätzliche Kategorien.
Öffnungszeiten: Um Öffnungszeiten zu finden wird häufig Google verwendet. Geben Sie hier Ihre korrekten Öffnungszeiten an, dabei kann es sich auch um Büro- oder Telefonzeiten handeln.
Einführung: Beschreiben Sie Ihr Unternehmen, besonders spezielle Produkte und Angebote.

google_my_business_informationen_bearbeiten

Fotos
Verwenden Sie qualitativ gute und eigene Fotos für Ihr Profil bei My Business. Auf jeden Fall sollten Sie die Fotos zu Ihrer Identität hochladen. Google macht hilfreiche Angaben zu Art, Grössen und Auflösung des Bildmaterials.

Profilbild: Das Profilbild wird meist kreisförmig ausgeschnitten. Verwenden Sie am Besten ein eindeutiges Element aus Ihrem Logo. Positionieren Sie es in einem quadratischen Format auf weissem Grund mit genügend Abstand zum Rand. Als Akazie verwenden wir das grosse grüne A.
Logo: Auch das Logo in einem Quadrat auf weissem Grund positionieren.
Hintergrundbild: Verwenden Sie ein Bild, das einen Einblick in Ihr Unternehmen gibt: Ein Aussen- oder Innenansicht Ihres Geschäfts, Ihrer Werkstatt, ein besonders gelungenes Kundenprojekt oder Ihre besten Produkte. Als digitale Firma verwenden wir das gleiche Bild wie auf der Startseite unserer Website. Schneiden Sie ihr Foto im Format 16:9 zu.

Weitere Fotos (Innen-, Aussenaufnahmen, Mitarbeiter…) helfen Ihr Unternehmen genauer zu beschreiben.

google_my_business_fotos_beispiel_akazie

Übersicht Google My Business
In Ihrem My Business Konto können Sie Ihr Unternehmen verwalten. Hier können Sie zwischen verschiedenen Ansichten wechseln. In der Listenansicht können Sie auf die weiteren Google Dienste, wie Google+ oder Google Maps zugreifen. Mit der Bestätigung in My Business wird für Ihr Unternehmen eine Google+ Seite und einen Eintrag auf Google Maps eröffnet, zeigt eine einfache Statistik zu Ihrer Website und Bewertungen Ihres Unternehmens an.

google_my_business_startseite_liste
Listenansicht (Beispiel Akazie): 1. Wechsel zwischen Karten- und Listenansicht; 2. Weiterer Standort hinzufügen; 3. Zu weiteren Dienstleistungen von Google wechseln; 4. Navigation öffnen

google_my_business_uebersicht
Kartenansicht

Betreuen Sie mehrere Unternehmen? Über die Navigation können Sie zusätzliche Unternehmenskonten erstellen und diese mit dem gleichen Login verwalten.

google_my_business_navigation

Bei Rückfragen oder für Unterstützungen jeglicher Art stehen wir gerne zur Verfügung. Wir wünschen Ihnen viel Erfolg – unter anderem Dank Ihrem My Business Eintrag!Facebooktwitterpinterestlinkedintumblr

SSL für alle

Da die Verschlüsselung der Daten, wie auch eine sichere Verbindung zu einer Webseite immer wichtiger ist, setzen wir bei allen unseren Kunden auf das Protokoll HTTPS.
Weil uns die Sicherheit der Daten ein Anliegen ist, haben wir uns für einen Hoster in der Schweiz entschieden (cyon). Weitere Gründe für unsere Entscheidung war die Benutzerfreundlichkeit der Oberfläche, der Support wie auch der Standort des Hosters.

Seit Beginn 2016 ist unsere Webseite akazie.com per HTTPS erreichbar.
Für alle neu erstellten Websites wird die Verschlüsselung automatisch erstellt, unsere Kunden müssen sich so keine Gedanken machen das eine Drittperson den Traffic abfangen und einsehen könnte. Wir werden auch bei unseren bestehenden Kunden das SSL-Protokoll aktivieren, damit am Ende alle Kunden von uns eine verschlüsselte Verbindung zu ihrer Seite aufbauen können.

Ob eine Webseite verschlüsselt ist oder nicht, erkennen Sie in der Adresszeile des Browsers (dies kann je nach Browser leicht abweichen):

Verschlüsselte Verbindung

Sollten Sie in Ihrer Adresszeile kein solches Zeichen sehen, ist Ihre Verbindung zu dieser Webseite nicht verschlüsselt und es wäre möglich Ihre Aktivität im Internet einzusehen.

Ein weiterer Grund wieso wir auf SSL aufbauen ist die Indexierung bei Google.
Google berücksichtigt diverse Kriterien für das Ranking der Seiten, SSL ist nun auch ein Teil davon.


Dies alles ist uns möglich da cyon ihren Kunden kostenlos die SSL Zertifikate anbietet.Facebooktwitterpinterestlinkedintumblr

Neue Website für ImmoSiT

Home Immosit
Startseite Immosit

Für das junge Immobilienbüro ImmoSiT mit Sitz an der Lenk durften wir eine neue Website umsetzen. Dies war unser erstes Projekt das wir von A bis Z, also vom Konzept über das Design bis zum Coden vollständig firmenintern umgesetzt haben. Umso mehr freuen wir uns über das gelungene und ansprechende Resultat.
Wie auch alle unsere anderen Web-Projekte läuft im Hintergrund das leon* CMS.
Die Website ist voll responsiv und wird auf allen Gerätegrössen optimiert angezeigt.

Special Ferienwohnungen
Besonderes Gewicht legten wir darauf, dass Ferienwohnungen in Text und Bild übersichtlich und ansprechend präsentiert werden können. Neben einer grossen Bildergalerie wird dem Nutzer der Zugriff auf die Beschreibung, die Preise, der Verfügbarkeitskalender und ein Buchungsformular über das Registermenu ermöglicht:
Ferienwohnung_mieten

Die Beschreibung der Ferienwohnung ist in einer Tabelle dargestellt, welche auch auch auf einem Smartphone lesefreundlich dargestellt wird:

Beschreibung Ferienwohnung

Auch für die Administration ist das Ausfüllen, Bearbeiten oder Erstellen einer Beschreibung im Backend vom leon* CMS sehr bedienerfreundlich. Die vordefinierten Felder können einfach ausgefüllt oder markiert werden und schon wird auf der Website alles korrekt dargestellt.

beschreibung_backend

Der Kalender wird vom externen Ferienwohnungs-Tool in die Website eingebunden, so müssen die Termine von der Firma ImmoSiT nur auf einer Plattform aktualisiert werden.

Feriewohnung_Kalender

Über das Formular in der Buchungsanfrage können sich Interessierte direkt für eine Ferienwohnung melden.

Logo-Design
Besonders gefreut hat uns an diesem Auftrag auch, dass wir nebst dem Auftrag für die neue Website auch den allgemeinen Firmenauftritt überarbeiten durften. Entstanden ist ein frisches und ansprechendes aber trotzdem sachliches Corporate Design.

logo_4f_screen

Wir wünschen der Firma ImmoSiT viel Erfolg und danken für den Auftrag.Facebooktwitterpinterestlinkedintumblr