Website opgemaakt m.b.v. photoshop toch indexeerbaar?

[Ard-Sc]

Aangezien dit forum uitpuilt van kennis op het gebied van website's stel ik hier graag even de volgende vraag.

 

Een client heeft zelf een website gebouwd met behulp van Photoshop. Aangezien ook de tekst "in een laag zit", is de tekst niet indexeerbaar, wat nadelige gevolgen heeft voor de vindbaarheid.

 

Is dit te verbeteren binnen Photoshop? Hoe?

 

(andere suggesties zijn natuurlijk ook welkom)

[renep]

Je moet een website niet maken als afbeelding in Photoshop, maar als HTML-pagina's in een webtekstverwerker (Dreamweaver, Frontpage e.d.), in een 'platte tekst'-verwerker (Notepad, Ultraedit e.d.) of met een webcontentmanagementsysteem op de server (Plone, Joomla, Drupal, Website Baker e.d.)

[djluc]

In photoshop zet je de tekstlagen uit. Vervolgens knip je de afbeelding in stukjes en gebruik je die in je HTML. Aan de tekst in een afbeelding heb je niets wat betreft indexeerbaarheid.

[NLServers]

Als het echt in plaatjes moet zijn, sleutelwoorden in de kleur van de achtergrond zetten in de HTML code is dan een optie.

[djluc]

Als het echt in plaatjes moet zijn, sleutelwoorden in de kleur van de achtergrond zetten in de HTML code is dan een optie.

Met een grote kans op een ban van Google. Als je zo'n opmerking maakt wel de risico's er bij vermelden!

[KovaK]

gebruik maken van de alt tag in de html code. ALT="beschrijving"

 

[Ard-Sc]

gebruik maken van de alt tag in de html code. ALT="beschrijving"

 

 

Ik wil jullie alvast bedanken voor je suggesties.

 

Om even de woorden te lenen van Denzel Washington: "explain it to me like I am a five-year-old"of te wel hoe leg je dit uit in Jip en Janneke taal?

 

Ik heb het vermoeden dat je Alt Tags normaal gesproken gebruikt als je ondertitels plaats bij plaatjes (ben zelf ook leek op dit gebied). De casus in dit geval is iemand die Photoshop en Indesign goed beheerst en daarmee eigenhandig een mooi ogende website heeft gebouwd. Wanneer de tekst nu ook indexbaar zou kunnen worden gemaakt heeft zij voor zichzelf de 100% oplossing gecreeerd.

 

[robberttk]

Het beste is om een webdesigner te vragen die het photoshop plaatje kan opknippen in delen en er vervolgens de tekst in kan plakken. Je hebt dan hetzelfde design, maar een echte html-pagina met grafische elementen, in plaats van een grafisch element dat door moet gaan voor een webpagina.

 

Het zou een webdesigner niet zoveel tijd moeten kosten als het design en de photoshop-gegevens aanwezig zijn (.psd)

 

Alt tags zijn idd om titels te geven aan plaatjes. Het stukje van NLservers (no offense) zou ik in dit geval zeker negeren, het betekent op termijn uitsluiting van de google index in vrijwel alle gevallen.

[facereverse]

met photoshop kun je ook een "design" opknippen. Bij photoshop zit namenlijk een programmaatje waar je dit uitstekend mee kunt, nl imageready.

 

in feite knip je het totale design op in losse plaatjes die vervolgens dmv html in een grote tabel worden gezet.

Dit is dan als het ware een framework waar je in kunt gaan werken.

Door een beetje uitgekiend te knippen (en te ontwerpen) kun je het gedeelte waar content in moet komen apart in de tabel zetten. In die tabel kun je vervolgens de tekst zetten dmv van html, het plaatje van het design wordt dan een achtergrond.

 

Dit is meestal een gangbare manier om sites te bouwen, als de nadruk op design ligt. Misschien niet het beste voorbeeld... maar veel pornosites worden op deze manier gemaakt. Werkt snel en makkelijk, zeker in combi met een programma als photoshop.

 

Een beetje webdesigner kan zon ontwerp redelijk snel omzetten naar een tabel.

[member123]

Hallo,

Fotoshop is prima om een mooi design te maken maar daarna moet je dat ontwerp dus in stukjes laten opknippen (slicen) en het geheel omzetten naar html code.

Let er daarbij op dat je dit niet door iemand die dan alsnog doodleuk alles in plaatjes opknipt en die met html weer aan elkaar zet maar dat dus de text delen ook echt in text gezet worden.

 

Het laten slicen van een layout kost over het algemeen slechts een paar tientjes.

[nonex.nl]

 

.... Photoshop en Indesign ....

 

 

Indesign kan html uitspugen met indexeerbare tekst. We ze het echt goed aanpakken: Adobe Golive kopen en een beetje doorleren.

[Ard-Sc]

Alvast bedankt voor jullie reacties! Ik zal de tips doorgeven en ook hier even melden welke oplossing gekozen werd.

 

Thnx!! Ard

[MvE]

Zelf gebruik ik Dreamweaver in combinatie met Photoshop voor het maken van websites. Alle grafische elementen worden in Photoshop gemaakt, indien nodig 'gesliced' en verder verwerkt in DW. Voor tekst maak ik in DW een aparte laag aan.

 

Het voordeel daarvan is o.a. dat de tekst evt. ook te vergroten of verkleinen is door de lezer.

 

Op de website van Adobe is een testversie van DW te downloaden en - als het toegestaan is een ander forum te vermelden - op www.macminds.net barst het van de kennis over o.a. webdesign.

[Nico Schouten]

Zelf gebruik ik Dreamweaver in combinatie met Photoshop voor het maken van websites. Alle grafische elementen worden in Photoshop gemaakt, indien nodig 'gesliced' en verder verwerkt in DW. Voor tekst maak ik in DW een aparte laag aan.

 

Het voordeel daarvan is o.a. dat de tekst evt. ook te vergroten of verkleinen is door de lezer.

 

Op de website van Adobe is een testversie van DW te downloaden en - als het toegestaan is een ander forum te vermelden - op www.macminds.net barst het van de kennis over o.a. webdesign.

 

Je mag zeker een ander informatiefforum pluggen zolang het naar niet om eigen activiteiten gaat.

 

[inside joke, liever magenta dan de blauwe buren]

[MvE]

[inside joke, liever magenta dan de blauwe buren]

 

;D

[facereverse]

Zelf gebruik ik Dreamweaver in combinatie met Photoshop voor het maken van websites. Alle grafische elementen worden in Photoshop gemaakt, indien nodig 'gesliced' en verder verwerkt in DW. Voor tekst maak ik in DW een aparte laag aan.

 

Het voordeel daarvan is o.a. dat de tekst evt. ook te vergroten of verkleinen is door de lezer.

 

Op de website van Adobe is een testversie van DW te downloaden en - als het toegestaan is een ander forum te vermelden - op www.macminds.net barst het van de kennis over o.a. webdesign.

 

als ik nog even een kanttekening mag plaatsen bij het gebruik van dreamweaver.

 

wat ik vaak zie bij mensen die met DW werken is dat:

 

- DW er veel onnodige html/code inzet. de bestanden worden dus onnodig lang

- DW zich niet altijd houdt aan w3c specificaties en daardoor loop je gevaar dat het bijvoorbeeld in firefox anders uit ziet, of de pagina's zelfs verminkt

 

Het zijn toch zaken om serieus rekening mee te houden, denk ik.

Verder zijn er natuurlijk vele wegen die naar Rome leiden.

[renep]

wat ik vaak zie bij mensen die met DW werken is dat:

 

- DW er veel onnodige html/code inzet. de bestanden worden dus onnodig lang

- DW zich niet altijd houdt aan w3c specificaties en daardoor loop je gevaar dat het bijvoorbeeld in firefox anders uit ziet, of de pagina's zelfs verminkt

 

Dit herken ik niet. Ik maak met DW moeiteloos sobere en correcte HTML-code. Ben je misschien in de war met een andere webtekstverwerker?

[nonex.nl]

wat ik vaak zie bij mensen die met DW werken is dat:

 

- DW er veel onnodige html/code inzet. de bestanden worden dus onnodig lang

- DW zich niet altijd houdt aan w3c specificaties en daardoor loop je gevaar dat het bijvoorbeeld in firefox anders uit ziet, of de pagina's zelfs verminkt

 

Dit herken ik niet. Ik maak met DW moeiteloos sobere en correcte HTML-code. Ben je misschien in de war met een andere webtekstverwerker?

 

Hangt er van af of je met tables of div's (layers) werkt. Bij tabellen maakt Dreamweaver veel lege tabellen om de tabellen te positoneren, bij divs (layers) is dat niet aan de orde.

[wouteronline]

Ik heb zelf ook erg goede ervaringen met DW. Zeker i.c.m. met een grafisch programma als Photoshop of Fireworks kan je tot mooie resultaten komen.

 

Ff terug ontopic: het is belangrijk dat de tekst in html geschreven is en niet een plaatje zit. Plaatjes worden (en kunnen) namelijk niet geïndexeerd worden door google. Dat wil zeggen, hij ziet dat er een plaatje staat maar weet niet of er een boot of een auto op dat plaatje staat (mits het ook niet in de naam is aangegeven: boot.jpg). Laat staan dat Google er tekst uit kan halen....

 

Gewoon laten knippen, opnieuw op laten maken in HTML en vervolgens het tekst gedeelte als html invoegen.

[facereverse]

wat ik vaak zie bij mensen die met DW werken is dat:

 

- DW er veel onnodige html/code inzet. de bestanden worden dus onnodig lang

- DW zich niet altijd houdt aan w3c specificaties en daardoor loop je gevaar dat het bijvoorbeeld in firefox anders uit ziet, of de pagina's zelfs verminkt

 

Dit herken ik niet. Ik maak met DW moeiteloos sobere en correcte HTML-code. Ben je misschien in de war met een andere webtekstverwerker?

 

nope, ben niet in de war. Van de week zag ik bijvoorbeeld nog een stukje code uit DW waarin de hoogte van een tabel in de html code stond

.

 

Firefox maakt hier een hoogte van ongeveer 10 van, terwijl i.e. dit goed weergeeft. Research heeft opgeleverd dat dit gebruik van code "deprecated" is, oftewel gebruik ervan wordt afgeraden omdat het in toekomstige versies zal verdwijnen. Hoogte van tabellen dient middels stylesheets opgemaakt te worden.

 

Enfin, een klein recent voorbeeldje dus...

[renep]

Van de week zag ik bijvoorbeeld nog een stukje code uit DW waarin de hoogte van een tabel in de html code stond

 

Aha, als je de table in de wysiwyg-view resizet dan maakt DW inderdaad dergelijke code. Maar je kunt net zo goed een class aan de table of bepaalde cellen toekennen en via css stylen, DW is daar vrij sterk in.

 

Research heeft opgeleverd dat dit gebruik van code "deprecated" is

 

Nou, "research"... dat staat gewoon in de HTML-standaard :)

 

Hoogte van tabellen dient middels stylesheets opgemaakt te worden.

 

Het probleem met dit soort dingen is dat het web evolueert en dat webtekstverwerkers zowel oude browsers als nieuwe standaards moeten ondersteunen. Ik ben in het verleden erg kritisch geweest op DW (o.a. wegens algehele instabiliteit) maar de css-ondersteuning in de laatste versie vind ik errug mooi. Juist bij modern css-gebaseerd ontwerpen zou ik Dreamweaver aanraden.

 

Maar het komt ook op de ontwerper aan. Je kunt in DW ongetwijfeld nog op andere manieren 'foute' code produceren. Maar evengoed kun je er standaardcompliant sites mee maken. En dat was met andere webtekstverwerkers weleens anders, want die vernaggelden je code elke keer als je een pagina opnieuw bewerkte. Met name oude versies van Frontpage waren hier berucht om. Met de hedendaagse Dreamweaver zie ik dat fenomeen eigenlijk nooit.

[facereverse]

"research" is inderdaad een wat grote term in deze, maar ik refereerde inderdaad naar de literatuur zoals voorhanden op internet.

 

anyway, ik probeer hier ook niet dreamweaver af te kraken. Mijn doel is hooguit te waarschuwen voor mogelijke crossbrowser incompatibiliteit.

Wat je zelf zegt, als je in de wysiwyg werkt, kan zoiets gebeuren.

Geen kwestie van een slecht product, maar gewoon goed in de gaten houden.

 

Iedere webdesigner met actuele kennis van html zou met welk programma dan ook een site moeten kunnen maken, zelfs met alleen notepad. Maar ik ben persoonlijk erg te spreken over de functionaliteit van photoshop in combi met imageready. De uitgevoerde html is perfect.

 

Maar om een lang verhaal kort te maken, de vraagsteller heeft nu denk ik wel een idee hoe hij een en ander moet aanpakken en welke partij hij zou moeten inschakelen. Als laatste zou ik hem willen meegeven, als hij iemand dat slicen laat doen, bij aflevering nog eens extra te verifieren of de opmaak bij verschillende browsers nog wel overeind blijft.

 

Ik groet u! :)