The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> Responsive and adaptive design
Lee Batchelor
post Jan 12 2024, 01:12 PM
Post #21


Member
***

Group: Members
Posts: 82
Joined: 10-May 20
Member No.: 27,332



Hi all,

When I was trained in HTML and CSS, it was when desktop computers were the only platforms. Now that mobile devices are used for 51% of all web browsing, we need to use responsive and adaptive design so that the website resolves correctly on all devices. I recently completed a web design and used this code in the meta tags,
<meta name="viewport" content="width=device-width, initial-scale=1">

Sadly, this doesn't cause the website to resolve correctly on mobile devices in landscape and portrait modes. I have a feeling there's a 500 hour course of instruction in my future if I want to fix this issue. Perhaps there are some easier lines of code that will solve my problem? Thoughts?

Thanks...
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
 
Reply to this topicStart new topic
Replies
Lee Batchelor
post Feb 1 2024, 07:15 PM
Post #22


Member
***

Group: Members
Posts: 82
Joined: 10-May 20
Member No.: 27,332



Hi Coothead,

Many thanks for the validator information. When I trained in 2012, there were no mobile devices for websites, so we were only taught how to code for PC and Mac computers - much simpler days!

I'm delighted you use the W3C validator. I used it in training and for every website since. Never had any reported issues with the code not working on certain browsers.

I've learned SO much from reading through the code you wrote for me. The band members extend their gratitude as well. I'll be 71 in July, so I'm not that far behind you. All our band members are between 69 and 72.

I'll finalize the website and then upload it. As it stands, the pages all look fine at a breakpoint width of 340px. I modified some of the design concepts in your finished pages. I teach technical writing at Humber College in Toronto. In one of my courses, I teach the concepts put forth by Dr. Robin Williams (not the actor of course). She wrote a book entitled, The Non-Designers Design Book. In it, she coins the acronym, CRAP. It stands for Contrast, Repetition, Alignment, and Proximity. I use these rules exclusively in all my website and document designs for large companies. The goal is to drastically increase readability and information retrieval. Your designs follow these principles, with only a few minor differences.

Off topic - I have a friend who will hit the 80 mark this May. He's doing well and I'm sure we won't see you fall off the planet anytime soon either. At any rate, I'm eternally grateful for the help. Stay well...

- Lee

This post has been edited by Lee Batchelor: Feb 1 2024, 07:18 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic
Lee Batchelor   Responsive and adaptive design   Jan 12 2024, 01:12 PM
coothead   [indent] Thoughts? [indent] If your page appears...   Jan 12 2024, 02:42 PM
Lee Batchelor   Thanks Coothead. If I disable my entire CSS sheet,...   Jan 12 2024, 03:32 PM
coothead   [indent]Do I have this right? [indent] Not reall...   Jan 12 2024, 04:33 PM
Christian J   If I disable my entire CSS sheet, the pages will ...   Jan 12 2024, 05:27 PM
Lee Batchelor   Thanks, Coothead. I'll give that article a rea...   Jan 12 2024, 10:20 PM
Lee Batchelor   Christian, I nulled out the CSS sheet and opened t...   Jan 12 2024, 10:34 PM
Christian J   Everything displayed perfectly but the alignments...   Jan 13 2024, 07:54 PM
coothead   [indent] Thanks for the help. Further thoughts? ...   Jan 14 2024, 05:03 AM
coothead   I forgot to mention that I have used index.[b]htm...   Jan 14 2024, 11:00 AM
Christian J   The CSS looks like it can be shortened in various ...   Jan 13 2024, 08:27 PM
Lee Batchelor   Hi Coothead, Many thanks for the file. I'll c...   Jan 17 2024, 10:22 AM
Lee Batchelor   Hi Christian, Thanks for the analysis. You and Co...   Jan 17 2024, 10:31 AM
Lee Batchelor   Okay, I opened the new page design Coothead did fo...   Jan 17 2024, 10:46 AM
coothead   [indent] The only issue I see is the words ...   Jan 17 2024, 11:56 AM
Lee Batchelor   Great, thanks again Coothead. Send me your invoice...   Jan 17 2024, 01:40 PM
coothead   [indent] Great, thanks again Coothead. Send me yo...   Jan 18 2024, 06:20 PM
Lee Batchelor   OMG Coothead. What a tremendous offer. You're ...   Jan 24 2024, 04:38 PM
coothead   [indent] I usually right align the picture in the...   Jan 24 2024, 05:31 PM
Lee Batchelor   Sorry for the confusion, Coothead. When I opened y...   Jan 24 2024, 10:22 PM
Christian J   [b]Edit I selected the "notification by emai...   Jan 29 2024, 07:54 AM
Lee Batchelor   Coothead was generous enough to devote his time to...   Jan 29 2024, 03:14 PM
coothead   [indent] The only remaining issue is, the menu is...   Jan 30 2024, 05:57 PM
Lee Batchelor   Once again, many thanks Coothead!   Jan 30 2024, 07:19 PM
coothead   Hi there Lee Batchelor, after a look at your lat...   Jan 31 2024, 06:49 PM
Lee Batchelor   They look great, thanks Coothead! I just fin...   Feb 1 2024, 09:41 AM
coothead   [indent] Shall I download the HTML and CSS files ...   Feb 1 2024, 11:09 AM
Lee Batchelor   Coothead, I used the Inspection tool in Chrome and...   Feb 1 2024, 10:04 AM
coothead   [indent] I used the Inspection tool in Chrome and...   Feb 1 2024, 11:24 AM
coothead   Hi there Lee Batchelor The music.html file inclu...   Feb 1 2024, 12:23 PM
Lee Batchelor   Thanks, Coothead. That looks better. I forgot to m...   Feb 1 2024, 03:04 PM
coothead   [indent] I forgot to mention that the music page ...   Feb 1 2024, 03:56 PM
Lee Batchelor   Good catch Coothead. I ran the the pages through ...   Feb 1 2024, 04:18 PM
coothead   [indent] I ran the the pages through the W3C Val...   Feb 1 2024, 05:30 PM
Lee Batchelor   Hi Coothead, Many thanks for the validator inform...   Feb 1 2024, 07:15 PM


Reply to this topicStart new topic
10 User(s) are reading this topic (10 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 2nd June 2024 - 05:46 PM