Pēdējā ekrānuzņēmumā mēs izķemmējām šo fotoattēlu no iStockPhoto ar sniegoto kajīti un mežu. Mēs to nometām fonā, aiz mūsu Photoshop dokumenta galvenā satura apgabala un sānjoslas, un tas labi iederējās tur augšā sava veida pārējo vietnes virsrakstu stilā. Starp ekrānuzņēmumiem es uzrakstīju arī dažas lapas kopijas. Es būtu vēlējies to skenēt, taču kopijas rakstīšana ir viena no tām lietām, kas prasa tikai ilgu laiku un ir pat smalkāka nekā dizaina pielāgošana. Mēs par to tomēr mazliet runājam.
Photoshopā es “paslēpju” tekstu “The Lodge” aiz kokiem, nedaudz pietuvinot attēla maskēšanu. Es to nedarīju ļoti detalizētu darbu, taču jums tas nav īsti jādara, kad jūs esat pietuvināts, un attēls tiks samazināts arī tīmeklī.
Mēs izveidojam unikālu lapas veidni tieši šai lapai (page-lodge.php). Izmantojot PHP komentāru konvenciju, /* Template Name: The Lodge */šī veidne tiek parādīta mūsu lapas veidnes nolaižamajā lapā, veidojot jaunu lapu programmā WordPress. Tas dod mums visu nepieciešamo kontroli. Mēs varam rediģēt HTML šajā veidnē, un, ja šai lapai ir nepieciešama unikāla CSS, mēs varam izmantot nosacītu loģiku un saistīt to failā header.php. Retrospektīvāk ir lietderīgāk izmantot failu function.php, lai sasaistītu unikālo CSS, lai saglabātu tīrāku “view” (header.php), taču tas ir kaut kas nākamajai reizei.
Šīs galvenes fona grafiku dēvētu par “Hero Graphic” - tas ir, lielu (burtiski un lieluma ziņā) grafiku, kas ir svarīga lapas izskatam / izjūtai / saturam. Tā kā mēs cenšamies būt atbildīgi par veiktspēju (mēs vēlamies, lai vietne tiktu ātri ielādēta), mums patiešām nevajadzētu apkalpot šo gigantisko grafiku maziem ekrāniem. CSS tas ir daudz vieglāk nekā HTML. Mēs izmantojam mūsu “reverso” multivides vaicājumus ( min-widthnevis max-width), lai teiktu “kad ekrāns ir tik plats vai platāks, izmantojiet šo grafiku ... kad tas ir vēl platāks, izmantojiet šo grafiku” un tā tālāk. Tādā veidā pēc noklusējuma tiek izmantots tikai mazākais attēls, taču tas tiek ignorēts, ja plašāka pārlūkprogramma pieprasa lapu. Mazliet domājat par mobilajām ierīcēm.
Galu galā mums ir jauks audekls (ja vēlaties), lai strādātu pie visām The Lodge lapām.