# 125: Photoshop della pagina del singolo video - Trucchi CSS

Anonim

In questo screencast approfondiamo la progettazione di un'altra pagina molto importante. Questa è una di quelle pagine che sono stato entusiasta di progettare sin dall'inizio, perché è una pagina particolarmente poco servita dall'ultimo progetto. In questo nuovo design, lo affronteremo da zero e progetteremo qualcosa che si adatti meglio al contenuto.

Il primo ordine del giorno è rendere il video effettivo sulla pagina il più grande possibile. Penso che sarebbe fantastico se il video fosse più grande sullo schermo rispetto a YouTube. Mi piace guardare i video molto grandi, ma non sempre lo schermo intero, che nasconde l'intero schermo.

La domanda quindi diventa dove va il titolo del video. Abbiamo già l'intestazione del sito, l'intestazione dei video e la barra di navigazione secondaria. Se includiamo anche un titolo (e possibilmente descrizione e metadati) che spinge questo video a larghezza intera abbastanza maledettamente in fondo alla pagina. Questa pagina è interamente dedicata ai video, quindi teniamo il video sopra le altre informazioni. Fortunatamente possiamo usare la barra nera per mostrare il titolo del video, quindi non è che l'utente si sia perso riguardo a ciò che sta guardando o a dove si trova nella gerarchia del sito.

Usiamo anche la barra di navigazione nera per offrire un collegamento Iscriviti su iTunes, che è più pertinente in questa pagina che in qualsiasi altra parte del sito. Questo è il tipo di personalizzazione dei modelli di contenuto che fa cantare un sito.

Sotto il video, possiamo strutturare una griglia che essenzialmente assomiglia a un post del blog, uno snippet o una voce di alamanac o qualsiasi altra cosa. Contenuto e commenti a sinistra 2/3 e a lato (barra laterale) contenuto a destra 1/3.