<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Kod | Altuğ Gürkaynak</title>
	<atom:link href="https://altug.design/Kategori/kod/feed/" rel="self" type="application/rss+xml" />
	<link>https://altug.design</link>
	<description>Altug.Design</description>
	<lastBuildDate>Wed, 12 Jun 2024 21:04:30 +0000</lastBuildDate>
	<language>tr</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>

<image>
	<url>https://altug.design/wp-content/uploads/2026/06/cropped-altug2026-2b-32x32.png</url>
	<title>Kod | Altuğ Gürkaynak</title>
	<link>https://altug.design</link>
	<width>32</width>
	<height>32</height>
</image> 
<site xmlns="com-wordpress:feed-additions:1">210762941</site>	<item>
		<title>Örneklerle CSS Seçicileri (Selectors) ve :nth-child Kullanımı</title>
		<link>https://altug.design/css-seciciler-selectors-ve-nth-child-kullanimi-ornekleriyle/</link>
					<comments>https://altug.design/css-seciciler-selectors-ve-nth-child-kullanimi-ornekleriyle/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Fri, 14 Apr 2023 08:07:33 +0000</pubDate>
				<category><![CDATA[İpucu]]></category>
		<category><![CDATA[Kod]]></category>
		<category><![CDATA[Tasarım]]></category>
		<category><![CDATA[CSS]]></category>
		<guid isPermaLink="false">https://altug.design/?p=1284</guid>

					<description><![CDATA[CSS seçiciler ön-yüz (frontend) tasarımcılar için hayat kurtarıcı, kolay yordamlardır. Her ne kadar UI ve UX tasarımcılar ve hatta yazılımcılar bu konuya eğilmeyi ihmal veya reddetseler de, öğrenildiğinde ne kadar kolay ve keyifli çözümler ürettiğini göreceksiniz. Öncelikle herkese karmaşık gelen :nth-child seçicisinin kullanımına bir bakalım. Bunu da bir şema ile gösterelim: first-child 1 2 3 [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/css-seciciler-selectors-ve-nth-child-kullanimi-ornekleriyle/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">1284</post-id>	</item>
		<item>
		<title>HTML Listeleri 2.0</title>
		<link>https://altug.design/html-listeleri-2-0/</link>
					<comments>https://altug.design/html-listeleri-2-0/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Wed, 16 Nov 2022 07:30:03 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<category><![CDATA[İpucu]]></category>
		<category><![CDATA[HTML]]></category>
		<guid isPermaLink="false">https://altug.design/?p=1212</guid>

					<description><![CDATA[Bu yazıda, daha önce de değindiğim HTML Listelemelerine biraz daha yakından bakacağız. Çoğunlukla kod örneklerini paylaşarak kod &#8211; sonuç odaklı ilerleyeceğiz. Hazırsanız başlayalım 👇 Öncelikle Temelleri Bir Hatırlayalım Eğer &#60;ol&#62; / &#60;ul&#62; / &#60;li&#62; yapılarını hatırlıyorsanız eğlenceli kısıma atlayabilirsiniz. Sıralı listelemeler, yani Ordered List için, İngilizce tabirin ilk iki harfini kullanıyoruz. Yani O &#8211; L [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/html-listeleri-2-0/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">1212</post-id>	</item>
		<item>
		<title>2022 Yılı Favori Google El Yazısı Fontlarım</title>
		<link>https://altug.design/2022-yili-favori-google-el-yazisi-fontlarim/</link>
					<comments>https://altug.design/2022-yili-favori-google-el-yazisi-fontlarim/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Wed, 27 Apr 2022 07:35:13 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<category><![CDATA[Tavsiye]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[UX]]></category>
		<guid isPermaLink="false">https://altug.in/?p=975</guid>

					<description><![CDATA[Kullanıcı deneyimi, biraz da içerikleri kullanıcıya daha doğal hislerle sunabilmektir. Projenin türü veya kullanıldığı yere göre &#8220;el yazısı&#8221; yazı tiplerini kullanmak daha güzel olabilir. Ne yazık ki Türkçe karakterleri de destekleyen el yazısı yazı tipleri halen istediğimiz sayıda değil. Bu yazıda 2022&#8217;de en çok gözüme çarpa ve projelerde kullandığım Google Fontları paylaşmak istedim. Umarım işinize [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/2022-yili-favori-google-el-yazisi-fontlarim/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">975</post-id>	</item>
		<item>
		<title>Bir Öğeyi Gizlemenin 3 Yolu (HTML / CSS)</title>
		<link>https://altug.design/bir-ogeyi-gizlemenin-3-yolu-html-css/</link>
					<comments>https://altug.design/bir-ogeyi-gizlemenin-3-yolu-html-css/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Sun, 24 Apr 2022 18:41:30 +0000</pubDate>
				<category><![CDATA[İpucu]]></category>
		<category><![CDATA[Kod]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<guid isPermaLink="false">https://altug.in/?p=970</guid>

					<description><![CDATA[Web sayfalarında bir öğeyi gizlemek bazen gerekli olabilir. Bazen de gizlemeyi anlık (veya geçici) bir düzeltme için kullanırız. Web sayfalarında en yaygın öğe gizleme usullerini inceleyelim. İnceleyeceklerimizden ilk ikisi CSS özellikleri olacak: display: none ve visibility: hidden Çoğumuz bunları zaten kullanıyor olsak da, açıklığa kavuşturmak için özetleyelim. .gizle {display: none} .gosterme {visibility: hidden} .gizle sınıfına [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/bir-ogeyi-gizlemenin-3-yolu-html-css/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">970</post-id>	</item>
		<item>
		<title>Sayfa Açılış Hızınızı Artırın: Görselleri Asenkron Yükleme (img decoding async) ve Lazy Loading</title>
		<link>https://altug.design/sayfa-acilis-hizinizi-artirin-gorselleri-asenkron-yukleme-img-decoding-async-ve-lazy-loading/</link>
					<comments>https://altug.design/sayfa-acilis-hizinizi-artirin-gorselleri-asenkron-yukleme-img-decoding-async-ve-lazy-loading/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Sun, 10 Apr 2022 13:46:50 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<category><![CDATA[Tavsiye]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[Kullanıcı Deneyimi]]></category>
		<category><![CDATA[Tasarım]]></category>
		<category><![CDATA[UX]]></category>
		<guid isPermaLink="false">https://altug.in/?p=918</guid>

					<description><![CDATA[Karşıt görüşler olsa da, çoğunluk kabul edecektir ki; &#8216;iyi kullanıcı deneyimi hızlı servisle başlar&#8217;.  Internet tarayıcıları (Chrome, Firefox, Opera&#8230;) görsel ve metin içerikleri senkron olarak aynı anda yüklerler. Bu da sayfa açılırken güzel bir görüntü sunar. Şöyle ki: &#60;h2&#62;Güzel Bir Başlık&#60;/h2&#62; &#60;img src="büyük-bir-gorsel" alt="Görsel Hakkında Bilgi" /&#62; &#60;p&#62;Kullanıcının almak istediği bilgiyi sunan metinler.&#60;/p&#62; Maalesef her [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/sayfa-acilis-hizinizi-artirin-gorselleri-asenkron-yukleme-img-decoding-async-ve-lazy-loading/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">918</post-id>	</item>
		<item>
		<title>WordPress İpucu: Tek Arama Sonucunu Otomatik Olarak Aç</title>
		<link>https://altug.design/wordpress-ipucu-tek-arama-sonucunu-otomatik-olarak-ac/</link>
					<comments>https://altug.design/wordpress-ipucu-tek-arama-sonucunu-otomatik-olarak-ac/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Fri, 08 Apr 2022 13:32:11 +0000</pubDate>
				<category><![CDATA[İpucu]]></category>
		<category><![CDATA[Kod]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[WoordPress]]></category>
		<guid isPermaLink="false">https://altug.in/?p=916</guid>

					<description><![CDATA[Tasarımcılar olarak, kullanıcı deneyimi tasarımı (veya kısaca UXD) açısından, kendimizi kullanıcının yerine koymalıyız. Şahsen bunu yaparken, kendimi, tasarımcısı olduğum ürünü ilk elden kullanıcıların zihnine oturtmak için ürünü yaratırken edindiğim deneyim ve düşüncelerden arındırıyorum. Bunu yaptığımda, arama sonuç sayfasında şunu fark ettim ki; bazen sorgumuz tek bir sonuç getirebiliyor ve bu -güzel olsa da- gayet saçma! [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/wordpress-ipucu-tek-arama-sonucunu-otomatik-olarak-ac/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">916</post-id>	</item>
		<item>
		<title>Tarayıcınızı Not Defterine Çevirin</title>
		<link>https://altug.design/tarayicinizi-not-defterine-cevirin/</link>
					<comments>https://altug.design/tarayicinizi-not-defterine-cevirin/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Thu, 07 Apr 2022 12:26:53 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<category><![CDATA[İpucu]]></category>
		<category><![CDATA[Erişilebilirlik]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[UI]]></category>
		<guid isPermaLink="false">https://altug.design/?p=348</guid>

					<description><![CDATA[Acil durumlarda kağıt aramakla veya bilgisayarınızdan program – uygulama açmakla uğraşma derdine son! Bu tek satırlık kodu tarayıcınızın adres satırına yapıştırıp, ENTER’a basın. Ardından kısa yol çubuğunuza – sürükle bırak yoluyla çekin ve gerektiğinde bu kısa yola tıklayın. Yeni açılacak sekmeyi, artık, geçici bir not defteri olarak kullanabilirsiniz.]]></description>
		
					<wfw:commentRss>https://altug.design/tarayicinizi-not-defterine-cevirin/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		<enclosure url="https://altug.design/wp-content/uploads/2022/04/tarayici-not-defteri.mp4" length="400778" type="video/mp4" />

		<post-id xmlns="com-wordpress:feed-additions:1">1018</post-id>	</item>
		<item>
		<title>CSS Truncate &#8211; Single Line / Multiple Lines</title>
		<link>https://altug.design/css-truncate-single-line-multiple-lines/</link>
					<comments>https://altug.design/css-truncate-single-line-multiple-lines/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Wed, 30 Mar 2022 12:09:16 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<guid isPermaLink="false">https://altug.in/?p=860</guid>

					<description><![CDATA[While there are ways to truncate a long text with coding, we can also use CSS to Truncate texts. For cutting the text, which is longer than the width of the area we want it to use, I suggest you to apply the CSS Truncate methods. For your needs, you may choose from a one [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/css-truncate-single-line-multiple-lines/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">860</post-id>	</item>
		<item>
		<title>CSS ile Metin Kırpma (Truncate) &#8211; Tek Satır / Çoklu Satır</title>
		<link>https://altug.design/css-ile-metin-kirpma-truncate-tek-satir-coklu-satir/</link>
					<comments>https://altug.design/css-ile-metin-kirpma-truncate-tek-satir-coklu-satir/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Wed, 30 Mar 2022 12:09:16 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[CSS]]></category>
		<guid isPermaLink="false">https://altug.in/?p=875</guid>

					<description><![CDATA[Kodlama ile uzun bir metni kısaltmanın farklı yolları olsa da, metinleri kısaltmak için CSS&#8217;i de rahatça kullanabiliriz. Kullanmak istediğimiz alanın genişliğinden daha uzun bir metni kesmek için CSS Metin Kırpma veya kesme yöntemlerini kullanabiliriz. İhtiyacımıza uygun olan tek satır veya çoklu satır için kırpma (truncate) metodlarından bize uygun olanı seçelim. Tek Satır için CSS Kırpma [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/css-ile-metin-kirpma-truncate-tek-satir-coklu-satir/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">875</post-id>	</item>
		<item>
		<title>WordPress İpucu: Aramayı Tek Kategori İle Sınırlama</title>
		<link>https://altug.design/wordpress-ipucu-aramayi-tek-kategori-ile-sinirlama/</link>
					<comments>https://altug.design/wordpress-ipucu-aramayi-tek-kategori-ile-sinirlama/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Fri, 25 Mar 2022 07:10:43 +0000</pubDate>
				<category><![CDATA[İpucu]]></category>
		<category><![CDATA[Kod]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[WordPress]]></category>
		<guid isPermaLink="false">https://altug.in/?p=821</guid>

					<description><![CDATA[WordPress tabanlı projenizdeki yazılarınızda (posts) birden fazla Kategori kullanıyor fakat site içi arama özelliğinizin sadece belli bir tanesi için çalışmasını istiyorsanız, bu yöntem sizin için. Öncelikle şunu hatırlatmakta fayda var: Eklenti kullanmadan yapabileceğiniz basit işlemler için sitenize lütfen eklenti kurmayın! Bunun 2 ana sebebi var: Güvenlik: Eklentiler o eklentiyi yazan kişinin inisiyatifindedir. Siz yüklediğiniz sırada [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/wordpress-ipucu-aramayi-tek-kategori-ile-sinirlama/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">821</post-id>	</item>
		<item>
		<title>CSS Maskeleme ile Metinlere Resim Giydirme</title>
		<link>https://altug.design/css-maskeleme-ile-metinlere-resim-giydirme/</link>
					<comments>https://altug.design/css-maskeleme-ile-metinlere-resim-giydirme/#respond</comments>
		
		<dc:creator><![CDATA[Altuğ GÜRKAYNAK]]></dc:creator>
		<pubDate>Thu, 17 Mar 2022 22:02:54 +0000</pubDate>
				<category><![CDATA[Kod]]></category>
		<category><![CDATA[Tasarım]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<guid isPermaLink="false">https://altug.in/?p=714</guid>

					<description><![CDATA[CSS&#8217;in güzelliklerinden faydalanarak bir metine renk verebildiğimiz gibi, resim giydirme de kullanabiliriz. Siz de dikkat çekici başlıklar için, dilerseniz resimden oluşan başlıklar, yani resim giydirme / maskeleme kullanabilirsiniz. Bunun için anlatacağım yöntem: -webkit-background-clip . Bu yöntemde, metnimizi gerçekten metinsel olarak yazıyoruz. Böylece esnek, kolay değiştirilebilir ve dinamik başlıklar elde edebiliyoruz. &#60;div class="metinResim istanbul"&#62;İSTANBUL&#60;/div&#62; .metinResim { [&#8230;]]]></description>
		
					<wfw:commentRss>https://altug.design/css-maskeleme-ile-metinlere-resim-giydirme/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">714</post-id>	</item>
	</channel>
</rss>
