DEV Community

Cover image for 14 Things To Check Before Deploying a Website 👨‍💻🔥

14 Things To Check Before Deploying a Website 👨‍💻🔥

Arjun Vijay Prakash on January 16, 2024

Let's get started! 🚀 Dropping a website out into the wild web is a big deal, so making sure every last detail is tightened up first is k...
Collapse
 
htho profile image
Hauke T.

The MOST important Point is missing: GOOD CONTENT

Nothing is as important as good content.

There is so much useless content no the internet:
SEO Text (endless paragraphs of meaningless text in the hopes to please the gods of the search engines). AI generated text which adds no value to the knowledge we have. Outdated or misleading information. Useless or hard-to-find information.

Please, please make content the top priority.
If there is good content, users are willing to accept the most bloated and hard to use website.
If there is no good content, users will not care about the good craftsmanship you showed off on this website.

Collapse
 
ksolomon profile image
Keith Solomon

In our shop, we don’t even spin up a dev instance until we have 100% of the content for the site, and it’s gone through our in-house content manager.

Collapse
 
ahmadswalih profile image
Ahmad Swalih

sure, content is the most important thing

Collapse
 
aloisseckar profile image
Alois Sečkár

A lot of issues, altough it is not allmighty, can be spotted simply by using Lighthouse built-in Chrome devtools (F12). It will auto-check your page load and warn you about common flaws and problems. Just note, that running it towards your local dev server will give you much more optimistic results than the live site will (in terms of page loading speed). There are also services to mimic slow and unreliable networks even during development.

Also, it is always worth to check your HTML syntax towards the official validator, although with frameworks it is now less common to make mistakes.

Collapse
 
the_riz profile image
Rich Winter

I just wanted to say that this is a really great list.

For images, one can use elements as well as SVG files for performance/optimization boosts.

You can use defer to make it feel like the site is faster for JS and images.

Critical CSS is another idea but is kind of hard to figure out.

Another speed warning is about font-loading issues, or @import statements in CsS that can block the page.

Collapse
 
livetvchannels profile image
Trieu.iv

Optimize Images 🌅
No matter how optimized your website is, images will always be one of the slowest-loading elements on the page.
So optimizing images on your website is essential.
It's always better to avoid TIFF or BMP images and stick to JPEGs and PNGs.
Also, you should avoid empty image src code lines. Before deploying your site, optimize your pictures across web pages; otherwise, it will affect your page loading time. 📸

Yes, optimizing images is important for improving website loading speed. While JPEGs and PNGs are popular formats, using an image format like WebP can offer significant benefits in terms of file size and quality with modern browsers today.

WebP is designed to provide good image quality but with smaller file sizes than other formats. This helps to reduce the amount of data that needs to be loaded, reducing page load time and improving the user experience.

To use WebP, you must create copies of your images in this format and then integrate them into your website. If the browser supports WebP, it will load this image, while browsers that do not support it will load the image in a different format if available.

In addition, consider using online or desktop image optimization tools to reduce file size without affecting quality too much. This will help to reduce page load time and optimize the user experience.

Here are some additional tips for optimizing images for your website:

  • Use the right image format for the content. JPEG is a good choice for photographs, while PNG is a good choice for images with text or sharp edges.
  • Resize images to the appropriate size. Large images will take longer to load, so it's important to resize them to the size they will be displayed on your website.
  • Remove unnecessary metadata. Metadata is information about an image that is not visible to the user. It can add unnecessary weight to an image file, so it's important to remove it before uploading your images to your website.

By following these tips, you can help improve your website's performance and provide a better experience for your users.

Collapse
 
aloisseckar profile image
Alois Sečkár

From my experience for smaller images like thubmnails or logos .webp is not such a bit deal. Sometimes it is even bigger than original .jpg.

Or is it because of some compression settings? I am using GIMP.

Collapse
 
ahmadswalih profile image
Ahmad Swalih

yeah, for small images it's not that a big deal. BTW you can adjust the size of the image in gimp by adjusting the quality and alpha quantity that ask just before exporting the webp image

Collapse
 
livetvchannels profile image
Trieu.iv

Optimizing your images can be achieved by using this online tool
shrinkme.app/

Collapse
 
the_riz profile image
Rich Winter

Don't forget about SVG!

Also, elements instead of gives you the flexibility on file sizes.

Collapse
 
sofiacodes profile image
sofia

Great tips! I’m just starting. Any CMS recommendations to use?

Collapse
 
balghisa12 profile image
Balghisa12

Strapi is great tool , used it before

Collapse
 
arpit_gaur profile image
Arpit Gaur

Django CMS or Wordpress

Collapse
 
rcls profile image
OssiDev

Pretty big deal to miss a CMS when deploying. There's something horribly wrong if you miss that.

Collapse
 
brunoblaise profile image
Mudacumura Brunoblaise

Amazing brother keep it up

Collapse
 
liladoc profile image
LilaDoc

Thank you for the tip, will follow 👍🏼

Collapse
 
ricardogesteves profile image
Ricardo Esteves

Cool! Nice post.
I would add testing and improve performance and rendering cycles and finally automate checks for vulnerabilities.

Collapse
 
sehgalspandan profile image
Spandan Sehgal

Thanks for providing tips for websites... I will surely focus on these factors before deploying the site 😀

Collapse
 
boby900 profile image
Boby Tiwari

Good read

Collapse
 
random_ti profile image
Random

Awsome Guide Thanks for sharing 💖

Collapse
 
jenesh profile image
Jenesh Napit

Can I throw in a good domain name? That is like the first touch point for anyone before they even land on any part of your website.

Collapse
 
alexroor4 profile image
Alex Roor

It’s great when you start reading an article and can’t put it down!

Collapse
 
s-m profile image
Santiago

Great Post, and really helpful for almost any type of website. I'm resuming my technical writing and used this as a check list on my blog site.

Collapse
 
lilgionate profile image
Gionathan Vargas

Exciting!

Collapse
 
georgexp97 profile image
Georgexp97

Great post touching on some really important issues.

Collapse
 
reza_rahem profile image
Reza Rahem

In bonus tips you wrote avoid redirect. Why!? what's the problem with redirecting?

Collapse
 
puffnstuffuk profile image
Puff n Stuff

Deploying a website involves more than just uploading files to a server. Test your website on different browsers (Chrome, Firefox, Safari, Edge, etc.) to ensure a consistent experience.
Responsive Design: Verify that your website displays correctly on various devices, including desktops, tablets, and mobile phones.

Collapse
 
Sloan, the sloth mascot
Comment deleted

Some comments have been hidden by the post's author - find out more