{"id":22053,"date":"2026-08-26T16:10:40","date_gmt":"2026-08-26T14:10:40","guid":{"rendered":"https:\/\/www.curiaweb.ch\/?post_type=docs&p=22053"},"modified":"2026-08-26T16:12:39","modified_gmt":"2026-08-26T14:12:39","password":"","slug":"kopage-bilder-galerien-einfuegen","status":"publish","type":"docs","link":"https:\/\/www.curiaweb.ch\/en\/hilfe\/website-baukasten\/kopage-bilder-galerien-einfuegen\/","title":{"rendered":"Insert images and galleries in the Kopage website builder"},"content":{"rendered":"

Mit dem Kopage Website-Baukasten kannst du Bilder direkt in deine Website einf\u00fcgen und mehrere Bilder in Galerien pr\u00e4sentieren. Bilder lassen sich hochladen, ausw\u00e4hlen und anschliessend direkt im Editor bearbeiten.<\/p>\n\n\n\n

In dieser Anleitung zeigen wir dir, wie du einzelne Bilder und Galerien in Kopage einf\u00fcgst und worauf du bei Bildgr\u00f6sse und Alt-Texten achten solltest.<\/p>\n\n\n\n

1. Ein einzelnes Bild einf\u00fcgen<\/h2>\n\n\n\n
    \n
  1. \u00d6ffne die gew\u00fcnschte Seite im Kopage Website-Baukasten.<\/li>\n\n\n\n
  2. Wechsle in den Bearbeitungsmodus der Seite.<\/li>\n\n\n\n
  3. F\u00fcge an der gew\u00fcnschten Position ein Bild-Element<\/strong> hinzu.<\/li>\n\n\n\n
  4. W\u00e4hle ein bereits vorhandenes Bild aus oder lade ein neues Bild hoch.<\/li>\n\n\n\n
  5. Passe das Bild anschliessend an das Design deiner Seite an.<\/li>\n<\/ol>\n\n\n\n

    Je nach verwendetem Layout kannst du unter anderem die Gr\u00f6sse, Position und Darstellung des Bildes anpassen.<\/p>\n\n\n\n

    2. Mehrere Bilder als Galerie einf\u00fcgen<\/h2>\n\n\n\n

    Wenn du mehrere Bilder gemeinsam pr\u00e4sentieren m\u00f6chtest, kannst du daf\u00fcr eine Galerie verwenden.<\/p>\n\n\n\n

      \n
    1. \u00d6ffne die gew\u00fcnschte Seite im Bearbeitungsmodus.<\/li>\n\n\n\n
    2. F\u00fcge an der gew\u00fcnschten Position ein Galerie-Element<\/strong> hinzu.<\/li>\n\n\n\n
    3. W\u00e4hle die Bilder aus, die in der Galerie erscheinen sollen.<\/li>\n\n\n\n
    4. Lade bei Bedarf weitere Bilder hoch.<\/li>\n\n\n\n
    5. Ordne die Bilder in der gew\u00fcnschten Reihenfolge an.<\/li>\n\n\n\n
    6. Speichere deine \u00c4nderungen.<\/li>\n<\/ol>\n\n\n\n

      Eine Galerie eignet sich beispielsweise f\u00fcr Referenzen, Produkte, Veranstaltungen, R\u00e4umlichkeiten oder andere Inhalte, bei denen mehrere Bilder zusammengeh\u00f6ren.<\/p>\n\n\n\n

      3. Bilder f\u00fcr deine Website vorbereiten<\/h2>\n\n\n\n

      Lade Bilder nicht unn\u00f6tig gross auf deine Website. Sehr grosse Bilddateien ben\u00f6tigen mehr Speicherplatz und k\u00f6nnen die Ladezeit deiner Seiten erh\u00f6hen.<\/p>\n\n\n\n

      Vor dem Hochladen solltest du deshalb pr\u00fcfen:<\/p>\n\n\n\n

        \n
      • Passt die Bildgr\u00f6sse zum vorgesehenen Einsatz?<\/li>\n\n\n\n
      • Ist die Dateigr\u00f6sse m\u00f6glichst klein, ohne dass die sichtbare Qualit\u00e4t darunter leidet?<\/li>\n\n\n\n
      • Verwendest du ein geeignetes Bildformat?<\/li>\n\n\n\n
      • Ist der Dateiname verst\u00e4ndlich und aussagekr\u00e4ftig?<\/li>\n<\/ul>\n\n\n\n

        F\u00fcr Fotos eignen sich moderne, weboptimierte Bildformate. Bei Grafiken oder Bildern mit Transparenz kann abh\u00e4ngig vom Motiv ein anderes Format sinnvoll sein.<\/p>\n\n\n\n

        Tip:<\/strong> Es gibt keine feste Dateigr\u00f6sse, die f\u00fcr jedes Bild optimal ist. Ein kleines Vorschaubild ben\u00f6tigt deutlich weniger Daten als ein grossfl\u00e4chiges Headerbild. Entscheidend ist ein gutes Verh\u00e4ltnis zwischen Bildqualit\u00e4t, Abmessungen und Dateigr\u00f6sse.<\/p>\n\n\n\n

        4. Alt-Texte f\u00fcr Bilder verwenden<\/h2>\n\n\n\n

        Wenn Kopage f\u00fcr ein Bild die Eingabe eines Alt-Textes<\/strong> erm\u00f6glicht, solltest du diesen bei inhaltlich relevanten Bildern sinnvoll verwenden.<\/p>\n\n\n\n

        Der Alt-Text beschreibt kurz, was auf dem Bild zu sehen ist oder welche inhaltliche Funktion das Bild erf\u00fcllt. Er unterst\u00fctzt insbesondere Besucher, die Screenreader verwenden, und hilft Suchmaschinen dabei, den Bildinhalt einzuordnen.<\/p>\n\n\n\n

        Ein guter Alt-Text beschreibt das Bild konkret und nat\u00fcrlich.<\/p>\n\n\n\n

        Example:<\/p>\n\n\n\n

        B\u00fcndner Berglandschaft mit Blick auf den Calanda bei Chur<\/code><\/pre>\n\n\n\n
        Vermeide dagegen mit Keywords \u00fcberladene Beschreibungen oder Texte, die mit dem tats\u00e4chlichen Bildinhalt nichts zu tun haben.<\/p>\n\n\n\n
        5. \u00c4nderungen speichern und Website kontrollieren<\/h2>\n\n\n\n
        Speichere deine \u00c4nderungen und kontrolliere die Seite anschliessend auch ausserhalb des Editors.<\/p>\n\n\n\n
        Achte insbesondere darauf, wie deine Bilder auf unterschiedlichen Bildschirmgr\u00f6ssen dargestellt werden. Ein Bild, das auf einem grossen Bildschirm gut aussieht, kann auf einem Smartphone anders zugeschnitten oder angeordnet werden.<\/p>\n\n\n\n
        Pr\u00fcfe deshalb nach gr\u00f6sseren \u00c4nderungen sowohl die Desktop- als auch die mobile Darstellung deiner Website.<\/p>","protected":false},"excerpt":{"rendered":"
        Mit dem Kopage Website-Baukasten kannst du Bilder direkt in deine Website einf\u00fcgen und mehrere Bilder in Galerien pr\u00e4sentieren. Bilder lassen sich hochladen, ausw\u00e4hlen und anschliessend direkt im Editor bearbeiten. In dieser Anleitung zeigen wir dir, wie du einzelne Bilder und Galerien in Kopage einf\u00fcgst und worauf du bei Bildgr\u00f6sse und Alt-Texten achten solltest. 1. Ein […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_joinchat":[],"footnotes":""},"doc_category":[84],"doc_tag":[],"class_list":["post-22053","docs","type-docs","status-publish","hentry","doc_category-website-baukasten"],"year_month":"2026-09","word_count":517,"total_views":"3","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"Silvio Mazenauer","author_nicename":"admin-curia","author_url":"https:\/\/www.curiaweb.ch\/en\/author\/admin-curia\/"},"doc_category_info":[{"term_name":"Website-Baukasten","term_url":"https:\/\/www.curiaweb.ch\/en\/hilfe-kategorie\/website-baukasten\/"}],"doc_tag_info":[],"knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/docs\/22053","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/comments?post=22053"}],"version-history":[{"count":1,"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/docs\/22053\/revisions"}],"predecessor-version":[{"id":22055,"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/docs\/22053\/revisions\/22055"}],"wp:attachment":[{"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/media?parent=22053"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/doc_category?post=22053"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.curiaweb.ch\/en\/wp-json\/wp\/v2\/doc_tag?post=22053"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}