fbpx

Stappenplan: Maak je afbeeldingen gereed voor je WordPress website

Maak afbeeldingen gereed voor je WordPress website via deze eenvoudige stappenplan!

Wil jij tijd besparen, efficiënt & snel afbeeldingen plaatsen in je WordPress website?

In deze blog geef ik je een fijne stappenplan die jou ook echt kan helpen met het maken, plaatsen en bewerken van jouw afbeeldingen!

Stappenplan - Maak je afbeeldingengereed voor je website _ TopGemerkt

More...

Want.. even een website bouwen doe je niet zo maar even of wel dan?

Geen idee of je jouw eigen website zelf beheerd of dat je dit door iemand anders laat doen?

Ik vind het wel fijn om zelf aanpassingen te kunnen doen en weten waar ik dingen kan vinden en hoe het werkt. Zo ook achter het maken van mijn eigen website. Er komt toch altijd zoveel bij kijken.


Wil je dat je website een visitekaartje is
of dat deze ook potentiële klanten aantrekt?


​Ja ik wil het laatste en dat gun ik jou ook. Dus het hebben van een goed plan en een team die je hierin helpen is dan wel zo fijn.


Achter de schermen heb ik een team van kanjers die me op alle wijze helpen, zo ook o.a. met mijn website.

Toen we dus een tijdje geleden aan mijn website aan het werken waren en ik dus echt in een proces zit waar ik leer uit te besteden, merk je toch dat je als team toch andere gedachtes kan hebben over bepaalde dingen.

​Kleine discussie

Zo had ik een kleine discussie met één van mijn teamkanjers. Tijdens een '2-daagse funnel marketing event', die ik eind november 2018 heb gehad, was het onder andere de bedoeling mijn website te vullen.

Denk zoal aan: het vullen met templates, lay-outs, teksten en natuurlijk (veel) afbeeldingen.

Zo ook de reden dat ik deze blog schrijf. Ik ben er zelf tegen aangelopen en deze stappen had ik graag van te voren geweten, dus let op ik ga het met je delen!

Weet jij de juiste stappen te nemen als het gaat om een afbeelding plaatsen op je website?

Hier bedoel ik mee, vanaf het moment dat je dus eigenlijk een foto maakt, bewerkt of gewoon denkt, hè die moet op mijn website?

Juist! Daar zijn onbewust wel wat stapjes voor kan ik je vertellen. Natuurlijk wist ik al héél veel maar toch...

Samen met één van de team-mannen waar ik mee zat, begonnen we dus mijn webpagina’s door te lopen en dingen te vullen doe nog ingevuld moesten worden.

Hij had al een paar foto’s van mijn oude website gehaald, MH Business Support, en Facebook voor een paar andere afbeeldingen.

Die stonden al in mijn mediabibliotheek van WordPress.

De afbeeldingen even snel een naam geven, opslaan op de computer en vervolgens uploaden in WordPress.

Echter opgeslagen onder bijvoorbeeld: mariskah.png. Uhmzz, niet echt handig dacht ik nog.

Ik vroeg waarom hij dit op deze manier had gedaan. De discussie ging over het feit dat het veel tijd en lang kan duren als je alle afbeeldingen van te voren goed opslaat en dus de juist alt-naam geeft.

Ook in het kader van tijd en efficiënt werken, kan je de foto's ook later nog bewerken.

Hij was het zeker wel met mij eens, maar hij zei dat dit nu tijd kost en als wij nu de website gewoon willen vullen dat het sneller en efficiënter is dit even te laten.

Uhmzzzzz, nee! Daar was ik het deels wel mee eens.. nu doorpakken en gewoon gas geven maar aan de andere kant.. moet ik na 1 of 2 maanden weer mijn hele website langs!

Tja, ik blijf toch graag bij mijn eigen gevoel om te zeggen: Doe het in één keer goed voordat je begint, dat scheelt je toch een heleboel tijd!

Als jij weet welke afbeeldingen je allemaal tegelijk op jouw website wil hebben raad ik je aan om de volgende stappen te volgen zodat je het jezelf een stuk gemakkelijk maakt!

Om al die afbeeldingen eerst ergens op mijn computer op te zoeken, ja dan moet je Mariska heten, maar ik weet soms echt niet meer waar ik alles heb opgeslagen.

Heb zo veel mappen en vergeet weleens of ik het onder één van deze mappen heb gezet: Blog, Social Media, Website of bv. Foto's.


Herkenbaar?


En… dan niet te vergeten dat je na een tijdje al je webpagina’s (weer) langs kan gaan, elke afzonderlijke afbeelding op moet zoeken op je computer en dan de juiste stappenplan volgen (hieronder te vinden).

Tuurlijk moet je wel je afbeeldingen voorzien van de juiste stappen, de juiste naam en het een alt-naam meegeven. Waarom? Lees verder en dan vertel ik het je!

Ik ging mee in de waanzin om maar te helpen vullen, maar achteraf toch een tikkeltje spijt natuurlijk.

Daarom deel ik hieronder wat ik heb gedaan en uit eigen ervaring kan ik je vertellen dat het veel efficiënter is als je voorruit en eigenlijk in massa productie werkt.

​Zoals bijvoorbeeld bulk afbeeldingen wilt plaatsen op je website of in 1 keer sneller de afbeeldingen netjes en goed wil krijgen.


​Voor jou een stuk gemakkelijker maken

​Goed we gaan beginnen...

Stel je nou eens voor dat jij nu inderdaad de eerste tactiek toegepast:

  • ​Zo snel mogelijk en efficiënt een website vullen.
  • ​Geef je dus afbeeldingen snel een naampje.
  • ​Zet je dus je foto’s vanuit hele verkeerde mappen, vanuit je computer, in je mediabibliotheek in WordPress.
  • ​Met het vooruitzicht dat Google jouw websitepagina’s langs gaat én ook al jouw afbeeldingen indexeert.

Wat bedoel ik met het woord: Indexeren?

Indexeren, oftewel ook wel indexatie genoemd, is het registeren van al jouw pagina’s op je website voor de database van zoekmachines, zoals Google dus!

Dit gebeurd niet elke dag, dus het kan goed voorkomen dat je niet meteen je nieuwe blog of een nieuwe pagina in Google hoeft tegen te komen.

Het indexeren van een website is natuurlijk belangrijk, want zonder een indexatie komt een website niet tevoorschijn in de zoekresultaten van de zoekmachines 😊

Zelf hoef je hier niks mee te doen, je pagina letterlijk ‘publiceren’ is dat je hem openstelt voor dus de zoekmachine Google.

Als deze weer een indexatie toepast zal hij de nieuwe updates van je website meenemen.

Als Google dus jouw website teksten, maar ook je afbeeldingen, zonder de juiste naam indexeert, is dat niet fijn en handig en dien je naderhand weer updates doen of de juiste plugins over je website heen gooien. Zonde van je tijd!

Ik wil het eigenlijk voor jou een stuk gemakkelijker maken dan de stuggle waar ik in heb gezeten.

Ik ben ervan overtuigd dat als je namelijk weet welke afbeeldingen je allemaal op je website wil hebben dat je hier een logische stappenplan voor kan volgen.

Zodat het je echt tijd gaat opleveren, want niets is vervelender dan dat je zoveel tijd kwijt bent aan het updaten van je foto's.

Vandaar dat ik een stappenplan voor je heb gemaakt, zodat je in één keer klaar bent.

Zorg er dan voor dat je vanaf heden elke keer als je één of meerdere foto’s wilt uploaden in je mediabibliotheek in je WordPress, je deze stappen volgt!

Goed, nu ga ik echt beginnen! Dit stappenplan is voor alle afbeeldingen geschikt maar hier een kleine opsomming:

- Referentie afbeeldingen
- Eigen afbeeldingen
- Foto’s die je bij je blog(s) wilt toevoegen
- Header foto’s etc.


Stap #1: Gebruik dezelfde afmetingen

Sla jij bijvoorbeeld afbeeldingen op vanuit Facebook, maak je een print screen of gebruik je een knipprogramma?

Elke afbeelding heeft andere afmetingen en is qua grootte verschillend. (bestand grootte uitgedrukt in kB’s = kilobytes)

Zorg er daarom voor dat als je gewone of afbeeldingen voor referenties wilt gebruiken, altijd dat je dezelfde afmetingen inzet.

Zorg bijvoorbeeld voor afmetingen 300x300px of 400x400px of 450x450px. Net wat jij wenst.

Stappenplan-Maak je afbeeldingen gereed voor je website- blog-dezelfde afmetingen _ TopGemerkt

Stap #2: ​Gebruik Canva of Photoshop

Om stap #1 te kunnen doen, raad ik je aan om te beginnen met een lege lay-out van dus bijvoorbeeld 300x300px (referentie afbeeldingen) in de mooie gratis grafische tool Canva of Photoshop als je dat liever hebt.

In deze blogpost ga ik de stappen uitleggen met het gebruik van Canva i.p.v. Photoshop.

Stappenplan-Maak je afbeeldingen gereed voor je website-blog-Canva of PDS _ TopGemerkt
  1. Als je Canva hebt geopend dan kan je bovenaan je eigen afmetingen toevoegen. Je vult hier dan de afmetingen in
    die jij wenst.

  2. Het beste wat je kan doen is een ‘fotoachtergrond’ toevoegen. Deze kan je vinden als je in het linkermenu van Canva naar >elementen gaat. Dan zie je de middelste van de bovenste rij >rasters.

  3. De eerste die je links ziet, sleep je naar je witte werkveld. Het grote voordeel van dit is, dat als je namelijk jouw foto erin wil zetten dat hij altijd aangepast wordt naar de afmeting van deze template of lay-out.

    Dit betekent: snel en efficiënt! Ik neem nu even een vierkant als voorbeeld, maar je kan ook kiezen voor andere vormen. Dat is aan jou.

  4. Zorg ervoor dat je de foto's die je wilt hebben al in je Canva uploads hebt staan of via uploaden toevoegen.

  5. Sleep de foto’s dan in het foto lay-out en klaar is het.

  6. Maak een eigen bestandsmap aan op jouw pc of je bureaublad, voor even ‘de snelle touch’.

  7. Vanuit Canva nummert hij de afbeeldingen zoals de volgorde, 1,2,3,4 etc. Sla deze afbeelding(en) gewoon zo op
    deze manier op je computer.

  8. Heb je alle afbeeldingen gehad? Ga dan naar je map toe en ga elke foto de juiste naam geven. – Afbeelding selecteren, Rechtermuis knop, >Naam veranderen. Door >tab te klikken verspringt de selectie naar de eerst volgende afbeelding en geef deze ook een naam.

  9. Hier ga je jouw plaatje letterlijk overal alvast de juiste benaming geven. Doe het nu, niet achteraf!

Stap #3: De juiste naam geven

Hoe geef je jouw plaatjes nou de juiste naam? Je begint eigenlijk altijd wat je bijvoorbeeld op deze afbeelding ziet.

Stel dat je met een referentie afbeelding bezig bent, wat ik vaak altijd doe is het volgende:​

Stappenplan-Maak je afbeeldingen gereed voor je website-blog-juiste naam geven _ TopGemerkt

1. naam van de persoon
2. plus bedrijfsnaam van de persoon
3. met daarbij het woord ‘referentie’
4. afsluiten met je eigen bedrijfsnaam


Voorbeeld:
Mariska Huijnen van TopGemerkt – referentie _TopGemerkt

of (fictief voorbeeld)

Monica Laters van Virtual Assistent Monica – referentie _TopGemerkt

Zo weet Google tenminste wie er op de foto staat. Als je de afbeelding willekeurig zou opslaan zoals bv 1.png of 2.png of image2080.png weet google echt niet wie en wat er op de foto te vinden is of waarom deze foto bedoeld is.


Magazine-Mockup-100+(20)

P.S. Ben je opzoek 
naar inspiratie?

Krijg 100+ Content & Social Ideeën
Voor Meer Zichtbaarheid & Klanten.

Stap #4: ​Foto's verkleinen

Open vervolgens ‘TinyPng’.

Dit is een tool die je helpt je foto’s, plaatjes en afbeeldingen te verkleinen en dit is goed voor de snelheid (laadtijd) van je website, zo hoeft je bezoeker niet eeuwig te wachten voordat je plaatjes zijn geladen.

Google overigens waardeert snelle websites, dus win-win situatie

Stappenplan-Maak je afbeeldingen gereed voor je website- blog-fotos verkleinen _ TopGemerkt
  1. Sleep al jou afbeeldingen in TinyPng en hij zal ze voor je verkleinen.
  2. Als je dit hebt gedaan download je ze allemaal. (Download All)
  3. Open die ene map, waarbij je ze al had staan maar nog niet verkleind. Via CTRL+C,
    kopieer je de afbeeldingen en met CTRL+V plak je ze letterlijk in dezelfde map.
  4. Je krijgt de vraag of je ze er overheen wilt opslaan aan uiteraard klik je: ja

Als je nu naar de bestand grootte kijkt.. zijn ze zeker met de helft verkleind!

En dat.. is precies de bedoeling!


Stap #5: ​Tegelijk uploaden in WordPress

Hiermee kan je ze allemaal tegelijk uploaden in je WordPress website in je mediabibliotheek.

Stappenplan-Maak je afbeeldingen gereed voor je website-blog-uploaden wordpress _ TopGemerkt

Stap #6: ​ALT-code meegeven

Je bent er nog niet helemaal! Wat een stappen hè? Maar dit zijn wel de laatste stappen…

Als je in je mediabibliotheek bent (Dashboard >Media) zie je alle afbeeldingen nu staan.

Rechts zie je dan ook nog een klein werkveld. Hier vind je dan de URL-naam.

Stappenplan-Maak je afbeeldingen gereed voor je website-blog-Alt-code _ TopGemerkt

​Dit is dus de naam hoe je hem opgeslagen hebt vanuit je computer en in welke map hij staat. Als je iemand deze URL-link geeft, komt diegene een losse websitepagina tegen met alleen die ene foto.


Test maar met deze:
https://topgemerkt.nl/wp-content/uploads/2018/11/100pluscontentideeen.png

 

Kijk maar eens naar oude afbeeldingen, en loop je URL-links maar na, valt je iets op? Heb je het al goed gedaan? Of.. kan je nog wel het één en ander aanpassen?

Vervolgens zie je daaronder ook de ALT-code. Met de ALT-code geef je dus letterlijk aan wat, wie en waarom deze afbeelding er is. Stel de foto wil niet laden, maar de tekst staat er wel, weet de bezoeker wel wat er op die afbeelding zou moeten staan. Maar ook wat je hebt geleerd: Google weet ook wat er op die afbeelding staat.

Want Google is slim, maar je moet hem wel een beetje helpen. Google ‘ziet’ niet wat er op de afbeelding staat. Nee, Google ‘leest’ wat jij als naam hebt gegeven ‘aan’ je afbeelding!


Even een voorbeeld:
Stel je hebt een afbeelding met een chocolade mok vol met marshmallows. Je kan de afbeelding meerdere namen geven natuurlijk:

1. image123.png
2. 5.png
3. choco.png
of
4. Warme chocolade mok met marshmallows en chocoladesaus _TopGemerkt

Welke van de 4 zou Google beter kunnen inlezen en snappen wat er écht op die afbeelding staat? (zie de afbeelding van Stap#3)


TIP:
Als je elke afbeelding op deze manier bekijkt, ze direct deze naam geeft
bij het OPSLAAN OP JE COMPUTER -IN DIE DESBETREFFENDE MAP
of dé map waar je die afbeeldingen wilt hebben.

Ben je meteen goed bezig. Leer het je meteen aan om het op deze manier te doen, ook al heb je haast.

Kopieer de Titel naar de ALT-code, eventueel ook nog bij de omschrijving en tada! Ready to go!

TIP2:
Met ​de benaming -titel- wordt bedoeld dat je de titel van de afbeelding een naam kan geven.

Scrol maar eens met je muis over één van mijn afbeeldingen. Dat is de naam van de titel. Die kan je dus ook anders aanpassen dan de alt-code.

Even alles in het kort samengevat:

  1. ​Gebruik bijvoorbeeld voor (referenties) foto's of afbeeldingen altijd dezelfde maten bijvoorbeeld 300x300px of 450x450
  2. Bewerk het in Canva of Photoshop
  3. Sla de afbeeldingen op je pc in een (aparte) map.
  4. Ga naar TinyPng en verklein hierbij je afbeeldingen
  5. Geef het Beestje de juiste naam in je map
  6. Laad de foto’s in WordPress
  7.  Meteen de ALT-Code(s) toevoegen zodat je dit niet vergeet

Heel veel succes met het uploaden van jouw mooie foto’s! Zodat het voor jou nu ook niet veel tijd kost om de afbeeldingen in je WordPress te zetten. Meteen goed vanaf het begin!


Nog een laatste tip:
Je kan de URL-link, na het uploaden niet meer aanpassen. De Titel wel.. maar die zal niet veranderen zoals de URL. De ALT-code kan je altijd aanpassen, maar mijn advies is: Zet de naam meteen goed met de gedachte dat je aan je ALT-code denkt, dan zit je in de meeste gevallen het beste 😊

Oke, ik kan het niet laten en ben zo lekker op dreef:
Je kan de maten van je afbeelding ook nog wel aanpassen in WordPress zelf. Als je de afbeelding hebt geplaats kan je het verwijderen via het kruisje of bewerken met het desbetreffende potloodje.

Hier zie je dat je de afbeelding in diverse maten kan zetten. Ook kan je jouw eigen ‘afmetingen’ zelf toepassen. Heb je bijvoorbeeld een 1000x1000 afbeelding, dan kan je hem verkleinen naar 450x450px.

Heel veel succes!


Het creëren van meer zichtbaarheid en een online business opbouwen, kost tijd. Meestal is dit een gevecht van groei. De groei ​die ik op dit vlak heb mogen ervaren, ​geef ik heel graag door aan jou.

​Dat heb ik tot mijn missie mogen maken. Sta je hiervoor open? Dan nodig ​ik je heel graag uit om eens kennis met ​mij te komen maken​ tijdens​ mijn​ Parel Methode Weekend.

Meer informatie over de 2-daagse training (en aanmelden) kun je hier vinden.


Liefs,​

Handtekening Mariska van TopGemerkt

​DEEL dit artikel s.v.p. met jouw netwerk, door op de Tweet, Like, Pin of Share hieronder te klikken, zodat ook de mensen in jouw netwerk ervan kunnen profiteren.

>