Need help w/ responsive web design

I have made a portion of a website, but it looks terrible on the phone. I have tried media queries in CSS and I see zero impact on how to adjust this to look presentable on a phone. Is there anyone who knows how to do this and be willing to sit down with me and try to figure this out. I’m willing to pay a tutoring fee.

1 Like

Add a viewport

"Even for a basic page, you must always include a viewport meta tag. The viewport is the most critical component you need for building multi-device experiences. Without it, your site will not work well on a mobile device.

The viewport indicates to the browser that the page needs to be scaled to fit the screen. There are many different configurations that you can specify for your viewport to control the display of the page. As a default, we recommend:

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

I’m only around really really late at night but I know VCC tends to hold weekly “office hours” and you can reach out to @denzuko for his calendar availability. He uses some kind of calendar app to schedule appointments.

1 Like

I would recommend using a CSS framework like Bootstrap, which makes it much easier to create responsive layouts. It uses CSS media queries at it’s core, but also comes with a nice 12 column system for creating columns, and a bunch of UI widgets (tab controls, dropdowns, etc.). Even their own site is built using it, and you can resize your browser to see how different screen sizes affect the layout.

3 Likes

that’s the one! I was trying to remember the name of the prebuilt library.

1 Like

Take a look at freeCodeCamp.org. They have in-depth lessons on responsive design.

1 Like

I would second using bootstrap but beware the samples have lots of layouts/parts that can get confusing quick. Not all are optimal for mobile.

Bootstrap is archaic these days one should be using Bulma.

Same with jQuery, most of that is baked in or obsolete. VueJS is a better choice.


If your need someone to help guide you then feel free to pick a time from https://calendly.com/denzuko/maker-help?back=1&month=2019-05

And I’ll be there to help out.

If it is a site you need to maintain I would avoid picking a flavor of the day. Look for tech that has a history of maintaining the code base. Too many libraries are just clones of other ideas and soon abandoned.

Take it from someone who builds sites and maintains 400+ sites across dozens of servers.

2 Likes

your quite rite on avoiding the flavor of the day. But we also said that about prototype and script.oc.lous then jQuery got bundled with rails and the rest was done.

Bulma is being bundled with other frameworks and its been around for some time: https://github.com/jgthms/bulma/graphs/code-frequency

Plus its a one for one replacement to bootstrap while remaining better preformant.

@lbhellings I should have stated that earlier but either way. Welcome to the community. Glad that you have posted here and all are welcome. Some have different views and we respect that but hear everyone out equally.

1 Like