विज्ञापन ब्लॉक जे डायरेक्ट बनाना

हेलो लोग! मैं वाई। डायरेक्ट के विज्ञापन ब्लॉक को डिजाइन करने की अनिर्दिष्ट संभावनाओं के बारे में स्वामी के साथ बात करना चाहता हूं।

मेरी आंखों के साथ विज्ञापन डिजाइन का चरण-दर-चरण सेटअप:
चरण ०।
dir0.png
इस तरह से हमारी शुरुआती जगह काम की लग रही है।

स्टेज 1
dir1.png
यहां तक ​​कि अगर आप केवल आधे मस्तिष्क और एक हाथ के मालिक हैं, तो पहली बार जब आप Yandex.Direct विज्ञापनों के साथ काम करते हैं, तो आपको ऊपर चित्र के समान एक तस्वीर मिलेगी। एन-ए-ए-ए-फिक, ये बेवकूफ फ्रेम और स्पष्ट विज्ञापन इकाइयां - हम विज्ञापन इकाइयों और साइट के बीच अधिकतम समानता की तलाश करेंगे।

स्टेज 2।
dir2.png
मैंने ब्लॉकों को ठीक किया: फ़्रेम हटा दिया, विज्ञापनों की पृष्ठभूमि, रंगों को उठाया।
क्या आप देख रहे हैं? विज्ञापन इंडेंटेड हैं।
इसलिए, हम अपने विज्ञापनों को div ब्लॉक्स के साथ निम्नानुसार फ्रेम करते हैं:
 <div id = "ads">
 प्रत्यक्ष कोड
 </ Div>

सीएसएस में हम निम्नलिखित लिखते हैं:
 # पैड {
 मार्जिन-लेफ्ट: -8px;
 }


स्टेज 3।
dir31.png

बुरा नहीं है, है ना? लेकिन विज्ञापनों के शीर्षक पृष्ठ शीर्षक की उपस्थिति क्यों नहीं देते हैं?
हम इसे फिर से css के साथ करते हैं:
 #ads .ad-link a {
 / * वसा निकालें * /
 फ़ॉन्ट-वजन: सामान्य महत्वपूर्ण!
 / * अंडरस्कोर निकालें * /
 पाठ-सजावट: कोई भी महत्वपूर्ण नहीं;
 / * शीर्षक के समान एक रेखांकन जोड़ें * /
 बॉर्डर-बॉटम: 1px धराशायी # 87855F! महत्वपूर्ण
 / * फ़ॉन्ट बढ़ाएँ * /
 फ़ॉन्ट-आकार: 1.4 महत्वपूर्ण!
 / * संरेखित करें * /
 लाइन-ऊंचाई: सामान्य महत्वपूर्ण;
 }
 #ads .y5_black, #ads .y5_h a {
 रंग: # एफएफएफएफएफ-महत्वपूर्ण;
 / * शिलालेख बनाओ जे। डायरेक्ट व्हाइट * /
 }

हो गया! Admire:
dir4.png

"आपको अभी तक प्रत्यक्ष से बाहर नहीं निकाला गया है?"
"फिर हम आपके पास जाते हैं!"

अपने जोखिम पर इन सभी तरीकों का उपयोग करें। सभी नाम काल्पनिक हैं, सभी मैच यादृच्छिक हैं। मैं रिटायर हो रहा हूं। आप सभी को धन्यवाद!

स्त्रोत - चेर्नोव १२/३

Source: https://habr.com/ru/post/In22150/


All Articles