Creare immagini, gallerie fotografiche e slider in Kopage

Le immagini sono tra gli elementi di design più importanti di un sito web. Nel classico website builder Kopage puoi utilizzare le tue immagini, sostituire quelle esistenti e presentare più scatti tramite gallerie fotografiche o slider.

In questo modo non dovresti prestare attenzione solo all'aspetto di un'immagine. Anche la dimensione del file, le dimensioni, l'inquadratura e la visualizzazione su schermi di diverse dimensioni influenzano la qualità del tuo sito web.

In questa guida ti mostriamo come utilizzare in modo sensato le immagini in Kopage e quando è adatta una singola immagine, una galleria fotografica o uno slider.

Breve spiegazione: Usa singole immagini per i normali contenuti di pagina, una fotogalerie per più scatti correlati e uno slider se si desidera mostrare più immagini all'interno di un'area di presentazione comune.

Utilizzare immagini in un sito web Jimdo #

Le immagini possono essere inserite in diversi punti del tuo sito web in Kopage.

Esempi tipici sono le immagini all'interno di blocchi di contenuto, aree visive più grandi, immagini di team o di referenze, nonché immagini all'interno di una galleria o di uno slider.

Quale variante sia opportuno scegliere dipende dal compito che l'immagine deve svolgere.

Una foto accanto alla descrizione di una prestazione, ad esempio, non ha bisogno di una galleria fotografica. Se invece desideri presentare più scatti di un progetto, una galleria può risultare molto più ordinata.

Carica la tua immagine #

Se desideri sostituire un'immagine di esempio esistente con una tua immagine o creare una nuova area di immagine, puoi utilizzare il tuo file di immagine in Kopage.

Seleziona a tal fine la funzione immagine all'interno dell'area di contenuto interessata e carica il file desiderato oppure seleziona un'immagine già esistente dalla tua gestione file.

Prima di caricare un file, dovresti controllare se è adatto per l'uso su un sito web.

Consiglio pratico: Prepara le immagini il più possibile per il loro scopo prima di caricarle. Gli originali molto grandi di fotocamere o smartphone generano volumi di dati non necessari, sebbene vengano visualizzati in dimensioni molto ridotte sul sito web.

Sostituire l'immagine esistente #

Molti modelli e blocchi di contenuto contengono già immagini di esempio. Queste servono come elementi di riserva e possono essere sostituite con le tue immagini.

Durante la sostituzione, dovresti assicurarti che la nuova immagine si adatti all'area prevista.

Un'immagine con un formato molto verticale può ad esempio risultare inadatta se l'area di contenuto è prevista per un formato panoramico ampio.

Verifica quindi sempre l'inquadratura effettiva dell'immagine sul sito web dopo la sostituzione.

Quali formati di immagine sono adatti per un sito web? #

Per le normali immagini di siti web si utilizzano in particolare moderni formati web, oltre a JPEG e PNG.

Quale formato sia opportuno dipende dal contenuto dell'immagine.

Per le fotografie è adatto un formato di immagine compresso. Per la grafica o i loghi, invece, può essere necessario un formato con trasparenza.

Ciò che è determinante è un ragionevole compromesso tra qualità dell'immagine e dimensione del file.

Importante: Un file di immagine il più grande possibile non significa automaticamente una resa migliore. Per i siti web, una dimensione di file adeguata è importante tanto quanto la qualità visiva dell'immagine.

Ridurre le immagini prima del caricamento #

Gli smartphone e le fotocamere digitali moderni producono immagini con risoluzioni molto elevate. Tali file originali sono spesso inutilmente grandi per l'uso diretto su un normale sito web.

Se, ad esempio, un'immagine sul tuo sito web viene visualizzata con una larghezza di soli 1000 pixel circa, un file originale largo diverse migliaia di pixel di solito non offre alcun vantaggio reale per il visitatore.

Invece, può aumentare la quantità di dati da trasferire.

Riduci quindi le immagini a una dimensione ragionevole per l'effettivo utilizzo e comprimile senza compromettere inutilmente la qualità visiva.

Dimensione del file e tempo di caricamento #

Le immagini sono spesso tra i file più grandi di un sito web. Diversi foto inutilmente grandi possono quindi influenzare notevolmente il tempo di caricamento.

Ciò è particolarmente rilevante sugli smartphone e con connessioni internet più lente.

Se una pagina contiene dieci foto grandi, il browser deve trasferire molti più dati rispetto a immagini opportunamente ottimizzate.

L'ottimizzazione delle immagini non è quindi solo un intervento di design, ma anche una misura tecnica.

Scegliere l'inquadratura giusta #

Un'immagine di partenza di buona qualità non funziona automaticamente in qualsiasi layout.

Nella scelta dovresti considerare quanto spazio è previsto per l'immagine e quale rapporto di forma possiede la relativa area.

Un esempio:

Area di contenuto ampia
→ preferibilmente orizzontale

Ritratto di persona
→ spesso verticale

Galleria uniforme
→ proporzioni delle immagini il più possibile coerenti

Ciò non significa che tutte le immagini debbano avere esattamente lo stesso formato. Tuttavia, uno stile d'immagine uniforme può far apparire una galleria o una pagina decisamente più armoniosa.

Utilizzare immagini all'interno dei blocchi di contenuto #

I Content Block possono contenere diverse combinazioni di testi e immagini.

Con questo puoi, ad esempio, mostrare un testo accanto a un'immagine o creare una zona visiva più ampia all'interno di una pagina.

Ti spiegheremo come selezionare e modificare fondamentalmente i blocchi di contenuto su Creare contenuti con Kopage: modifica di blocchi di contenuto, testi e immagini.

Cos'è il File Manager? #

Kopage dispone di un gestore di file che ti permette di gestire i file o le immagini caricati.

Questo è utile se desideri riutilizzare un'immagine già caricata in un altro punto.

In questo modo non devi ricaricare ogni volta lo stesso file dal computer per ogni utilizzo.

Una gestione dei file chiara diventa particolarmente importante quando il tuo sito web contiene nel tempo molte immagini e altri file.

Organizzare i file in modo logico #

Evita di caricare inutilmente le stesse immagini più volte.

Se è già disponibile un file adatto, dovresti usarlo se possibile.

Anche i nomi di file comprensibili aiutano nella gestione successiva.

Un nome file come:

team-curiaweb.jpg

è, ad esempio, molto più significativo di:

IMG_839274.jpg

Ciò vale in particolare se in seguito saranno presenti molti file nella gestione media.

Modifica immagini #

Kopage offre strumenti per la modifica delle immagini. Con questi strumenti è possibile adattare le immagini per l'uso all'interno del sito web.

Tuttavia, è opportuno utilizzare già un file di partenza idoneo.

Un editor di immagini integrato non dovrebbe servire a compensare permanentemente immagini di origine molto grandi o fondamentalmente inadatte.

Cos'è una galleria fotografica? #

Una fotogalleria è utile se desideri presentare in modo chiaro diverse immagini correlate.

Tipiche aree di applicazione sono, ad esempio:

• Progetti di riferimento,
• Eventi,
• Prodotti o opere,
• Locali,
• Foto di squadra o di club.

Invece di inserire ogni immagine come blocco di contenuto separato, puoi mostrare gli scatti in una galleria unita.

Creare una galleria fotografica in Kopage #

Apri la pagina in cui desideri inserire la tua galleria e seleziona la relativa funzione di galleria o il modulo apposito.

Aggiungi quindi le immagini desiderate e controlla la loro disposizione e visualizzazione.

A seconda della visualizzazione della galleria utilizzata, dovresti prestare particolare attenzione al fatto che le immagini selezionate si abbinino visivamente.

Consiglio pratico: Una galleria con dieci immagini accuratamente selezionate risulta spesso migliore di una galleria con cinquanta scatti molto simili. Mostra le immagini che sono effettivamente interessanti per i visitatori.

Ordine delle immagini della galleria #

L'ordine può influenzare il modo in cui i visitatori percepiscono una serie di immagini.

In un progetto, ad esempio, puoi procedere in modo cronologico:

Situazione di partenza
       ↓
Lavori
       ↓
Risultato parziale
       ↓
progetto finito

In una galleria generale, invece, l'immagine più forte o più significativa può essere utile all'inizio.

Evita, se possibile, un ordine del tutto casuale se le immagini devono mostrare insieme una storia o un'evoluzione.

Che cos'è uno slider? #

Un cursore mostra più contenuti o immagini all'interno di un'area comune in sequenza.

Ciò consente di presentare più immagini senza doverle mostrare tutte contemporaneamente una sotto l'altra.

I slider possono essere utilizzati, ad esempio, per referenze selezionate o impressioni visive.

Quando è utile un carosello? #

Un cursore dovrebbe soddisfare uno scopo specifico e non essere utilizzato solo perché la funzione è disponibile.

Se una singola immagine forte trasmette già il messaggio desiderato, questa può essere più semplice e d'impatto.

Un cursore è più adatto quando più immagini appartengono effettivamente insieme e devono essere mostrate all'interno della stessa area.

Nota: Maggiore movimento non significa automaticamente un web design migliore. Utilizza uno slider solo dove diversi contenuti alternati offrono un reale valore aggiunto al visitatore.

Galleria o slider: qual è meglio? #

Entrambe le funzioni perseguono obiettivi diversi.

Galleria fotografica
→ visualizzare chiaramente più immagini

Slider
→ mostrare più immagini nella stessa area di presentazione

Immagine singola
→ supportare in modo mirato un determinato messaggio

Se i visitatori devono confrontare più foto tra loro o sceglierle liberamente, una galleria è spesso più indicata.

Se invece si desidera mostrare solo pochi impressioni visive all'interno di un'area compatta, può essere utile un slider.

Non ogni pagina ha bisogno di una galleria o di uno slider #

Le funzioni visive aggiuntive dovrebbero sempre adattarsi al contenuto.

Ad esempio, su una pagina di contatto non è spesso necessario un grande cursore di immagini. Su una pagina di referenze o di progetti, invece, una galleria può essere molto utile.

Utilizza quindi tali funzioni in modo mirato e non automaticamente su ogni pagina.

Qualità dell'immagine all'interno di una galleria #

In una galleria le differenze tra i singoli quadri saltano particolarmente all'occhio.

Risoluzioni, rapporti d'aspetto o stili visivi marcatamente differenti possono rendere la visualizzazione caotica.

Wenn möglich, bereite zusammengehörige Galerie-Bilder deshalb in ähnlicher Qualität und mit einem passenden Seitenverhältnis vor.

Zu viele Bilder vermeiden #

Eine umfangreiche Bildergalerie kann nicht nur unübersichtlich werden, sondern auch zusätzliche Daten übertragen.

Überlege deshalb, welche Bilder tatsächlich notwendig sind.

Bei einer Referenzseite müssen beispielsweise nicht zwanzig fast identische Aufnahmen desselben Motivs gezeigt werden.

Eine gezielte Auswahl erleichtert Besuchern die Orientierung und reduziert gleichzeitig unnötige Datenmengen.

Bilder auf dem Smartphone kontrollieren #

Ein Bild kann auf einem Desktop-Monitor hervorragend aussehen und auf einem Smartphone einen ungünstigen Ausschnitt zeigen.

Kontrolliere deshalb insbesondere:

• große Titel- und Hintergrundbilder,
• Text-Bild-Content-Blocks,
• Galerien,
• Slider,
• und Bilder mit wichtigen Motiven am Rand.

Weitere Hinweise zur mobilen Darstellung findest du unter Design Responsive: ottimizzare il sito web Kopage per smartphone e tablet.

Text nicht als Bild einbauen #

Wichtige Informationen sollten nach Möglichkeit als echter Text auf der Website stehen und nicht ausschließlich Bestandteil eines Bildes sein.

Das betrifft beispielsweise Überschriften, Kontaktinformationen oder längere Beschreibungen.

Echter Text lässt sich auf unterschiedlichen Bildschirmgrößen besser darstellen und kann von Suchmaschinen und unterstützenden Technologien besser verarbeitet werden.

Bilder und Suchmaschinenoptimierung #

Bilder können auch für die Suchmaschinenoptimierung relevant sein. Entscheidend ist dabei vor allem, dass sie sinnvoll in den Seiteninhalt eingebunden werden und technisch vernünftig eingesetzt werden.

Verwende aussagekräftige Dateinamen und – sofern die entsprechende Funktion im verwendeten Bereich zur Verfügung steht – eine sinnvolle Beschreibung beziehungsweise einen Alternativtext für inhaltlich relevante Bilder.

Ein Alternativtext sollte beschreiben, was für das Verständnis des Bildes beziehungsweise des Seiteninhalts relevant ist, und nicht mit einer Liste von Suchbegriffen gefüllt werden.

Die allgemeinen SEO-Einstellungen behandeln wir unter SEO con Kopage: titolo della pagina, metadati, URL e ottimizzazione per i motori di ricerca.

Urheberrechte bei Bildern beachten #

Nur weil ein Bild im Internet gefunden werden kann, bedeutet das nicht, dass du es auf deiner eigenen Website verwenden darfst.

Verwende deshalb eigene Bilder oder Dateien, für deren Nutzung du die erforderlichen Rechte besitzt.

Bei Bildern aus Bilddatenbanken solltest du die jeweiligen Lizenzbedingungen beachten und prüfen, ob beziehungsweise in welcher Form eine Quellen- oder Urheberangabe erforderlich ist.

Importante: Lade keine Bilder aus der Google-Bildersuche oder von fremden Websites herunter und verwende sie ungeprüft auf deiner Website. Die Auffindbarkeit eines Bildes sagt nichts über deine Nutzungsrechte aus.

Bilder später austauschen #

Du kannst Bilder auf deiner Kopage Website später aktualisieren oder ersetzen.

Das ist beispielsweise sinnvoll, wenn neue Teamfotos vorhanden sind, Referenzen aktualisiert werden oder ein bisher verwendetes Bild nicht mehr zum Erscheinungsbild deiner Website passt.

Kontrolliere nach dem Austausch, ob der neue Bildausschnitt weiterhin zum betreffenden Content Block beziehungsweise zur Galerie passt.

Bilder löschen #

Wenn du eine Bilddatei nicht mehr benötigst, solltest du vor dem endgültigen Löschen prüfen, ob sie noch an einer anderen Stelle der Website verwendet wird.

Das ist besonders wichtig, wenn du Dateien über eine zentrale Dateiverwaltung mehrfach eingesetzt hast.

Attenzione: Entferne eine Datei nicht vorschnell aus der Dateiverwaltung, wenn du nicht sicher bist, ob sie noch auf einer anderen Seite, in einer Galerie oder in einem anderen Bereich verwendet wird.

Typische Fehler bei Bildern #

Häufige Probleme entstehen durch unnötig große Dateien, ungeeignete Bildausschnitte, unscharfe Bilder oder sehr unterschiedliche Bildstile innerhalb derselben Seite.

Auch zu viele Slider und Galerien können eine Website überladen.

Ein weiteres Problem sind Bilder, die zwar dekorativ aussehen, aber nicht zum eigentlichen Inhalt passen.

Verwende Bilder deshalb gezielt und betrachte sie als Bestandteil deiner Kommunikation – nicht nur als Dekoration.

Controllo prima della pubblicazione #

Nach größeren Bildänderungen lohnt sich eine kurze Kontrolle:

Sind alle Platzhalterbilder ersetzt?
        ↓
Sind die Bilder scharf?
        ↓
Sind die Dateien sinnvoll dimensioniert?
        ↓
Stimmen die Bildausschnitte?
        ↓
Funktionieren Galerie und Slider?
        ↓
Ist die Reihenfolge sinnvoll?
        ↓
Smartphone-Darstellung prüfen
        ↓
Seite im normalen Browser testen

Come procediamo? #

Nachdem du Seiten, Content Blocks und Bilder verwalten kannst, ist eine weitere häufig benötigte Funktion das Kontaktformular.

Damit können Besucher direkt über deine Website Anfragen und andere Informationen übermitteln.

Si prosegue quindi con Creare moduli e moduli di contatto con Kopage.

Riepilogo #

Im klassischen Kopage Website Builder kannst du einzelne Bilder innerhalb deiner Seiten verwenden und mehrere Bilder über Fotogalerien oder Slider präsentieren.

Bereite Bilder möglichst passend für ihren tatsächlichen Einsatzzweck vor. Achte auf ausreichende Qualität, vernünftige Dateigrößen und einen geeigneten Bildausschnitt.

Eine Fotogalerie eignet sich für mehrere zusammengehörige Bilder, während ein Slider mehrere Bilder innerhalb eines gemeinsamen Präsentationsbereichs darstellen kann. Für viele Inhalte reicht dagegen ein einzelnes, gut ausgewähltes Bild vollkommen aus.

Kontrolliere Bilder, Galerien und Slider immer auch auf kleineren Bildschirmgrößen und verwende ausschließlich Bildmaterial, für dessen Nutzung du die notwendigen Rechte besitzt.

Gute Bildgestaltung bedeutet nicht, möglichst viele Bilder einzusetzen. Entscheidend sind passende Motive, gute Qualität, vernünftige Dateigrößen und ein klarer Zweck innerhalb der jeweiligen Seite.