147 lines
8.1 KiB
HTML
147 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Blog in Progress #1</title>
|
|
<link rel="stylesheet" href="https://murtezayesil.me/theme/css/main.css" />
|
|
<link rel="stylesheet" href="https://murtezayesil.me/theme/css/tooltip.css" />
|
|
<link href="https://murtezayesil.me/feeds/atom.xml" type="application/atom+xml" rel="alternate" title="Ali Murteza Yesil Atom Feed" />
|
|
<link href="https://murtezayesil.me/feeds/rss.xml" type="application/rss+xml" rel="alternate" title="Ali Murteza Yesil RSS Feed" />
|
|
|
|
<!-- This border added via BLACK_LIVES_MATTER toggle in site settings -->
|
|
<style>
|
|
body {
|
|
border-width: 5em ;
|
|
border-color: #000000 ;
|
|
border-style: none solid solid solid ; /* top border : none, right bottom left : solid */
|
|
}
|
|
</style>
|
|
|
|
<!--[if IE]>
|
|
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
|
|
<body id="index" class="home">
|
|
|
|
<!-- This banner added via BLACK_LIVES_MATTER toggle in site settings -->
|
|
<div style="background-color: black; padding: 1em; margin-bottom: .8em">
|
|
<h1 style="text-align: center; margin-bottom: 0em"><a href="https://blacklivesmatter.com/" style="color: #fce21b; font-size: 2em">Black Lives Matter</a></h1>
|
|
</div>
|
|
<header id="banner" class="body">
|
|
<h1><a href="https://murtezayesil.me/">Ali Murteza Yesil <strong>Blog</strong></a></h1>
|
|
<nav><ul>
|
|
|
|
<li><a href="https://murtezayesil.me/pages/about.html">About</a></li>
|
|
|
|
<li><a href="https://murtezayesil.me/pages/contact.html">Contact</a></li>
|
|
</ul>
|
|
<form id="search" action"#" onsubmit="javascript:window.open('https://duckduckgo.com/?q='+document.getElementById('keywords').value+'+site:https://murtezayesil.me');">
|
|
<input id="keywords" type="text" />
|
|
</form>
|
|
</nav>
|
|
<div id="submenu">
|
|
<ul>
|
|
<li><a href="https://murtezayesil.me/category/draft.html">draft</a></li>
|
|
<li class="active"><a href="https://murtezayesil.me/category/notes.html">Notes</a></li>
|
|
<li><a href="https://murtezayesil.me/category/personal.html">Personal</a></li>
|
|
<li><a href="https://murtezayesil.me/category/tech.html">Tech</a></li>
|
|
</ul>
|
|
<div>
|
|
</header><!-- /#banner -->
|
|
<section id="content" class="body">
|
|
<article>
|
|
<header>
|
|
<h1 class="entry-title">
|
|
<a href="https://murtezayesil.me/blog-in-progress-1.html" rel="bookmark"
|
|
title="Permalink to Blog in Progress #1">Blog in Progress #1</a></h1>
|
|
</header>
|
|
|
|
<div class="entry-content">
|
|
<footer class="post-info">
|
|
<span>Sat 15 August 2020</span>
|
|
<span>| in <a href="https://murtezayesil.me/category/notes.html">Notes</a></span>
|
|
<span>| tags: <a href="https://murtezayesil.me/tag/100daystooffload.html">100DaysToOffload</a></span> <span>| Day <strong>19</strong> of #100DaysToOffload</span>
|
|
|
|
|
|
</footer><!-- /.post-info --> <div style="text-align: center;">
|
|
<img src="images/gifs/construction_progress_bar.gif" alt="Under Construction GIF">
|
|
</div>
|
|
|
|
<p>I am redesigning this blog's theme piece by piece. But there is a possibility that you will be reading this article after the new theme is applied. So <a href="images/screenshots/index_full_page_screenshot_w760.webp" title="Old index page">here is a reference screenshot</a> before new theme is applied. Theme isn't the only change. I have few more changes in mind to extend blog's features and optimize it even further.</p>
|
|
<p>If you want to know how well does this page performed in GTmetrix with old theme, <a href="extra/gtmetrix_murtezayesil.me_2020_08_16.pdf">here is the report</a> in PDF.</p>
|
|
<h1>Removing Google Font dependency</h1>
|
|
<p><a href="https://www.yanone.de/fonts/kaffeesatz/">Yanone's Kaffeesatz font</a> is beautiful, but it takes almost 300ms to load. Even though it is as small as 20KB, it is something that is not needed.</p>
|
|
<p>Another reason I want to remove it is that, it is embedded through Google Fonts which also loads some Google API code. It would be ironic to not respect my readers while I am going through digital cleansing and de-Googling myself.</p>
|
|
<h1>MP4 videos may fail to load</h1>
|
|
<p>Honestly, I don't know how to fix that "No video with supported format and MIME type found." error. Only future proofed solution I can think is hosting videos on PeerTube and embedding them to posts. You can download video by using "save as ..." option in context (right click) menu 😐️</p>
|
|
<p>Fun Fact: My IndieWeb profile image is 1024 by 1024 PNG and is 174 KB, around 9 times the Yanone's Kaffesatz font from Google Fonts, but still takes a third less time to download. That being said, it isn't displayed anywhere and shouldn't be loaded unless explicitly wanted. 128x128 would be fine too. 1024x1024 is an overkill for an image that isn't displayed 😬️</p>
|
|
</div><!-- /.entry-content -->
|
|
|
|
<!-- #100DaysToOffload message -->
|
|
<p>Day <strong>19</strong> of <a href="https://100daystooffload.com/" title="click to read about the challenge">#100DaysToOffload</a></p>
|
|
|
|
<!-- Comments -->
|
|
<hr>
|
|
<h2>Comments</h2>
|
|
<p>Toot on <a href="https://fosstodon.org/@murtezayesil/104695315322991971">this thread</a> to comment. This blog is a static site. Comments won't appear here.</p>
|
|
|
|
|
|
</article>
|
|
</section>
|
|
<section id="extras" class="body">
|
|
<div class="blogroll">
|
|
<h2>blogroll</h2>
|
|
<ul>
|
|
<li><a href="https://kevq.uk">Kev Quirk</a></li>
|
|
<li><a href="https://mikestone.me">Mike Stone</a></li>
|
|
<li><a href="https://yarmo.eu/">Yarmo Mackenbach</a></li>
|
|
</ul>
|
|
</div><!-- /.blogroll -->
|
|
<div class="social">
|
|
<h2>social</h2>
|
|
<ul>
|
|
<li><a href="https://murtezayesil.me/feeds/atom.xml" type="application/atom+xml" rel="alternate">atom feed</a></li>
|
|
<li><a href="https://murtezayesil.me/feeds/rss.xml" type="application/rss+xml" rel="alternate">rss feed</a></li>
|
|
|
|
<li><a href="https://fosstodon.org/@murtezayesil" rel="me">Fostodon</a></li>
|
|
</ul>
|
|
</div><!-- /.social -->
|
|
</section><!-- /#extras -->
|
|
|
|
<footer id="contentinfo" class="body">
|
|
<p>Powered by <a href="http://getpelican.com/">Pelican</a>. Theme <a href="https://github.com/blueicefield/pelican-blueidea/">blueidea</a>, inspired by the default theme.</p>
|
|
</footer><!-- /#contentinfo -->
|
|
|
|
|
|
<!-- IndieWeb Profile -->
|
|
<!-- ToDo : Make IndieWeb Profile auto generating according to site preferences -->
|
|
<!-- This profile is created by following https://kevq.uk/how-to-create-an-indieweb-profile/ blog post. Thanks to Kev Quirk -->
|
|
<section style="display: none;" class="h-card">
|
|
|
|
<!-- About me -->
|
|
<span class="p-name">Ali Murteza Yesil</span>
|
|
<span class="p-note">I'm a student, privacy advocate and SysAdmin wannabe. I was born in Turkey but I live abroad.</span>
|
|
|
|
<!-- Profile picture -->
|
|
<img class="u-photo" src="https://murtezayesil.me/images/avatar_polygon_128x128.png"/>
|
|
|
|
<!-- My location -->
|
|
<!-- <span class="p-locality">City, Country or Country</span> -->
|
|
|
|
<!-- Links -->
|
|
<a class="u-url u-uid" href="https://murtezayesil.me"></a>
|
|
<!-- Mail Template <a class="u-email" rel="me" href="mailto:USERNAME@SERVICEPROVIDER"></a> -->
|
|
<a class="u-url" rel="me" href="https://fosstodon.org/@murtezayesil"></a>
|
|
<!-- Twitter Example <a class="u-url" rel="me" href="https://twitter.com/USERNAME"></a> -->
|
|
<!-- Template <a class="u-url" rel="me" href="https://URL"></a> -->
|
|
|
|
<!-- Categories -->
|
|
<span class="p-category">Blogging</span>
|
|
<span class="p-category">Open Source Software</span>
|
|
<span class="p-category">Privacy</span>
|
|
|
|
</section>
|
|
|
|
</body>
|
|
</html> |