-Ðóáðèêè

 -Ïîäïèñêà ïî e-mail

 

 -Ïîèñê ïî äíåâíèêó

Ïîèñê ñîîáùåíèé â FladeX

 -Ïîñòîÿííûå ÷èòàòåëè

 -Ñòàòèñòèêà

Ñòàòèñòèêà LiveInternet.ru: ïîêàçàíî êîëè÷åñòâî õèòîâ è ïîñåòèòåëåé
Ñîçäàí: 23.02.2007
Çàïèñåé:
Êîììåíòàðèåâ:
Íàïèñàíî: 209

Øàáëîí äëÿ danneo cms - ðåôàêòîðèíã html ðàçìåòêè

Äíåâíèê

Ñóááîòà, 20 Ñåíòÿáðÿ 2008 ã. 17:41 + â öèòàòíèê
 êîëîíêàõ èãðàåò - Rage Against The Machine - Down Radeo
Ïî÷òè âñÿ ïÿòíèöà óøëà íà ïåðåïèñûâàíèå .tpl ôàéëîâ øàáëîíà Default. Ïî÷òè âñå òàáëèöû áûëè çàìåíåíû íà div.  êîíå÷íîì èòîãå êîä øàáëîíà óìåíüøèëñÿ ïðèìåðíî íà 12-14Êá.
×òî ðåàëèçîâàíî:

  • Ïåðåïèñàíû ôàéëû òàáëèö ñòèëåé, óäàëåíà êó÷à ïðîáåëîâ.
  • Àòðèáóòû âíóòðè ñåëåêòîðîâ css ðàñïîëîæåíû â àëôàâèòíîì ïîðÿäêå, ïî îäíîìó íà ñòðîêó.
  • Êîäû öâåòîâ ïåðåïèñàíû â íèæíåì ðåãèñòðå.
  • Èñïðàâëåíû íåáîëüøèå íåòî÷íîñòè è îøèáêè.
  • Áîëüøàÿ ÷àñòü òàáëèö áûëà óäàëåíà, âìåñòî íèõ òåïåðü èñïîëüçóþòñÿ äèâû.
  • Êîä ïåðåïèñàí ñåìàíòè÷åñêè, óðîâíè âëîæåííîñòè îòìå÷åíû ñèìâîëàìè òàáóëÿöèè.
  • Îôîðìëåíèå ïåðåíåñåíî â òàáëèöû ñòèëåé.
  • Äëÿ èçîáðàæåíèé äîáàâëåí àòðèáóò alt (äëÿ âàëèäàöèè)
  • Âñå çàïèñè òåãà <br /> èñïðàâëåíû íà <br />
  • Àìïåðñàíäû ïðîïèñàíû ñ ïîìîùüþ &amp;
  • Óñòàðåâøèé òåã <font> çàìåíåí íà <span>
  • Êîä ñòàë ìåíüøå íà 12-14Êá ïî ñðàâíåíèþ ñ ïåðâîíà÷àëüíûì âàðèàíòîì.

×òî åùå ïðåäñòîèò ñäåëàòü:

  • unicode-âåðñèÿ øàáëîíà
  • Äîáàâëåíèå ðåäêî èñïîëüçóåìûõ, íî áîëåå ïðàâèëüíûõ html-òåãîâ
  • Äîðàáîòêà ôîðì ñ ïîìîùüþ ñïèñêîâ
  • Ïîëíûé ïåðåõîä íà âåðñòêó ñëîÿìè (div)
Ðóáðèêè:  phpBB / Slaed / danneo

Ìåòêè:  

Áëîêè â øàáëîíå Default

Äíåâíèê

Ñðåäà, 17 Ñåíòÿáðÿ 2008 ã. 00:00 + â öèòàòíèê
 êîëîíêàõ èãðàåò - Gilia - Ìîé çàñíåæåííûé ãîðîä
Äîáðàëñÿ äî .tpl ôàéëîâ ñòàíäàðòíîãî øàáëîíà Danneo. Ðåøèë íà÷àòü ñ top.tpl, bot.tpl è ñîäåðæèìîãî ïàïêè block.
Ãëàâíàÿ òðóäíîñòü - âîçíèêëè çàòðóäíåíèÿ ïðè ïåðåõîäå îò òàáëèöû îñíîâû øàáëîíà ê áëî÷íîé âåðñòêå. Èçíà÷àëüíî èñïîëüçóåòñÿ 3êîëîíî÷íûé ìàêåò, ëåâûå è ïðàâûå áëîêè èìåþò øèðèíó 190ïèêñåëåé, ñðåäíèé áëîê ñ êîíòåíòîì ðåçèíîâûé. Ïåðâûì äåëîì ïîïðîáîâàë ñäåëàòü òàê - ëåâûé è ïðàâûé áëîê ñäåëàë â âèäå ñëîåâ ñ ôèêñèðîâàííîé øèðèíîé è îáòåêàíèåì (ñëåâà è ñïðàâà ñîîòâåòñòâåííî), à ñðåäíèé áëîê ïóñòèë ïîñëå íèõ, â ðåçóëüòàòå ÷åãî îí äîëæåí áûë çàíèìàòü ñåðåäèíó, è â òîæå âðåìÿ ðàñòÿãèâàòüñÿ íà âñþ âîçìîæíóþ øèðèíó. Ýòî ðàáîòàåò, îäíàêî áðàóçåð-èíâàëèä ÈÅ îïÿòü èñïîðòèë êàðòèíó. Îí òóïî ñïóñêàë ñðåäíèé áëîê âíèç. ß äîëãî êîâûðÿòüñÿ íå ñòàë, ðåøèë îñòàâèòü ýòîò ýòàï è ïåðåéòè ê òàáëèöàì ìåíüøåãî ìàñøòàáà.
Ê ïðèììåðó, òàêîé êîä áëîêà:
code:
<table width="100%">
<tr>
<td class="botblock">
{blockname}
</td>
</tr>
<tr>
<td class="paddingtext">
{blockcont}
</td>
</tr>
</table>

ìîæíî ïåðåâåðñòàòü òàê:
code:
<div>
<div class="botblock">
{blockname}
</div>
<div class="paddingtext">
{blockcont}
</div>
</div>

Âèäíî, ÷òî êîä ñòàíîâèòñÿ êîðî÷å è, ÷òî ñàìîå ãëàâíîå, áîëåå ïîíÿòíûì è óäîáíûì äëÿ ðåäàêòèðîâàíèÿ.
Ðóáðèêè:  phpBB / Slaed / danneo

Ìåòêè:  

Øàáëîí äëÿ danneo cms - ðåôàêòîðèíã òàáëèö ñòèëåé

Äíåâíèê

Âîñêðåñåíüå, 14 Ñåíòÿáðÿ 2008 ã. 21:31 + â öèòàòíèê
 êîëîíêàõ èãðàåò - ÑÄ - Ïîòåðÿííûå ñòðàíèöû
Ñåãîäíÿ çàíèìàëñÿ îïòèìèçàöèåé css ôàéëà äåôîëòíîãî øàáëîíà. ×òî áûëî ïðîäåëàíî:
1. Èçìåíåíà ñòðóêòóðà ôàéëà.
 èñõîäíîì ôàéëå âñå ñåëåêòîðû ðàñïîëàãàëèñü íà îòäåëüíîé ñòðîêå, ïðè÷åì ñâîéñòâà è èõ çíà÷åíèÿ áûëè ïðîïèñàíû íà òîé æå ñòðîêå, ÷òî è ñåëåêòîð.  êà÷åñòâå ðàçäåëèòåëåé áûëè èñïîëüçîâàíû ïðîáåëû, ïðè÷åì â ïîðÿäî÷íîì êîëè÷åñòâå. ß æå ïåðåïèñàë, èñïîëüçóÿ òàáóëÿöèþ äëÿ ðàçìåòêè, è ðàçìåùàÿ ïî îäíîìó ñâîéñòâó/ñåëåêòîðó íà ñòðîêó.
2. Íèæíèé ðåãèñòð.
Âîçìîæíî ýòî ïîêàæåòñÿ íåçíà÷èòåëüíûì, íî âñå æå ïåðåïèñàë êîä â íèæíåì ðåãèñòðå.
3. Óïîðÿäî÷èâàíèå ñâîéñòâ.
Âíóòðè îäíîãî ñåëåêòîðà âñå ñâîéñòâà òåïåðü èäóò â àëôàâèòíîì ïîðÿäêå. Êñòàòè ýòî ïîçâîëèëî îáíàðóæèòü íåêîòîðûå íåêîððåêòíûå ìåñòà â êîäå.
4. Ñîêðàùåíèå êîäîâ öâåòà.
Css ïîçâîëÿåò çàïèñûâàòü êîä öâåòà #rrggbb â ñîêðàùåííîì âàðèàíòå #rgb. Ýòî áûëî èñïîëüçîâàíî ìíîþ, ïîçâîëèâ åùå íåìíîãî óìåíüøèòü ðàçìåð ôàéëà ñòèëåé.
5. Ñîêðàùåííûé âàðèàíò çàïèñè.
Êðîìå öâåòîâ, áûëè ñîêðàùåíû è äðóãèå çíà÷åíèÿ ñâîéñòâ. Íàïðèìåð, padding: 2px 2px; ìîæíî çàïèñàòü êàê padding: 2px; à padding: 0px; ìîæíî çàïèñàòü êàê padding: 0; Îïÿòü æå, ýòî äàëî íåáîëüøîå ñîêðàùåíèå ðàçìåðà ôàéëà.

Íåêîòîðûå íåòî÷íîñòè â èñõîäíîì ôàéëå:
code:
.formtext { padding-left:10px; padding: 5px;

Çäåñü óêàçûâàåò îòñòóï ñëåâà â 10ïèêñåëåé, êîòîðûé çàòåì ïåðåîïðåäåëÿåòñÿ ñëåäóþùèì ñâîéñòâîì, êîòîðîå çàäàåò îòñòóï â 5ïèêñåëåé ñî âñåõ ñòîðîí.

code:
border-top: 1px solid #C6C6C6;
border-right: 1px solid #C6C6C6;
border-bottom: 3px solid #C6C6C6;
border-left: 1px solid #C6C6C6;

Çäåñü öâåò è òèï ðàìêè îäèíàêîâ äëÿ âñåõ 4 ñòîðîí, îäíàêî çàäàåòñÿ 4 ðàçà. Òîëùèíà â 1ïèêñåëü îäèíàêîâà äëÿ òðåõ ñòîðîí. Äàííóþ çàïèñü ìîæíî ñîêðàòèòü äî çàïèñè â äâå ñòðîêè.

code:
background: #2D82B6 url(../images/topugol.gif) no-repeat top left;
background-color: #2D82B6;

Çäåñü âòîðîå ñâîéñòâî ëèøíåå, òàê êàê íå íåñåò ñìûñëà, èáî äóáëèðóåò ÷àñòü ïåðâîãî ñâîéñòâà.

code:
border-left-width: 120px;
border-left-style: solid;
border-left-color: #f1f1f1;

Çäåñü ìîæíî âñå çíà÷åíèÿ ïðîïèñàòü, èñïîëüçóÿ ëèøü îäèí ïàðàìåòð border-left. Ýêîíîìèì 2 ñòðî÷êè êîäà.


Ïðîìåæóòî÷íûå ðåçóëüòàòû:
temp/default/css/style.css
èñõîäíûé css ôàéë: 24 893 á
css ôàéë ïîñëå îïòèìèçàöèè: 16 904 á
Îáà ôàéëà èäåíòè÷íû, íå ñ÷èòàÿ èñïðàâëåíèÿ íåáîëüøèõ íåòî÷íîñòåé, îïèñàííûõ âûøå.
temp/default/css/simple.style.css
èñõîäíûé css ôàéë: 5 253 á
css ôàéë ïîñëå îïòèìèçàöèè: 3 382 á
Îáà ôàéëà èäåíòè÷íû, íå ñ÷èòàÿ èñïðàâëåíèÿ íåáîëüøèõ íåòî÷íîñòåé, îïèñàííûõ âûøå.
Ðóáðèêè:  phpBB / Slaed / danneo

Ìåòêè:  

Øàáëîí äëÿ danneo cms

Äíåâíèê

Ñóááîòà, 13 Ñåíòÿáðÿ 2008 ã. 01:08 + â öèòàòíèê
 êîëîíêàõ èãðàåò - Ddrop - Óïðóãîñòü
Ïîëó÷èë "äîáðî" íà ðåôàêòîðèíã øàáëîíà Default, êîòîðûé èñïîëüçóåòñÿ â danneo ïî óìîë÷àíèþ. Äàííàÿ ðàáîòà áóäåò ïîëåçíà äëÿ ìåíÿ - ÿ ïîëó÷ó îïûò, ïîó÷àñòâóþ â ðàçðàáîòêå èíòåðåñíîãî open-source ïðîåêòà, ïîëó÷ó çàãîòîâêó äëÿ áóäóùèõ øàáëîíîâ ñâîèõ ñàéòîâ. Íó è äëÿ âñåõ ïîëüçîâàòåëåé ñèñòåìû òàêæå áóäåò ïîëåçíûì ïîëó÷èòü íîâûé øàáëîí - çà ñ÷åò óìåíüøåíèÿ ðàçìåðà îí áóäåò ÷óòü áûñòðåå ðàáîòàòü, çà ñ÷åò ïåðåâîäà íà áëî÷íóþ ñòðóêòóðó ñàéòû áóäóò ëó÷øå èíäåêñèðîâàòüñÿ, çà ñ÷åò âûíîñà îôîðìëåíèÿ â css øàáëîí áóäåò áîëåå ïðîñòûì äëÿ ðåäàêòèðîâàíèÿ.
Ñïèñîê çàïëàíèðîâàííûõ äåéñòâèé:
1. Óìåíüøèòü ðàçìåð øàáëîíà.
Äëÿ ýòîãî ïðèäåòñÿ ïî÷èñòèòü êîä âñåõ ôàéëîâ, íàïðèìåð â style.css ïîðÿäêà 4Êá ëèøíèõ ïðîáåëîâ. Ïåðåõîä ñ òàáëèö íà äèâû òàêæå ñïîñîáñòâóåò óìåíüøåíèþ ðàçìåðà.
2. Ïåðåõîä ñ òàáëè÷íîé ñòðóêòóðû íà áëî÷íóþ.
Ïîñòàðàþñü ïîëíîñòüþ èçáàâèòüñÿ îò òàáëèö êàê èíñòðóìåíòà ñòðóêòóðèðîâàíèÿ øàáëîíà. Îñòàâëþ ëèøü òàì, ãäå îíè äåéñòâèòåëüíî íåîáõîäèìû.
3. Âûíîñ íà÷àëà è êîíöà html-ðàçìåòêè â ôàéëû top.tpl è bot.tpl ñîîòâåòñòâåííî.
Ýòî äàñò âîçìîæíîñòü, ê ïðèìåðó, ñìåíèòü äîêòàéï âíóòðè îòäåëüíî âçÿòîãî øàáëîíà. Íà äàííûé ìîìåíò ýòî ðåäàêòèðóåòñÿ â php-ôàéëå äëÿ âñåõ øàáëîíîâ îäíîâðåìåííî.
4. Ñåìàíòèêà è âàëèäíîñòü.
Íàñêîëüêî âîçìîæíî, ïåðåïèøó êîä ñåìàíòè÷åñêè, ÷òîáû ïðè ðåäàêòèðîâàíèè âåðñòàëüùèêàì áûëî â íåì ïðîùå ðàçîáðàòüñÿ. Íó è êîíå÷íî æå, øàáëîí äîëæåí áûòü âàëèäíûì. Íà xhtml çàìàõèâàòüñÿ íå áóäó, òàê êàê ýòî íå ïîääåðæàëè ïîëüçîâàòåëè, ïîýòîìó ñâåðòàþ âñå ïîä html 4.01 strict.
5. Êîäèðîâêè.
Øàáëîí áóäåò ïèñàòüñÿ èçíà÷àëüíî ïîä cp1251-âåðñèþ ñèñòåìû, îäíàêî ïî çàâåðøåíèè ðàáîòû áóäåò ñîçäàíà è utf8 âåðñèÿ øàáëîíà.
6. Ìåëî÷è.
Ðàçëè÷íûå ìåëêèå èäåè. Íàïðèìåð íàçâàíèå øàáëîíà ñ ìàëåíüêîé áóêâû, ôàéë êîíôèãóðàöèè â ïàïêå ñ øàáëîíîì (â ðàññ÷åòå íà áóäóùèå âåðñèè), èñïîëüçîâàíèå ðåäêèõ òåãîâ è ïðî÷åå, ïðî÷åå.
Ðóáðèêè:  phpBB / Slaed / danneo

Ìåòêè:  

 Ñòðàíèöû: [1]