by Mark | Mar 31, 2024 | AI and Machine Learning, CSS3, HTML5, JavaScript, State of the Web, Web Accessibility, Web Security, WWW Desktop View
Spring is officially here (in the northern hemisphere). A lot has been happening both in the organization and the world of web technologies. Readers of this blog know we are in the midst of helping many states with their SkillsUSA web design and development competitions. Winners at the state level are then eligible to compete at the national level in June (in Atlanta). We are glad to be helping these states.
For those who suspect, the featured image was created with AI (Adobe Firefly in this case). Readers of this blog will also recall that all links will open in a new browser tab.
Web Technology Updates
- Accessibility trends – we found this overview of 7 accessibility trends to watch in 2024 an interesting read. Web accessibility testing will become more automated with greater reliance on AI (Artificial Intelligence). Personalized accessibility solutions and more integration of voice technology also top the list. We encourage you to review the article to learn more about these trends.
- CSS – Chris Coyier created a bookmarkable guide to a list of recent enhancements to CSS. We like the overview of these along with notes about when you should care and what browsers support these capabilities now. Working examples (which allow you to also view the code) are highly useful and helpful. Emphasis is on container queries, the :has( ) pseudo selector, View transitions, anchor positioning, and much more. We encourage readers to review and reference his article.
- Frontend Trends – Diego Petrecolla provided a solid overview of frontend trends for early 2024. This includes a nice overview of BFF (Backend for the Frontend) patterns, PWA (Progressive Web Apps), JavaScript and more.
- Web Development Trends – We found this informative article useful as it combines an overview of where these technologies came from (HTML, CSS, JavaScript) along with where they are going (use of AI in web development, voice search optimization, Web Assembly, and cyber security measures). Definitely a lot to think about as we move into the second quarter of 2024.
- Web Design Trends – Christopher Lara reviews 24 web design trends (since it is 2024, after all). From scrolling animations to claymorphism to dark mode to frosted glass effects to voice activated interface, there is a lot to unpack in this article.
- Cybersecurity trends of 2024 – Vera Cooper (Splashtop) provides an overview of many cybersecurity trends which are emerging in 2024. AI and machine learning top her list. IoT is a close second. Phishing attacks, mobile security, and much more are discussed in her article as well.
These are some of the articles/ trends we are watching evolve in 2024. What additional trends do you see? Let us know in the comments. We always look forward to insights from our members.
by Mark | Jan 29, 2024 | CSS3, HTML Web Components, JavaScript, WWW Desktop View
Web Professionals Global hopes that 2024 is off to a great start for everyone reading this post. It is hard to believe January is almost concluded. WOW! That being said, it is time to catch up on various aspects of what we have been investigating recently. Although we don’t specifically address AI in this post, the featured image was generated with Adobe Firefly. Let us know what you are keen to learn more about.
Here are our areas of focus for January:
- accessibility (always an important topic),
- CSS,
- HTML web components
- JavaScript
Accessibility
We noted the UK government is making changes to the design system to meet WCAG 2.2. For those needing a bit of a refresher – Web Content Accessibility Guidelines 2.2 was published in October, 2023 by the W3C. Many components are affected by this change (ranging from back links and breadcrumbs to tags). There are also changes to patterns to ask users to supply information and patterns to help users do things.There are also page pattern changes. We encourage you to review the article to learn more. Yes, this is the UK, but we are expecting these enhancements will ripple worldwide relatively soon.
CSS
Stephanie Stimac provides a great introduction to CSS media query for scripting support. With the release of Chrome 120 (November, 2023), this support is now available. “Simply, this media query allows you to test whether scripting language are available and tailor page content and styles depending on support.” Progressive enhancement has come a long way since we first started thinking about such concepts.
HTML Web Components
Zach Leatherman provides great insights via his Attempted Taxonomy of Web Components article. “These components layer on interactivity and add behaviors in true progressive enhancement fashion. This is the bread and butter use case of web components.” Of course, he expands significantly in the article and even discusses JavaScript web components. We encourage readers to check this article out. It is well worth reading.
For those who are not that familiar with HTML web components, perhaps the Web Components in Earnest article will help put things into better perspective.
JavaScript
During some recent internal discussions, I was reminded that we have not touched much on JavaScript and frameworks in a while. Of course, this discussion came up as part of our ongoing web design and development competitions. Hard to believe that we have been doing these competitions on the national stage for over 2 decades (and almost 2.5 decades in Illinois). Which got me to thinking – rather than discuss what is happening with ES and JavaScript, perhaps we should ask our readers for their opinions about the current state of JavaScript. Therefore, what are your thoughts about Vite? For readers unfamiliar, here is the why Vite development guide. How are you using this in your projects today? We look forward to your comments. Perhaps we will focus on additional projects in the coming months. A lot depends on the number of comments we receive *wink wink – now is the time to comment.*
Yes, there are many other articles we could have posted. However, we thought this mix would be a good introduction to what is happening with web technologies as we begin 2024. As always, we appreciate and look forward to your comments.
by Mark | Dec 7, 2023 | AI and Machine Learning, CSS3, Industry News, JavaScript, Web Accessibility
As 2023 draws to a close, we thought it would be helpful to share some of the articles we have been reading. We have tried to focus on a handful of articles (covering the categories below). As we have noted on previous articles, all links will open in a new browser tab/ window.
Artificial Intelligence
As readers are well aware, the pace of change in AI is hard to fathom. This article summarizes what we should be looking for in late 2023 and early 2024. Perhaps we will look back at this article in mid-2024 and see how the predictions fared.
As you may suspect, the “featured image” accompanying this post was generated by Adobe Firefly.
Accessibility
Web Content Accessibility Guidelines (WCAG) 2.2 were released on October 5. There are many aspects to consider. We found Craig Abbott’s analysis most helpful (this is definitely worth a read).
CSS
If you are even a little curious where CSS might be heading, we encourage you to review Eric Meyer’s article concerning Nuclear Anchored Sidenotes. Of course, you will need a fairly recent version of the Chrome browser with the “experimental web features” option enabled if you want to try out his examples.
JavaScript
JavaScript continues to evolve as well. Here is a good article concerning new features for 2023 and expectations for 2024. Some of the main features discussed including the ability to change an array by copy without mutating the original array. One can also find within an array starting at the end and working backwards.
WordPress
WordCamp US concluded several months ago. However, these presentations provide an overview of many insights provided at this venue. Of course, the annual keynote address by Matt Mullenweg (State of the Word) is scheduled for December 11 (from Spain). We are definitely curious what will be covered in that keynote.
Feedback please!
It has been a few months since we have posted a “desktop view” article. Do you enjoy reading these articles? What other topics would you like to see us cover (to learn more about)? Please let us know in the comments.
by Mark | May 31, 2023 | AI and Machine Learning, CSS3, JavaScript, Web Accessibility
Hard to believe we are almost at the middle of 2023. Time flies. As we prepare for our 20th national web design and development competition in Atlanta (beginning June 20), we thought it might be useful to share some of the articles we have been reading.
AI and images
Before we cover those articles, we feel it is important to mention our featured image. This was generated using Adobe FireFly. We used the following text to have the image generated. Note that we were rather specific in what we asked for (and the technology complied).
Looking at a desktop holding a phone, tablet and laptop along with a notebook with a pen. The desktop has one succulent plant. Sunlight is coming through a window to the left of the desktop.
If you expand the image, you will note that there is a tag assigned in the lower left corner indicating this image was generated using AI. We never cease to be amazed at how quickly one can create images (and how detailed they are).
We recently became members of the Content Authenticity Initiative. As we have mentioned in earlier weblog posts, the purpose is “to provide media transparency to allow for better evaluation of content.” We encourage readers to check out this initiative (and consider becoming members). In our view, as AI generated images become more prevalent, it is important to inform everyone that the image has been computer generated. We view this in a vein similar to copyrights. If one uses something that has not been created by the author, it is important to inform (and respect) where the images come from. That is why we commit to not only providing the source, but the text used to generate these images.
Accessibility
For those who missed it, May 19 marked Global Accessibility Awareness Day. The GAAD Foundation was launched in 2021 to mark the 10th anniversary. The focus is to make accessibility a core requirement. We encourage you to review the site (and focus on accessibility every day, not just May 19th).
CSS
We recently encountered a nice review of what’s new in CSS and UI. The article outlines 20 recent developments.These include responsive design improvements (such as container queries and style queries). The :has( ) selector lets one check if a parent element has specific children. There are many other enhancements which professionals can take advantage of (either now or very soon). We encourage readers to review the article to learn more about changes happening this year.
Also, we recently learned that scoped CSS is back. “Scoped styles allow you to contain a set of styles within a single component on the page.” We encourage readers to review the capabilities discussed in this article. Some nice examples are also provided.
We also came across this article (written in January) discussing new CSS relative units. Did you know there are roughly 50 CSS length units?
JavaScript
We recently encountered this nice overview of new JavaScript features coming in ECMAScript 2023. Many of these changes may have significant uses in your code. For example, change array by copy and array find from last. In addition to these smaller proposals, there are 4 larger ones. These include iterator helpers, temporal, decorators, and making resource management obvious.
National Web Competition
This year marks our 20th year of providing a national web design and development competition with SkillsUSA (yes, we started as a demonstration competition in 2004) and we have been running this ever since (even during the pandemic). We could not do this without the help of many people. We really appreciate their help and are posting additional articles. We managed to provide assistance to a number of states this year. We hope to see the winners of those state competitions at our national competition in June.
Feedback please!
That is what we found interesting this month. As always, we are keen to learn what you found interesting (and what you would like to learn more about). Please let us know in the comments.
by Mark | May 8, 2023 | AI and Machine Learning, Industry News, JavaScript
April has been a very busy month at Web Professionals Global. In addition to running the SkillsUSA national web design and development competition, we have been helping more and more states with their statewide web design and development competitions. This year we connected with a significant number. We provided the contest assets (including a work order), a coding environment, judging rubric, and associated videos to help both competitors use the online environment and judges review the work of competitors. This means our monthly update on what is happening in the world of the web is running a bit late.
Here are some of the articles we found interesting. We hope you enjoy learning more about what is happening. As always, we are interested in learning what you are most keen to learn about. Please add a comment and let us know. Here are some categories for the articles we found interesting. As mentioned in previous posts, all links will open in a new browser window/ tab.
- AI and current uses
- Browsers
- JavaScript
AI and current uses
You will note there is a featured image associated with this weblog post. In the past, this was manually generated (using tools such as Adobe Express or similar). The image this month was generate from a test entry describing to Adobe Firefly what was desired. In this example, I entered text asking for a photo of a desktop with an open laptop, an open notebook, pens and pencils on the desk and blooming orchids. The result is what you see. It was generated in under 10 seconds. Yes, AI saves time.
We have also been using AI to generate the client assets for our web competitions. Logo creation, text content, and more are all generated using AI (which saves us considerable time).
As an organization, we support the recently formed Content Authenticity Intiative. We encourage readers to follow the link to learn more about this important initiative.
Browsers
It appears Google is considering updating the venerable padlock depicting SSL sites.They are considering a variant of the tune icon. Read more about it on the Chromium blog. They present a solid rationale for making this change. For example, only 11% of those surveyed really understood what the padlock meant. As they mention, even the FBI mentions the lock icon is no indication of website safety. We are curious as to your thoughts about this change. It appears this will be coming to a Chrome browser near you one of these releases. Let us know your thoughts in the comments.
Speaking of browsers, in case you missed it, April 30 marked the 30th anniversary of the licensing of the web for general use and at no cost. 30 years. WOW. Yes, that was a pun.
One more article you may find of interest – the calm web: a solution to our scary and divisive online world. Karolina Szczur provides many thoughtful insights. She also offers practical ways one can get started. For example, stripping away unnecessary code and removing low quality content.
JavaScript
Although this article is over a year old, it might be worth reviewing (and pointing this out to aspiring web professionals – perhaps those you teach). A web components primer seems a good introduction to the topic. For those of you teaching web technologies – do you discuss web components? Why or why not? What are your thoughts about this article?
Your turn…
That is a quick overview of some articles we found intriguing. We hope you enjoy them as well. What did you find helpful? What would you like to learn more about? Please tell us in the comments.
by Mark | Feb 27, 2023 | CSS3, Industry News, JavaScript, Web Development
Here are some of the articles we have been reviewing during the month We hope you find them as interesting as we did. [Note: these links will all open in a new browser tab.] Don’t forget to let us know what else you would like to see in terms of current professional trends in web design and development. Here are the categories of what we encountered during February:
- CSS
- JavaScript
- Web Development Trends
CSS
Here is an interesting read – 10 modern layouts in one line of CSS. These include sidebar says, the pancake stack, the 12 span grid and much more. Let us know what you think of these.
If you are curious where CSS is going, consider the high definition CSS color guide. With Chrome 111, there is support for CSS Color 4 gamuts ( size of something) and color spaces (this is explained in much ore detail in the linked article). This means there is 50% more colors in supporting browsers.
Native CSS nesting may also be finally arriving (in Chrome 112, for example). Bryce Wray provides a nice overview of recent experiments with this.
JavaScript
Did you get a chance to review the state of JavaScript in 2022 article? In a nutshell, JavaScript is more vibrant than ever. Of course, there are many more details to be found in the linked article.
Web Development Trends
Robin Wieruch published an interesting overview of 10 web development trends in 2023. Among the trends discussed is a movement from client side rendering to server side rendering. It is worth noting that server side rendering is now relying on JavaScript. Serverless functions continue to be a trend this year.Because of this, databases are also experiencing a renaissance. In terms of JavaScript runtimes, Deno is a successor of node. To learn more about these trends (and much more), we recommend reading the entire article.
Horror stories
As professionals, we are always working with clients. We thought it might be helpful to share a horror story or two each month. Obviously, there are lessons to be learned. However, the fact that we have been using web technologies over three decades and still see some problems repeating means we are not fully learning these lessons.
Case in point. I was helping a client with a WordPress site. They had recently purchased a plugin and were experiencing difficulty in using the enhanced features which came with the upgraded plugin (freemium model is still very popular, isn’t it). Specifically, I was asked to investigate why all the added functionality remained greyed out despite having paid for the upgrade. To keep the story short, one had to click on the greyed out item to “load” the enhancement. Took yours truly about an hour to figure that one out. Lesson we should all have learned by now – there are standard design patterns which must be followed. To show something as greyed out means it is not active and not available. Breaking a pattern which has been in use for well over a decade causes unnecessary consternation. A simple explanation that one must click on an item to activate it might have sufficed (instead of wasting the time of multiple individuals).
As if that wasn’t enough, when helping another client, I needed to contact technical support for a WordPress plugin. Believe it or not, the individual who was trying to help me quickly asked for my username and password so they could access the site as an administrator to see what the problem was. Ummm, NO. Ok, they then asked if I could create a separate administrator account for them to use so they could see the site. Ummm. NO again. Think about this from a security perspective – if you allow someone (who you don’t know) administrative access to your site, you have handed over the data and capabilities of the site to a stranger. Would you gladly hand your car key fob to a stranger who asked for a ride to the store while you were waiting for the light to change? Maybe if your car was making a strange noise? Same concept. Never, ever, provide such access no matter how severe you think the problem is with a WordPress plugin. If you need that much help, it is time to find an alternate plugin. Shame on the vendor in this case for even allowing an employee to make such a request.
OK, readers, that is enough on the horror stories for this month. Do you have something you would like to share which tops these horror stories. Please let us know in the comments (or send us an email to our membership email at the top of the page). We are always interested in what you liked and would like to see in future articles. Just let us know that as well.
In case you missed these…
We recently published additional information about the proposed Websites and Software Applications Accessibility Act. We encourage you to review this post to keep up to date with what is happening regarding website accessibility.
Curious about security (especially passwords), please review our passwords and psychology article.
We also announced our 2023 web design and development competitions (including that we are recognized as a SkillsUSA Official Partner.
Your turn
We are always what you find interesting and what you would like to learn more about. Please provide comments below so we can better address what you find most interesting.