Il problema qui è che i due team non stanno lavorando insieme, ma che gli sviluppatori dovrebbero reimplementare l'HTML. Questo rallenta i progettisti e fa perdere tempo allo sviluppatore.
Invece, le squadre dovrebbero lavorare più vicine. In particolare, i file creati dai designer dovrebbero essere messi in produzione con modifiche minime. Come può essere possibile?
Utilizza un motore di template. Non inserisci direttamente PHP in file HTML, ma usa modelli separati che vengono renderizzati dall'applicazione PHP. Offri ai tuoi progettisti uno strumento per testare questi modelli, possibilmente una versione di facile implementazione dell'applicazione stessa. Scrivere modelli richiede un po 'di programmazione, ma si tratta principalmente di inserire la variabile corretta o forse alcuni condizionali e cicli. I template sono anche grandiosi perché i designer possono inserire qui un po 'di logica di presentazione, invece di doverlo negoziare con gli sviluppatori.
PHP può essere usato come motore di template, ma è troppo potente e ha una sintassi potenzialmente difficile da capire. Quindi i modelli su cui lavorano i designer dovrebbero essere modificabili senza dover capire PHP.
In casi estremi, alcuni siti Web passano a "rendering sito client", in cui l'HTML viene creato da JavaScript nel browser. Questo è interessante perché il design può andare avanti senza dover cambiare nulla sul back-end. Ma a parte le applicazioni web che beneficiano davvero del rendering lato client, questo è disfunzionale. È meglio che designer e sviluppatori lavorino insieme piuttosto che usare tecnologie che consentano loro di evitare l'un l'altro.
Durante la scrittura di modelli, potresti avere modelli separati per componenti riutilizzabili. Ma questi componenti potrebbero anche avere singoli stili o snippet di JavaScript. Come puoi organizzarli? Puoi organizzarli per tipo, ovvero mantenere tutti i modelli insieme e tutti gli stili insieme. Ciò semplifica l'implementazione, ma rende le modifiche più difficili, poiché le modifiche a un componente vengono diffuse in tutte le parti del progetto. Spesso è meglio organizzarli per componente, in modo che il modello, lo stile e gli altri oggetti di un widget si trovino uno accanto all'altro. Dovresti quindi raggruppare gli stili e le risorse prima della distribuzione, in modo che il browser non debba scaricare centinaia di piccoli file. Il moderno ecosistema JavaScript ha un ottimo supporto per fare questo raggruppamento. Puoi anche seguire il metodo BEM di Yandex per organizzare i tuoi componenti.