Huis Sociale Media Omgaan met afbeeldingen op uw website - dummies

Omgaan met afbeeldingen op uw website - dummies

Inhoudsopgave:

Video: Afbeelding op de juiste manier opslaan voor het web 2024

Video: Afbeelding op de juiste manier opslaan voor het web 2024
Anonim

Het moeilijkste aspect van het opnemen van afbeeldingen op uw webpagina's is het oplossen van alle ontwerpproblemen die gepaard gaan met het gebruik van afbeeldingen. Het is niet zo eenvoudig om effectieve grafische afbeeldingen te maken en ze op de juiste manier te plaatsen in relatie tot uw tekst. Sommige extra zorgen ontstaan ​​wanneer u afbeeldingen op het web gebruikt.

Langzame pagina's versnellen

Een van de lopende problemen van het web is downloadsnelheid - de hoeveelheid tijd die een webpagina nodig heeft om op het scherm van de gebruiker te verschijnen. De downloadtijd is bijzonder traag voor pagina's met veel grafische afbeeldingen, die, hoewel interessanter om te bekijken, frustrerender kunnen zijn omdat ze langzamer lijken. En de afweging is niet eenvoudig; veel variabelen komen tussenbeide. Bijvoorbeeld:

  • Toegangssnelheden: Verschillende gebruikers hebben toegang tot het web via verbindingen die op verschillende snelheden worden uitgevoerd. En dezelfde server kan een webpagina op verschillende snelheden serveren, afhankelijk van hoe druk de server is. Wanneer u uw geheel nieuwe, grafische pagina op uw lokale computer test, kan alles snel gaan. Maar wanneer u dezelfde pagina naar een server uploadt en de pagina via een 56 Kbps (kilobits per seconde) -modem opent, laadt de pagina veel langzamer.
  • Goede en slechte grafische afbeeldingen: Als u van plan bent de tijd van uw gebruikers te besteden aan het downloaden van grote afbeeldingen, investeer dan eerst wat van uw eigen tijd en geld om ervoor te zorgen dat de afbeeldingen zo hoog zijn kwaliteit mogelijk. Mensen vinden het niet erg om bijna evenveel op een goede afbeelding te wachten als ze denken aan het wachten op een slechte. Een goede afbeelding kan een productfoto zijn. Een slechte afbeelding kan een banner zijn die zegt: "HALLO! "In zes fluorescerende kleuren.
  • Frustratieniveaus: Dezelfde gebruikers die graag 's morgens naar je pagina kijken, verschijnen onder het genot van een kop koffie, maar kunnen in de verleiding komen om in hun browser te gillen wanneer ze snel je pagina proberen te bekijken net voordat je naar huis gaat van je werk.

Wat kunt u doen om al deze factoren aan te pakken, vooral wanneer ze samengaan om uw pagina te vertragen en uw gebruikers chagrijnig maken? Wees slim:

  • Beperk het aantal kleuren in uw afbeeldingen om de bestanden kleiner te maken, zodat ze sneller downloaden.
  • Vraag deskundig advies - van iemand die je kent of een boek - of bekijk coole sites online om je te helpen de grafische afbeeldingen die je gebruikt interessanter te maken.
  • Bestrooi uw pagina lichtjes met kleine afbeeldingen, in plaats van deze te belasten met verschillende grote afbeeldingen.

Drie grote fouten vermijden

Maak deze drie grote fouten met betrekking tot afbeeldingen op internet niet:

  • Geen afbeeldingen: Geen afbeeldingen op uw webpagina's hebben saaie pagina's.
  • Te veel afbeeldingen: Het gebruik van te veel grote, traag om te downloaden afbeeldingen kan de grootste newbie-auteurschending zijn.
  • Geen tekstalternatief: Sommige gebruikers hebben helemaal geen grafische mogelijkheden en een toenemend aantal mensen met een visuele beperking gebruikt het web. U moet deze gebruikers tegemoet komen door uw pagina zodanig te maken dat alleen-teksttoegang en grafische toegang worden ondersteund.

Sommige sites bieden een hele reeks parallelle webpagina's die puur tekstueel zijn in plaats van grafisch. Door parallelle pagina's met alleen tekst aan te bieden, kan de gebruiker kiezen of hij voor de aantrekkelijke, bandbreedte-zuigende grafische pagina's of voor de zeer snelle pagina's met alleen tekst wil gaan, en stelt hij gebruikers met visuele beperkingen in staat te profiteren van de voordelen van het internet.

Omdat het percentage gebruikers met niet-breedbandtoegang blijft dalen, kan het bieden van een complete set pagina's met alleen tekst te veel van het goede zijn. Overweeg een tekst-meestal -versie te leveren, met beperkt gebruik van afbeeldingen, eenvoudiger lay-out en alternatieve tekst voor afbeeldingen. Deze optie is mogelijk alleen het ticket voor gebruikers met een visuele beperking.

Dit zijn de belangrijkste regels voor ondersteuning van tekst en grafische toegang:

  • Terwijl u uw pagina ontwerpt en maakt, bedenkt u hoe uw pagina er uit zal zien met alle grafische toegangen uitgeschakeld en ingeschakeld.
  • Test uw pagina met afbeeldingen uitgeschakeld.
  • Test uw pagina in verschillende browsers.
  • Neem ALT-tags op - in feite het ALT-kenmerk binnen de IMG-tag - in alle afbeeldingen, zodat verklarende tekst wordt weergegeven wanneer een afbeelding niet wordt weergegeven.
  • Lever alleen tekstmenu's naast pictogramgebaseerde selecties en afbeeldingen.
  • Als u iedereen heel blij wilt maken, overweeg dan om een ​​afzonderlijke, alleen-tekstversie van uw site te maken.
Omgaan met afbeeldingen op uw website - dummies

Bewerkers keuze

Setup Menu 3 op de Rebel T6i / 750D - dummies

Setup Menu 3 op de Rebel T6i / 750D - dummies

Er wachten nogal wat aanpassingsmogelijkheden op de Setup-menu van de Rebel T6i / 750D 3. Setup-menu 3, weergegeven in de volgende afbeelding, bevat de volgende aanpassingsmogelijkheden: Schermkleur: standaard bevat het scherm Opname-instellingen opnamegegevens in het wit op een eenvoudige zwarte achtergrond. Er worden grijstinten in grijstinten gebruikt en accenten worden meestal oranje gemarkeerd. ...

Bewerkers keuze

Tekst invoeren en in een PowerPoint-dia passen - dummies

Tekst invoeren en in een PowerPoint-dia passen - dummies

Tekst aan een inhoud toevoegen tijdelijke aanduiding in Microsoft PowerPoint, klik op het gebied Klik om tekst toe te voegen en typ wat u wilt. Als u een ander type inhoud wilt toevoegen, klikt u op het pictogram in de tijdelijke aanduiding voor het gewenste type. Als u meer tekst typt dan in dat tekstvak past (vooral gebruikelijk voor ...

Voor senioren: de Prullenbak van uw computer leegmaken - dummies

Voor senioren: de Prullenbak van uw computer leegmaken - dummies

De Prullenbak op uw computer bevat onlangs verwijderde items. Uw oude bestanden bevinden zich in de Prullenbak en u kunt ze ophalen totdat u deze leegt of totdat deze de maximale maximale grootte heeft bereikt, en Windows automatisch enkele bestanden dumpt. Nadat u de Prullenbak hebt leeggemaakt, zijn alle bestanden daarin niet beschikbaar voor ...

Hoe tekst in te voeren in een Microsoft Office-document - dummies

Hoe tekst in te voeren in een Microsoft Office-document - dummies

Nadat u een document hebt gemaakt, bent u klaar om te beginnen met typen. Tekst op de pagina plaatsen (of op het scherm) is een beetje anders in elk van de drie grote Microsoft Office-toepassingen: Word, Excel en PowerPoint. Woord: Het belangrijkste werkgebied van het programma is een lege lei waarop u rechtstreeks kunt typen. Klik gewoon in de ...

Bewerkers keuze

Animatie maken met de HTML5-canvastag - dummies

Animatie maken met de HTML5-canvastag - dummies

Hoewel de HTML5-canvastag misschien niet als vervanging voor Flash als mechanisme voor het implementeren van games en animaties in de browser, is het redelijk eenvoudig om animaties aan een canvasafbeelding toe te voegen. De sleutel is om de animatiefuncties te gebruiken die al in de browser zijn ingebouwd. Basisstructuur van de animatielus in HTML5-canvas Een animatie ...

Hoe externe stijlen maken in CSS3 - dummies

Hoe externe stijlen maken in CSS3 - dummies

De meeste ontwikkelaars gebruiken externe stijlen in CSS3 om te verkleinen de hoeveelheid werk die nodig is om een ​​site te onderhouden. Een. CSS-bestand bevat alle stijlen voor de site, wat betekent dat het veranderen van een stijl voor de hele site net zo eenvoudig is als het veranderen van dat ene bestand (in plaats van elke pagina). Omdat de wijziging plaatsvindt in slechts ...

Hoe u volledige interactieve CSS3-toepassingen maakt met YUI - dummies

Hoe u volledige interactieve CSS3-toepassingen maakt met YUI - dummies

De Yahoo! Gebruikersinterface (YUI) -bibliotheek (Yuilibrary) is een complete ontwikkeling - API verwant met jQuery en jQuery UI CSS3 gecombineerd in sommige opzichten en rijker dan deze bibliotheken in andere. Dit is een complexe API die is ontworpen om aan de behoeften van grotere applicaties te voldoen. Eigenlijk moet je echt de tutorials doorlopen, ...