Video: Landscape Design Ideas - Garden Design for Small Gardens 2024
Når du slår på en iPhone eller iPad, justerer orienteringen til en nettside automatisk tilsvarende. Safari-nettleseren forstørrer (eller reduserer) websider for å passe til skjermen, men det er ikke perfekt. Selv om Safari kan få sidene til å passe på plass i det hele tatt, kan designene dine lide fordi:
-
Når siden forstørres for å passe liggende modus på en iPad, kan optimerte bilder bli uklare.
-
Redusere størrelsen på sider kan gjøre tekst umulig å lese.
I mange år har de fleste optimalisert nettsidenees bredde og høyde for de mest brukte dataskjermer:
-
Bredde: I de tidlige dagene av Internett, med denne strategien, mente du at du skapte design som var ikke mer enn 780 piksler bredt slik at de ville passe innenfor en skjermoppløsning satt til 800 x 600 piksler. De fleste valgte 780 piksler fordi den innstillingen igjen et lite rom for rullefeltet på hver side av nettleservinduet.
I de senere årene, som større skjermer har blitt mer rimelig og mer brukt, oppdaterte de fleste webdesignere målestørrelsen på 960 til 980 piksler, som passer godt på skjermer med en oppløsning på 1024 x 768 piksler.
-
Høyde: Selv om de fleste designere er enige om bredden på et design som er optimalisert for disse skjermstørrelsene (gi eller ta 10 eller 20 piksler), har en debatt slått seg om hvorvidt websidedesign skal passe inn i høyden av disse designene.
Teorien bak å begrense høyden på nettsider er basert på studier som tyder på at brukerne ikke liker å rulle nedover en side, og at innhold som ikke er synlig når siden først lastes, blir ignorert. Muligvis rulling har fått en dårlig rap gjennom årene. Det er på tide å forlate ideen om at webdesign aldri skal utvide mer enn 600 piksler nedover en side.
Denne figuren illustrerer hvorfor iPad for alltid har endret debatten om hvor lenge en nettside skal være. Her ser du et skjermbilde av ING Direct-nettstedet som det vises på en iPad i portrettmodus. I rettferdighet til designerne hos ING Direct passer stedet komfortabelt innenfor begrensningene til en skjerm med en oppløsning på 800 x 600 piksler.
Ved å begrense nettstedets innhold til 600-pixel cutoff, opptar designet kun om lag en tredjedel av iPad-skjermbildet i stående modus. Selv i landskapsmodus på iPad, tar designet ikke opp det vertikale rommet, i stedet fyller nederste kvartal av skjermen med den lyse oransje bakgrunnsfargen.
Hvis du vil lage bare ett design for et nettsted, er det best å designe sidene sine til å være 980 piksler bredt og deretter utvide dem minst 980 piksler nedover skjermen.Hvis du gjør dette, tilpasser både iPad og iPhone automatisk designet for å fylle skjermen i liggende og stående modus ved å justere størrelsen slik den passer.
Men hvis du virkelig bryr deg om design og ønsker at sidene dine skal se deres beste ut på iPad og iPhone, er det best å lage to forskjellige design.
Reglene for Cascading Style Sheets (CSS) inkluderer muligheten til å lage flere stilark for å best utnytte størrelsen og egenskapene til hver enhet. For eksempel kan du opprette stiler som er målrettet mot landskapet eller stående orientering av iPhone eller iPad (som i designet som vises her).
På samme måte kan du målrette mot forskjellige enheter med forskjellige stilark ved å lage et sett med stiler for en side når den vises på en stasjonær datamaskin og et annet sett med stiler når siden sendes til en skriver.
