Posizionare assolutamente tutto su un sito web?

Question

Ho avuto una discussione con qualcuno sul posizionamento assoluto. Sostiene che la migliore pratica per garantire che tutto sembra uguale nella maggior parte dei browser e che è il modo più semplice per mantenere l'aspetto e la sensazione che si intendeva per un sito web.

Non sono d'accordo con la sua opinione, che il posizionamento assoluto sarebbe il rimedio e un approccio generale migliore per la creazione di una pagina web.

Nel mio caso, sono stato più propenso a utilizzare l'approccio di margine/larghezza/regolazioni fluttuanti accurate e talvolta la tabella occasionale. Che è una leggera generalizzazione, come ovviamente non smetterei di usare il posizionamento assoluto solo perché sarei ideologicamente contrario, è solo che trovo l'approccio assoluto-posizione una regola adatta a tutti-approccio come sostenuto dal mio pari a essere piuttosto dubbioso

Qual è il consenso generale su questo?

Answer 1

La mia visione generale è il fine giustifica i mezzi.

Il pragmatismo regna sovrano qui. L'obiettivo finale è quello di farlo funzionare il più rapidamente possibile sulla più ampia gamma di browser possibile. Se utilizzare o meno il posizionamento assoluto, se utilizzare o meno le tabelle, se utilizzare o meno il puro CSS ... tutte queste domande sono, nel migliore dei casi, secondarie.

In realtà trovo bizzarro quanto "odio da tavolo" ci sia là fuori ma, come è stato documentato innumerevoli volte, se vuoi fare alcune cose (come il centraggio verticale) e renderlo compatibile con IE6 non c'è più veloce , soluzione più semplice e più compatibile.

Non sono a favore o contro tabelle, posizionamento assoluto o altro. L'unica cosa per cui "sono" è che funzioni.

Quindi, in questo filone, trovo che la discussione sul posizionamento assoluto "radicale" sia - per mancanza di una descrizione migliore - distrazioni irrilevanti.

Con tutte queste cose (tabelle, posizionamento assoluto, puro CSS, ecc.) Nella maggior parte dei casi non stai risolvendo tutti i tuoi problemi, stai semplicemente scambiando un insieme di problemi con un altro. Potrebbe andar bene, perché nel contesto di ciò che stai facendo potrebbe essere preferibile una serie di problemi, ma non esiste un punto magico (che si tratti di posizionamento assoluto o altro).

Dall'esperienza ho avuto altrettanti problemi ottenendo il posizionamento assoluto per fare ciò che voglio (cross-browser) come qualsiasi altro approccio.

Answer 2

Utilizzare il posizionamento assoluto solo quando si è sicuri al 100% che gli elementi coinvolti non dovranno mai ridimensionare le proprie dimensioni e non verranno spostati. Se hai posizionato in modo assoluto un elemento e poi ne cresce un altro, possono sovrapporsi e il tuo layout è rotto. Io userei il posizionamento assoluto con molta attenzione e generalmente consiglio contro di esso. Lo stesso layout può quasi sempre essere raggiunto usando elementi fluttuanti e/o posizionamento relativo.

Answer 3

Garantire che tutto sembra uguale su tutti i browser è un obiettivo difficile, soprattutto perché si punta sempre a un obiettivo in movimento.

I siti Web sono un meccanismo di consegna per contenuti per lo più di natura testuale. Se i tuoi contenuti si basano su un posizionamento pixel-perfect, come grafica animata e simili, HTML e Javascript potrebbero non essere la soluzione migliore per te. Dovrebbe davvero importare se i tuoi paragrafi sono un pixel più in basso nella pagina di Firefox che in IE?

Answer 4

Anche se può essere molto soggettivo, non sono un fan del posizionamento assoluto, come lo dovrebbe controllare con CSS disabilitato per vedere come il contenuto degrada per browser non compatibili con CSS (come motori di ricerca, console browser di testo e browser HTML-> Speech per non vedenti).

L'altro vantaggio principale, non posizionandosi in modo assoluto, è che si può avere un CSS più generalizzato, condiviso su un intero sito, senza dover depositare dichiarazioni di posizionamento su tutto il codice - sarebbe orribile se il cliente improvvisamente fa il suo il logo ha un aspetto diverso e deve spostare tutto intorno ...

Answer 5

Internet non è stampato, non penso sia l'ideale per posizionare tutto in modo assoluto. Direi che puoi assicurarti che le cose sembrino migliori usando il tuo metodo, magari aumentando l'uso di EMs per alcune larghezze per consentire alla pagina di essere un po 'più fluida su schermi di diverse dimensioni (e DPI). Ciò consente ai tuoi contenuti di scalare meglio e, con la navigazione mobile, diventare più popolare è importante.

Nella mia esperienza, le pagine tendono ad apparire complessivamente migliori quando pianifichi che la pagina debba adattarsi un po 'a dispositivi diversi, invece di provare a imporre layout perfetti al 100% come quelli che vedresti in stampa. Questo non è solo la natura di Internet.

Modifica: Pensandoci meglio, l'utilizzo di tutti gli assoluti potrebbe davvero tornare a morderti con i browser mobili se non stai attento. Cosa succede quando il tuo sito utilizza il posizionamento assoluto su qualcosa come l'iPhone (supponendo che stai allineando alcuni elementi agli angoli)? Il posizionamento sarebbe allineato agli angoli dell'iPhone, che sono un rapporto dispari (rispetto ai computer) e una risoluzione molto più piccola; buttando tutto fuori di wack. Se hai usato una combinazione di float/width/etc, assicurati che il sito mantenga le sue dimensioni originali e che tu debba solo scorrere.

Answer 6

Il posizionamento assoluto è in genere piuttosto scadente. Raramente vuoi che il tuo sito web appaia con le stesse finestre del laptop 1024x768 di qualcuno e a schermo intero sul desktop 1920x1200. Inoltre, buona fortuna conciliare il posizionamento assoluto con diverse dimensioni dei caratteri utente.

Ricordate ai vostri colleghi che gli utenti avrebbero preferito vedere l'aspetto grafico hanno intendono per un sito web, non è l'aspetto grafico lui intende (entro limiti ragionevoli.)

Answer 7

Cletus ha un punto. Come sviluppatori, la domanda è in definitiva: quanto vogliamo essere approfonditi? Se il tuo sito in uscita è il più importante, è possibile che vengano sacrificate ulteriori precauzioni. Se la creazione di un sito "a prova di proiettile" è una priorità, fare ciò richiederà molto tempo e impegno. Personalmente non sacrificherei mai l'estensibilità e l'usabilità in nome della convenienza. Il ridimensionamento tra le altre cose squalifica il posizionamento assoluto per il layout ogni volta nel mio libro.

Answer 8

Non sono affatto un fan del posizionamento assoluto ma ho visto gli sviluppatori Web usarlo per ottenere risultati di ricerca migliori, perché possono facilmente inserire la parte di testo più importante all'inizio dell'HTML e utilizzare il posizionamento assoluto per posizionalo dove effettivamente appartiene.

Non lo userei nemmeno per quell'argomento, perché ci sono modi per rendere l'HTML per essere search engine friendly ma usare comunque un layout fluido come lo The Perfect 3 Column Liquid Layout o altre varianti.

Answer 9

Egli sostiene che la migliore pratica per garantire che tutto sembra lo stesso nella maggior parte dei browser

È Non puoi garantire che tutto sembra lo stesso in tutta maggior parte dei browser. I font sono sempre resi in modo diverso a seconda della piattaforma, delle impostazioni e della disponibilità. Se si utilizza il posizionamento assoluto completo - come in, ogni elemento ha la sua posizione orizzontale e impostata in pixel - quindi qualsiasi deviazione sulla dimensione del carattere può comportare la scrittura di righe di testo l'una sull'altra, rendendo pagina illeggibile.

Esistono strumenti di progettazione WYSIWYG che eseguono questa operazione (e alcune persone abusano di Dreamweaver in questo modo), ma in genere è considerato un approccio poco divertente. Più comunemente, il posizionamento assoluto viene utilizzato solo nell'asse orizzontale, per creare intestazioni e piè di pagina a larghezza fissa consentendo al contempo il testo nella pagina di occupare lo spazio verticale necessario. (Questo è ciò che SO fa, per esempio, tra molti altri.)

L'argomento di layout fisso-liquido sulla larghezza del browser è una guerra religiosa che infurierà per sempre, ma il sommario ovviamente corretto è che il liquido è il migliore. ;-)

(... se più difficile da tirare fuori, natch.)

è il modo più semplice per mantenere l'aspetto e la sensazione che si intende per un sito web.

Sì! Un cattivo modo di risolvere un problema è spesso il più semplice. Ma "best practice"? Quasi. solo

Answer 10

utilizzare il posizionamento assoluto quando si è sicuri al 100% che i coinvolti elementi non dovranno mai scalare loro dimensione e non saranno spostati. Se si è posizionato in modo assoluto l'elemento e successivamente un altro aumenta , è possibile che si sovrappongano e che il layout sia danneggiato.

Questo è giusto. Ho appena guadagnato 500 dollari per sistemare un sito per un ragazzo, e insegnandogli che il suo sito web in posizione assoluta si è rotto nel momento in cui ha aggiunto una virgola, perché il testo sarebbe ri-flusso e l'intera cosa andrebbe a pezzi.

Answer 11

L'utilizzo del posizionamento assoluto ti morderà sempre più tardi. Un sito dovrebbe trovarsi nel flusso normale il più possibile, in modo che gli elementi possano sedersi in relazione l'uno con l'altro (crescere/restringersi, collassare quando è nascosto, ecc.).

Con un layout assolutamente posizionato, sarà sempre necessario modificare il layout ogni volta che il contenuto cambia.

ho sempre e solo realmente utilizzare il posizionamento assoluto per tre motivi:

1) che sto mettendo un elemento in cima a un altro elemento, come una scatola pop-up.

2) Non c'è davvero nessun buon modo per inserire un elemento in cui ha bisogno di essere in flusso normale

4) L'elemento verrà manipolata in modo dinamico (javascript) e che deve accadere al di fuori del flusso normale.

L'altra regola che tendo a rispettare quando si utilizza il posizionamento assoluto è utilizzare un altro elemento come un genitore relativamente posizionato. In questo modo, l'elemento posizionato in modo assoluto si posizionerà rispetto a quel genitore, piuttosto che al viewport (che spesso cambierà le sue dimensioni a seconda di come viene visualizzata la pagina).