Curiosita Labs

Thoughts on programming, web development and design.

Circuit Board

Why you need to use software customizations

Software needs to be adaptable. Not all software has everything that you need to make it work for your business. It should provide you with tools for modifying the software to fit your unique business needs. Business needs change. Your software should be able to change with your needs.

How do you make your software adapt to you needs?

You make your software adapt by customizing it. Software customizations range from simple adjustments to more complex updates and connections. You customize by tweaking settings, adding new or missing features, changing how things work or linking with other tools. The three ways to customize software are configuration, extension and customization.

How do you define configuration, extension and customization?

  • Configuration: A set of finite choices that you make to control the behavior of the software. You may tweak settings, change branding options and add items that are unique to your business.
  • Extension: You decide to add third-party products (plug-ins, apps or extensions) to your software. These products extend the functionality of the software by implementing features that don’t natively exist in the software.
  • Customizing: You may write your own extension to fit your business needs. You choose to do this because you can’t find an app that does what you needs. Or an existing app no longer does what you need it to do. Many software vendors provide you with tools like APIs so you may add what’s missing from their software.

Staying adaptable with software customizations

Too many customizations can affect performance of your software. You need to pick the right type and amount of customizations for your business needs. You stay adaptable by maintaining your software with updates. Review all configurations, extensions and customizations every year. Technology changes quickly. You’ll need to adapt to these changes.

Restart Numbered List with CSS

Normally, you can renumber an HTML ordered list. You use the attribute “start” to set the value you want to restart the numbers at. What happens when you have a special style that overrides how the numbers are generated?

Restart Number Lists with CSS

Image by Alicja from Pixabay

For example, I use the following CSS style to override how a list looks.

ol.simple-list {
	counter-reset: li-counter;
	list-style-type: none;
	list-style-type: decimal !ie;
	margin: 0;
	margin-left: 3em;
	padding: 0;
}


It creates a list with numbers like this.

Green Numbered List

When I tried to use the start attribute to restart numbering a list, it set all of the numbers to 1. I tried to update the style with newer CSS styling. It didn’t fix the problem. Finally, I found the right way to make this work. The attribute “counter-increment” lets you reset the counter. You have to pick a number one less than what you want to start at.

.simple-list-counter-9 {
	counter-increment: li-counter 9;
}

By doing this, you can restart your list at the desired number. With the above style the new list starts at 10 instead of 1. This works if all your lists end at number 9. If you want to restart at a different style, I suggest using an in-line style instead of adding it to your CSS file.

Naming Colors in Your CSS

Naming things in programming in hard. What you name things matters. Naming is communication. You want the names in your CSS to be easy to understand. They need to quickly communicate what you were thinking.

What naming convention do you use to name your colors in CSS? CSS can be difficult to maintain. Save yourself and others time by picking an easy naming convention. Your choice can save you hours of debugging in the future.

Naming Your Colors IN CSS

Image by Myriams-Fotos from Pixabay

Choose a Naming Convention

There are two types of naming or variable categories in CSS. Descriptive or functional. A descriptive name describes the value. A functional name describes a use. If you want a variable to display a blue color, you might name it --color-blue. When you want a variable for a specific purpose like an accent color, you might name it --color-accent. Use both variable categories to make it easier to maintain your custom color palette.

Naming Colors

Colors have tints, shades and tones. How do you know what to call each one? Use The Color API to find out what to call the colors in your color palette. You can put in a hex code or RGB value to identify your color.

Start with your color palette

It’s good practice to limit the number of colors in your design. Use descriptive names to define your color palette. Then, use functional names to further define your styles.

root: {
brand-blue-color: #0000ff;  
brand-green-color: #008000;
}

.article-title {
color: var(--brand-blue-color);
}

.primary-button {
color: var(--brand-color-green);
}

When you need to change your colors, you can easily do it. Simply change the color code. If that won’t work, create a new descriptive name and use that instead. Whatever strategy you choose, make it simple so you or someone else can easily make updates in the future.

6 Migration Tips

How do you migrate your solution? Whether you are moving to the cloud or a new server, migrating is easier said than done. You’ll need to carefully plan it to make sure you do it right. Use these 6 migration tips to plan your strategy.

6 Migration Tips

Choose a migration type

These are the types of common migration strategies to choose from:

  • Rehosting: Also known as "lift and shift". You move your application to the cloud with minimal tweaks and changes.
  • Replaforming: Same as Rehosting. You move your environment to the cloud. Then, make some adjustments to optimize it for the cloud.
  • Repurchasing: Move your customized, legacy application to a brand new, cloud-native product. You’ll need to train your team on the new platform.
  • Refactoring: You’ll need to change your apps. In some cases, you’ll need to rebuild from scratch. Make changes to take advantage of the cloud without compromising the core features.
  • Retiring: Some of your applications may no longer be useful to you. You’ll need to decide which applications you can stop using.
  • Retaining: Are you ready to migrate to the cloud? You may not be ready to migrate. If you aren’t, you should reconsider migrating at a later date.

Assign a Migration Architect

Pick a person who can guide or execute all technical aspects of the migration. They’ll need to define the necessary refactoring, data migration, tools and strategy.

Understand the scope of your migration

Your migration project needs to manageable. You’ll need to know what you want to accomplish and how to get there. Make sure you give yourself plenty of time. By defining your migration project scope, your team can manage their work without delays.

Find the right integration partner

Look for a partner who has moved before. They can help you plan your move and guide your through the process.

Document your processes

Make sure you have documented your processes. If you need to make changes, it is good to know where to start.

Test and test again

No move is perfect. You may miss something in the first round of testing. Make sure you create a checklist of things to test. Test them in many environments.

7 UX Mistakes to Avoid

A bad user interface can lead to a bad user experience. Everyone has used apps and websites that are difficult to use. Or even confusing. Bad design choices can lead to a bad user experience. Choices like inconsistency, bad color decisions, too many fonts and confusing UI.

7 UX Mistakes to Avoid

Photo by Alvaro Reyes on Unsplash

What UX mistakes can you avoid in your next app?

1. Too many fonts

How many fonts are too many? Sticking with a couple of fonts makes it easier to read. Two or three. Use one or two fonts for your headings. One font for the body. Keep it simple.

2. Bad color contrast

Color contrast can mean the difference between easy to read or difficult. A bad color choice can make the text blend in with the background. Color blind and older individuals make have difficulty if you use the wrong colors. Check out the Best Ways to Evaluate Your Designs for Color Contrast.

3. Forgetting to label your icons

Many apps use the same icons. Icons like stars, hearts and check marks. These icons can mean different things in different apps. Use labels to help users know what the icon means.

4. Misleading users with links and buttons

Make sure that buttons and links do what you promised. It should take the user somewhere or do something. A general rule is that a link needs to go somewhere. Buttons allow a user to do something. Don’t use links to add, change or delete any data on the screen.

When do you use a button? First, consider what task you want the user to do. If they need to Buy, Sign Up or Add something, use a button. You may use secondary buttons for different tasks. Your primary action should stand out. For other actions like going to a new page, you can use a link.

5. Slow load times

Slow loading pages can annoy your users. Use tools like PageSpeed Insights to tell you what is slowing your site down. Images, fonts and videos can slow your site down.

6. No way to distinguish a primary and secondary button

Sometimes you’ll have more than one action that you want the user to do. It’s important to make it easy for them to identify the primary action. Your primary button should be bolder and more prominent. Choose a strong color with bold text to help it stand out.

7. No text hierarchy

People scan your UI to figure out what to do. Text hierarchy helps them to know what to pay attention to. Use size, color and weight to show importance of text. Include spacing to separate different pieces of information.

Design mistakes can happen. You can create a better user experience by avoiding these common UX mistakes.

Page 1 of 51

Powered by WordPress & Theme by Anders Norén