# 125: Photoshoppen op de enkele videopagina - CSS-trucs

Anonim

In deze screencast gaan we in op het ontwerpen van nog een zeer belangrijke pagina. Dit is een van die pagina's waar ik vanaf het begin enthousiast over ben geweest, omdat het een pagina is die bijzonder onderbelicht werd door het laatste ontwerp. In dit nieuwe ontwerp zullen we het vanaf nul benaderen en iets ontwerpen dat beter bij de inhoud past.

De eerste stap is om de daadwerkelijke video op de pagina zo groot mogelijk te maken. Ik denk dat het geweldig zou zijn als de video groter was op het scherm dan op YouTube. Ik kijk graag naar video's die erg groot zijn, maar ik hou niet altijd van volledig scherm - dat het hele scherm verbergt.

De vraag wordt dan waar de titel van de video naartoe gaat. We hebben al de sitekop, de videokop en de subnavigatie op de zwarte balk. Als we ook een titel (en mogelijk een beschrijving en metagegevens) opnemen die deze video over de volledige breedte behoorlijk ver naar beneden op de pagina duwen. Deze pagina gaat helemaal over video, dus we houden de video boven die andere informatie. Gelukkig kunnen we de zwarte balk gebruiken om de titel van de video weer te geven, dus het is niet alsof de gebruiker verdwaald is in wat ze bekijken of waar ze zich bevinden in de hiërarchie van de site.

We gebruiken ook de navigatie op de zwarte balk om een ​​link Abonneren op iTunes aan te bieden - die op deze pagina relevanter is dan waar dan ook op de site. Dat is het soort aanpassing van inhoudssjablonen dat een site doet zingen.

Onder de video kunnen we een raster structureren dat er in wezen uitziet als een blogpost of fragment, alamanac-item of iets anders. Inhoud en opmerkingen links 2/3 en naast (zijbalk) inhoud rechts 1/3.