Member Avatar for mombasageek

anyone got any advice on designing a mobile website

  • 3 Contributors
  • 2 Replies
  • 79 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by floatingDivs

Dani AI

Generated

A practical starting point: design content for the smallest screens first, then scale up. That keeps priorities clear and avoids shoving desktop-only features into a cramped layout. Include a viewport meta tag so the browser renders pages at device width:

<meta name="viewport" content="width=device-width, initial-scale=1">

Focus on performance and usability. Serve appropriately sized images (responsive images or server-side resizing), compress and combine assets where it helps, lazy-load below-the-fold resources, and defer noncritical JavaScript. Use semantic HTML and appropriate input types (email, tel, date) so mobile keyboards and autofill work for users. Keep touch targets large enough and place primary actions within thumb reach. Test for contrast, keyboard focus, and screen-reader labels — accessibility helps everyone.

About the replies here: is right to point toward cross-device toolkits, but favor maintained, modern projects and progressive enhancement over heavy legacy libraries. is on the right track thinking about layout differences; prefer one responsive codebase with conditional loading of large assets rather than maintaining duplicate content. For step-by-step guides and practical examples, see MDN on responsive design (Responsive design basics) and use Lighthouse/DevTools for performance and mobile diagnostics (Lighthouse). Test on real devices and throttled networks before launch.

Recommended Answers

All 2 Replies

Member Avatar for peidoca

You can try http://jqtouch.com/, which fix most of the compatibility issues cross devices.

Member Avatar for floatingDivs

It's pretty simple to create a mobile view of the site by adding content that's hidden on the desktop view and shows up on the mobile view. This way, those 800x120 header images don't render on a mobile screen and do on a desktop view. Things like that are really simple to implement and can help with the mobile site. Another thing you need to consider using is a liquid-width based layout. For instance, main DIVs should be set to a width of 100%. Things like that would go a long way in making your site mobile-friendly.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.