Is this a good or best way to configure a web site HTML to add mobile users?
My site pages add Googles default meta viewport, and all code is simple (basic CSS, no frills), but flows well into narrow screens.
It uses 10% margins for readability if wide, but if screen max-width is < 800 pixels, it reduces margin to 1%.
Wide things (large images or tables) use 0 page margin, and auto float to center. Table columns will shrink to size of largest word (a few   ; are used)
Most regular size images are float left or right, surrounded by text, but a narrow screen will show this down in single file. A few &nssp ; are used to prevent too-narrow text columns.
My concern is, if screen < 800 pixels, it also sets all IMG max-width to 100%, reducing the size of larger images to fit to screen. Is that “responsible” design? It still downloads bytes, but seems to work well, but I fear I may be missing something?
4
My concern is, if screen < 800 pixels, it also sets all IMG max-width
to 100%, reducing the size of larger images to fit to screen. Is that
“responsible” design? It still downloads bytes, but seems to work
well, but I fear I may be missing something?
Well, one problem with this approach is that you’re still downloading an 800px wide image, even though you’re displaying a much narrower image. Sending mobile users a smaller image would look the same, but would load faster and burn less user bandwidth. Mobile users tend to have worse connectivity than desktop users, so this may be important.
1