1040 stories
·
2 followers

In Praise Of The Basics

1 Share

Lately, I’ve been thinking about the basics of web development. Actually, I’ve been thinking about them for some time now, at least since I started teaching beginning web development in 2020.

I’m fascinated by the basics. They’re an unsung hero, really, as there is no developer worth their salt who would be where they are without them. Yet, they often go unnoticed.

The basics exist in some sort of tension between the utmost importance and the incredibly banal.

You might even think of them as the vegetable side on your dinner plate — wholesome but perhaps bland without the right seasoning.

Who needs the basics of HTML and CSS, some say, when we have tools that abstract the way they’re written and managed? We now have site builders that require no technical knowledge. We have frameworks with enough syntactic sugar to give your development chops a case of cavities. We have libraries packed with any number of pre-established patterns that can be copy-pasted without breaking a sweat. The need to “learn” the basics of HTML and CSS is effectively null when the number of tools that exist to supplant them is enough to fill a small galaxy of stars.

Rachel Andrew wrote one of my all-time favorite posts back in 2019, equating the rise of abstractions with an increase in complexity and a profound loss of inroads for others to enter the web development field:

“We have already lost many of the entry points that we had. We don’t have the forums of parents teaching each other HTML and CSS, in order to make a family album. Those people now use Facebook or perhaps run a blog on wordpress.com or SquareSpace with a standard template. We don’t have people customising their MySpace profile or learning HTML via Neopets. We don’t have the people, usually women, entering the industry because they needed to learn HTML during that period when an organisation’s website was deemed part of the duties of the administrator.”

— Rachel Andrew, “HTML, CSS and our vanishing industry entry points

There’s no moment more profound in my web development career than the time I changed the background color of a page from default white to some color value I can’t remember (but know for a fact it would never be dodgerblue). That, and my personal “a-ha!” moment when realizing that everything in CSS is a box. Nothing guided me with the exception of “View Source,” and I’d bet the melting Chapstick in my pocket that you’re the same if you came up around the turn of the 21st century.

Where do you go to learn HTML and CSS these days? Even now, there are few dedicated secondary education programs (or scholarships, for that matter) to consider. We didn’t have bootcamps back in the day, but you don’t have to toss a virtual stone across many pixels to find one today.

There are excellent and/or free tutorials, too. Here, I’ll link a few of ’em up for you:

Let’s not even get into the number of YouTube tutorials. But if you do, no one beats Kevin’s incredible archive of recorded gems.

Anyway, my point is that there are more resources than ever for learning web development, but still painfully few entry points to get there. The resources we have for learning the basics are great, but many are either growing stale, are quick hits without a clear learning path, or assume the learner has at least some technical knowledge. I can tell you, as someone who has hit the Publish button on thousands of front-end tutorials, that the vast majority — if not all — of them are geared toward those who are already on the career path.

It was always a bit painful when someone would email CSS-Tricks asking where to get started learning CSS because, well, you’d imagine CSS-Tricks being the perfect home for something like that, and yet, there’s nothing. It’s just the reality, even if many of us (myself included) cut our chops with sites like CSS-Tricks, Smashing Magazine, and A List Apart. We were all learning together at that time, or so it seemed.

What we need are more pathways for deep learning.

Learning Experience Design (LXD) is a real thing that I’d position somewhere between what we know as UX Design and the practice of accessibility. There’s a focus on creating delightful experiences, sure, but the real aim of LDX is to establish learning paths that universally account for different types of learners (e.g., adults and children) and learning styles (e.g., visual and experiential). According to LDX, learners have a set of needs not totally unlike those that Maslow’s hierarchy of needs identifies for all humans, and there are different models for determining those needs, perhaps none more influential than Bloom’s Taxonomy.

These are things that many front-end tutorials, bootcamps, videos, and programs are not designed for. It’s not that the resources are bad (nay, most are excellent); it’s that they are serving different learners and learning types than what a day-one beginner needs. And let’s please not rely on AI to fill the gaps in human experiences!

Like I said, I’ve been thinking about this a lot. Like, a lot a lot. In fact, I recently published an online course purely dedicated to learning the basics of front-end development, creatively named TheBasics.dev. I’d like to think it’s not just another tutorial because it’s a complete set of lessons that includes reading, demonstrations, videos, lab exercises, and assessments, i.e., a myriad of ways to learn. I’d also like to think that this is more than just another bootcamp because it is curricula designed with the intention to develop new knowledge through reflective practices, peer learning, and feedback.

Anyway, I’m darn proud of The Basics, even if I’m not exactly the self-promoting type, and writing about it is outside of my comfort zone. If you’re reading this, it’s very likely that you, too, work on the front end. The Basics isn’t for you exactly, though I’d argue that brushing up on fundamentals is never a bad thing, regardless of your profession, but especially in front-end development, where standards are well-documented but ever-changing as well.

The Basics is more for your clients who do not know how to update the website they paid you to make. Or the friend who’s learning but still keeps bugging you with questions about the things they’re reading. Or your mom, who still has no idea what it is you do for a living. It’s for those whom the entry points are vanishing. It’s for those who could simply sign up for a Squarespace account but want to actually understand the code it spits out so they have more control to make a site that uniquely reflects them.

If you know a person like that, I would love it if you’d share The Basics with them.

Long live the basics! Long live the “a-ha!” moments that help us all fall in love with the World Wide Web.



Read the whole story
kvarley
21 days ago
reply
Share this story
Delete

The visionary work and home of Robert Tatin

1 Share
Robert Tatin

Robert Tatin wanted to build a shed. So he did. When he finished it, he decided it was too beautiful to just be a shed. So he built another and ran into the same problem. This conundrum continued until he up and decided that his home in rural Mayenne, France, would be best off if it was deemed a museum. — Read the rest

The post The visionary work and home of Robert Tatin appeared first on Boing Boing.

Read the whole story
kvarley
109 days ago
reply
Share this story
Delete

You Don't Have a PDF Problem, You Have a Workflow Problem

1 Share

A website isn't a filing cabinet, but somehow, yours has become a PDF repository. No one sets out to build a digital monument to the PDF. How did this happen? And what are you going to do about it?

Why PDFs are a problem

PDFs are a barrier between you and your users. They are text-heavy and dense and usually lack their host site's visual context and navigability. Don't serve your audience PDF content that could otherwise be a web page. Good old-fashioned HTML is more accessible, easier to update and maintain, and provides a better overall user experience. 

  • Accessibility. Many PDFs are not created to be accessible to assistive technology. This excludes parts of your audience and leaves your organization vulnerable to lawsuits.
  • Forced downloads. Requiring folks to download a document to complete a task is an extra step. Most won't want to take it. Some users, especially on mobile devices, won't know where to find the download, ending their journey. Users with low bandwidth or limited data plans may not want to download large files.
  • Search and findability. Content hidden in a PDF is also hidden from simple search. Using CTRL+F on an HTML page won't find content in a PDF attached to that page. Without internal navigation, PDFs are hard to navigate and scan for keywords.
  • Obsolescence. Old PDFs lingering on your site can turn up in search results. They may provide information that's inaccurate, out of date, or worse.
  • Screen compatibility. PDFs are formatted for a particular size, usually intended for print. Users on laptops, tablets, and mobile devices must pinch and zoom to navigate the content. 

How to solve your PDF problem

Before you can solve a problem, you have to know its size. First, audit your PDFs. Decide which to tackle first, then convert them to HTML content, link to external sources, or modify PDFs to meet accessibility standards.

Audit

To get a sense of the scale of your PDF problem, perform a PDF audit. Collect a list of all the PDFs on your site and review them one by one. PDF content that meets the criteria below will likely work well as HTML content.

  • Is the content all text and fewer than five pages?

  • Is a PDF the best way to communicate this information to our audience?

  • Is this PDF up to date? Will it need to be updated often?

  • Can it be made into website content or a web form?

  • Do we need to host this content, or can we link to it elsewhere?

  • Can it be deleted?

Download our starter template to start evaluating your PDFs.

To find links to all the PDFs on your website, use web crawler software like Screaming Frog or compile them manually. 

Any time you're tempted to create a new PDF, run through these questions again. 















Spreadsheet showing PDF audit in process, with analytics data and evaluative criteria

This PDF audit highlights that many PDFs are out of date and receive little traffic

Prioritize

Once you understand the scope of the problem, it's time to set some priorities. Get content to people who need it faster by focusing on the most important stuff first. Plus, priorities help keep overwhelm at bay.

  • Audience. Who is the content for? Tackle PDFs relevant to your primary audience first. Then, move on to content for secondary and tertiary audiences.

  • Traffic. Use analytics tools to understand which of your PDFs gets the most traffic. Start there.

  • Timeliness. Figure out when this content was last updated. Fresh, new content, or content that changes frequently, is a good candidate to tackle early on.

These are a starting point. Don't be afraid to set your own priorities.

Convert

There's no way around it: converting PDF content to HTML is work. 

You must restructure the PDF content as HTML, adding headers, lists, and links. You may need to rewrite the content entirely! The page structure, content hierarchy, and even the voice and tone may be different on a web page than they were in print. This change requires human input. Set aside enough time to meet your goals, and work off your prioritized list.

Link

Don't reproduce content locally that is available at other web sources. Link to reliable external web content. Link to documents issued by government agencies instead of hosting them or recreating them.

Mitigate

We recommend converting web content to HTML. If you can't, you must mitigate existing PDFs to meet accessibility standards.

Use the source document and program. Tag the document with all the relevant metadata and structure the software needs to produce an accessible PDF.

Things get tough when the source document isn't available, or the software you used doesn't support making an accessible PDF. Adobe Acrobat's accessibility tools can fix issues flagged during a check. This can be complex and time-consuming. Any future updates to the document will need manual mitigation again. Are you sure this PDF can't be web content?

Fix your workflow

PDFs are a symptom, not the root cause.

An organization's people, processes, and habits create the conditions for a website chock full of PDFs. These internal processes may have nothing to do with the website, but their output often ends up online. Changing to a digital-first workflow takes time, training, and organizational will. 

Here are some common scenarios we see and what to try instead.

Subject matter experts can't or won't publish content to the web

Sometimes, the person who writes the content can't or won't publish it to the web in HTML format. They don't have time, they don't know how—reasons vary. In these cases, someone in a web editorial role can work with subject matter experts (SMEs) to verify the accuracy of content, format it for the web, and get sign-off to publish. This person acts as a liaison between SMEs and the website to get content online in a format that people can access. At the same time, they support the ability of SMEs to create content. As content needs get more complex, it helps differentiate between these roles.

In smaller organizations, educate SMEs to create good web content and publish it themselves.

Web editors aren't empowered to make changes to content

In some organizations, the people who publish content aren't the ones who created it—and they don't have the authority to make changes. If editors can't transform PDF content into something accessible and accurate, their only option is to upload the PDF as-is. 

Reduce your dependence on PDFs by revising your workflow. Include the SME in review and sign-off, and empower the editor to make changes to suit the context.

Internal workflow reliant on PDFs

Human resources departments and other occupations that use a lot of forms may have internal workflows that rely on PDF input. Consider where in the process you can use web forms instead. If it's impossible to cut out all PDFs, create supporting documentation. How-to HTML pages help users understand the process without downloading a form first.

It takes time to change a print-reliant culture, so start small. Look for a few short but high-impact PDFs that you could convert to web forms first.

The CMS is hard to use

Some content management systems weren't created with the needs of authors in mind. Folks using these systems get frustrated or avoid the work. Uploading PDF from Word seems like the fastest option for communicating important information. Minor adjustments to form fields and permissions could help—or a redesign may be in your future. (We know a guy.)

Formal or policy documents that are rarely or never updated

Use document structure, timestamps, and design to make a web page look permanent and authoritative. Visual design and structured content can help users understand the context they need to interpret the document. 

Public policy, law, and code are good candidates for this treatment, which state governments often upload in PDF format.

Work with your site builders to create a unique content type, including the fields and attributes needed to communicate necessary information: time and date, contact person, referenced sources, and a flexible content body area with options for semantic headers. A taxonomy vocabulary or tagging system to identify the originating organization and intended audiences can connect content across your site. (PDFs definitely can't do that.)

Manuals or other lengthy documents

Convert these to native web content. Web pages are easier to keep up-to-date as technology or processes change. If users need offline access, support PDF as an alternate format. A table of contents component makes it easier for users to browse long-form documents by skipping from header to header.















Screenshot of Mass IT accessibility policies page

Structured content fields convey authority and permanence at Mass.gov

Content includes images, tables, branding, or other graphics

PDFs can look like brochures or include graphics or branding in ways that may not be possible on their website. Folks can be reluctant to let go of this design freedom.

Work with your web publishing team to translate the information you need to include into native web content. A design system with table styles, a CMS with the ability to embed data visualizations, and robust landing pages with graphic imagery are all ways to help avoid PDFs.

Your CMS might already have these capabilities, but no one knows about them, or there are no user guides. Time for a lunch-and-learn with your team or some system documentation.















Iowa design system showing table styles, with a blue header row and alternating gray and white rows below

Tables display styles in the Iowa design system

Printable content

Modern web design practices make it easy to create web pages that look great when printed. Attach the PDF as a secondary content source to the main HTML page. Let your development team know if this is a priority for your content.

When you have to use a PDF

Is there a place for PDFs on your website? Many content strategists would say, "Sure—in the trash." For that rare, required PDF, ensure people have the best possible experience.

  • Create an accessible PDF from the start. Make sure your PDF text is machine-readable. Do not use image-only PDFs. Tag PDFs and add internal metadata.
  • Add alt text for images, charts, graphs, and other visuals to describe the information displayed.
  • Use visual hierarchy and plain language.
  • If your document has fields for users to fill out, make these fields interactive.
  • Don't force downloads. Allow PDFs to open in a user's browser.
  • When linking to a PDF, note the file type and include the file size. You may be able to set up your templates to output this information automatically.
  • Make the file size as small as possible. Mobile users will thank you.
  • Don't link to PDFs in a header text. Headers communicate page structure and hierarchy and shouldn't contain surprise downloads.
  • Consider using HTML gateway pages to introduce and contextualize PDFs. These pages summarize a PDF's key points and offer users the option to download.
  • Hide PDFs from search indexing to keep search results relevant and accessible.
  • If your document doesn't meet accessibility requirements because of specific circumstances, include contact information for users who need accommodations. Include the full email address or URL so it is visible on the page. This should be first in the document's reading order.















Document display with name, summary, file size, and file type

This test document listing shows document size (165.68kb) and file type (.pdf)

Persevere

It's hard to break a PDF habit without resources to support a proper web editorial workflow. Most folks are doing the best they can with the tools they have available.

Many organizations won't have the budget, time, or wherewithal to make the change away from PDFs. If you're at one of these places, don't fret. Audit your PDFs—even just the most popular ones—and start small. Your work can make the case for further investment. 

And your users will thank you.

Other links and sources:

Read the whole story
kvarley
130 days ago
reply
Share this story
Delete

New online class about mind-bending science fiction writer Philip K. Dick taught by the stars of PKD scholarship

1 Share

"Welcome to punk rock literary criticism!" says Philip K. Dick scholar David Gill who is launching a new online course starting January 30 all about the strange, prophetic, and influential author of dozens of essential novels including Do Androids Dream of Electric Sheep, Ubik, and A Scanner Darkly. — Read the rest

The post New online class about mind-bending science fiction writer Philip K. Dick taught by the stars of PKD scholarship appeared first on Boing Boing.

Read the whole story
kvarley
156 days ago
reply
Share this story
Delete

Amazon Q1 2023 Financials

1 Share

In recent years I’ve posted a quick analysis of Amazon’s results each quarter in a Twitter thread. I don’t use Twitter much any more, and Mastodon doesn’t make it easy to post threads, so the blog it is; this is the second outing. Summary: Amazon’s retail business loses money (as usual) but the AWS and Advertising businesses are huge, throw off loads of cash, and continue to grow fast. They subsidize the money-losing retail operation in a way that seems deeply unfair to me.

Source: Q1 2023 Earnings Release.

Looking at Amazon as a whole, quarterly sales are up 9% year-over-year to $127.4B. The company had a GAAP profit of $3.2B in Q1; operating income $4.8B.

“Profit” is an accounting abstraction. Free cash flow remains negative at $-3.3B in Q1. Hmmm.

I noticed that Amazon is now bragging about improvements in their safety numbers, reducing “recordable incidents” 24% since 2019. Now, the definition of such an incident, and whether Amazon is honest in counting them, are very much open to question based on past reporting, but at least they’re trying to look like they’re trying.

Amazon has been talking about using Rivian electric vans for delivery and now claim to have used them to deliver 75 million packages in the US. (They’ve also lost billions on their Rivian investment; half a billion in this quarter).

AWS

Quarterly revenue growth of 16% year-over-year to $21.4B; that YoY growth number continues a downward trend; it was 20% last quarter. I mean, it’s still a great business, with $5.1B in operating income (that’s an operating margin of 24%). Yes, once again, that income is higher than Amazon’s as a whole, we’re used to that now.

AWS is firmly ensconced in the top tier of IT companies. It’s no Microsoft or Google yet, but it’s 1½ IBMs, nearly two Oracles, or 2½ Salesforces.

The second derivative may be negative, but this combination of scale and margin and growth is still a very special business story.

I saw one thing that concerned me: new-customer announcements were kind of lacklustre. Hey, an AWS partnership for “smart living solutions” with Telus, a sprawling Canadian phone-company which conglomerates into agriculture and health and, I dunno, maybe stuffed toys. Not a locus of innovation. Similarly, T-Mobile 5G, uh-huh.

Other stuff

Advertising quarterly revenue is at $9.5B, growth over 23% year-over-year. Note that they don’t report income, but advertising is a high-margin business, my bet is it does better than AWS.

Take-away

(Note: Mostly copy/pasted from last quarter, which is a signal that this story goes on being the same.)

Amazon as a whole isn’t really very profitable. Its retail sector loses money, and that loss is made up by the tens of billions in gravy coming in from AWS and Advertising.

Why is this business structure considered rational? And why is it legal for Amazon to be the prime competitor of the economy’s whole retail sector while not having to make a profit?

Obviously, foregoing profit for the sake of growth is a tried-and-true business strategy, and laudable within limits. But it seems obvious to me that Amazon is way, way past those limits.

As I’ve said since the moment I walked out Amazon’s door in May 2020, AWS should be spun off. The best time to do that was three years ago. The second best time is now.

Read the whole story
kvarley
420 days ago
reply
Share this story
Delete

Drupal 10: Everything You Need to Know

1 Share

Drupal 10 will be released on December 14, 2022, with new features and new possibilities. Here's what you need to know.

Making Drupal beautiful with Claro and OIivero

Drupal 10 will have two new default themes, and we are proud to say that we helped push these initiatives forward so that they would be ready and stable for this release.

Olivero, the new front-end theme, has a modern design that accommodates common features like secondary navigation, media embeds, and layout builder. It is also WCAG AA conformant. Learn more about the design process for Olivero.

Claro, the new administration theme, came out of Drupal's Admin UI & JavaScript Modernisation initiative. Claro refreshes the administration UI with an up-to-date look and feel and brings in well-known UI patterns used on the web. It also has a focus on being accessible to as many users as possible. In the future, you can expect Claro to focus on UX improvements for each persona who has a hand in managing a Drupal website.

Theme starter kit

Currently, if you want to create a custom theme, you could use a core or contrib theme as a base theme and inherit all of its code and functionality. This works great…unless you want to modify or remove parts of the base theme. Drupal 10 will come with a theme generation tool that copies all of a theme's files and performs some string replacement to create the same theme but under a different name.

You can use this tool to copy the new starter_kit theme and have a new theme with basic templates and CSS. This barebones theme provides useful scaffolding, ready to be customized. If you want to streamline theme development further with different templates and defaults, you can create your own "starter" theme and use that as a base from which to copy.

More upcoming features

The plan is to make Automatic Updates and Project Browser a part of Drupal Core during Drupal 10's lifecycle. These features help match user expectations for using a modern content management system. 

Automatic Updates lets you update Drupal Core with the push of a button, but only patch-level changes. You won't be able to use it to upgrade to Drupal 11, for example, but you will be able to use it to update to new minor versions of Drupal 10. Listen to our podcast with three of the people working to make Automatic Updates a reality.

Project Browser lets users search for modules and themes and install them without leaving their Drupal site, even if the site uses Composer to manage packages and dependencies.

Upgrading from Drupal 9

Drupal 9 will reach its end of life on November 2023, which matches the end of life for Symfony 4. This gives you almost a year to plan your upgrade. While upgrading to Drupal 10 shouldn't be a huge endeavor, you'll want to pay attention to the modules you use and your hosting infrastructure. Both can cause unexpected snags. Here is what to look out for:

  • Contributed modules - make sure the contributed modules you have installed are ready for Drupal 10. If they aren't, consider working with the maintainers to help create and test patches. Acquia has a running list of modules and their Drupal 10 readiness status.
  • Custom modules - make sure your custom code is not using any deprecated functionality.
  • Hosting infrastructure - Drupal 10 will require PHP 8.1. Drupal 9 requires PHP 7.3, so you might have some system administration work to do.

Porting your code to Drupal 10

Drupal 9.5 and Drupal 10 will be identical, but Drupal 9.5 will still have all deprecated functionality remaining. This means you can update to Drupal 9.5, update your code to remove any deprecated functionality, and then it will be ready for Drupal 10. Here are the steps you want to take:

After you have worked through all the fixes, your codebase will be ready to upgrade to Drupal 10. You won't have much to do here if you have kept up with Drupal 9 deprecations as they have been updated.

Moving to CKEditor 5

Drupal 9 uses CKEditor 4 as its default rich text editor, but Drupal 10 will use CKEditor 5. This latest version of CKEditor is a complete rewrite with a modern JavaScript architecture and an improved UI. You'll have access to several new features.

But since it is a rewrite, CKEditor 4 plugins are not compatible. If you only used its out-of-the-box Drupal features, then moving to CKEditor 5 is simple. After updating to Drupal 9.5, switch your text formats to use CKEditor 5, which will trigger a semi-automatic upgrade path.

If you want to stay on CKEditor 4 for a while, install the CKEditor 4 module before moving to Drupal 10. This can buy you some time if you have some custom CKEditor 4 plugins you need to migrate because all custom JavaScript code will need to be rewritten. Like Drupal 9, CKEditor 4 becomes end-of-life near the end of 2023, so the sooner you start, the better.

Time to get prepared

A year goes by faster than you think. It's almost the end of 2022 already, and many people will be surprised despite the previous eleven months of hints, clues, and warnings. Time doesn't crawl, it gallops at a thundering pace. Drupal 9's end-of-life will be here before you know it. Start planning for Drupal 10 now.

Already feel behind? Maybe a little overwhelmed? Maybe your development has been focusing on new features and enhancements, and you don't want to grind their progress to a halt so you can do updates. Either way, we can help. Our support and maintenance services prioritize long-term maintenance by creating automated end-to-end testing and automated package updaters that keep your website updated, stable, and secure. When your website stays current with the latest Drupal core and contrib releases, upgrading to Drupal 10 (and beyond) becomes much easier.

Read the whole story
kvarley
555 days ago
reply
Share this story
Delete
Next Page of Stories