-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathfix.html
More file actions
408 lines (299 loc) · 21.4 KB
/
Copy pathfix.html
File metadata and controls
408 lines (299 loc) · 21.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>NewsFlash | Post</title>
<!-- Favicon -->
<link rel="icon" type="image/png" sizes="32x32" href="./assets/images/favicon.png">
<!-- Remix icons -->
<link href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" rel="stylesheet">
<!-- Swiper.js styles -->
<link rel="stylesheet" href="./assets/css/swiper-bundle.min.css"/>
<!-- Custom styles -->
<link rel="stylesheet" href="./assets/css/main.css">
</head>
<body>
<!-- Header -->
<header class="header" id="header">
<nav class="navbar container">
<a href="./index.html">
<h2 class="logo">TechFlash</h2>
</a>
<div class="menu" id="menu">
<ul class="list">
<li class="list-item">
<a href="#" class="list-link current">Home</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Categories</a>
<ul class="Categories">
<li class="list-item">
<a href="#" class="list-link">AI</a>
</li>
<li class="list-item">
<a href="#" class="list-link">IOT</a>
</li>
<li class="list-item">
<a href="#" class="list-link">E-sports</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Software</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Blockchain</a>
</li>
<li class="list-item">
<a href="#" class="list-link">How-to-do</a>
</li>
</ul>
</li>
<li class="list-item">
<a href="#" class="list-link">Reviews</a>
</li>
<li class="list-item">
<a href="#" class="list-link">News</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Contact</a>
</li>
<li class="list-item screen-lg-hidden">
<a href="./sign-in.html" class="list-link">Sign in</a>
</li>
<li class="list-item screen-lg-hidden">
<a href="./sign-up.html" class="list-link">Sign up</a>
</li>
</ul>
</div>
<div class="list list-right">
<button class="btn place-items-center" id="theme-toggle-btn">
<i class="ri-sun-line sun-icon"></i>
<i class="ri-moon-line moon-icon"></i>
</button>
<button class="btn place-items-center" id="search-icon">
<i class="ri-search-line"></i>
</button>
<button class="btn place-items-center screen-lg-hidden menu-toggle-icon" id="menu-toggle-icon">
<i class="ri-menu-3-line open-menu-icon"></i>
<i class="ri-close-line close-menu-icon"></i>
</button>
<a href="sign-in.html" class="list-link screen-sm-hidden">Sign in</a>
<a href="sign-in.html" class="btn sign-up-btn fancy-border screen-sm-hidden">
<span>Sign up</span>
</a>
</div>
</nav>
</header>
<!-- Search -->
<div class="search-form-container container" id="search-form-container">
<div class="form-container-inner">
<form action="" class="form">
<input class="form-input" type="text" placeholder="What are you looking for?">
<button class="btn form-btn" type="submit">
<i class="ri-search-line"></i>
</button>
</form>
<span class="form-note">Or press ESC to close.</span>
</div>
<button class="btn form-close-btn place-items-center" id="form-close-btn">
<i class="ri-close-line"></i>
</button>
</div>
<!-- blog post -->
<section class="blog-post section-header-offset">
<div class="blog-post-container container">
<div class="blog-post-data">
<h3 class="title blog-post-title">How to Fix Blurry Apps in Windows 11</h3>
<div class="article-data">
<span>May 19th 2023</span>
<span class="article-data-spacer"></span>
<span>9 Min read</span>
</div>
</div>
<div class="container">
<img src="./assets/images/fix/1.webp" alt="">
<h4>High-resolution monitors are affordable and commonplace these days, but many applications weren't created with these displays in mind. Using them on such monitors or moving the app's window from a second, low-resolution screen to one that's much higher can lead to a fuzzy appearance and blurry-looking text.</h4>
<p>While there is no instant fix for every app that isn't very clear, there are various solutions that you can try to cure those blurry blues for good. Here's our handy guide.</p>
<h3>Scaling and DPI</h3>
<p>Monitor screens are comprised of millions of tiny dots (a.k.a. pixels) and one measure for how many there are present is known as DPI – dot per inch. Originally, this referred to how many ink dots a printing press would lay down on paper, in one inch of printing.</p>
<p>With computers, it now means how many pixels are used to draw a 1 inch diagonal line on the screen. For many years, Windows has used a standard value of 96 DPI and this was perfectly fine, because the majority of monitors weren't very big or had a high resolution.</p>
<p>For example, a 15-inch screen with a resolution of 1024 x 768 has a DPI of 85, and because this is lower than the value Windows uses, apps will look just fine.</p>
<img src="./assets/images/fix/2.webp" alt="">
<p>However, you can now get a 27-inch 2560 x 1440 monitor for less than $200. Such a screen has a DPI of around 109 and since that's more dots than what Windows uses by default, every app will be slightly blurry. This is because internally Windows will be trying to draw the shape with a fixed number of dots, but then display it spread out over more dots.</p>
<p>Well, it would be the case if it wasn't for DPI scaling.</p>
<p>For quite a few years, Microsoft has updated Windows to use a variety of tricks to ensure that programs are correctly displayed on monitors with higher DPIs. However, most of these changes are for developers or hidden away from the end user.</p>
<p>Fortunately, there is an option to force Windows to alter the DPI it uses, displaying this as a percentage. At 100%, Windows will use the normal value of 96, but increasing this will everything to use a higher number of dots per inch (e.g. 150% is equal to a DPI of 144).</p>
<h3>How to adjust the DPI scaling</h3>
<p>Step 1: Press the Windows key + I and then click on the Display section, or click on Start > Settings > System > Display.</p>
<p>Step 2: Scroll down until you see the Scaling option and click on the Menu.You should see a list of values as shown below:</p>
<img src="./assets/images/fix/3.webp" alt="">
<p>Step 3: If applications look too small or too blurry, increase this value – it's recommended that you don't exceed 150%, unless you have a very high resolution monitor.</p>
<p>Notice how it says 'Recommended' next to 150%? That's because this image was taken using a 27" 4K monitor. If the screen was larger (e.g. 32") then 125% might be a better fit, but it's really down to personal preference.</p>
<p>Using different scaling values will force everything to change in size, though, and not just applications. The taskbar, notification area, and desktop icons will all shrink or grow, too.</p>
<img src="./assets/images/fix/4.webp" alt="">
<p>The image above shows how the Recycle Bin compares at 100%, 125%, 150%, 175%, and 200% scaling on a 4K monitor. If you look closely, you'll see that the first two options leave the text underneath the icon looking a little blurry (the image has been zoomed in, though).</p>
<p>But remember, if you go too large with the scaling, then you'll lose a lot of room on your taskbar and desktop in general.</p>
<h3>How to change the DPI scaling for a single app</h3>
<p>If you've set Windows scaling to how you like it, but are still experiencing problems with a specific application (especially an old one), then you'll need to dig deeper to try and fix the issue.</p>
<p>Start by right-clicking on the icon for the app and click on the Properties option...</p>
<img src="./assets/images/fix/5.webp" alt="">
<p>This will open up a new window, with a variety of tabs along the top – select the one that says Compatibility.</p>
<img src="./assets/images/fix/6.webp" alt="">
<p>Towards the bottom of the window, you should see a large button that says Change high DPI settings – click this and another window will open up.</p>
<p>This is where you can override the app's behavior when it comes to DPI scaling.</p>
<p>The first option to try is Program DPI and checking this will force Windows to optimize the app's scaling, either when you first log into the operating system or when you launch the program. It's not overly clear exactly what happens with this option, as Microsoft doesn't provide any helpful tips for it.</p>
<img src="./assets/images/fix/7.webp" alt="">
<p>It's probably best that you select the "When I open this program" option, simply because you might not use the app very often. If you do, though, then by all means select the first choice.</p>
<p>The second option you can try is the bottom one, labeled High DPI scaling override. This gives you three choices: Application, System, and System (Enhanced). If it's a particularly old program, it may well have problems scaling properly, so select the third choice in the list.</p>
<img src="./assets/images/fix/8.webp" alt="">
<p>You can check both Program DPI and High DPI scaling override to really force Windows to take control over the program's scaling, but more often than not, the first one is enough to get the job done.</p>
<p>As with all things Windows-related, once you've changed the settings, click on the OK button in the two windows still open, and then restart your computer. Hopefully, the recalcitrant app will behave itself now.</p>
<p>Note that this works on "Win32" programs as UWP apps (Universal Windows Platform) scale 100% properly, all of the time, according to Microsoft.</p>
<h3>Other settings for making things clearer</h3>
<p>DPI scaling is a thorny problem and there's no magic wand that can be waved to fix every problem that might be encountered. So here are some further things you can try, to improve the clarity of everything on your monitor.</p>
<h4>Use the highest refresh rate that you can</h4>
<p>Older monitors are often limited to a maximum of 60 Hz, but if yours supports higher values, make sure that Windows is set to using the correct value. If the same section of Settings that you adjust the DPI scaling, scroll down to Advanced display.</p>
<img src="./assets/images/fix/9.webp" alt="">
<p>Here you'll see the option to adjust the monitor refresh rate. Monitors are designed to run perfectly well at their highest rate, so unless you have very good reasons for not doing so, make sure it's set at the maximum value.</p>
<p>Also, ensure you're using the monitor's native resolution – if the screen has 3840 x 2160 pixels, having it set to something else like 2560 x 1600 will definitely make things look blurry.</p>
<h4>Make sure graphics drivers are up-to-date</h4>
<p>This might seem like an obvious thing, but when AMD, Intel, and Nvidia update their drivers, they often fix a number of small bugs that can affect specific applications – sometimes it's about stability or performance, but occasionally it can be about images or text not displaying properly.</p>
<h4>Disable window transparency and animation effects</h4>
<p>While these give Windows a nice visual touch, for some users, having a partially transparent background or a fancy animation running when you open or close them, can make things harder to read.</p>
<p>Open up Settings (Win key + I or Start Menu > Settings) and select Accessibility in the left-hand menu. Now choose Visual Effects in the list on the right-hand side of your screen.</p>
<img src="./assets/images/fix/10.webp" alt="">
<p>You'll see the option to disable transparency and animation effects here, so click them to deactivate the features. You may even notice that Windows feels a little bit snappier with them off if you're using a budget computer.</p>
<h4>Adjust ClearType text to suit your monitor</h4>
<p>A Windows default feature, ClearType enhances how text appears on LCD monitors by drawing them at the sub-pixel level rather than working with entire dots. How it all works isn't important but as every monitor is different, the standard settings might not be perfect for you.</p>
<p>Click on the Start Menu and type in "ClearType Tuner," and then click on the app shown (it will have a little colored icon next to it). The tuning program first gives you the option to enable ClearType, if it isn't already, followed by which monitors you want to tune it for if you have multiple screens.</p>
<img src="./assets/images/fix/11.webp" alt="">
<p>Then, you'll go through 5 tests – just like when you're getting your eyes tested by an optician, select the panel that looks the clearest for you, clicking next each time until you've gone through all of the tests. If you're not happy with the results, then go back and try it again a few times until you have everything matched to your monitor.</p>
<p>Hopefully, with this guide, you'll have fixed any pesky apps that have been giving you visual problems. Very old apps may be beyond saving but with luck, they should be few in number.</p>
<div class="author d-grid">
<div class="author-image-box">
<img src="./assets/images/dummy-user.png" alt="" class="article-image">
</div>
<div class="author-about">
<h3 class="author-name">Ramanan</h3>
<p>Tech Enthusiast , student at KCE</p>
<ul class="list social-media">
<li class="list-item">
<a href="#" class="list-link"><i class="ri-instagram-line"></i></a>
</li>
<li class="list-item">
<a href="#" class="list-link"><i class="ri-facebook-circle-line"></i></a>
</li>
<li class="list-item">
<a href="#" class="list-link"><i class="ri-twitter-line"></i></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- Newsletter -->
<section class="newsletter section">
<div class="container">
<h2 class="title section-title" data-name="Newsletter">Newsletter</h2>
<div class="form-container-inner">
<h6 class="title newsletter-title">Subscribe to TechFlash</h6>
<p class="newsletter-description">stay connected</p>
<form action="" class="form">
<input class="form-input" type="text" placeholder="Enter your email address">
<button class="btn form-btn" type="submit">
<i class="ri-mail-send-line"></i>
</button>
</form>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer section">
<div class="footer-container container d-grid">
<div class="company-data">
<a href="./index.html">
<h2 class="logo">TechFlash</h2>
</a>
<p class="company-description">Stay ahead of the curve with our tech flash – the latest news and reviews on all the latest devices and software!</p>
<ul class="list social-media">
<li class="list-item">
<a href="https://www.instagram.com" class="list-link"><i class="ri-instagram-line"></i></a>
</li>
<li class="list-item">
<a href="https://www.facebook.com" class="list-link"><i class="ri-facebook-circle-line"></i></a>
</li>
<li class="list-item">
<a href="https://twitter.com" class="list-link"><i class="ri-twitter-line"></i></a>
</li>
<li class="list-item">
<a href="https://in.pinterest.com" class="list-link"><i class="ri-pinterest-line"></i></a>
</li>
</ul>
<span class="copyright-notice">©2023 TechFlash. All rights reserved.</span>
</div>
<div>
<h6 class="title footer-title">Categories</h6>
<ul class="footer-list list">
<li class="list-item">
<a href="#" class="list-link">AI</a>
</li>
<li class="list-item">
<a href="#" class="list-link">IOT</a>
</li>
<li class="list-item">
<a href="#" class="list-link">E-sports</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Software</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Blockchain</a>
</li>
<li class="list-item">
<a href="#" class="list-link">How-to-do</a>
</li>
</ul>
</div>
<div>
<h6 class="title footer-title">Useful links</h6>
<ul class="footer-list list">
<li class="list-item">
<a href="#" class="list-link">Home</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Elements</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Tags</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Authors</a>
</li>
</ul>
</div>
<div>
<h6 class="title footer-title">Company</h6>
<ul class="footer-list list">
<li class="list-item">
<a href="#" class="list-link">Contact us</a>
</li>
<li class="list-item">
<a href="#" class="list-link">F.A.Q</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Careers</a>
</li>
<li class="list-item">
<a href="#" class="list-link">Authors</a>
</li>
</ul>
</div>
</div>
</footer>
<!-- Swiper.js -->
<script src="./assets/js/swiper-bundle.min.js"></script>
<!-- Custom script -->
<script src="./assets/js/main.js"></script>
</body>
</html>