Компютри » Как да създадете HTML страница: инструкции стъпка по стъпка

Как да създадете HTML страница: инструкции стъпка по стъпка

Компютри

Пощенските списъци са важна част от маркетинговите кампании. Създаването на имейли за тях до голяма степен напомня развитието на прости уеб страници. В същото време трябва да се вземат предвид някои важни различия. По-специално изпращането на HTML листове ще бъде ефективно само ако са правилно формулирани в технически смисъл, а съдържанието и стилът им съответстват на вашите цели. В същото време се смята, че неспециалистът не може да се справи с тази задача. Тази статия съдържа подробни инструкции стъпка по стъпка за това как да пишете и как да изпратите HTML страница.


Характеристики на създаването

Един съвременен човек получава средно 5-6, а понякога и 10 имейла на ден. Това означава, че имате по-малко от секунда, за да привлечете вниманието на адресата преди да отиде да чете такава кореспонденция. В противен случай изпращането на HTML-страници ще бъде напълно неефективно и вие просто губите времето си напразно. Една от нюансите, които увеличават шансовете ви за привличане на вниманието на потенциални клиенти или други целеви групи, е създаването на кореспонденция, адаптирана към мобилните устройства. В крайна сметка повечето от тези, които са адресирани към пощата, вероятно ги използват много по-често от настолните компютри и лаптопите. За тази цел, например, "чувствителен дизайн, мога лесно да се адаптира към размера на екрана.

Какъв трябва да бъде образецът на писмо

При изготвянето на документ, предназначен да бъде изпратен на кореспондентите, трябва да се спазват следните изисквания:
  • Тя трябва да бъде много тясна, т.е. по размер не трябва да надвишава диапазона от 500-600 пиксела, което ще гарантира правилното показване на текст и друго съдържание на всяко устройство от всякакъв вид.
  • Необходимо е да се използва доста голям шрифт за цялата текстова информация, тъй като на устройства с iOS ще е неудобно да се чете HTML страницата, ако размерът на шрифта е по-малък от 13 пиксела.
  • Елементите, от които можете да кликнете, трябва да бъдат достатъчно големи и изолирани от най-близките връзки. В този случай получателят може лесно да ги активира от първия опит.



    • Подготовка

    Преди да се разработи HTML страница, трябва да създадете нова папка на един от дисковете и да я наименувате, например, "Кореспонденция". Освен това трябва да изтеглите и инсталирате Dreamweaver CS3. Този продукт на Adobe е един от сравнително простите инструменти за проектиране на уеб сайт и е подходящ за разработване на HTML таблици.

    Създаване и запазване на документ

    Преди да напишете текстова част от писмото, трябва да:
  • отворите доста популярен дизайнер за HTML листите на Dreamweaver CS3 (DW);
  • създават документ, като го избират като тип "Transition HTML 401";
  • запазване на файла с разширение .html;
  • Намерете командата за редактиране в горното меню;
  • премахнете отметката "Използвайте CSS вместо HTML тагове".

    • Указание стъпка по стъпка

    Сега да разгледаме как да създадем HTML страница. За да направите това:
  • последователно отваряне на раздела "Вмъкни" и "Таблица" в менюто и показване на желаните параметри на таблицата.Например низове - 2 колони - 1 ширина - 700 позиция - отгоре. Можете да поставите границите, или можете да го направите без тях, като посочите 0.
  • Формирайте заглавието на листа. Тъй като HTML листът е предназначен за по-голям брой получатели, операторът [first_name] се използва за заместване на желаното име на получател.
  • В долния прозорец, Properties, те показват желаните параметри за шрифта, размера и цвета на заглавния текст и цвета на фона.
  • "Изход" от полето за заглавие. В долната част на екрана задавате параметри за курсора "Център" и "В средата".
  • Поставете готовия текст на писмото или го напишете директно в програмата DW, като изберете желания тип и размер на шрифта, както и позицията на текста на страницата.

    • Създаване на хипертекстови връзки

    Ще се опитаме да направим HTML-страницата по-професионална и напреднала. За тази цел скрийте хипертекстовите връзки в съдържанието. За да направите това, изберете място в текста, който сте избрали като хипертекстова връзка. В левия ъгъл в горната част на екрана трябва да отворите съответната икона и да поставите връзката си в падащото меню. В същото време, не забравяйте да поставите отметка в квадратчето за отметка "_blank", така че връзките, отворени в нов прозорец и дестинацията, след като са видени, не са загубили достъп до главното писмо.

    Как се вмъкват снимки

    Обикновено HTML съобщение се допълва с информация за контакт, за предпочитане от снимката на автора или със съответния тематичен образ. Тя може да бъде изтеглена от Интернет или предварително заредена в интернет, както ви е необходимоURL адрес на изображение. Най-добре е да направите това с една от безплатните услуги. За да направите такъв фин финал:
  • поставете в долната част на листа, в рамките на основната маса, друга с параметър 3 колони за границата от 0 пиксела;
  • поставете курсора на мястото на масата, където искате да видите картината;
  • да се отбележи в долния прозорец "Вътре" и "Горен ръб" за всяка секция;
  • изберете раздела Вмъкване в горното меню;
  • Щракнете върху "Изображение" и в падащото меню вмъкваме копието на адреса;
  • Натиснете "Ok" 2 пъти.

    • Преглеждане

    Сега, след като знаете как да направите HTML страница, трябва да се уверите, че получателят ще го види в правилната форма. За да направите това, преди да изпратите, трябва да прегледате работата си в браузъра Dreamweaver CS3. За да направите това, кликнете върху иконата с глобуса в средното горно меню. Ако вместо буквите на екрана се появи абракадабра, тогава трябва да зададете автокодиране в настройките на браузъра.

    Кодиране

    От раздела "Проект" и преминаване в кодовата част - "Код". В прозореца изберете и копирайте всичко, което е затворено между маркерите и. Запазване на файла. След това вмъкваме HTML кода.

    Изпращане на HTML-листове

    За да се направи пощенска кутия с отваряне на „Smart Reporter“ (SR). След това:
  • изберете или създайте нова буква, попълвайки редовете "Име" и "Адрес на подателя".
  • попълнете реда "Предмет на писмото";
  • маркирайте HTML кода в горното ляво меню;
  • въведете кода,DW-код, копиран в програмата в голямото поле "Източник";
  • проверява коректността на картографирането с помощта на инструмента "Преглед";
  • премахване на текстовата версия на писмото;
  • тествайте за спам, като използвате бутона със същото име до бутона "Изпрати".

    • Няколко популярни шаблона

    Използването на рамката помага за значително ускоряване на процеса на създаване на писмо и го прави по-достъпен за разработчик, който все още разбира основите на създаване на уеб документи. Най-популярните шаблони са:
  • Cerberus. Този набор от така наречени отзивчиви шаблони ви позволява да създавате имейли, които обикновено се показват в мобилното приложение Gmail и в Outlook. Тя ви позволява да използвате блокове на HTML код или индивидуално, или чрез комбиниране на тях.
  • Мастилото е подготовката на писма, чието разпространение е практически универсално и съвместимо с всички устройства и клиенти.
  • Наистина прост HTML шаблон за електронна поща. Шаблонът ви позволява да създавате бюлетини много лесно и бързо. Вярно е, че те ще имат много прост дизайн под формата на една колона, в която се поставя призив за действие.

    • Как да вмъкнем HTML лист

    Да разгледаме малко по-различна задача. За да поставите HTML код в имейл, например gmail, използвайки следния пример, браузърът на Google Chrome трябва:
  • да кликнете върху бутона "F12" или да изберете подходящата последователност от команди в менюто;
  • В прозореца с кода на текущата страница на клиента на gmail намерете мястото, където искате да поставите HTML страницата, щракнете с десния бутон и изберете Редактиране като HTML.
  • Вмъкванекопиран HTML код;
  • за натискане на комбинация от два клавиша «Ctrl» и «Enter».
    • За същата цел можете да изтеглите лесно за използване приложение Mozilla thunderbird. Използвайте го, за да създадете писмо, след това изберете Вмъкни, след това HTML, и поставете там кода на вашия пощенски списък.

    Инструменти

    WordPress Plugin e-Newsletter ви позволява професионално управление на пощенски списъци и абонати. И двете, и двете, се правят директно през административния панел на WordPress. Това обстоятелство осигурява пълен контрол и абсолютно безплатно, което не може, но моля. Друг прост инструмент - Bulletproof фонови изображения, който е прост инструмент, който ви позволява да получите кода за фоновото изображение, генерирано от буквите. С него можете да направите кореспонденцията много по-красива. За да напишете писмо, просто посочете URL адреса на желаното фоново изображение и неговия резервен цвят, а също така и тези настройки се отнасят за цялото тяло на HTML листа или са предназначени само за една клетка от таблицата. В резултат на това ще получите завършен код, който искате да копирате и поставите в шаблона си.
    Сега знаете как да изпратите HTML страница. Създаването му не представлява особена сложност, особено ако използвате готови шаблони, в които няма неблагоприятно положение в мрежата. Ето защо дори тези, които нямат специални знания, могат лесно да се справят с тази задача.

    Свързани публикации