Ако сте нов в уеб дизайна и разработката в края на страницата (HTML, CSS, Javascript), можете да изберете да започнете с WYSIWYG редактор. Това акроним означава "това, което виждате, е това, което получавате" и основно се отнася до софтуер, който ви позволява да създадете уеб страница с помощта на визуални инструменти, докато софтуерът написва някакъв код зад кулисите въз основа на това, което създавате. Най-популярният WYSIWYG инструмент, който може да се използва, е Dreamweaver на Adobe .
Dreamweaver е добър вариант за тези, които просто започват
Докато много опитни професионалисти в мрежата с по-изискани умения гледат надолу по Dreamweaver и с тенденцията си да произвеждат издути HTML марки и CSS стилове, простата истина е, че платформата остава добър вариант за тези, които просто започват с дизайна на уебсайтове. Когато започнете да използвате опцията "изглед на дизайна" на Dreamweaver, за да създадете уеб страница, един от въпросите, които вероятно ще имате, е как да създадете единичен прозорец за съдържание в този изглед.
Когато добавяте HTML текст към уеб страница, уеб браузърът ще покаже този текст като дълъг ред, докато стигне до ръба на прозореца на браузъра или елемента на контейнера. В този момент текстът ще се превърне в следващия ред. Това е подобно на това, което се случва във всеки софтуер за текстообработка, като например Microsoft Word или Google Docs. Когато даден ред текст няма повече място в хоризонтална линия, той се завива, за да започне друг ред. И така, какво ще стане, ако искате да диктувате къде се проваля линия?
Когато натиснете бутона [ENTER] в дизайна на Dreamweaver, текущият параграф се затваря и започва нов параграф. Визуално, това означава, че тези две линии са разделени с малко вертикално отстояние. Това е така, защото по подразбиране HTML абзаците имат подложки или полета (които зависи от самия браузър), приложени в долната част на абзаца, който добавя това разстояние.
Това може да бъде коригирано с CSS, но истината е, че искате да има разстояние между параграфите, за да се даде възможност за четливост на уебсайта. Ако искате един ред и няма широко вертикално разстояние между линиите, не искате да използвате [ENTER] , защото не искате тези линии да бъдат отделни абзаци.
За тези времена, когато не искате да се стартира нов параграф, бихте добавили маркера в HTML. Това също понякога е написано като
. специално за версии на XHTML, които изискват всички елементи да бъдат затворени. Последният / в този синтаксис самозатваря елемента, тъй като маркерът на Google няма собствен затварящ маркер. Това е добре и добре, но работите в Design View в Dreamweaver. Може да не искате да влезете в кода и да добавите тези почивки. Това е добре, защото наистина можете да добавите прекъсване на линия в Dreamweaver, без да прибягвате до изглед с код.
Добавяне на прекъсване на линия в дизайна на Dreamweaver:
- Поставете курсора, където искате да започне новата линия.
- Задръжте клавиша за смяна и натиснете [ENTER].
Това е! Простото добавяне на клавиша "shift" заедно с [ENTER] ще добави "" вместо нов параграф. Сега, когато знаете как е това, трябва да помислите къде да го използвате и къде да го избегнете. Не забравяйте, че HTML има за цел да създаде структурата на сайта, а не визуалния външен вид. Не трябва да използвате няколко тагове, за да създадете вертикални разстояния под елементите във вашия дизайн.
Това е, което CSS свойства за подложка и маржове са за. Там, където бихте използвали маркер, е, когато просто се нуждаете от една линия почивка. Ако например кодирате адрес за кореспонденция и сте решили да използвате параграф, бихте могли да добавите такива тагове:
Име на фирмата
Адрес линия
Град, държава, ZIP
Този код за адреса е само един абзац, но визуално би показал трите реда на отделни линии с малко пространство между тях.